import React from "react";
import { NylasScheduling, NylasSchedulerEditor } from "@nylas/react";
function CreateSchedule() {
return (
<NylasSchedulerEditor
nylasSessionsConfig={{
clientId: "5b...", // Replace with your Nylas client ID
// redirectUri: `${window.location.origin}/scheduler-editor`,
domain: "https://api.eu.nylas.com", // or 'https://api.eu.nylas.com' for EU data center
hosted: true,
accessType: "offline",
}}
defaultSchedulerConfigStoreState={{
selectedConfiguration: {
requires_session_auth: false, // Set to 'false' to create a public configuration
},
}}
/>
);
}
export default CreateSchedule;
When I open the component in browser, I can see as shown in the image. But when I click on View all providers I receive this error:
{
"request_id": "b702522f-0c84-42ff-a75e-58ffa381df6c",
"error": {
"type": "not_found_error",
"message": "Unrecognized request URL (GET: /connect/auth). Please see https://developer.nylas.com/docs/api/v3/ecc/ or we can help at https://support.nylas.com/."
}
}
My goal is to create a schedule using my virtual nylas account using the Scheduler UI components, Please guide on how can do this. I want to have something similar to what is developed in this nylas video: https://www.youtube.com/watch?v=d4Avpuupv-c&t=525
Hey @krutd33 , you found a typo in our docs! Thank you! Could you please try with https://api.eu.nylas.com/v3 (note the /v3 appended) as the domain URL in the nylasSessionConfig prop?
Hi @krutd33 for item 1, re:redirectUri have you had a chance to look at the Scheduler Quickstart Guides, in those we are using ${window.location.origin}/scheduler-editor where schedule-editor is a separate page created.
Followed the Quickstart and I have found the code for scheduler-editor
So now I have been able to sign in using my gmail and redirected to the scheduler-editor path.
But in scheduler-editor path I’m facing CORS error. Pasting some screenshots
In the below screenshot please observe that Availability & Booking Options didn’t appear, the way it is present in quickstart guide. In the Calendar booking field, calendar is still loading, I can’t move forward.
import { NylasSchedulerEditor, NylasScheduling } from "@nylas/react";
function ScheduleEditor() {
return (
<div>
<NylasSchedulerEditor
schedulerPreviewLink={`${window.location.origin}/?config_id={config.id}`}
nylasSessionsConfig={{
clientId: "589.........", // Replace with your Nylas client ID from the previous
redirectUri: `${window.location.origin}/scheduler-editor`,
domain: "https://api.eu.nylas.com/v3", // or 'https://api.eu.nylas.com/v3' for EU data center
hosted: true,
accessType: "offline",
}}
defaultSchedulerConfigState={{
selectedConfiguration: {
requires_session_auth: false, // Creates a public configuration which doesn't require a session
scheduler: {
// The callback URLs to be set in email notifications
rescheduling_url: `${window.location.origin}/reschedule/<BOOKING_REFERENCE>`, // The URL of the email notification includes the booking reference
cancellation_url: `${window.location.origin}/cancel/<BOOKING_REFERENCE>`,
},
},
}}
/>
</div>
);
}
export default ScheduleEditor;
PS: I’m not sure on how I will receive the <BOOKING_REFERENCE> & config.id values.
@krutd33 does the following updates to App.jsx work:
rescheduling_url: `${window.location.origin}/reschedule/:booking_ref`, // The URL of the email notification includes the booking reference
cancellation_url: `${window.location.origin}/cancel/:booking_ref`,
Hi @krutd33 - we do not have the code available for the corresponding reschedule / cancel user paths in the Quickstart Guides at the moment. Will let you know if this changes.
{
"request_id": "f1d584fd-e5ad-4098-95ff-8f9e3b4c0fd7",
"error": {
"type": "invalid_request_error",
"message": "json: cannot unmarshal object into Go struct field CreateBookingRequest.additional_fields of type []scheduling.BookingAdditionalField"
}
}
