Merge branch 'main' into bugfix/unify-email-sending
This commit is contained in:
Bailey Pumfleet
GitHub
commit
35fc5964eb
6 changed files with 104 additions and 37 deletions
|
|
@ -229,16 +229,13 @@ Contributions are what make the open source community such an amazing place to b
|
|||
2. On the upper right, click "Develop" => "Build App".
|
||||
3. On "OAuth", select "Create".
|
||||
4. Name your App.
|
||||
5. Choose "Account-level app" as the app type.
|
||||
5. Choose "User-managed app" as the app type.
|
||||
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.
|
||||
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:write:admin
|
||||
2. meeting:write:admin
|
||||
3. user:write:admin
|
||||
11. You don't need to provide basic information about your app. Instead click at "Scopes" and then at "+ Add Scopes". On the left, click the category "Meeting" and check the scope `meeting:write`.
|
||||
12. Click "Done".
|
||||
13. You're good to go. Now you can easily add your Zoom integration in the Calendso settings.
|
||||
|
||||
|
|
|
|||
|
|
@ -329,34 +329,46 @@ export default function Book(props: any): JSX.Element {
|
|||
</div>
|
||||
))}
|
||||
<div className="mb-4">
|
||||
{!guestToggle && (
|
||||
<label
|
||||
onClick={toggleGuestEmailInput}
|
||||
htmlFor="guests"
|
||||
className="block text-sm font-medium text-blue-500 mb-1 hover:cursor-pointer">
|
||||
+ Additional Guests
|
||||
</label>
|
||||
)}
|
||||
{guestToggle && (
|
||||
<ReactMultiEmail
|
||||
placeholder="Input your Email Address"
|
||||
emails={guestEmails}
|
||||
onChange={(_emails: string[]) => {
|
||||
setGuestEmails(_emails);
|
||||
}}
|
||||
getLabel={(email: string, index: number, removeEmail: (index: number) => void) => {
|
||||
return (
|
||||
<div data-tag key={index}>
|
||||
{email}
|
||||
<span data-tag-handle onClick={() => removeEmail(index)}>
|
||||
×
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
{!guestToggle &&
|
||||
<label
|
||||
onClick={toggleGuestEmailInput}
|
||||
htmlFor="guests"
|
||||
className="block text-sm font-medium dark:text-white text-blue-500 mb-1 hover:cursor-pointer">
|
||||
+ Additional Guests
|
||||
</label>
|
||||
}
|
||||
{guestToggle && (
|
||||
<div>
|
||||
<label
|
||||
htmlFor="guests"
|
||||
className="block text-sm font-medium dark:text-white text-gray-700">
|
||||
Guests
|
||||
</label>
|
||||
<ReactMultiEmail
|
||||
placeholder="guest@example.com"
|
||||
emails={guestEmails}
|
||||
onChange={(_emails: string[]) => {
|
||||
setGuestEmails(_emails);
|
||||
}}
|
||||
getLabel={(
|
||||
email: string,
|
||||
index: number,
|
||||
removeEmail: (index: number) => void
|
||||
) => {
|
||||
return (
|
||||
<div data-tag key={index}>
|
||||
{email}
|
||||
<span data-tag-handle onClick={() => removeEmail(index)}>
|
||||
×
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
<div className="mb-4">
|
||||
<label
|
||||
htmlFor="notes"
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ import { Menu, Transition } from "@headlessui/react";
|
|||
import { DotsHorizontalIcon } from "@heroicons/react/solid";
|
||||
import classNames from "@lib/classNames";
|
||||
import { ClockIcon, XIcon } from "@heroicons/react/outline";
|
||||
import Loader from "@components/Loader";
|
||||
|
||||
export default function Bookings({ bookings }) {
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
|
|
@ -17,7 +18,7 @@ export default function Bookings({ bookings }) {
|
|||
const router = useRouter();
|
||||
|
||||
if (loading) {
|
||||
return <p className="text-gray-400">Loading...</p>;
|
||||
return <Loader />;
|
||||
}
|
||||
|
||||
async function confirmBookingHandler(booking, confirm: boolean) {
|
||||
|
|
|
|||
|
|
@ -267,7 +267,7 @@ export default function IntegrationHome({ integrations }) {
|
|||
<p>If you want to add your own App here, get in touch with us.</p>
|
||||
</div>
|
||||
<div className="mt-5">
|
||||
<a href="apps@calendso.com" className="btn btn-white">
|
||||
<a href="mailto:apps@calendso.com" className="btn btn-white">
|
||||
Contact us
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import { getSession, useSession } from "next-auth/client";
|
|||
import { UsersIcon } from "@heroicons/react/outline";
|
||||
import TeamList from "../../components/team/TeamList";
|
||||
import TeamListItem from "../../components/team/TeamListItem";
|
||||
import Loader from "@components/Loader";
|
||||
|
||||
export default function Teams() {
|
||||
const [, loading] = useSession();
|
||||
|
|
@ -38,7 +39,7 @@ export default function Teams() {
|
|||
}, []);
|
||||
|
||||
if (loading) {
|
||||
return <p className="text-gray-400">Loading...</p>;
|
||||
return <Loader />;
|
||||
}
|
||||
|
||||
const createTeam = (e) => {
|
||||
|
|
|
|||
|
|
@ -81,6 +81,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* !important to style multi-email input */
|
||||
::-moz-selection {
|
||||
color: white;
|
||||
background: black;
|
||||
|
|
@ -99,9 +100,64 @@
|
|||
}
|
||||
|
||||
.react-multi-email > [type='text'] {
|
||||
--tw-ring-shadow: 0 0 0 0 0;
|
||||
@apply shadow-sm dark:bg-gray-700 dark:text-white dark:border-gray-900 focus:ring-black focus:border-black block w-full sm:text-sm border-gray-300 rounded-md;
|
||||
}
|
||||
|
||||
.react-multi-email {
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 auto;
|
||||
flex: 1 0 auto;
|
||||
text-align: left;
|
||||
line-height: 1.25rem;
|
||||
padding: 0.75em 0.5rem;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.react-multi-email > span[data-placeholder] {
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0.8rem;
|
||||
top: 0.75rem;
|
||||
line-height: 1.25rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.react-multi-email.empty > span[data-placeholder] {
|
||||
display: inline;
|
||||
color: #646b7a;
|
||||
}
|
||||
|
||||
.react-multi-email.focused > span[data-placeholder] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.react-multi-email > input {
|
||||
width: 100% !important;
|
||||
display: inline-block !important;
|
||||
@apply mt-1;
|
||||
}
|
||||
|
||||
.react-multi-email [data-tag] {
|
||||
@apply inline-flex items-center px-2 py-1 my-1 mr-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-gray-900 dark:text-white bg-neutral-200 hover:bg-neutral-100 dark:bg-neutral-900 dark:hover:bg-neutral-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-500;
|
||||
}
|
||||
|
||||
.react-multi-email [data-tag] [data-tag-item] {
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.react-multi-email [data-tag] [data-tag-handle] {
|
||||
margin-left: 0.833em;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* !important to override react-select */
|
||||
.react-select__value-container{
|
||||
border: 0 !important;
|
||||
|
|
|
|||
Loading…
Reference in a new issue