Virtual Calendar in Scheduler Editor

Question and Answers
1

Hey all!
I’m trying to use virtual calendars in the scheduler editor component but for some reason I can’t get it to work. I’m following all the guides on how to create virtual calendars and grants, but can’t seem to find how to use those grants in the scheduler editor.

I’m also following this guide based on this comment. But I’m unsure where to include the grants in my code for the component and if I need to authenticate the user still with a custom authentication.

If I want to authenticate the user via this URL: https://api.eu.nylas.com/v3/connect/auth? I get a login error.

Can someone please explain me how to authenticate virtual calendars (if needed) and use grants in the scheduler editor?

Thanks!

2

Hey @minimum ,

You cannot pass a grant directly into the component; the guide you’re following is the right approach, and in CustomIdentityRequestWrapper you would put whatever logic you want to use for the component to make calls out with.

For example, CustomIdentityRequestWrapper in the guide shows essentially identical logic to what the component already does by default, but writing it explicitly allows you to swap in whatever access token you want instead.

If you’re trying to use grants, you could just hardcode the grant and API_KEY in there, but we strongly discourage it for security reasons. Instead, a safer approach would be to make a sort of proxy endpoint in your backend that is authenticated with your app’s access token, which then (on your backend) finds the related grant_id, and calls our scheduler endpoints with it (+ API_KEY).

3

Thanks for getting back to me @antoine!
I was wondering if there’s an example somewhere to see how it would work with a grant and API key coded into the CustomIdentityRequestWrapper . As we’re creating a new Grant per user and that’s already stored safely in our backend. I also just want to test things out a bit more before committing to a more secure yet complex approach.
Thanks!

4

@minimum if you wanted to test it out from the frontend (but only for testing, unsafe for anything else), you could just replace a few things in the CustomIdentityRequestWrapper:

      const response = await fetch(`https://api.us.nylas.com/v3/grants/{YOUR_GRANT}/${args.path}`, {
        method: args.method,
        body: JSON.stringify(args.body),
        headers: {
          ...args.headers,
          'Authorization': `Bearer ${API_KEY}`,
          'Content-Type': 'application/json',
        },
      });

You’ll notice instead of me in the API path, it’s the grant itself. And instead of an accessToken for auth, it’s the API_Key. Be mindful to also change the base API url to use EU!

Also, check out the code for the 2nd example in this showcase, where I show how to use a customIdentityWrapper with the editor :slight_smile: https://scheduler-v3-showcase.vercel.app/