Skip to content
Nylas Docs

Configure authentication for the Scheduler Editor Component

The Scheduler Editor Component uses the Hosted authentication details in nylasSessionsConfig to interact with the Nylas APIs. Instead of using nylasSessionsConfig, you can use nylasApiRequest property in the either of the following situations:

Download Nylas identity package

To use nylasApiRequest, you first need to download the Nylas identity package:

Terminal window
npm i @nylas/identity@latest

Use existing Nylas Hosted authentication

If you’re already using Nylas Hosted auth in your application, you can use nylasApiRequest with NylasIdentityRequestWrapper.

!!!include(v3_code_samples/scheduler/custom-auth-nylas-identity-request-wrapper.html" />
!!!include(v3_code_samples/scheduler/custom-auth-nylas-identity-request-wrapper.tsx)!!!

Use Custom authentication

If you want to use Custom auth or a different HTTP client library for authentication, you can define a custom wrapper (CustomIdentityRequestWrapper) which implements nylasApiRequest, and set the nylasApiRequest property with CustomIdentityRequestWrapper.

The Scheduler Editor Component and CustomIdentityRequestWrapper require an access token from the same origin. To get the access token:

  1. Add a callback URI.
  2. Make an authorization request to retrieve a code.
  3. Exchange the code for an access token.

Add a callback URI

  1. In your Nylas application, click Hosted Authentication in the left navigation, and click Callback URIs.
  2. Click Add a callback URI.
  3. Select the JavaScript platform.
  4. For URL, enter https://127.0.0.1:3000/scheduler-editor. This assumes you host the Scheduler Editor on localhost:3000. The URL will vary based on your hosting choice.
  5. For Origin, enter https://127.0.0.1:3000.
  6. Click Add callback URI.

Make an authorization request

Make a GET /v3/connect/auth request to retrieve an authorization code that you can exchange for an access token.

Terminal window
/v3/connect/auth?
  client_id=<NYLAS_CLIENT_ID>
  &redirect_uri=https://127.0.0.1:3000/scheduler-editor
  &response_type=code
  &provider=google
  &access_type=offline

Exchange the code for an access token

Using the code from your authorization request, make a POST /v3/connect/token request to get the access token.

Terminal window
curl --request POST \
  --url 'https://api.us.nylas.com/v3/connect/token' \
  --header 'Content-Type: application/json' \
  --header 'Origin: 'https://127.0.0.1:3000' \
  --data '{
      "code": "<AUTHORIZATION_CODE>",
      "client_id": "<NYLAS_CLIENT_ID>",
      "client_secret": "<NYLAS_API_KEY>",
      "redirect_uri": "https://127.0.0.1:3000/scheduler-editor",
      "grant_type": "authorization_code"
  }'

You can then use the access token in CustomIdentityRequestWrapper and the Scheduler Editor Component. Make sure that CustomIdentityRequestWrapper has a currentUser function that returns the same email address that is associated with the access token.

Example: CustomIdentityRequestWrapper and the Scheduler Editor Component

!!!include(v3_code_samples/scheduler/custom-identity-request-wrapper-example.js)!!!
!!!include(v3_code_samples/scheduler/custom-auth-custom-identity-request-wrapper.html" />
!!!include(v3_code_samples/scheduler/custom-auth-custom-identity-request-wrapper.tsx)!!!