Customize Scheduler booking flows

By default, Scheduler follows the standard flow when you don't make any customizations. You can add or skip the steps to create an optional flow. The following diagram illustrates the standard flow and the supported optional flows in Scheduler.

A flow diagram showing the Scheduler flow.

You can customize your booking flows by adding a confirmation redirect URL or setting up pre-bookings.

Add a confirmation redirect URL

Instead of displaying the default booking confirmation in the Scheduling Component, you can redirect guests to a custom booking confirmation page. For example, your custom page can match your branding and include any preparatory steps or materials needed for the event. You can add a confirmation redirect URL either using the Scheduler API or the Scheduler Editor.

Add a confirmation redirect URL using the Scheduler API

You can make a Create Configuration request or an Update Configuration request to add confirmation_redirect_url.

...
"scheduler": {
  "confirmation_redirect_url": "https://www.example.com/booking-confirmed"
}

Add a confirmation redirect URL using the Scheduler Editor

By default, the Scheduler Editor includes an option to add a confirmation redirect URL on the Booking options tab.

In the Scheduler Editor, click Booking options from the navigation.
Under Custom booking flow, for When a booking is confirmed, select Redirect to custom URL.
Enter the confirmation redirect URL.
Click Save change.

Set up pre-bookings

Pre-booking allows you to pause the booking flow to complete an action. When you set up pre-booking, Scheduler adds a placeholder event to the organizer's calendar before finalizing the booking. Scheduler will finalize the booking only when a specified action is completed.

Scheduler currently supports organizer-confirmation pre-bookings.

Set up an organizer-confirmed booking

When you set booking-type to organizer-confirmation and a guest books an event, Nylas Scheduler creates a placeholder event marked [PENDING] in the organizer's calendar and sends them an email message with a confirmation link. When the organizer clicks the link, they're redirected to the confirmation request page, where they can either accept or reject the pre-booking.

If the organizer accepts the pre-booking, Scheduler makes an Update Bookings request to confirm the booking and replaces the placeholder event with the actual booking. The guest then receives a booking confirmation email message.
If the organizer rejects the pre-booking, Scheduler makes an Update Bookings request to cancel the booking and delete the placeholder event.

To set up organizer-confirmed bookings, you need to create a confirmation request page and then add the URL to the configuration.

Create a confirmation request page

To create a confirmation request page, add the organizerConfirmationBookingRef property to the Scheduling Component and set it to the booking reference for the pre-booking to confirm.

🔍 You can find the booking reference in the rescheduling or cancellation page URLs, or in the notifications you get when you subscribe to Scheduler notification triggers.

<NylasScheduling
  organizerConfirmationBookingRef="<BOOKING_REFERENCE>"
/>

Add the URL for the confirmation request page to the configuration

You can add the URL for the confirmation request page either using the Scheduler API or the Scheduler Editor.

Add the URL using the Scheduler API

Make an Update Configuration request to set booking-type to organizer-confirmation and to set organizer_confirmation_url.

"event_booking": {
  "booking_type": "organizer-confirmation",
  ...
},
"scheduler": {
  "organizer_confirmation_url": "https://www.example.com/confirmation/:booking_ref",
}

Add the URL using the Scheduler Editor

First, add organizer_confirmation_url to the Scheduler Editor Component.

HTML/VanillaJS
React

<html>
  <body>
    <nylas-scheduler-editor />
      
    <script type="module">
      // ...Scheduler Editor Configuration
      ...
      schedulerEditor.defaultSchedulerConfigState = {
        selectedConfiguration: {
          requires_session_auth: false,
          scheduler: {
            organizer_confirmation_url: `${window.location.origin}/confirmation/:booking_ref`,
            cancellation_url: `${window.location.origin}/cancel/:booking_ref`,
          }
        }
      };
      ...
    </script>
  </body>
</html>

<NylasSchedulerEditor
  ...
  defaultSchedulerConfigState = {
    selectedConfiguration: {
      requires_session_auth: false,
      scheduler: {
        organizer_confirmation_url: `${window.location.origin}/confirmation/:booking_ref`,
        cancellation_url: `${window.location.origin}/cancel/:booking_ref`,
      },
    },
  }
/>

You can then set up an organizer-confirmed booking in the Scheduler Editor UI, on the Booking options tab.

In the Scheduler Editor, click Booking options from the navigation.
Under Custom booking flow, for When a booking is requested, select Manually accept bookings from the dropdown list.
Click Save change.