Merge branch 'main' into bugfix/unify-email-sending
This commit is contained in:
commit
bd28636af5
13 changed files with 168 additions and 92 deletions
99
README.md
99
README.md
|
@ -21,6 +21,7 @@
|
|||
</p>
|
||||
|
||||
<!-- ABOUT THE PROJECT -->
|
||||
|
||||
## About The Project
|
||||
|
||||
<img width="937" alt="calendso-screenshot" src="https://user-images.githubusercontent.com/8019099/117973912-d9405a80-b324-11eb-8b35-4262e472909c.png">
|
||||
|
@ -28,18 +29,17 @@
|
|||
Let's face it: Calendly and other scheduling tools are awesome. It made our lives massively easier. We're using it for business meetings, seminars, yoga classes and even calls with our families. However, most tools are very limited in terms of control and customisations. That's where Calendso comes in. Self-hosted or hosted by us. White-label by design. API-driven and ready to be deployed on your own domain. Full control of your events and data. Calendso is to Calendly what GitLab is to GitHub.
|
||||
|
||||
### Product of the Month: April
|
||||
|
||||
#### Support us on [Product Hunt](https://www.producthunt.com/posts/calendso?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-calendso)
|
||||
|
||||
<a href="https://www.producthunt.com/posts/calendso?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-calendso" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-badge.svg?post_id=291910&theme=light&period=monthly" alt="Calendso - The open source Calendly alternative | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a> <a href="https://www.producthunt.com/posts/calendso?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-calendso" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=291910&theme=light" alt="Calendso - The open source Calendly alternative | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a> <a href="https://www.producthunt.com/stories/how-this-open-source-calendly-alternative-rocketed-to-product-of-the-day" target="_blank"><img src="https://calendso.com/maker-grant.svg" alt="Calendso - The open source Calendly alternative | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
|
||||
|
||||
|
||||
|
||||
### Built With
|
||||
|
||||
* [Next.js](https://nextjs.org/)
|
||||
* [React](https://reactjs.org/)
|
||||
* [Tailwind](https://tailwindcss.com/)
|
||||
* [Prisma](https://prisma.io/)
|
||||
- [Next.js](https://nextjs.org/)
|
||||
- [React](https://reactjs.org/)
|
||||
- [Tailwind](https://tailwindcss.com/)
|
||||
- [Prisma](https://prisma.io/)
|
||||
|
||||
## Stay Up-to-Date
|
||||
|
||||
|
@ -47,9 +47,8 @@ Calendso is currently in alpha. Watch **releases** of this repository to be noti
|
|||
|
||||

|
||||
|
||||
|
||||
|
||||
<!-- GETTING STARTED -->
|
||||
|
||||
## Getting Started
|
||||
|
||||
To get a local copy up and running, please follow these simple steps.
|
||||
|
@ -57,9 +56,10 @@ To get a local copy up and running, please follow these simple steps.
|
|||
### Prerequisites
|
||||
|
||||
Here is what you need to be able to run Calendso.
|
||||
* Node.js
|
||||
* PostgreSQL
|
||||
* Yarn _(recommended)_
|
||||
|
||||
- Node.js
|
||||
- PostgreSQL
|
||||
- Yarn _(recommended)_
|
||||
|
||||
You will also need Google API credentials. You can get this from the [Google API Console](https://console.cloud.google.com/apis/dashboard). More details on this can be found below under the [Obtaining the Google API Credentials section](#Obtaining-the-Google-API-Credentials).
|
||||
|
||||
|
@ -75,33 +75,35 @@ You will also need Google API credentials. You can get this from the [Google API
|
|||
```
|
||||
3. Copy `.env.example` to `.env`
|
||||
4. Configure environment variables in the .env file. Replace `<user>`, `<pass>`, `<db-host>`, `<db-port>` with their applicable values
|
||||
|
||||
```
|
||||
DATABASE_URL='postgresql://<user>:<pass>@<db-host>:<db-port>'
|
||||
GOOGLE_API_CREDENTIALS='secret'
|
||||
```
|
||||
|
||||
<details>
|
||||
<summary>If you don't know how to configure the DATABASE_URL, then follow the steps here</summary>
|
||||
|
||||
1. Create a free account with [Heroku](https://www.heroku.com/).
|
||||
|
||||
2. Create a new app.
|
||||
<img width="306" alt="Google Chrome — CleanShotX | 2021-04-20 at 02 01 56" src="https://user-images.githubusercontent.com/16905768/115322780-b3d58c00-a17e-11eb-8a52-b758fb0ea942.png">
|
||||
<img width="306" alt="Google Chrome — CleanShotX | 2021-04-20 at 02 01 56" src="https://user-images.githubusercontent.com/16905768/115322780-b3d58c00-a17e-11eb-8a52-b758fb0ea942.png">
|
||||
|
||||
3. In your new app, go to `Overview` and next to `Installed add-ons`, click `Configure Add-ons`. We need this to set up our database.
|
||||

|
||||

|
||||
|
||||
4. Once you clicked on `Configure Add-ons`, click on `Find more add-ons` and search for `postgres`. One of the options will be `Heroku Postgres` - click on that option.
|
||||

|
||||

|
||||
|
||||
5. Once the pop-up appears, click `Submit Order Form` - plan name should be `Hobby Dev - Free`.
|
||||
<img width="512" alt="Google Chrome — CleanShotX | 2021-04-20 at 02 04 29" src="https://user-images.githubusercontent.com/16905768/115323265-b4baed80-a17f-11eb-99f0-d67f019aa6df.png">
|
||||
<img width="512" alt="Google Chrome — CleanShotX | 2021-04-20 at 02 04 29" src="https://user-images.githubusercontent.com/16905768/115323265-b4baed80-a17f-11eb-99f0-d67f019aa6df.png">
|
||||
|
||||
6. Once you completed the above steps, click on your newly created `Heroku Postgres` and go to its `Settings`.
|
||||

|
||||

|
||||
|
||||
7. In `Settings`, copy your URI to your Calendso .env file and replace the `postgresql://<user>:<pass>@<db-host>:<db-port>` with it.
|
||||

|
||||

|
||||

|
||||

|
||||
|
||||
8. To view your DB, once you add new data in Prisma, you can use [Heroku Data Explorer](https://heroku-data-explorer.herokuapp.com/).
|
||||
</details>
|
||||
|
@ -119,10 +121,11 @@ You will also need Google API credentials. You can get this from the [Google API
|
|||
npx prisma studio
|
||||
```
|
||||
8. Click on the `User` model to add a new user record.
|
||||
9. Fill out the fields (remembering to encrypt your password with [BCrypt](https://bcrypt-generator.com/)) and click `Save 1 Record` to create your first user.
|
||||
9. Fill out the fields (remembering to encrypt your password with [BCrypt](https://bcrypt-generator.com/)) and click `Save 1 Record` to create your first user.
|
||||
10. Open a browser to [http://localhost:3000](http://localhost:3000) and login with your just created, first user.
|
||||
|
||||
### Upgrading from earlier versions
|
||||
|
||||
1. Pull the current version:
|
||||
```
|
||||
git pull
|
||||
|
@ -130,22 +133,28 @@ You will also need Google API credentials. You can get this from the [Google API
|
|||
2. Apply database migrations by running <b>one of</b> the following commands:
|
||||
|
||||
In a development environment, run:
|
||||
|
||||
```
|
||||
npx prisma migrate dev
|
||||
```
|
||||
|
||||
(this can clear your development database in some cases)
|
||||
|
||||
In a production environment, run:
|
||||
|
||||
```
|
||||
npx prisma migrate deploy
|
||||
```
|
||||
|
||||
3. Check the `.env.example` and compare it to your current `.env` file. In case there are any fields not present
|
||||
in your current `.env`, add them there.
|
||||
|
||||
For the current version, especially check if the variable `BASE_URL` is present and properly set in your environment, for example:
|
||||
|
||||
```
|
||||
BASE_URL='https://yourdomain.com'
|
||||
```
|
||||
|
||||
4. Start the server. In a development environment, just do:
|
||||
```
|
||||
yarn dev
|
||||
|
@ -157,27 +166,33 @@ You will also need Google API credentials. You can get this from the [Google API
|
|||
```
|
||||
5. Enjoy the new version.
|
||||
<!-- DEPLOYMENT -->
|
||||
|
||||
## Deployment
|
||||
|
||||
### Docker
|
||||
|
||||
The Docker configuration for Calendso is an effort powered by people within the community. Calendso does not provide official support for Docker, but we will accept fixes and documentation. Use at your own risk.
|
||||
|
||||
|
||||
The Docker configuration can be found [in our docker repository](https://github.com/calendso/docker).
|
||||
|
||||
### Railway
|
||||
|
||||
[](https://railway.app/new/template?template=https%3A%2F%2Fgithub.com%2Fcalendso%2Fcalendso&plugins=postgresql&envs=GOOGLE_API_CREDENTIALS%2CBASE_URL%2CNEXTAUTH_URL%2CPORT&BASE_URLDefault=http%3A%2F%2Flocalhost%3A3000&NEXTAUTH_URLDefault=http%3A%2F%2Flocalhost%3A3000&PORTDefault=3000)
|
||||
|
||||
You can deploy Calendso on [Railway](https://railway.app/) using the button above. The team at Railway also have a [detailed blog post](https://blog.railway.app/p/calendso) on deploying Calendso on their platform.
|
||||
|
||||
<!-- ROADMAP -->
|
||||
|
||||
## Roadmap
|
||||
|
||||
See the [open issues](https://github.com/calendso/calendso/issues) for a list of proposed features (and known issues).
|
||||
|
||||
<!-- CONTRIBUTING -->
|
||||
|
||||
## Contributing
|
||||
|
||||
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are **greatly appreciated**.
|
||||
|
||||
|
||||
1. Fork the project
|
||||
2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
|
||||
3. Make your changes
|
||||
|
@ -185,7 +200,6 @@ Contributions are what make the open source community such an amazing place to b
|
|||
5. Push to the branch (`git push origin feature/AmazingFeature`)
|
||||
6. Open a pull request
|
||||
|
||||
|
||||
## Obtaining the Google API Credentials
|
||||
|
||||
1. Open [Google API Console](https://console.cloud.google.com/apis/dashboard). If you don't have a project in your Google Cloud subscription, you'll need to create one before proceeding further. Under Dashboard pane, select Enable APIS and Services.
|
||||
|
@ -196,11 +210,12 @@ Contributions are what make the open source community such an amazing place to b
|
|||
6. In the third page (Test Users), add the Google account(s) you'll using. Make sure the details are correct on the last page of the wizard and your consent screen will be configured.
|
||||
7. Now select [Credentials](https://console.cloud.google.com/apis/credentials) from the side pane and then select Create Credentials. Select the OAuth Client ID option.
|
||||
8. Select Web Application as the Application Type.
|
||||
9. Under Authorized redirect URI's, select Add URI and then add the URI `<CALENDSO URL>/api/integrations/googlecalendar/callback` replacing CALENDSO URL with the URI at which your application runs.
|
||||
9. Under Authorized redirect URI's, select Add URI and then add the URI `<CALENDSO URL>/api/integrations/googlecalendar/callback` replacing CALENDSO URL with the URI at which your application runs.
|
||||
10. The key will be created and you will be redirected back to the Credentials page. Select the newly generated client ID under OAuth 2.0 Client IDs.
|
||||
11. Select Download JSON. Copy the contents of this file and paste the entire JSON string in the .env file as the value for GOOGLE_API_CREDENTIALS key.
|
||||
|
||||
## Obtaining Microsoft Graph Client ID and Secret
|
||||
|
||||
1. Open [Azure App Registration](https://portal.azure.com/#blade/Microsoft_AAD_IAM/ActiveDirectoryMenuBlade/RegisteredApps) and select New registration
|
||||
2. Name your application
|
||||
3. Set **Who can use this application or access this API?** to **Accounts in any organizational directory (Any Azure AD directory - Multitenant)**
|
||||
|
@ -209,6 +224,7 @@ Contributions are what make the open source community such an amazing place to b
|
|||
6. Click **Certificates & secrets** create a new client secret and use the value as the **MS_GRAPH_CLIENT_SECRET** attriubte
|
||||
|
||||
## Obtaining Zoom Client ID and Secret
|
||||
|
||||
1. Open [Zoom Marketplace](https://marketplace.zoom.us/) and sign in with your Zoom account.
|
||||
2. On the upper right, click "Develop" => "Build App".
|
||||
3. On "OAuth", select "Create".
|
||||
|
@ -217,37 +233,36 @@ Contributions are what make the open source community such an amazing place to b
|
|||
6. De-select the option to publish the app on the Zoom App Marketplace.
|
||||
7. Click "Create".
|
||||
8. Now copy the Client ID and Client Secret to your .env file into the `ZOOM_CLIENT_ID` and `ZOOM_CLIENT_SECRET` fields.
|
||||
4. Set the Redirect URL for OAuth `<CALENDSO URL>/api/integrations/zoomvideo/callback` replacing CALENDSO URL with the URI at which your application runs.
|
||||
5. Also add the redirect URL given above as a whitelist URL and enable "Subdomain check". Make sure, it says "saved" below the form.
|
||||
7. You don't need to provide basic information about your app. Instead click at "Scopes" and then at "+ Add Scopes". Search for and check the following scopes:
|
||||
1. account:master
|
||||
2. account:read:admin
|
||||
3. account:write:admin
|
||||
4. meeting:master
|
||||
5. meeting:read:admin
|
||||
6. meeting:write:admin
|
||||
7. user:master
|
||||
8. user:read:admin
|
||||
9. user:write:admin
|
||||
8. Click "Done".
|
||||
9. You're good to go. Now you can easily add your Zoom integration in the Calendso settings.
|
||||
9. Set the Redirect URL for OAuth `<CALENDSO URL>/api/integrations/zoomvideo/callback` replacing CALENDSO URL with the URI at which your application runs.
|
||||
10. Also add the redirect URL given above as a whitelist URL and enable "Subdomain check". Make sure, it says "saved" below the form.
|
||||
11. You don't need to provide basic information about your app. Instead click at "Scopes" and then at "+ Add Scopes". Search for and check the following scopes:
|
||||
1. account:read:admin
|
||||
2. account:write:admin
|
||||
3. meeting:read:admin
|
||||
4. meeting:write:admin
|
||||
5. user:read:admin
|
||||
6. user:write:admin
|
||||
12. Click "Done".
|
||||
13. You're good to go. Now you can easily add your Zoom integration in the Calendso settings.
|
||||
|
||||
<!-- LICENSE -->
|
||||
|
||||
## License
|
||||
|
||||
Distributed under the MIT License. See `LICENSE` for more information.
|
||||
|
||||
<!-- ACKNOWLEDGEMENTS -->
|
||||
|
||||
## Acknowledgements
|
||||
|
||||
Special thanks to these amazing projects which help power Calendso:
|
||||
|
||||
[<img src="https://calendso.com/powered-by-vercel.svg">](https://vercel.com/?utm_source=calend-so&utm_campaign=oss)
|
||||
|
||||
* [Vercel](https://vercel.com/?utm_source=calend-so&utm_campaign=oss)
|
||||
* [Next.js](https://nextjs.org/)
|
||||
* [Day.js](https://day.js.org/)
|
||||
* [Tailwind CSS](https://tailwindcss.com/)
|
||||
* [Prisma](https://prisma.io/)
|
||||
- [Vercel](https://vercel.com/?utm_source=calend-so&utm_campaign=oss)
|
||||
- [Next.js](https://nextjs.org/)
|
||||
- [Day.js](https://day.js.org/)
|
||||
- [Tailwind CSS](https://tailwindcss.com/)
|
||||
- [Prisma](https://prisma.io/)
|
||||
|
||||
[product-screenshot]: https://i.imgur.com/4yvFj2E.png
|
||||
|
|
|
@ -7,6 +7,7 @@ const AvailableTimes = ({
|
|||
date,
|
||||
eventLength,
|
||||
eventTypeId,
|
||||
minimumBookingNotice,
|
||||
workingHours,
|
||||
timeFormat,
|
||||
user,
|
||||
|
@ -20,6 +21,7 @@ const AvailableTimes = ({
|
|||
eventLength,
|
||||
workingHours,
|
||||
organizerTimeZone,
|
||||
minimumBookingNotice,
|
||||
});
|
||||
|
||||
return (
|
||||
|
|
|
@ -23,6 +23,7 @@ const DatePicker = ({
|
|||
periodEndDate,
|
||||
periodDays,
|
||||
periodCountCalendarDays,
|
||||
minimumBookingNotice,
|
||||
}) => {
|
||||
const [calendar, setCalendar] = useState([]);
|
||||
const [selectedMonth, setSelectedMonth] = useState<number>();
|
||||
|
@ -77,6 +78,7 @@ const DatePicker = ({
|
|||
!getSlots({
|
||||
inviteeDate: date,
|
||||
frequency: eventLength,
|
||||
minimumBookingNotice,
|
||||
workingHours,
|
||||
organizerTimeZone,
|
||||
}).length
|
||||
|
@ -93,6 +95,7 @@ const DatePicker = ({
|
|||
!getSlots({
|
||||
inviteeDate: date,
|
||||
frequency: eventLength,
|
||||
minimumBookingNotice,
|
||||
workingHours,
|
||||
organizerTimeZone,
|
||||
}).length
|
||||
|
@ -106,6 +109,7 @@ const DatePicker = ({
|
|||
!getSlots({
|
||||
inviteeDate: date,
|
||||
frequency: eventLength,
|
||||
minimumBookingNotice,
|
||||
workingHours,
|
||||
organizerTimeZone,
|
||||
}).length
|
||||
|
|
|
@ -88,4 +88,13 @@ export default class CalEventParser {
|
|||
eventCopy.description = this.getRichDescriptionHtml();
|
||||
return eventCopy;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns a calendar event with rich description as plain text.
|
||||
*/
|
||||
public asRichEventPlain(): CalendarEvent {
|
||||
const eventCopy: CalendarEvent = { ...this.calEvent };
|
||||
eventCopy.description = this.getRichDescription();
|
||||
return eventCopy;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -227,28 +227,38 @@ const MicrosoftOffice365Calendar = (credential): CalendarApiAdapter => {
|
|||
? listCalendars().then((cals) => cals.map((e) => e.externalId))
|
||||
: Promise.resolve(selectedCalendarIds).then((x) => x)
|
||||
).then((ids: string[]) => {
|
||||
const urls = ids.map(
|
||||
(calendarId) =>
|
||||
"https://graph.microsoft.com/v1.0/me/calendars/" + calendarId + "/events" + filter
|
||||
);
|
||||
return Promise.all(
|
||||
urls.map((url) =>
|
||||
fetch(url, {
|
||||
method: "get",
|
||||
headers: {
|
||||
Authorization: "Bearer " + accessToken,
|
||||
Prefer: 'outlook.timezone="Etc/GMT"',
|
||||
},
|
||||
})
|
||||
.then(handleErrorsJson)
|
||||
.then((responseBody) =>
|
||||
responseBody.value.map((evt) => ({
|
||||
start: evt.start.dateTime + "Z",
|
||||
end: evt.end.dateTime + "Z",
|
||||
}))
|
||||
)
|
||||
)
|
||||
).then((results) => results.reduce((acc, events) => acc.concat(events), []));
|
||||
const requests = ids.map((calendarId, id) => ({
|
||||
id,
|
||||
method: "GET",
|
||||
headers: {
|
||||
Prefer: 'outlook.timezone="Etc/GMT"',
|
||||
},
|
||||
url: `/me/calendars/${calendarId}/events${filter}`,
|
||||
}));
|
||||
|
||||
return fetch("https://graph.microsoft.com/v1.0/$batch", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Authorization: "Bearer " + accessToken,
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({ requests }),
|
||||
})
|
||||
.then(handleErrorsJson)
|
||||
.then((responseBody) =>
|
||||
responseBody.responses.reduce(
|
||||
(acc, subResponse) =>
|
||||
acc.concat(
|
||||
subResponse.body.value.map((evt) => {
|
||||
return {
|
||||
start: evt.start.dateTime + "Z",
|
||||
end: evt.end.dateTime + "Z",
|
||||
};
|
||||
})
|
||||
),
|
||||
[]
|
||||
)
|
||||
);
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
|
@ -357,7 +367,7 @@ const GoogleCalendar = (credential): CalendarApiAdapter => {
|
|||
attendees: event.attendees,
|
||||
reminders: {
|
||||
useDefault: false,
|
||||
overrides: [{ method: "email", minutes: 60 }],
|
||||
overrides: [{ method: "email", minutes: 10 }],
|
||||
},
|
||||
};
|
||||
|
||||
|
@ -404,7 +414,7 @@ const GoogleCalendar = (credential): CalendarApiAdapter => {
|
|||
attendees: event.attendees,
|
||||
reminders: {
|
||||
useDefault: false,
|
||||
overrides: [{ method: "email", minutes: 60 }],
|
||||
overrides: [{ method: "email", minutes: 10 }],
|
||||
},
|
||||
};
|
||||
|
||||
|
@ -517,7 +527,12 @@ const createEvent = async (
|
|||
): Promise<EventResult> => {
|
||||
const parser: CalEventParser = new CalEventParser(calEvent, maybeUid);
|
||||
const uid: string = parser.getUid();
|
||||
const richEvent: CalendarEvent = parser.asRichEvent();
|
||||
/*
|
||||
* Matching the credential type is a workaround because the office calendar simply strips away newlines (\n and \r).
|
||||
* We need HTML there. Google Calendar understands newlines and Apple Calendar cannot show HTML, so no HTML should
|
||||
* be used for Google and Apple Calendar.
|
||||
*/
|
||||
const richEvent: CalendarEvent = parser.asRichEventPlain();
|
||||
|
||||
let success = true;
|
||||
|
||||
|
@ -579,7 +594,7 @@ const updateEvent = async (
|
|||
): Promise<EventResult> => {
|
||||
const parser: CalEventParser = new CalEventParser(calEvent);
|
||||
const newUid: string = parser.getUid();
|
||||
const richEvent: CalendarEvent = parser.asRichEvent();
|
||||
const richEvent: CalendarEvent = parser.asRichEventPlain();
|
||||
|
||||
let success = true;
|
||||
|
||||
|
|
17
lib/slots.ts
17
lib/slots.ts
|
@ -1,7 +1,6 @@
|
|||
import dayjs, { Dayjs } from "dayjs";
|
||||
import utc from "dayjs/plugin/utc";
|
||||
import timezone from "dayjs/plugin/timezone";
|
||||
|
||||
dayjs.extend(utc);
|
||||
dayjs.extend(timezone);
|
||||
|
||||
|
@ -119,10 +118,20 @@ const getSlots = ({
|
|||
workingHours,
|
||||
organizerTimeZone,
|
||||
}: GetSlots): Dayjs[] => {
|
||||
const startTime = dayjs().utcOffset(inviteeDate.utcOffset()).isSame(inviteeDate, "day")
|
||||
? inviteeDate.hour() * 60 + inviteeDate.minute() + (minimumBookingNotice || 0)
|
||||
: 0;
|
||||
// current date in invitee tz
|
||||
const currentDate = dayjs().utcOffset(inviteeDate.utcOffset());
|
||||
const startDate = currentDate.add(minimumBookingNotice, "minutes"); // + minimum notice period
|
||||
// when the invitee date is not the same as the current date, reset the date to the start of day
|
||||
if (inviteeDate.date() !== currentDate.date()) {
|
||||
inviteeDate = inviteeDate.startOf("day");
|
||||
}
|
||||
|
||||
const startTime = startDate.isAfter(inviteeDate)
|
||||
? // block out everything when inviteeDate is less than startDate
|
||||
startDate.date() > inviteeDate.date()
|
||||
? 1440
|
||||
: startDate.hour() * 60 + startDate.minute()
|
||||
: 0;
|
||||
const inviteeBounds = inviteeBoundary(startTime, inviteeDate.utcOffset(), frequency);
|
||||
|
||||
return getOverlaps(
|
||||
|
|
|
@ -175,14 +175,16 @@ export default function Type(props): Type {
|
|||
organizerTimeZone={props.eventType.timeZone || props.user.timeZone}
|
||||
inviteeTimeZone={timeZone()}
|
||||
eventLength={props.eventType.length}
|
||||
minimumBookingNotice={props.eventType.minimumBookingNotice}
|
||||
/>
|
||||
{selectedDate && (
|
||||
<AvailableTimes
|
||||
workingHours={props.workingHours}
|
||||
timeFormat={timeFormat}
|
||||
organizerTimeZone={props.eventType.timeZone || props.user.timeZone}
|
||||
eventLength={props.eventType.length}
|
||||
minimumBookingNotice={props.eventType.minimumBookingNotice}
|
||||
eventTypeId={props.eventType.id}
|
||||
eventLength={props.eventType.length}
|
||||
date={selectedDate}
|
||||
user={props.user}
|
||||
/>
|
||||
|
@ -246,6 +248,7 @@ export const getServerSideProps: GetServerSideProps = async (context: GetServerS
|
|||
"periodStartDate",
|
||||
"periodEndDate",
|
||||
"periodCountCalendarDays",
|
||||
"minimumBookingNotice",
|
||||
]
|
||||
);
|
||||
|
||||
|
|
|
@ -264,7 +264,7 @@ export default function Book(props: any): JSX.Element {
|
|||
{input.type !== EventTypeCustomInputType.Bool && (
|
||||
<label
|
||||
htmlFor={input.label}
|
||||
className="block text-sm font-medium text-gray-700 mb-1">
|
||||
className="block text-sm font-medium text-gray-700 dark:text-white mb-1">
|
||||
{input.label}
|
||||
</label>
|
||||
)}
|
||||
|
@ -284,7 +284,7 @@ export default function Book(props: any): JSX.Element {
|
|||
name={"custom_" + input.id}
|
||||
id={"custom_" + input.id}
|
||||
required={input.required}
|
||||
className="shadow-sm dark:bg-gray-700 dark:border-gray-900 focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
|
||||
className="shadow-sm dark:bg-gray-700 dark:text-white dark:border-gray-900 focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
|
||||
placeholder=""
|
||||
/>
|
||||
)}
|
||||
|
@ -294,7 +294,7 @@ export default function Book(props: any): JSX.Element {
|
|||
name={"custom_" + input.id}
|
||||
id={"custom_" + input.id}
|
||||
required={input.required}
|
||||
className="shadow-sm dark:bg-gray-700 dark:border-gray-900 focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
|
||||
className="shadow-sm dark:bg-gray-700 dark:text-white dark:border-gray-900 focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
|
||||
placeholder=""
|
||||
/>
|
||||
)}
|
||||
|
|
|
@ -55,6 +55,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
|
|||
periodStartDate: req.body.periodStartDate,
|
||||
periodEndDate: req.body.periodEndDate,
|
||||
periodCountCalendarDays: req.body.periodCountCalendarDays,
|
||||
minimumBookingNotice: req.body.minimumBookingNotice,
|
||||
};
|
||||
|
||||
if (req.method == "POST") {
|
||||
|
|
|
@ -66,7 +66,8 @@ type EventTypeInput = {
|
|||
periodStartDate?: Date | string;
|
||||
periodEndDate?: Date | string;
|
||||
periodCountCalendarDays?: boolean;
|
||||
enteredRequiresConfirmation: boolean;
|
||||
requiresConfirmation: boolean;
|
||||
minimumBookingNotice: number;
|
||||
};
|
||||
|
||||
const PERIOD_TYPES = [
|
||||
|
@ -92,7 +93,6 @@ export default function EventTypePage({
|
|||
}: Props): JSX.Element {
|
||||
const router = useRouter();
|
||||
|
||||
console.log(eventType);
|
||||
const inputOptions: OptionBase[] = [
|
||||
{ value: EventTypeCustomInputType.Text, label: "Text" },
|
||||
{ value: EventTypeCustomInputType.TextLong, label: "Multiline Text" },
|
||||
|
@ -174,6 +174,7 @@ export default function EventTypePage({
|
|||
const lengthRef = useRef<HTMLInputElement>();
|
||||
const isHiddenRef = useRef<HTMLInputElement>();
|
||||
const requiresConfirmationRef = useRef<HTMLInputElement>();
|
||||
const minimumBookingNoticeRef = useRef<HTMLInputElement>();
|
||||
const eventNameRef = useRef<HTMLInputElement>();
|
||||
const periodDaysRef = useRef<HTMLInputElement>();
|
||||
const periodDaysTypeRef = useRef<HTMLSelectElement>();
|
||||
|
@ -190,6 +191,7 @@ export default function EventTypePage({
|
|||
const enteredDescription: string = descriptionRef.current.value;
|
||||
const enteredLength: number = parseInt(lengthRef.current.value);
|
||||
const enteredIsHidden: boolean = isHiddenRef.current.checked;
|
||||
const enteredMinimumBookingNotice: number = parseInt(minimumBookingNoticeRef.current.value);
|
||||
const enteredRequiresConfirmation: boolean = requiresConfirmationRef.current.checked;
|
||||
const enteredEventName: string = eventNameRef.current.value;
|
||||
|
||||
|
@ -200,14 +202,6 @@ export default function EventTypePage({
|
|||
const enteredPeriodStartDate = periodStartDate ? periodStartDate.toDate() : null;
|
||||
const enteredPeriodEndDate = periodEndDate ? periodEndDate.toDate() : null;
|
||||
|
||||
console.log("values", {
|
||||
type,
|
||||
periodDaysTypeRef,
|
||||
enteredPeriodDays,
|
||||
enteredPeriodDaysType,
|
||||
enteredPeriodStartDate,
|
||||
enteredPeriodEndDate,
|
||||
});
|
||||
// TODO: Add validation
|
||||
|
||||
const payload: EventTypeInput = {
|
||||
|
@ -226,6 +220,7 @@ export default function EventTypePage({
|
|||
periodStartDate: enteredPeriodStartDate,
|
||||
periodEndDate: enteredPeriodEndDate,
|
||||
periodCountCalendarDays: enteredPeriodDaysType,
|
||||
minimumBookingNotice: enteredMinimumBookingNotice,
|
||||
requiresConfirmation: enteredRequiresConfirmation,
|
||||
};
|
||||
|
||||
|
@ -671,6 +666,25 @@ export default function EventTypePage({
|
|||
|
||||
<fieldset className="my-8">
|
||||
<Text variant="largetitle">When can people book this event?</Text>
|
||||
<div className="my-4">
|
||||
<label htmlFor="minimumAdvance" className="block text-sm font-medium text-gray-700">
|
||||
Minimum booking notice
|
||||
</label>
|
||||
<div className="mt-1 relative rounded-md shadow-sm">
|
||||
<input
|
||||
ref={minimumBookingNoticeRef}
|
||||
type="number"
|
||||
name="minimumAdvance"
|
||||
id="minimumAdvance"
|
||||
required
|
||||
className="focus:ring-blue-500 focus:border-blue-500 block w-full pr-20 sm:text-sm border-gray-300 rounded-md"
|
||||
defaultValue={eventType.minimumBookingNotice}
|
||||
/>
|
||||
<div className="absolute inset-y-0 right-0 pr-3 flex items-center text-gray-400 text-sm">
|
||||
minutes
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr className="my-8" />
|
||||
<section className="space-y-12">
|
||||
<div className="mb-4">
|
||||
|
@ -1019,6 +1033,7 @@ export const getServerSideProps: GetServerSideProps<Props> = async ({ req, query
|
|||
periodEndDate: true,
|
||||
periodCountCalendarDays: true,
|
||||
requiresConfirmation: true,
|
||||
minimumBookingNotice: true,
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
@ -159,14 +159,14 @@ export default function Success(props) {
|
|||
"https://outlook.live.com/calendar/0/deeplink/compose?body=" +
|
||||
props.eventType.description +
|
||||
"&enddt=" +
|
||||
date.add(props.eventType.length, "minute").format() +
|
||||
date.add(props.eventType.length, "minute").utc().format() +
|
||||
"&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=" +
|
||||
date.format() +
|
||||
date.utc().format() +
|
||||
"&subject=" +
|
||||
eventName
|
||||
) + (location ? "&location=" + location : "")
|
||||
}>
|
||||
<a className="mx-2 btn-wide btn-white">
|
||||
<a className="mx-2 btn-wide btn-white" target="_blank">
|
||||
<svg
|
||||
className="inline-block w-4 h-4 mr-1 -mt-1"
|
||||
fill="currentColor"
|
||||
|
@ -183,14 +183,14 @@ export default function Success(props) {
|
|||
"https://outlook.office.com/calendar/0/deeplink/compose?body=" +
|
||||
props.eventType.description +
|
||||
"&enddt=" +
|
||||
date.add(props.eventType.length, "minute").format() +
|
||||
date.add(props.eventType.length, "minute").utc().format() +
|
||||
"&path=%2Fcalendar%2Faction%2Fcompose&rru=addevent&startdt=" +
|
||||
date.format() +
|
||||
date.utc().format() +
|
||||
"&subject=" +
|
||||
eventName
|
||||
) + (location ? "&location=" + location : "")
|
||||
}>
|
||||
<a className="mx-2 btn-wide btn-white">
|
||||
<a className="mx-2 btn-wide btn-white" target="_blank">
|
||||
<svg
|
||||
className="inline-block w-4 h-4 mr-1 -mt-1"
|
||||
fill="currentColor"
|
||||
|
|
|
@ -0,0 +1,2 @@
|
|||
-- AlterTable
|
||||
ALTER TABLE "EventType" ADD COLUMN "minimumBookingNotice" INTEGER NOT NULL DEFAULT 120;
|
|
@ -31,6 +31,7 @@ model EventType {
|
|||
periodDays Int?
|
||||
periodCountCalendarDays Boolean?
|
||||
requiresConfirmation Boolean @default(false)
|
||||
minimumBookingNotice Int @default(120)
|
||||
}
|
||||
|
||||
model Credential {
|
||||
|
|
Loading…
Reference in a new issue