Lauris SkraucisandGitHub
9724bc07a6
* fix: typo * feat: add italian language to atoms * chore: add changelog entry * docs: document available atoms languages
42 lines
2.4 KiB
Plaintext
42 lines
2.4 KiB
Plaintext
---
|
|
title: "Cal Provider"
|
|
---
|
|
|
|
Cal Provider is used to setup scheduling within your app. It is used in the root of your app, be it _app.js or or _app.tsx in case of
|
|
Next.js or App.js or App.ts in case of React. Here is an example:
|
|
|
|
|
|
```js
|
|
import "@calcom/atoms/globals.min.css";
|
|
import { CalProvider } from '@calcom/atoms';
|
|
|
|
function MyApp({ Component, pageProps }) {
|
|
const accessToken = "managed-user-access-token";
|
|
|
|
return (
|
|
<CalProvider
|
|
clientId={process.env.CAL_OAUTH_CLIENT_ID ?? ""}
|
|
options={{
|
|
apiUrl: process.env.CAL_API_URL ?? "https://api.cal.com/v2",
|
|
refreshUrl: process.env.REFRESH_URL
|
|
}}
|
|
accessToken={accessToken}
|
|
>
|
|
<Component {...pageProps} />
|
|
</CalProvider>
|
|
);
|
|
}
|
|
|
|
export default MyApp;
|
|
```
|
|
|
|
Below is a list of props that can be passed to the Cal Provider.
|
|
|
|
| Name | Required | Description |
|
|
|:----------------------------|:----------|:-------------------------------------------------------------------------------------------------------|
|
|
| clientId | Yes | Your OAuth client ID |
|
|
| options | Yes | Configuration options - `apiUrl` (should be https://api.cal.com/v2) and `refreshUrl` (URL of endpoint you have to build that to which atoms will send expired access tokens and receive new one in return. Read how to set it up [here](https://cal.com/docs/platform/quickstart#4-backend%3A-setting-up-a-refresh-token-endpoint)) and `readingDirection` (defaults to "ltr" but can also pass "rtl" which will change direction of UI components) |
|
|
| accessToken | No | The access token of your managed user for whom cal handles scheduling. |
|
|
| autoUpdateTimezone | No | Whether to automatically update managed user timezone (default: true) |
|
|
| language | No | Language code (default: "en") - available languages: "en", "de", "fr", "it", "nl", "pt-BR", "es" |
|
|
| organizationId | No | ID of your organization | |