diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 3edcaa6c49..f06a046724 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -387,12 +387,12 @@ The `metadata` frontmatter field can be used to define additional information ab
Define canonical or alternate URLs for your documentation page -
+

This is set via the alternates field. It has the following subfields:

- -| Name | Type | Default | Description | -| ---------- | --------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| `canonical` | `string` | - | The canonical URL to avoid duplicate content across versions or domains. | + +| Name | Type | Default | Description | +| ----------- | -------- | ------- | ------------------------------------------------------------------------ | +| `canonical` | `string` | - | The canonical URL to avoid duplicate content across versions or domains. | ```diff --- @@ -409,7 +409,7 @@ The `metadata` frontmatter field can be used to define additional information ab
Configure Open Graph metadata for social media previews -
+

This is set via the openGraph field. It has the following subfields:

| Name | Type | Default | Description | @@ -425,7 +425,7 @@ The `metadata` frontmatter field can be used to define additional information ab title: Example + metadata: + openGraph: -+ title: Clerk organizations - invite users ++ title: Clerk Organizations - invite users + description: Guide to sending and managing invitations within Clerk. + images: + - https://example.com/social-preview.png @@ -436,7 +436,7 @@ The `metadata` frontmatter field can be used to define additional information ab
Define X Cards metadata for the page -
+

This is set via the twitter field. It has the following subfields:

| Name | Type | Default | Description | @@ -450,7 +450,7 @@ The `metadata` frontmatter field can be used to define additional information ab title: Example + metadata: + twitter: -+ title: Clerk organizations - invite users ++ title: Clerk Organizations - invite users + description: Guide to sending and managing invitations within Clerk. + images: + - https://example.com/social-preview.png @@ -461,7 +461,7 @@ The `metadata` frontmatter field can be used to define additional information ab
Control search engine indexing and crawler behavior. -
+

This is set via the robots field. It has the following subfields:

| Name | Type | Default | Description | @@ -942,7 +942,7 @@ Tooltips are defined in the `_tooltips` folder and written in MDX, but they do n The tooltip syntax is similar to a link, but with a `!` prefix, as shown in the following example: ```mdx -The ID of the [active organization](!active-organization) that the user belongs to. +The ID of the [Active Organization](!active-organization) that the user belongs to. ``` Tooltips should follow the same styleguide as links - only add them on the first mention of a term and only in the highest heading section. So if a term is mentioned in an H2 section and again in its H3 section, it doesn't need to be added in the H3 section. diff --git a/docs/_partials/billing/enable-billing.mdx b/docs/_partials/billing/enable-billing.mdx index 039c283176..95faca64ea 100644 --- a/docs/_partials/billing/enable-billing.mdx +++ b/docs/_partials/billing/enable-billing.mdx @@ -1,12 +1,12 @@ -## Enable billing +## Enable Billing -To enable billing for your application, navigate to the [**Billing Settings**](https://dashboard.clerk.com/~/billing/settings) page in the Clerk Dashboard. This page will guide you through enabling billing for your application. +To enable Billing for your application, navigate to the [**Billing Settings**](https://dashboard.clerk.com/~/billing/settings) page in the Clerk Dashboard. This page will guide you through enabling Billing for your application. Clerk Billing costs the same as using Stripe Billing directly, just 0.7% per transaction, plus transaction fees which are paid directly to Stripe. Clerk Billing is **not** the same as Stripe Billing. Plans and pricing are managed directly through the Clerk Dashboard and won't sync with your existing Stripe products or plans. Clerk uses Stripe **only** for payment processing, so you don't need to set up Stripe Billing. ### Payment gateway -Once you have enabled billing, you will see the following **Payment gateway** options for collecting payments via Stripe: +Once you have enabled Billing, you will see the following **Payment gateway** options for collecting payments via Stripe: -- **Clerk development gateway**: A shared **test** Stripe account used for development instances. This allows developers to test and build billing flows **in development** without needing to create and configure a Stripe account. +- **Clerk development gateway**: A shared **test** Stripe account used for development instances. This allows developers to test and build Billing flows **in development** without needing to create and configure a Stripe account. - **Stripe account**: Use your own Stripe account for production. **A Stripe account created for a development instance cannot be used for production**. You will need to create a separate Stripe account for your production environment. diff --git a/docs/_partials/clerk-middleware-options.mdx b/docs/_partials/clerk-middleware-options.mdx index edc55b47e2..41a05f5265 100644 --- a/docs/_partials/clerk-middleware-options.mdx +++ b/docs/_partials/clerk-middleware-options.mdx @@ -46,7 +46,7 @@ The `clerkMiddleware()` function accepts an optional object. The following optio - `organizationSyncOptions?` - [OrganizationSyncOptions](#organization-sync-options) | undefined - Used to activate a specific [organization](/docs/guides/organizations/overview) or [personal account](/docs/guides/dashboard/overview) based on URL path parameters. If there's a mismatch between the [active organization](!active-organization) in the session (e.g., as reported by [`auth()`](/docs/reference/nextjs/app-router/auth)) and the organization indicated by the URL, the middleware will attempt to activate the organization specified in the URL. + Used to activate a specific [Organization](/docs/guides/organizations/overview) or [Personal Account](/docs/guides/dashboard/overview) based on URL path parameters. If there's a mismatch between the [Active Organization](!active-organization) in the session (e.g., as reported by [`auth()`](/docs/reference/nextjs/app-router/auth)) and the Organization indicated by the URL, the middleware will attempt to activate the Organization specified in the URL. --- diff --git a/docs/_partials/clerk-options.mdx b/docs/_partials/clerk-options.mdx index 43f46774a9..efc634631e 100644 --- a/docs/_partials/clerk-options.mdx +++ b/docs/_partials/clerk-options.mdx @@ -86,5 +86,5 @@ - `taskUrls?` - `Record` - The URL paths users are redirected to after sign-up or sign-in when specific session tasks need to be completed. For example, `{ 'choose-organization': '/onboarding/choose-organization' }` redirects users to `/onboarding/choose-organization` after sign-up if they need to choose an organization. + The URL paths users are redirected to after sign-up or sign-in when specific session tasks need to be completed. For example, `{ 'choose-organization': '/onboarding/choose-organization' }` redirects users to `/onboarding/choose-organization` after sign-up if they need to choose an Organization. diff --git a/docs/_partials/has-warning.mdx b/docs/_partials/has-warning.mdx index 0100d10827..3e719d42ce 100644 --- a/docs/_partials/has-warning.mdx +++ b/docs/_partials/has-warning.mdx @@ -1,2 +1,2 @@ > [!WARNING] -> Using `has()` **on the server-side** to check permissions works only with **custom permissions**, as [system permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) aren't included in the session token claims. To check system permissions, verify the user's role instead. +> Using `has()` **on the server-side** to check Permissions works only with **Custom Permissions**, as [System Permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) aren't included in the session token claims. To check System Permissions, verify the user's Role instead. diff --git a/docs/_partials/organization-sync-options.mdx b/docs/_partials/organization-sync-options.mdx index 1dc9e50a29..24fd15d8a7 100644 --- a/docs/_partials/organization-sync-options.mdx +++ b/docs/_partials/organization-sync-options.mdx @@ -5,15 +5,14 @@ object has the type `OrganizationSyncOptions`, which has the following propertie - `organizationPatterns` - [Pattern](#pattern)\[] - Specifies URL patterns that are organization-specific, containing an organization ID or slug as a path parameter. If a request - matches this path, the organization identifier will be used to set that org as active. + Specifies URL patterns that are Organization-specific, containing an Organization ID or slug as a path parameter. If a request matches this path, the Organization identifier will be used to set that Organization as active. If the route also matches the `personalAccountPatterns` prop, this prop takes precedence. - Patterns must have a path parameter named either `:id` (to match a Clerk organization ID) or `:slug` (to match a Clerk organization slug). + Patterns must have a path parameter named either `:id` (to match a Clerk Organization ID) or `:slug` (to match a Clerk Organization slug). > [!WARNING] - > If the organization can't be activated—either because it doesn't exist or the user lacks access—the previously [active organization](!active-organization) will remain unchanged. Components must detect this case and provide an appropriate error and/or resolution pathway, such as calling `notFound()` or displaying an [``](/docs/reference/components/organization/organization-switcher). + > If the Organization can't be activated—either because it doesn't exist or the user lacks access—the previously [Active Organization](!active-organization) will remain unchanged. Components must detect this case and provide an appropriate error and/or resolution pathway, such as calling `notFound()` or displaying an [``](/docs/reference/components/organization/organization-switcher). Common examples: @@ -26,7 +25,7 @@ object has the type `OrganizationSyncOptions`, which has the following propertie - `personalAccountPatterns` - [Pattern](#pattern)\[] - URL patterns for resources that exist within the context of a user's [personal account](/docs/guides/organizations/overview#allow-personal-accounts). + URL patterns for resources that exist within the context of a user's [Personal Account](/docs/guides/organizations/overview#allow-personal-accounts). If the route also matches the `organizationPattern` prop, the `organizationPattern` prop takes precedence. diff --git a/docs/_tooltips/active-organization.mdx b/docs/_tooltips/active-organization.mdx index 91aa710261..dc69a1567f 100644 --- a/docs/_tooltips/active-organization.mdx +++ b/docs/_tooltips/active-organization.mdx @@ -1 +1 @@ -A user can be a member of multiple organizations, but only one can be active at a time. The **active organization** determines which organization-specific data the user can access and which role and related permissions they have within the organization. +A user can be a member of multiple Organizations, but only one can be active at a time. The **Active Organization** determines which Organization-specific data the user can access and which Role and related Permissions they have within the Organization. diff --git a/docs/_tooltips/session-tasks.mdx b/docs/_tooltips/session-tasks.mdx index 8b940fcba5..4dd918bc1a 100644 --- a/docs/_tooltips/session-tasks.mdx +++ b/docs/_tooltips/session-tasks.mdx @@ -1 +1 @@ -**Session tasks** are requirements that users must fulfill in order to complete the authentication process, such as choosing an organization. +**Session tasks** are requirements that users must fulfill in order to complete the authentication process, such as choosing an Organization. diff --git a/docs/getting-started/core-concepts.mdx b/docs/getting-started/core-concepts.mdx index fb1a73acc7..b4b5612b78 100644 --- a/docs/getting-started/core-concepts.mdx +++ b/docs/getting-started/core-concepts.mdx @@ -13,7 +13,7 @@ Clerk provides three ways to integrate authentication into your application, dep 1. **[Prebuilt components](/docs/reference/components/overview)**: All-in-one UI components that can be integrated into your application. They are fully customizable to match your application's branding and design. This is the recommended approach for most use cases. 1. **[Custom flows using the Clerk API](/docs/guides/development/custom-flows/overview)**: Build your own UI using the Clerk API. This option provides maximum flexibility and control over the user experience but requires more development effort. -Clerk offers a comprehensive suite of prebuilt components designed to seamlessly integrate authentication and multi-tenancy into your application. Components, like ``, ``, and ``, are all-in-one solutions that handle the full lifecycle of the user experience, from sign-up/sign-in to user profile and organization management. +Clerk offers a comprehensive suite of prebuilt components designed to seamlessly integrate authentication and multi-tenancy into your application. Components, like ``, ``, and ``, are all-in-one solutions that handle the full lifecycle of the user experience, from sign-up/sign-in to user profile and Organization management. The Account Portal uses these components on dedicated pages that are hosted on Clerk servers. These pages cannot be customized beyond the options provided in the [Clerk Dashboard](https://dashboard.clerk.com/~/account-portal). @@ -32,7 +32,7 @@ For example, you can: - Enable phone number authentication or multi-factor authentication. - Add social providers like Google. -- Delete users or create organizations. +- Delete users or create Organizations. - Invite other users to your [workspace](/docs/guides/dashboard/overview#workspaces) to help configure and manage your application. To get started, see the [configuration docs](/docs/guides/configure/auth-strategies/sign-up-sign-in-options), which include dedicated guides for specific configuration options. @@ -67,9 +67,9 @@ The [`User`](/docs/reference/javascript/user) object represents the current user #### Organization -Organizations are a flexible and scalable way to manage users and their access to resources within your Clerk application. With organizations, you can assign specific roles and permissions to users, making them useful for managing projects, coordinating teams, or facilitating partnerships. +Organizations are a flexible and scalable way to manage users and their access to resources within your Clerk application. With Organizations, you can assign specific Roles and Permissions to users, making them useful for managing projects, coordinating teams, or facilitating partnerships. -Users can belong to many organizations. One of them will be the [active organization](!active-organization) of the session. It is represented by the [`Organization`](/docs/reference/javascript/organization) object. To learn about organizations, see the [dedicated guide](/docs/guides/organizations/overview). +Users can belong to many Organizations. One of them will be the [Active Organization](!active-organization) of the session. It is represented by the [`Organization`](/docs/reference/javascript/organization) object. To learn about Organizations, see the [dedicated guide](/docs/guides/organizations/overview). #### Sign in diff --git a/docs/getting-started/quickstart.go.mdx b/docs/getting-started/quickstart.go.mdx index b846205865..f88cda876c 100644 --- a/docs/getting-started/quickstart.go.mdx +++ b/docs/getting-started/quickstart.go.mdx @@ -98,9 +98,9 @@ The following example demonstrates how to use the Clerk Go SDK to execute [Clerk By executing the code in the snippet below, you will: -- Create an organization and update its slug. -- Fetch all organization memberships and loop through them to get the first one. -- Get more details about the organization's user. +- Create an Organization and update its slug. +- Fetch all Organization memberships and loop through them to get the first one. +- Get more details about the Organization's user. > [!NOTE] > Your Clerk Secret Key is required. If you're signed into the Clerk Dashboard, your Secret Key should become visible by selecting the eye icon. Otherwise, you can retrieve your Clerk Secret Key on the [**API keys**](https://dashboard.clerk.com/~/api-keys) page in the Clerk Dashboard. diff --git a/docs/getting-started/quickstart.js-backend.mdx b/docs/getting-started/quickstart.js-backend.mdx index a1a8ab16bc..8ce1ec67d6 100644 --- a/docs/getting-started/quickstart.js-backend.mdx +++ b/docs/getting-started/quickstart.js-backend.mdx @@ -307,7 +307,7 @@ The following options are available: ## Get the `userId` and other properties -The [`Auth`](/docs/reference/backend/types/auth-object) object contains important information like the current user's session ID, user ID, and organization ID. +The [`Auth`](/docs/reference/backend/types/auth-object) object contains important information like the current user's session ID, user ID, and Organization ID. diff --git a/docs/guides/billing/for-b2b.mdx b/docs/guides/billing/for-b2b.mdx index ab218aab50..a3dfe06134 100644 --- a/docs/guides/billing/for-b2b.mdx +++ b/docs/guides/billing/for-b2b.mdx @@ -1,36 +1,36 @@ --- title: Clerk Billing for B2B SaaS -description: Clerk Billing is a feature that allows you to create and manage plans and features for your application. +description: Clerk Billing is a feature that allows you to create and manage Plans and Features for your application. sdk: nextjs, react, expo, react-router, astro, tanstack-react-start, remix, nuxt, vue, js-frontend, expressjs, fastify, js-backend --- -Clerk Billing for B2B SaaS allows you to create plans and manage subscriptions **for companies or organizations** in your application. If you'd like to charge individual users, see [Billing for B2C SaaS](/docs/guides/billing/for-b2c). You can also combine both B2C and B2B billing in the same application. +Clerk Billing for B2B SaaS allows you to create Plans and manage Subscriptions **for companies or organizations** in your application. If you'd like to charge individual users, see [Billing for B2C SaaS](/docs/guides/billing/for-b2c). You can also combine both B2C and B2B Billing in the same application. -## Create a plan +## Create a Plan -Subscription plans are what your customers subscribe to. There is no limit to the number of plans you can create. If your Clerk instance has existing [custom permissions](/docs/guides/organizations/roles-and-permissions), the corresponding features from those permissions will automatically be added to the free plan for orgs. This ensures that organization members get the same set of custom permissions when billing is enabled, because all organizations start on the free plan. +Subscription Plans are what your customers subscribe to. There is no limit to the number of Plans you can create. If your Clerk instance has existing [Custom Permissions](/docs/guides/organizations/roles-and-permissions), the corresponding Features from those Permissions will automatically be added to the free Plan for Orgs. This ensures that Organization members get the same set of Custom Permissions when Billing is enabled, because all Organizations start on the free Plan. -To create a plan, navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. Here, you can create, edit, and delete plans. To setup B2B billing, select the **Plans for Organizations** tab and select **Add Plan**. When creating a plan, you can also create [features](/docs/guides/secure/features) for the plan; see the next section for more information. +To create a Plan, navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. Here, you can create, edit, and delete Plans. To setup B2B Billing, select the **Plans for Organizations** tab and select **Add Plan**. When creating a Plan, you can also create [Features](/docs/guides/secure/features) for the Plan; see the next section for more information. > [!TIP] > What is the **Publicly available** option? > > --- > -> Plans appear in some Clerk components depending on what kind of plan it is. All plans can appear in the `` component. If it's an organization plan, it can appear in the `` component. When creating or editing a plan, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. +> Plans appear in some Clerk components depending on what kind of Plan it is. All Plans can appear in the `` component. If it's an Organization Plan, it can appear in the `` component. When creating or editing a Plan, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. -## Add features to a plan +## Add Features to a Plan -[Features](/docs/guides/secure/features) make it easy to give entitlements to your plans. You can add any number of features to a plan. +[Features](/docs/guides/secure/features) make it easy to give entitlements to your Plans. You can add any number of Features to a Plan. -You can add a feature to a plan when you are creating a plan. To add it after a plan is created: +You can add a Feature to a Plan when you are creating a Plan. To add it after a Plan is created: 1. Navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. -1. Select the plan you'd like to add a feature to. +1. Select the Plan you'd like to add a Feature to. 1. In the **Features** section, select **Add Feature**. > [!TIP] @@ -38,63 +38,63 @@ You can add a feature to a plan when you are creating a plan. To add it after a > > --- > -> Plans appear in some Clerk components depending on what kind of plan it is. All plans can appear in the `` component. If it's an organization plan, it can appear in the `` component. When adding a feature to a plan, it will also automatically appear in the corresponding plan. When creating or editing a feature, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. +> Plans appear in some Clerk components depending on what kind of Plan it is. All Plans can appear in the `` component. If it's an Organization Plan, it can appear in the `` component. When adding a Feature to a Plan, it will also automatically appear in the corresponding Plan. When creating or editing a Feature, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. ## Create a pricing page -You can create a pricing page by using the [``](/docs/reference/components/billing/pricing-table) component. This component displays a table of plans and features that customers can subscribe to. **It's recommended to create a dedicated page**, as shown in the following example. +You can create a pricing page by using the [``](/docs/reference/components/billing/pricing-table) component. This component displays a table of Plans and Features that customers can subscribe to. **It's recommended to create a dedicated page**, as shown in the following example. -## Control access with features, plans, and permissions +## Control access with Features, Plans, and Permissions -You can use Clerk's features, plans, and permissions to gate access to content using [authorization checks](!authorization-check). There are a few ways to do this, but the recommended approach is to either use the [`has()`](/docs/reference/backend/types/auth-object#has) method or the [``](/docs/reference/components/control/protect) component. +You can use Clerk's Features, Plans, and Permissions to gate access to content using [authorization checks](!authorization-check). There are a few ways to do this, but the recommended approach is to either use the [`has()`](/docs/reference/backend/types/auth-object#has) method or the [``](/docs/reference/components/control/protect) component. The `has()` method is available for any JavaScript-based framework, while `` is a component, and therefore, is only available for React-based frameworks. > [!IMPORTANT] -> Permission-based authorization checks link with feature-based authorization checks. This means that if you are checking a custom permission, it will only work if the feature part of the permission key (`org::`) **is a feature included in the organization's active plan**. For example, say you want to check if an organization member has the custom permission `org:teams:manage`, where `teams` is the feature. Before performing the authorization check, you need to ensure that the user's organization is subscribed to a plan that has the `teams` feature. If the user's organization is not subscribed to a plan that has the `teams` feature, the authorization check will always return `false`, _even if the user has the custom permission_. +> Permission-based authorization checks link with Feature-based authorization checks. This means that if you are checking a Custom Permission, it will only work if the Feature part of the Permission key (`org::`) **is a Feature included in the Organization's active Plan**. For example, say you want to check if an Organization member has the Custom Permission `org:teams:manage`, where `teams` is the Feature. Before performing the authorization check, you need to ensure that the user's Organization is subscribed to a Plan that has the `teams` Feature. If the user's Organization is not subscribed to a Plan that has the `teams` Feature, the authorization check will always return `false`, _even if the user has the Custom Permission_. ### Example: Using `has()` -Use the `has()` method to test if the organization has access to a **plan**: +Use the `has()` method to test if the Organization has access to a **Plan**: ```jsx const hasPremiumAccess = has({ plan: 'gold' }) ``` -Or a **feature**: +Or a **Feature**: ```jsx const hasPremiumAccess = has({ feature: 'widgets' }) ``` -The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server-side helper that checks if the organization has been granted a specific type of access control (role, permission, feature, or plan) and returns a boolean value. `has()` is available on the [`auth` object](/docs/reference/backend/types/auth-object), which you will access differently [depending on the framework you are using](/docs/reference/backend/types/auth-object#how-to-access-the-auth-object). +The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server-side helper that checks if the Organization has been granted a specific type of access control (Role, Permission, Feature, or Plan) and returns a boolean value. `has()` is available on the [`auth` object](/docs/reference/backend/types/auth-object), which you will access differently [depending on the framework you are using](/docs/reference/backend/types/auth-object#how-to-access-the-auth-object). > [!TIP] -> Why aren't custom permissions appearing in the session token (JWT) or in API responses (including the result of the `has()` check)? +> Why aren't Custom Permissions appearing in the session token (JWT) or in API responses (including the result of the `has()` check)? > > --- > -> Custom permissions will only appear in the session token (JWT) and in API responses (including the result of the `has()` check) if the feature part of the permission key (`org::`) **is a feature included in the organization's active plan**. If the feature is not part of the plan, the `has()` check for permissions using that feature will return `false`, and those permissions will not be represented in the session token. +> Custom Permissions will only appear in the session token (JWT) and in API responses (including the result of the `has()` check) if the Feature part of the Permission key (`org::`) **is a Feature included in the Organization's active Plan**. If the Feature is not part of the Plan, the `has()` check for Permissions using that Feature will return `false`, and those Permissions will not be represented in the session token. > -> For example, say you want to check if an organization member has the custom permission `org:teams:manage`, where `teams` is the feature. The user's organization must be subscribed to a plan that has the `teams` feature for authorization checks to work. If the user's organization is not subscribed to a plan that has the `teams` feature, the authorization check will always return `false`, _even if the user has the custom permission_. +> For example, say you want to check if an Organization member has the Custom Permission `org:teams:manage`, where `teams` is the Feature. The user's Organization must be subscribed to a Plan that has the `teams` Feature for authorization checks to work. If the user's Organization is not subscribed to a Plan that has the `teams` Feature, the authorization check will always return `false`, _even if the user has the Custom Permission_. - The following example demonstrates how to use `has()` to check if an organization has a plan. + The following example demonstrates how to use `has()` to check if an Organization has a Plan. - The following example demonstrates how to use `has()` to check if an organization has a feature. + The following example demonstrates how to use `has()` to check if an Organization has a Feature. - The following example demonstrates how to use `has()` to check if an organization has a permission. + The following example demonstrates how to use `has()` to check if an Organization has a Permission. @@ -102,23 +102,23 @@ The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server- ### Example: Using `` -The [``](/docs/reference/components/control/protect) component protects content or even entire routes by checking if the organization has been granted a specific type of access control (role, permission, feature, or plan). You can pass a `fallback` prop to `` that will be rendered if the organization does not have the access control. +The [``](/docs/reference/components/control/protect) component protects content or even entire routes by checking if the Organization has been granted a specific type of access control (Role, Permission, Feature, or Plan). You can pass a `fallback` prop to `` that will be rendered if the Organization does not have the access control. - The following example demonstrates how to use `` to protect a page by checking if the organization has a plan. + The following example demonstrates how to use `` to protect a page by checking if the Organization has a Plan. - The following example demonstrates how to use `` to protect a page by checking if the organization has a feature. + The following example demonstrates how to use `` to protect a page by checking if the Organization has a Feature. - The following example demonstrates how to use `` to protect a page by checking if the organization has a permission. + The following example demonstrates how to use `` to protect a page by checking if the Organization has a Permission. diff --git a/docs/guides/billing/for-b2c.mdx b/docs/guides/billing/for-b2c.mdx index 6f76f59251..fe090d2154 100644 --- a/docs/guides/billing/for-b2c.mdx +++ b/docs/guides/billing/for-b2c.mdx @@ -1,36 +1,36 @@ --- title: Clerk Billing for B2C SaaS -description: Clerk Billing is a feature that allows you to create and manage plans and features for your application. +description: Clerk Billing is a feature that allows you to create and manage Plans and Features for your application. sdk: nextjs, react, expo, react-router, astro, tanstack-react-start, remix, nuxt, vue, js-frontend, expressjs, fastify, js-backend --- -Clerk Billing for B2C SaaS allows you to create plans and manage subscriptions **for individual users** in your application. If you'd like to charge companies or organizations, see [Billing for B2B SaaS](/docs/guides/billing/for-b2b). You can also combine both B2C and B2B billing in the same application. +Clerk Billing for B2C SaaS allows you to create Plans and manage Subscriptions **for individual users** in your application. If you'd like to charge companies or organizations, see [Billing for B2B SaaS](/docs/guides/billing/for-b2b). You can also combine both B2C and B2B Billing in the same application. -## Create a plan +## Create a Plan -Subscription plans are what your users subscribe to. There is no limit to the number of plans you can create. +Subscription Plans are what your users subscribe to. There is no limit to the number of Plans you can create. -To create a plan, navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. Here, you can create, edit, and delete plans. To setup B2C billing, select the **Plans for Users** tab and select **Add Plan**. When creating a plan, you can also create features for the plan; see the next section for more information. +To create a Plan, navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. Here, you can create, edit, and delete Plans. To setup B2C Billing, select the **Plans for Users** tab and select **Add Plan**. When creating a Plan, you can also create Features for the Plan; see the next section for more information. > [!TIP] > What is the **Publicly available** option? > > --- > -> Plans appear in some Clerk components depending on what kind of plan it is. All plans can appear in the `` component. If it's a user plan, it can appear in the `` component. When creating or editing a plan, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. +> Plans appear in some Clerk components depending on what kind of Plan it is. All Plans can appear in the `` component. If it's a user Plan, it can appear in the `` component. When creating or editing a Plan, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. -## Add features to a plan +## Add Features to a Plan -[Features](/docs/guides/secure/features) make it easy to give entitlements to your plans. You can add any number of features to a plan. +[Features](/docs/guides/secure/features) make it easy to give entitlements to your Plans. You can add any number of Features to a Plan. -You can add a feature to a plan when you are creating a plan. To add it after a plan is created: +You can add a Feature to a Plan when you are creating a Plan. To add it after a Plan is created: 1. Navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. -1. Select the plan you'd like to add a feature to. +1. Select the Plan you'd like to add a Feature to. 1. In the **Features** section, select **Add Feature**. > [!TIP] @@ -38,45 +38,45 @@ You can add a feature to a plan when you are creating a plan. To add it after a > > --- > -> Plans appear in some Clerk components depending on what kind of plan it is. All plans can appear in the `` component. If it's a user plan, it can appear in the `` component. When adding a feature to a plan, it will also automatically appear in the corresponding plan. When creating or editing a feature, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. +> Plans appear in some Clerk components depending on what kind of Plan it is. All Plans can appear in the `` component. If it's a user Plan, it can appear in the `` component. When adding a Feature to a Plan, it will also automatically appear in the corresponding Plan. When creating or editing a Feature, if you'd like to hide it from appearing in Clerk components, you can toggle the **Publicly available** option off. ## Create a pricing page -You can create a pricing page by using the [``](/docs/reference/components/billing/pricing-table) component. This component displays a table of plans and features that users can subscribe to. **It's recommended to create a dedicated page**, as shown in the following example. +You can create a pricing page by using the [``](/docs/reference/components/billing/pricing-table) component. This component displays a table of Plans and Features that users can subscribe to. **It's recommended to create a dedicated page**, as shown in the following example. -## Control access with features and plans +## Control access with Features and Plans -You can use Clerk's features and plans to gate access to the content. There are a few ways to do this, but the recommended approach is to either use the [`has()`](/docs/reference/backend/types/auth-object#has) method or the [``](/docs/reference/components/control/protect) component. +You can use Clerk's Features and Plans to gate access to the content. There are a few ways to do this, but the recommended approach is to either use the [`has()`](/docs/reference/backend/types/auth-object#has) method or the [``](/docs/reference/components/control/protect) component. The `has()` method is available for any JavaScript framework, while `` is only available for React-based frameworks. ### Example: Using `has()` -Use the `has()` method to test if the user has access to a **plan**: +Use the `has()` method to test if the user has access to a **Plan**: ```jsx const hasPremiumAccess = has({ plan: 'gold' }) ``` -Or a **feature**: +Or a **Feature**: ```jsx const hasPremiumAccess = has({ feature: 'widgets' }) ``` -The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server-side helper that checks if the organization has been granted a specific type of access control (role, permission, feature, or plan) and returns a boolean value. `has()` is available on the [`auth` object](/docs/reference/backend/types/auth-object), which you will access differently [depending on the framework you are using](/docs/reference/backend/types/auth-object#how-to-access-the-auth-object). +The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server-side helper that checks if the Organization has been granted a specific type of access control (Role, Permission, Feature, or Plan) and returns a boolean value. `has()` is available on the [`auth` object](/docs/reference/backend/types/auth-object), which you will access differently [depending on the framework you are using](/docs/reference/backend/types/auth-object#how-to-access-the-auth-object). - The following example demonstrates how to use `has()` to check if a user has a plan. + The following example demonstrates how to use `has()` to check if a user has a Plan. - The following example demonstrates how to use `has()` to check if a user has a feature. + The following example demonstrates how to use `has()` to check if a user has a Feature. @@ -84,17 +84,17 @@ The [`has()`](/docs/reference/backend/types/auth-object#has) method is a server- ### Example: Using `` -The [``](/docs/reference/components/control/protect) component protects content or even entire routes by checking if the user has been granted a specific type of access control (role, permission, feature, or plan). You can pass a `fallback` prop to `` that will be rendered if the user does not have the access control. +The [``](/docs/reference/components/control/protect) component protects content or even entire routes by checking if the user has been granted a specific type of access control (Role, Permission, Feature, or Plan). You can pass a `fallback` prop to `` that will be rendered if the user does not have the access control. - The following example demonstrates how to use `` to protect a page by checking if the user has a plan. + The following example demonstrates how to use `` to protect a page by checking if the user has a Plan. - The following example demonstrates how to use `` to protect a page by checking if the user has a feature. + The following example demonstrates how to use `` to protect a page by checking if the user has a Feature. diff --git a/docs/guides/billing/free-trials.mdx b/docs/guides/billing/free-trials.mdx index c7181158ee..9697a1d450 100644 --- a/docs/guides/billing/free-trials.mdx +++ b/docs/guides/billing/free-trials.mdx @@ -1,18 +1,18 @@ --- title: Free trials -description: Let users try paid features before subscribing +description: Let users try paid Features before subscribing --- -Free trials let your users explore paid [features](/docs/guides/secure/features) for a limited time for free, helping them build confidence in a purchase decision. With Clerk Billing, you can turn on free trials for any plan, or set the same trial period across all your plans. +Free trials let your users explore paid [Features](/docs/guides/secure/features) for a limited time for free, helping them build confidence in a purchase decision. With Clerk Billing, you can turn on free trials for any Plan, or set the same trial period across all your Plans. ## Enable free trials -To enable free trials for your plans: +To enable free trials for your Plans: 1. Navigate to the [**Plans**](https://dashboard.clerk.com/~/billing/plans) page in the Clerk Dashboard. -1. Select the plan you want to enable free trials on. +1. Select the Plan you want to enable free trials on. 1. Enable **Free trial** and set the number of trial days (minimum is 1 day). ## What your users experience @@ -25,7 +25,7 @@ A credit card is required to start a free trial. This helps prevent abuse and en ### During a trial -Users get access to the plan's paid features for the configured number of days. If they cancel during their trial, they keep access until the original trial end date. +Users get access to the Plan's paid Features for the configured number of days. If they cancel during their trial, they keep access until the original trial end date. ### When the trial ends @@ -44,8 +44,8 @@ If the trial period is shorter than 3 days, these notifications are sent immedia You can manually change the duration of a user's trial: -- **Cancel at the end of the trial**: Cancel the trial while allowing the user to keep access to the paid features until the trial period ends. This prevents their default payment method from being charged when the trial period ends. -- **End immediately**: Immediately move the user back to the free plan and terminate their access to the paid features they were trialing. +- **Cancel at the end of the trial**: Cancel the trial while allowing the user to keep access to the paid Features until the trial period ends. This prevents their default payment method from being charged when the trial period ends. +- **End immediately**: Immediately move the user back to the free Plan and terminate their access to the paid Features they were trialing. - **Extend a trial**: Make a user's trial last longer. You must extend a trial by at least 1 day and no more than 365 days. You can only manage the trial of a user while the trial is active. Once a trial ends, you can no longer extend or cancel it. diff --git a/docs/guides/billing/overview.mdx b/docs/guides/billing/overview.mdx index 921d42b194..ab065dd54f 100644 --- a/docs/guides/billing/overview.mdx +++ b/docs/guides/billing/overview.mdx @@ -1,6 +1,6 @@ --- title: Clerk Billing -description: Clerk Billing is a feature that allows you to create and manage plans and features for your application. +description: Clerk Billing is a feature that allows you to create and manage Plans and Features for your application. --- diff --git a/docs/guides/configure/auth-strategies/sign-up-sign-in-options.mdx b/docs/guides/configure/auth-strategies/sign-up-sign-in-options.mdx index 8f3a45f0cd..3d1a8f537c 100644 --- a/docs/guides/configure/auth-strategies/sign-up-sign-in-options.mdx +++ b/docs/guides/configure/auth-strategies/sign-up-sign-in-options.mdx @@ -109,9 +109,9 @@ SSO connections are a way to allow users to authenticate with their existing acc Clerk offers two different types of SSO connections: - For all users, which are also known as OAuth connections, or social connections. Read more about [OAuth connections](/docs/guides/configure/auth-strategies/social-connections/overview). -- For specific domains and organizations, which are also known as enterprise connections. Read more about [enterprise connections](/docs/guides/configure/auth-strategies/enterprise-connections/overview). +- For specific domains and Organizations, which are also known as Enterprise SSO connections. Read more about [Enterprise SSO connections](/docs/guides/configure/auth-strategies/enterprise-connections/overview). -To enable SSO connections, navigate to the [**SSO connections**](https://dashboard.clerk.com/~/user-authentication/sso-connections) page in the Clerk Dashboard. +To enable SSO connections, navigate to the [**Enterprise SSO connections**](https://dashboard.clerk.com/~/user-authentication/sso-connections) page in the Clerk Dashboard. ## Web3 authentication diff --git a/docs/guides/configure/session-tasks.mdx b/docs/guides/configure/session-tasks.mdx index 899239b516..eb540eda59 100644 --- a/docs/guides/configure/session-tasks.mdx +++ b/docs/guides/configure/session-tasks.mdx @@ -3,7 +3,7 @@ title: Tasks after sign-up/sign-in description: Learn how to configure your application to require users to complete specific tasks after signing up or signing in. --- -**Session tasks** are pending requirements that users must complete after authentication, such as choosing an organization. When enabled in the Clerk Dashboard, these tasks are handled automatically within the `` and `` components. +**Session tasks** are pending requirements that users must complete after authentication, such as choosing an Organization. When enabled in the Clerk Dashboard, these tasks are handled automatically within the `` and `` components. ## Available tasks @@ -13,7 +13,7 @@ The following table lists the available tasks and their corresponding keys. | Setting | Key | Description | | - | - | - | -| [Allow personal accounts](https://dashboard.clerk.com/~/organizations-settings) | `choose-organization` | Disabled by default when enabling organizations. When disabled, users are required to choose an organization after authenticating. When enabled, users can choose a personal account instead of an organization. | +| [Allow Personal Accounts](https://dashboard.clerk.com/~/organizations-settings) | `choose-organization` | Disabled by default when enabling Organizations. When disabled, users are required to choose an Organization after authenticating. When enabled, users can choose a Personal Account instead of an Organization. | ## Session states @@ -36,7 +36,7 @@ The following table lists the available tasks and their corresponding components | [Personal accounts disabled (default)](/docs/guides/organizations/overview#allow-personal-accounts) | [``](/docs/reference/components/authentication/task-choose-organization) | > [!IMPORTANT] -> Personal accounts being disabled by default was released on 08-22-2025. Applications created before this date will not be able to see the **Allow personal accounts** setting, because personal accounts were enabled by default. +> Personal accounts being disabled by default was released on 08-22-2025. Applications created before this date will not be able to see the **Allow Personal Accounts** setting, because Personal Accounts were enabled by default. If the prebuilt components don't meet your specific needs or if you require more control over the logic, you can also build your own UI using the `Session.currentTask` property to check if the user has pending session tasks. To access the `Session.currentTask` property, you can use either the `useSession()` hook for React-based applications or `window.Clerk` for other frameworks. @@ -272,7 +272,7 @@ The `useAuth()` hook and helpers that access the [`Auth` object](/docs/reference #### Example: Personal accounts disabled -When organizations are enabled, [personal accounts are disabled by default](/docs/guides/organizations/overview#allow-personal-accounts) and your users will be required to select or create an organization after authenticating. Until completed, their session remains `pending`. Pages that are protected using Clerk's protection utilities will treat the user's session as signed-out. +When Organizations are enabled, [Personal Accounts are disabled by default](/docs/guides/organizations/overview#allow-personal-accounts) and your users will be required to select or create an Organization after authenticating. Until completed, their session remains `pending`. Pages that are protected using Clerk's protection utilities will treat the user's session as signed-out. For `useAuth()`, `isSignedIn` will be `false` and `userId` and `orgId` will be `null` if the user has a `pending` session. @@ -284,7 +284,7 @@ export default function Dashboard() { return (

User has no session, or has a pending session. They either need to sign in, or they need to - complete tasks by selecting or creating an organization. + complete tasks by selecting or creating an Organization.

) } @@ -312,7 +312,7 @@ export default async function Page() { return (

User has no session, or has a pending session. They either need to sign in, or they need to - complete pending session tasks by selecting or creating an organization. + complete pending session tasks by selecting or creating an Organization.

) } diff --git a/docs/guides/customizing-clerk/account-portal.mdx b/docs/guides/customizing-clerk/account-portal.mdx index aeb5eb3867..d1a8fbd9ef 100644 --- a/docs/guides/customizing-clerk/account-portal.mdx +++ b/docs/guides/customizing-clerk/account-portal.mdx @@ -81,7 +81,7 @@ In the case that a user _does_ visit an Account Portal page directly without the - Sign-up and sign-in: Set the appropriate [environment variables](/docs/guides/development/clerk-environment-variables#sign-in-and-sign-up-redirects) to configure the fallback redirects for sign-in and sign-up. - Sign out: Set the post-sign-out redirect by passing the `afterSignOutUrl` prop to the `` component. See the [reference doc](/docs/reference/components/clerk-provider) for more information. -- Organization redirects: Both the `` and `` components accept an `afterLeaveOrganizationUrl` prop for setting the redirect after leaving an organization. The `` component accepts an `afterSelectOrganizationUrl` prop for setting the redirect after selecting an organization, and an `afterCreateOrganizationUrl` prop for setting the redirect after creating an organization. +- Organization redirects: Both the `` and `` components accept an `afterLeaveOrganizationUrl` prop for setting the redirect after leaving an Organization. The `` component accepts an `afterSelectOrganizationUrl` prop for setting the redirect after selecting an Organization, and an `afterCreateOrganizationUrl` prop for setting the redirect after creating an Organization. - Prefill sign-up and sign-in fields: Can be specified via the following query parameters: `email_address`, `phone_number`, `username`, `first_name`, and `last_name`. For example, visiting `https://accounts.example.com/sign-in?username=nick` will result in the username field being prefilled with the value `nick`. ## Available Account Portal pages @@ -118,21 +118,21 @@ The unauthorized sign-in page displays a UI confirming that a session from an un ![Clerk's Account Portal unauthorized sign-in page](/docs/images/account-portal/unauthorized-sign-in.png) -### Create organization +### Create Organization -The create organization page hosts the prebuilt [``](/docs/reference/components/organization/create-organization) component, which provides a streamlined interface for users to create new organizations within your application. +The create Organization page hosts the prebuilt [``](/docs/reference/components/organization/create-organization) component, which provides a streamlined interface for users to create new Organizations within your application. -![The Account Portal create organization page hosts the \ component](/docs/images/account-portal/create-org.png) +![The Account Portal create Organization page hosts the \ component](/docs/images/account-portal/create-org.png) -Redirect your authenticated users to the create organization page using the [``](/docs/reference/components/control/redirect-to-create-organization) control component. +Redirect your authenticated users to the create Organization page using the [``](/docs/reference/components/control/redirect-to-create-organization) control component. -### Organization profile +### Organization Profile -The user profile page hosts the prebuilt [``](/docs/reference/components/organization/organization-profile) component, which renders a beautiful, full-featured organization management UI that allows users to manage their organization profile and security settings. +The Organization profile page hosts the prebuilt [``](/docs/reference/components/organization/organization-profile) component, which renders a beautiful, full-featured Organization management UI that allows users to manage their Organization profile and security settings. -![The Account Portal organization profile page hosts the \ component](/docs/images/account-portal/org-profile.png) +![The Account Portal Organization Profile page hosts the \ component](/docs/images/account-portal/org-profile.png) -Redirect your authenticated users to their organization profile page using the [``](/docs/reference/components/control/redirect-to-organization-profile) control component. +Redirect your authenticated users to their Organization Profile page using the [``](/docs/reference/components/control/redirect-to-organization-profile) control component. ### Waitlist diff --git a/docs/guides/customizing-clerk/adding-items/user-button.mdx b/docs/guides/customizing-clerk/adding-items/user-button.mdx index 7e8ea2e736..bb4f5356bf 100644 --- a/docs/guides/customizing-clerk/adding-items/user-button.mdx +++ b/docs/guides/customizing-clerk/adding-items/user-button.mdx @@ -564,7 +564,7 @@ In the following example, the "Sign out" menu item is moved to the top of the me ## Conditionally render menu items -To conditionally render menu items based on a user's role or custom permissions, you can use the [`has()`](/docs/reference/backend/types/auth-object#has) helper function. +To conditionally render menu items based on a user's Role or Custom Permissions, you can use the [`has()`](/docs/reference/backend/types/auth-object#has) helper function. In the following example, the "Create organization" menu item will only render if the current user has the `org:app:admin` permission. diff --git a/docs/guides/dashboard/overview.mdx b/docs/guides/dashboard/overview.mdx index e9b563050f..1a668155c4 100644 --- a/docs/guides/dashboard/overview.mdx +++ b/docs/guides/dashboard/overview.mdx @@ -3,7 +3,7 @@ title: Clerk Dashboard overview description: Learn how to use the Clerk Dashboard to manage your application settings, users, and more. --- -The Clerk Dashboard is where you create your Clerk application and is the central hub for managing your instance's settings, users, organizations, and more. +The Clerk Dashboard is where you create your Clerk application and is the central hub for managing your instance's settings, users, Organizations, and more. At the top of the Clerk Dashboard, you will see a few notable features: diff --git a/docs/guides/development/custom-flows/account-updates/user-impersonation.mdx b/docs/guides/development/custom-flows/account-updates/user-impersonation.mdx index 1ed45681c2..41a4681760 100644 --- a/docs/guides/development/custom-flows/account-updates/user-impersonation.mdx +++ b/docs/guides/development/custom-flows/account-updates/user-impersonation.mdx @@ -155,7 +155,7 @@ This guide will walk you through how to build a custom flow that handles user im import { auth } from '@clerk/nextjs/server' export async function generateActorToken(actorId: string, userId: string) { - // Check if the user has the permission to impersonate + // Check if the user has the Permission to impersonate if (!auth().has({ permission: 'org:admin:impersonate' })) { return { ok: false, @@ -201,7 +201,7 @@ This guide will walk you through how to build a custom flow that handles user im > It is **recommended** that you build impersonation into a dashboard that **only authorized users** can access. 1. Create the `dashboard/` directory. - 1. In the `dashboard/` directory, create a `_layout.tsx` file with the following code. The [`useAuth()`](/docs/reference/hooks/use-auth) hook is used to access the user's authentication state. If the user is already signed in, they'll be redirected to the home page. The [``](/docs/reference/components/control/protect) component is used to ensure that only users with the `org:dashboard:access` permission can access it. You can modify the `permission` attribute to fit your use case. + 1. In the `dashboard/` directory, create a `_layout.tsx` file with the following code. The [`useAuth()`](/docs/reference/hooks/use-auth) hook is used to access the user's authentication state. If the user is already signed in, they'll be redirected to the home page. The [``](/docs/reference/components/control/protect) component is used to ensure that only users with the `org:dashboard:access` Permission can access it. You can modify the `permission` attribute to fit your use case. ```tsx {{ filename: 'app/dashboard/_layout.tsx' }} import { Redirect, Stack } from 'expo-router' diff --git a/docs/guides/development/custom-flows/billing/add-new-payment-method.mdx b/docs/guides/development/custom-flows/billing/add-new-payment-method.mdx index e1a105cca4..be2bc4280e 100644 --- a/docs/guides/development/custom-flows/billing/add-new-payment-method.mdx +++ b/docs/guides/development/custom-flows/billing/add-new-payment-method.mdx @@ -12,9 +12,9 @@ This guide will walk you through how to build a custom user interface that allow For the custom flow that allows users to add a new payment method **during checkout**, see the [dedicated guide](/docs/guides/development/custom-flows/billing/checkout-new-payment-method). - ### Enable billing features + ### Enable Billing Features - To use billing features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and set up your plans. + To use Billing Features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and set up your Plans. ### Add payment method flow diff --git a/docs/guides/development/custom-flows/billing/checkout-existing-payment-method.mdx b/docs/guides/development/custom-flows/billing/checkout-existing-payment-method.mdx index e15109c32a..1200d78cbd 100644 --- a/docs/guides/development/custom-flows/billing/checkout-existing-payment-method.mdx +++ b/docs/guides/development/custom-flows/billing/checkout-existing-payment-method.mdx @@ -10,15 +10,15 @@ description: Learn how to use the Clerk API to build a custom checkout flow that This guide will walk you through how to build a custom user interface for a checkout flow that allows users to checkout **with an existing payment method**. For the custom flow that allows users to **add a new payment method** during checkout, see the [dedicated guide](/docs/guides/development/custom-flows/billing/checkout-new-payment-method). - ## Enable billing features + ## Enable Billing Features - To use billing features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and setup your plans. + To use Billing Features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and setup your Plans. ## Checkout flow To create a checkout session with an existing payment method, you must: - 1. Set up the checkout provider with plan details. + 1. Set up the checkout provider with Plan details. 1. Initialize the checkout session when the user is ready. 1. Fetch and display the user's existing payment methods. 1. Confirm the payment with the selected payment method. @@ -33,7 +33,7 @@ This guide will walk you through how to build a custom user interface for a chec 1. Assumes that you have already have a valid `planId`, which you can acquire in many ways: - [Copy from the Clerk Dashboard](https://dashboard.clerk.com/~/billing/plans?tab=user). - Use the [Clerk Backend API](/docs/reference/backend-api/tag/commerce/get/commerce/plans#tag/commerce/get/commerce/plans){{ target: '_blank' }}. - - Use the new [`usePlans()`](/docs/reference/hooks/use-plans) hook to get the plan details. + - Use the new [`usePlans()`](/docs/reference/hooks/use-plans) hook to get the Plan details. This example is written for Next.js App Router but can be adapted for any React-based framework. diff --git a/docs/guides/development/custom-flows/billing/checkout-new-payment-method.mdx b/docs/guides/development/custom-flows/billing/checkout-new-payment-method.mdx index 8a4162ce31..d222582e98 100644 --- a/docs/guides/development/custom-flows/billing/checkout-new-payment-method.mdx +++ b/docs/guides/development/custom-flows/billing/checkout-new-payment-method.mdx @@ -14,15 +14,15 @@ For the custom flow that allows users to checkout **with an existing payment** m For the custom flow that allows users to add a new payment method to their account, **outside of a checkout flow**, see the [dedicated guide](/docs/guides/development/custom-flows/billing/add-new-payment-method). - ## Enable billing features + ## Enable Billing Features - To use billing features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and setup your plans. + To use Billing Features, you first need to ensure they are enabled for your application. Follow the [Billing documentation](/docs/guides/billing/overview) to enable them and setup your Plans. ## Checkout flow To create a checkout session with a new payment card, you must: - 1. Set up the checkout provider with plan details. + 1. Set up the checkout provider with Plan details. 1. Initialize the checkout session when the user is ready. 1. Render the payment form for card collection. 1. Confirm the payment with the collected payment method. @@ -37,7 +37,7 @@ For the custom flow that allows users to add a new payment method to their accou 1. Assumes that you have already have a valid `planId`, which you can acquire in many ways. - [Copy from the Clerk Dashboard](https://dashboard.clerk.com/~/billing/plans?tab=user). - Use the [Clerk Backend API](/docs/reference/backend-api/tag/commerce/get/commerce/plans#tag/commerce/get/commerce/plans){{ target: '_blank' }}. - - Use the new [`usePlans()`](/docs/reference/hooks/use-plans) hook to get the plan details. + - Use the new [`usePlans()`](/docs/reference/hooks/use-plans) hook to get the Plan details. This example is written for Next.js App Router but can be adapted for any React-based framework. diff --git a/docs/guides/development/custom-flows/organizations/accept-organization-invitations.mdx b/docs/guides/development/custom-flows/organizations/accept-organization-invitations.mdx index 5b07d79c4f..e7571284ff 100644 --- a/docs/guides/development/custom-flows/organizations/accept-organization-invitations.mdx +++ b/docs/guides/development/custom-flows/organizations/accept-organization-invitations.mdx @@ -1,17 +1,17 @@ --- -title: Handle accepting organization invitation links -description: Learn how to use the Clerk API to build a custom flows for accepting organization invitations. +title: Handle accepting Organization invitation links +description: Learn how to use the Clerk API to build a custom flows for accepting Organization invitations. --- -When a user visits an [organization invitation](/docs/guides/organizations/invitations) link, Clerk first checks whether a custom redirect URL was provided. +When a user visits an [Organization invitation](/docs/guides/organizations/invitations) link, Clerk first checks whether a custom redirect URL was provided. **If no redirect URL is specified**, the user will be redirected to the appropriate Account Portal page (either [sign-up](/docs/guides/customizing-clerk/account-portal#sign-up) or [sign-in](/docs/guides/customizing-clerk/account-portal#sign-in)), or to the custom sign-up/sign-in pages that you've configured for your application. **If you specified [a redirect URL when creating the invitation](/docs/guides/organizations/invitations#redirect-url)**, you must handle the authentication flows in your code for that page. You can either embed the [``](/docs/reference/components/authentication/sign-in) component on that page, or if the prebuilt component doesn't meet your specific needs or if you require more control over the logic, you can rebuild the existing Clerk flows using the Clerk API. -This guide demonstrates how to use Clerk's API to build a custom flow for accepting organization invitations from a link. +This guide demonstrates how to use Clerk's API to build a custom flow for accepting Organization invitations from a link. ## Build the custom flow @@ -19,7 +19,7 @@ Once the user visits the invitation link and is redirected to the specified URL, For example, if the redirect URL was `https://www.example.com/accept-invitation`, the URL that the user would be redirected to would be `https://www.example.com/accept-invitation?__clerk_ticket=.....`. -The `__clerk_ticket` query parameter contains the ticket token, which is essential for completing the organization invitation flow. You'll use this token in your code for the page that you redirected the user to. +The `__clerk_ticket` query parameter contains the ticket token, which is essential for completing the Organization invitation flow. You'll use this token in your code for the page that you redirected the user to. The `__clerk_status` query parameter is the outcome of the ticket verification and will contain one of three values: diff --git a/docs/guides/development/custom-flows/organizations/create-organizations.mdx b/docs/guides/development/custom-flows/organizations/create-organizations.mdx index c94418f426..ae66c8fc15 100644 --- a/docs/guides/development/custom-flows/organizations/create-organizations.mdx +++ b/docs/guides/development/custom-flows/organizations/create-organizations.mdx @@ -1,15 +1,15 @@ --- -title: Build a custom flow for creating organizations -description: Learn how to use the Clerk API to build a custom flow for creating organizations. +title: Build a custom flow for creating Organizations +description: Learn how to use the Clerk API to build a custom flow for creating Organizations. --- -This guide demonstrates how to use Clerk's API to build a custom flow for creating organizations. +This guide demonstrates how to use Clerk's API to build a custom flow for creating Organizations. - The following example uses the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook to access the `createOrganization()` method. This method is used to create a new organization with the provided name. + The following example uses the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook to access the `createOrganization()` method. This method is used to create a new Organization with the provided name. This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -55,7 +55,7 @@ This guide demonstrates how to use Clerk's API to build a custom flow for creati - The following example uses the [`clerk.createOrganization()`](/docs/reference/javascript/clerk#create-organization) method to create a new organization with the provided name. + The following example uses the [`clerk.createOrganization()`](/docs/reference/javascript/clerk#create-organization) method to create a new Organization with the provided name. Use the tabs to view the code necessary for the `index.html` and `main.js` files. diff --git a/docs/guides/development/custom-flows/organizations/manage-membership-requests.mdx b/docs/guides/development/custom-flows/organizations/manage-membership-requests.mdx index b6ef5af467..21fbe78110 100644 --- a/docs/guides/development/custom-flows/organizations/manage-membership-requests.mdx +++ b/docs/guides/development/custom-flows/organizations/manage-membership-requests.mdx @@ -1,17 +1,17 @@ --- -title: Build a custom flow for managing organization membership requests -description: Learn how to use the Clerk API to build a custom flow for managing organization membership requests. +title: Build a custom flow for managing Organization membership requests +description: Learn how to use the Clerk API to build a custom flow for managing Organization membership requests. --- -This guide will demonstrate how to use the Clerk API to build a custom flow for managing [organization membership requests](/docs/guides/organizations/verified-domains#membership-requests). +This guide will demonstrate how to use the Clerk API to build a custom flow for managing [Organization membership requests](/docs/guides/organizations/verified-domains#membership-requests). The following example: - 1. Uses the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `membershipRequests`, which is a list of the [active organization's](!active-organization) membership requests. + 1. Uses the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `membershipRequests`, which is a list of the [Active Organization's](!active-organization) membership requests. - `membershipRequests` is an object with `data` that contains an array of [`OrganizationMembershipRequest`](/docs/reference/javascript/types/organization-membership-request) objects. - Each `OrganizationMembershipRequest` object has an [`accept()`](/docs/reference/javascript/types/organization-membership-request#accept) and [`reject()`](/docs/reference/javascript/types/organization-membership-request#reject) method to accept or reject the membership request, respectively. 1. Maps over the `data` array to display the membership requests in a table, providing an "Accept" and "Reject" button for each request that calls the `accept()` and `reject()` methods, respectively. @@ -99,7 +99,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for The following example: - 1. Calls the [`getMembershipRequests()`](/docs/reference/javascript/organization#get-membership-requests) method to retrieve the list of membership requests for the active organization. This method returns `data`, which is an array of [`OrganizationMembershipRequest`](/docs/reference/javascript/types/organization-membership-request) objects. + 1. Calls the [`getMembershipRequests()`](/docs/reference/javascript/organization#get-membership-requests) method to retrieve the list of membership requests for the [Active Organization](!active-organization). This method returns `data`, which is an array of [`OrganizationMembershipRequest`](/docs/reference/javascript/types/organization-membership-request) objects. 1. Maps over the `data` array to display the membership requests in a table. 1. Provides an "Accept" and "Reject" button for each request that calls the [`accept()`](/docs/reference/javascript/types/organization-membership-request#accept) and [`reject()`](/docs/reference/javascript/types/organization-membership-request#reject) methods, respectively. @@ -148,7 +148,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for await clerk.load() if (clerk.isSignedIn) { - // Check for an active organization + // Check for an Active Organization if (clerk.organization) { const requestsTable = document.getElementById('requests-table-body') const { data } = await clerk.organization @@ -180,7 +180,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for row.insertCell().appendChild(rejectBtn) }) } else { - // If there is no active organization, + // If there is no Active Organization, // mount Clerk's // to allow the user to set an organization as active document.getElementById('app').innerHTML = ` diff --git a/docs/guides/development/custom-flows/organizations/manage-organization-invitations.mdx b/docs/guides/development/custom-flows/organizations/manage-organization-invitations.mdx index 8c6e8ffeb3..a25d9c11c8 100644 --- a/docs/guides/development/custom-flows/organizations/manage-organization-invitations.mdx +++ b/docs/guides/development/custom-flows/organizations/manage-organization-invitations.mdx @@ -1,36 +1,36 @@ --- -title: Build a custom flow for creating and managing organization invitations -description: Learn how to use the Clerk API to build a custom flow for creating and managing organization invitations. +title: Build a custom flow for creating and managing Organization invitations +description: Learn how to use the Clerk API to build a custom flow for creating and managing Organization invitations. --- -Organization members with appropriate [permissions](/docs/guides/organizations/roles-and-permissions) can invite new users to their organization and manage those invitations. The invitation recipient can be either an existing user of your application or a new user. If they are a new user, they will need to sign up in order to accept the invitation. +Organization members with appropriate [Permissions](/docs/guides/organizations/roles-and-permissions) can invite new users to their Organization and manage those invitations. The invitation recipient can be either an existing user of your application or a new user. If they are a new user, they will need to sign up in order to accept the invitation. -Users with the appropriate permissions can also revoke organization invitations for users that have not yet joined, which will prevent the user from becoming an organization member. +Users with the appropriate Permissions can also revoke Organization invitations for users that have not yet joined, which will prevent the user from becoming an Organization member. -This guide will demonstrate how to use the Clerk API to build a custom flow for inviting users to an organization and managing an organization's pending invitations. +This guide will demonstrate how to use the Clerk API to build a custom flow for inviting users to an Organization and managing an Organization's pending invitations. > [!NOTE] -> This guide is for creating and managing organization invitations client-side. You can also create an organization invitation using the Backend API. See the [organization invitations reference](/docs/guides/organizations/invitations) for more information. +> This guide is for creating and managing Organization invitations client-side. You can also create an Organization invitation using the Backend API. See the [Organization invitations reference](/docs/guides/organizations/invitations) for more information. > -> Also, see the [custom flow for accepting organization invitations](/docs/guides/development/custom-flows/organizations/accept-organization-invitations). +> Also, see the [custom flow for accepting Organization invitations](/docs/guides/development/custom-flows/organizations/accept-organization-invitations). To invite a user: - 1. Use the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `organization`, which is the [active organization's](!active-organization). - 1. Use `organization` to call the [`inviteMember()`](/docs/reference/javascript/organization#invite-member) method, with the recipient's email address and desired role passed as arguments. + 1. Use the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `organization`, which is the [Active Organization's](!active-organization). + 1. Use `organization` to call the [`inviteMember()`](/docs/reference/javascript/organization#invite-member) method, with the recipient's email address and desired Role passed as arguments. To revoke an invitation: - 1. Use the `useOrganization()` hook to get `invitations`, which is a list of invitations for the [active organization's](!active-organization). + 1. Use the `useOrganization()` hook to get `invitations`, which is a list of invitations for the [Active Organization's](!active-organization). 1. `invitations` is an array of [`OrganizationInvitation`](/docs/reference/javascript/types/organization-invitation) objects. Each `OrganizationInvitation` object has a [`revoke()`](/docs/reference/javascript/types/organization-invitation#revoke) method that can be called to revoke the invitation. The following example includes: - - An `` component that allows administrators to invite new members to their organization. + - An `` component that allows administrators to invite new members to their Organization. - An `` component that lists all pending invitations and allows administrators to revoke them. This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -216,16 +216,16 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for - To check if the current user is an organization admin: + To check if the current user is an Organization admin: - 1. Get the [active organization's](!active-organization) ID from the `clerk` object. - 1. Call the [`getOrganizationMemberships()`](/docs/reference/javascript/user#get-organization-memberships) method to get a list of organizations that the user is a member of. This method returns `data`, which is an array of `OrganizationMembership` objects. - 1. In the list of organizations that the user is a member of, find the `OrganizationMembership` object that has an ID that matches the active organization's ID. + 1. Get the [Active Organization's](!active-organization) ID from the `clerk` object. + 1. Call the [`getOrganizationMemberships()`](/docs/reference/javascript/user#get-organization-memberships) method to get a list of Organizations that the user is a member of. This method returns `data`, which is an array of `OrganizationMembership` objects. + 1. In the list of Organizations that the user is a member of, find the `OrganizationMembership` object that has an ID that matches the Active Organization's ID. 1. Check the `role` property of the `OrganizationMembership` object to see if the user is an admin. To invite a user: - 1. Use the active `organization` object to call the [`inviteMember()`](/docs/reference/javascript/organization#invite-member) method, with the recipient's email address and desired role passed as arguments. + 1. Use the active `organization` object to call the [`inviteMember()`](/docs/reference/javascript/organization#invite-member) method, with the recipient's email address and desired Role passed as arguments. To revoke an invitation: @@ -235,7 +235,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for The following example includes: - A `renderInvitations()` function that lists all invitations and allows administrators to revoke them. - - An `checkAdminAndRenderInvitations()` function that gets the current organization, checks if the current user is an admin, renders invitations, and sets up a form that allows administrators to invite new members to their organization. + - An `checkAdminAndRenderInvitations()` function that gets the current Organization, checks if the current user is an admin, renders invitations, and sets up a form that allows administrators to invite new members to their Organization. Use the tabs to view the code necessary for the `index.html` and `main.js` files. @@ -282,7 +282,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for await clerk.load() if (clerk.isSignedIn) { - // Check for an active organization + // Check for an Active Organization if (clerk.organization) { // Render list of organization invitations async function renderInvitations(organization, isAdmin) { @@ -361,7 +361,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for checkAdminAndRenderInvitations() } else { - // If there is no active organization, + // If there is no Active Organization, // mount Clerk's // to allow the user to set an organization as active document.getElementById('app').innerHTML = ` @@ -390,4 +390,4 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for ## Next steps -Now that you've created a flow for managing organization invitations, you might want to create a flow for accepting invitations. See the [dedicated custom flow guide](/docs/guides/development/custom-flows/organizations/accept-organization-invitations) for more information. +Now that you've created a flow for managing Organization invitations, you might want to create a flow for accepting invitations. See the [dedicated custom flow guide](/docs/guides/development/custom-flows/organizations/accept-organization-invitations) for more information. diff --git a/docs/guides/development/custom-flows/organizations/manage-roles.mdx b/docs/guides/development/custom-flows/organizations/manage-roles.mdx index c0ec7885e2..1e9880ccd6 100644 --- a/docs/guides/development/custom-flows/organizations/manage-roles.mdx +++ b/docs/guides/development/custom-flows/organizations/manage-roles.mdx @@ -1,21 +1,21 @@ --- -title: Build a custom flow for managing member roles in an organization -description: Learn how to use the Clerk API build a custom flow for managing member roles in an organization. +title: Build a custom flow for managing member Roles in an Organization +description: Learn how to use the Clerk API build a custom flow for managing member Roles in an Organization. --- -Organization members with appropriate [permissions](/docs/guides/organizations/roles-and-permissions#permissions) can manage a member's [role](/docs/guides/organizations/roles-and-permissions#roles) and remove members within an organization. +Organization members with appropriate [Permissions](/docs/guides/organizations/roles-and-permissions#permissions) can manage a member's [Roles](/docs/guides/organizations/roles-and-permissions#roles) and remove members within an Organization. -This guide will demonstrate how to use the Clerk API to build a custom flow for managing member roles in an organization. +This guide will demonstrate how to use the Clerk API to build a custom flow for managing member Roles in an Organization. The following example: - 1. Uses the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `memberships`, which is a list of the [active organization's](!active-organization) memberships. + 1. Uses the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to get `memberships`, which is a list of the [Active Organization's](!active-organization) memberships. - `memberships` is an object with `data` that contains an array of [`OrganizationMembership`](/docs/reference/javascript/types/organization-membership) objects. - - Each `OrganizationMembership` object has an [`update()`](/docs/reference/javascript/types/organization-membership#update) and [`destroy()`](/docs/reference/javascript/types/organization-membership#destroy) method to update the member's role and remove the member from the organization, respectively. + - Each `OrganizationMembership` object has an [`update()`](/docs/reference/javascript/types/organization-membership#update) and [`destroy()`](/docs/reference/javascript/types/organization-membership#destroy) method to update the member's Role and remove the member from the Organization, respectively. 1. Maps over the `data` array to display the memberships in a table, providing an "Update Role" and "Remove Member" button for each membership that calls the `update()` and `destroy()` methods, respectively. This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -35,7 +35,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for } // List of organization memberships. Administrators can - // change member roles or remove members from the organization. + // change member Roles or remove members from the Organization. export const ManageRoles = () => { const { user } = useUser() const { isLoaded, memberships } = useOrganization(OrgMembersParams) @@ -156,7 +156,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for - The following example includes a `checkAdminAndRenderMemberships()` function that checks if the user is an admin of the currently active organization and calls `renderMemberships()`. The `renderMemberships()` function lists the organization's memberships and allows administrators to update a member's role and remove a member from the organization. + The following example includes a `checkAdminAndRenderMemberships()` function that checks if the user is an admin of the currently active Organization and calls `renderMemberships()`. The `renderMemberships()` function lists the Organization's memberships and allows administrators to update a member's Role and remove a member from the Organization. Use the tabs to view the code necessary for the `index.html` and `main.js` files. @@ -205,7 +205,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for await clerk.load() if (clerk.isSignedIn) { - // Check for an active organization + // Check for an Active Organization if (clerk.organization) { // Render list of organization memberships async function renderMemberships(organization, isAdmin) { @@ -223,7 +223,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for row.insertCell().textContent = membership.role // Add administrative actions: - // Add and remove a member, and update a member's role. + // Add and remove a member, and update a member's Role. if (isAdmin) { // Show update and remove member buttons document.getElementById('update-role-head').removeAttribute('hidden') @@ -232,7 +232,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for // Get the user ID of the member const userId = membership.publicUserData.userId - // Update a member's role + // Update a member's Role const updateBtn = document.createElement('button') updateBtn.textContent = 'Change role' updateBtn.addEventListener('click', async function (e) { @@ -268,8 +268,8 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for /** * Checks if a user is an admin of the - * currently active organization and - * renders the organization's memberships. + * currently Active Organization and + * renders the Organization's memberships. */ async function checkAdminAndRenderMemberships() { const organizationId = clerk.organization.id @@ -294,11 +294,11 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for checkAdminAndRenderMemberships() } else { - // If there is no active organization, + // If there is no Active Organization, // mount Clerk's - // to allow the user to set an organization as active + // to allow the user to set an Organization as active document.getElementById('app').innerHTML = ` -

Select an organization to set it as active

+

Select an Organization to set it as active

` diff --git a/docs/guides/development/custom-flows/organizations/manage-user-org-invitations.mdx b/docs/guides/development/custom-flows/organizations/manage-user-org-invitations.mdx index a20547d9a7..af88b52faa 100644 --- a/docs/guides/development/custom-flows/organizations/manage-user-org-invitations.mdx +++ b/docs/guides/development/custom-flows/organizations/manage-user-org-invitations.mdx @@ -1,19 +1,19 @@ --- -title: Build a custom flow for managing a user's organization invitations -description: Learn how to use the Clerk API to build a custom flow for managing a user's organization invitations. +title: Build a custom flow for managing a user's Organization invitations +description: Learn how to use the Clerk API to build a custom flow for managing a user's Organization invitations. --- -This guide will demonstrate how to use the Clerk API to build a custom flow for managing a user's [organization invitations](/docs/guides/organizations/overview#organization-invitations). +This guide will demonstrate how to use the Clerk API to build a custom flow for managing a user's [Organization invitations](/docs/guides/organizations/overview#organization-invitations). The following example: - 1. Uses the [`useOrganizationList()`](/docs/reference/hooks/use-organization) hook to get `userInvitations`, which is a list of the user's organization invitations. + 1. Uses the [`useOrganizationList()`](/docs/reference/hooks/use-organization) hook to get `userInvitations`, which is a list of the user's Organization invitations. - `userInvitations` is an object with `data` that contains an array of [`UserOrganizationInvitation`](/docs/reference/javascript/types/user-organization-invitation) objects. - - Each `UserOrganizationInvitation` object has an [`accept()`](/docs/reference/javascript/types/organization-membership-request#accept) method that accepts the invitation to the organization. + - Each `UserOrganizationInvitation` object has an [`accept()`](/docs/reference/javascript/types/organization-membership-request#accept) method that accepts the invitation to the Organization. 1. Maps over the `data` array to display the invitations in a table, providing an "Accept" button for each invitation that calls the `accept()` method. This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -75,7 +75,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for The following example: - 1. Calls the [`getOrganizationInvitations()`](/docs/reference/javascript/user#get-organization-invitations) method to retrieve the list of organization invitations for the active user. This method returns `data`, which is an array of [`UserOrganizationInvitation`](/docs/reference/javascript/types/user-organization-invitation) objects. + 1. Calls the [`getOrganizationInvitations()`](/docs/reference/javascript/user#get-organization-invitations) method to retrieve the list of Organization invitations for the active user. This method returns `data`, which is an array of [`UserOrganizationInvitation`](/docs/reference/javascript/types/user-organization-invitation) objects. 1. Maps over the `data` array to display the invitations in a table. 1. Provides an "Accept" button for each invitation that calls the [`accept()`](/docs/reference/javascript/types/user-organization-invitation#accept) method. diff --git a/docs/guides/development/custom-flows/organizations/organization-switcher.mdx b/docs/guides/development/custom-flows/organizations/organization-switcher.mdx index 6b9380ca75..ea8eeba8ed 100644 --- a/docs/guides/development/custom-flows/organizations/organization-switcher.mdx +++ b/docs/guides/development/custom-flows/organizations/organization-switcher.mdx @@ -1,11 +1,11 @@ --- -title: Build a custom flow for switching organizations -description: Learn how to use the Clerk API to build a custom flow for switching between organizations. +title: Build a custom flow for switching Organizations +description: Learn how to use the Clerk API to build a custom flow for switching between Organizations. --- -This guide will demonstrate how to use the Clerk API to build a custom flow for switching between organizations. +This guide will demonstrate how to use the Clerk API to build a custom flow for switching between Organizations. @@ -13,13 +13,13 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for The following examples: - 1. Use the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook to get `memberships`, which is a list of the current user's organization memberships. `memberships` returns `data`, which is an array of [`OrganizationMembership`](/docs/reference/javascript/types/organization-membership) objects. - 1. Map over the `data` array to display the user's organization memberships in a table, providing a button that calls `setActive()` to set the selected organization as the [active organization](!active-organization). - - If there are no organizations, the [`` component (custom-flow version, not the Clerk component)](/docs/guides/development/custom-flows/organizations/create-organizations) is rendered to allow the user to create an organization. + 1. Use the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook to get `memberships`, which is a list of the current user's Organization memberships. `memberships` returns `data`, which is an array of [`OrganizationMembership`](/docs/reference/javascript/types/organization-membership) objects. + 1. Map over the `data` array to display the user's Organization memberships in a table, providing a button that calls `setActive()` to set the selected Organization as the [Active Organization](!active-organization). + - If there are no Organizations, the [`` component (custom-flow version, not the Clerk component)](/docs/guides/development/custom-flows/organizations/create-organizations) is rendered to allow the user to create an Organization. The difference between the two examples is the parameters passed to the `useOrganizationList()` hook in order to determine how the list is paginated. - - The "Paginated list" example provides a button to load more organizations if there are more available. The `data` array is paginated and will only return the first 5 results, so the `fetchNext()` method is used to load more organizations if they are available. + - The "Paginated list" example provides a button to load more Organizations if there are more available. The `data` array is paginated and will only return the first 5 results, so the `fetchNext()` method is used to load more Organizations if they are available. - The "Infinite list" example sets the `infinite` option to `true` to enable infinite results. This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -181,8 +181,8 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for The following example: - 1. Calls the [`getOrganizationMemberships()`](/docs/reference/javascript/user#get-organization-memberships) method to retrieve the list of organizations the current user is a part of. This method returns `data`, which is an array of [`OrganizationMembership`](/docs/reference/javascript/types/organization-membership) objects. - 1. Maps over the `data` array to display the user's organization memberships in a list, providing a button that calls [`setActive()`](/docs/reference/javascript/clerk#set-active) to set the selected organization as the active organization. + 1. Calls the [`getOrganizationMemberships()`](/docs/reference/javascript/user#get-organization-memberships) method to retrieve the list of Organizations the current user is a part of. This method returns `data`, which is an array of [`OrganizationMembership`](/docs/reference/javascript/types/organization-membership) objects. + 1. Maps over the `data` array to display the user's Organization memberships in a list, providing a button that calls [`setActive()`](/docs/reference/javascript/clerk#set-active) to set the selected Organization as the [Active Organization](!active-organization). Use the tabs to view the code necessary for the `index.html` and `main.js` files. @@ -239,7 +239,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for await clerk.load() if (clerk.isSignedIn) { - // Check for an active organization + // Check for an Active Organization if (clerk.organization) { const { data } = await clerk.user.getOrganizationMemberships() const memberships = data @@ -252,7 +252,7 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for row.insertCell().textContent = membership.createdAt.toLocaleDateString() row.insertCell().textContent = membership.role - // Set as active organization + // Set as Active Organization const addBtn = document.createElement('button') addBtn.textContent = 'Set as active' addBtn.addEventListener('click', async function (e) { @@ -272,8 +272,8 @@ This guide will demonstrate how to use the Clerk API to build a custom flow for row.insertCell().appendChild(addBtn) }) } else { - // If there is no active organization, - // render a form to create an organization + // If there is no Active Organization, + // render a form to create an Organization document.getElementById('create-organization-container').removeAttribute('hidden') const form = document.getElementById('create-organization') diff --git a/docs/guides/development/custom-flows/organizations/update-organizations.mdx b/docs/guides/development/custom-flows/organizations/update-organizations.mdx index 519e9d0048..e9438a956f 100644 --- a/docs/guides/development/custom-flows/organizations/update-organizations.mdx +++ b/docs/guides/development/custom-flows/organizations/update-organizations.mdx @@ -1,20 +1,20 @@ --- -title: Build a custom flow for updating an organization -description: Learn how to use the Clerk API to build a custom flow for updating an organization in your application. +title: Build a custom flow for updating an Organization +description: Learn how to use the Clerk API to build a custom flow for updating an Organization in your application. --- -Organization members with appropriate [permissions](/docs/guides/organizations/roles-and-permissions) can update an organization. +Organization members with appropriate [Permissions](/docs/guides/organizations/roles-and-permissions) can update an Organization. -This guide will demonstrate how to use Clerk's API to build a custom flow for updating an organization. +This guide will demonstrate how to use Clerk's API to build a custom flow for updating an Organization. The following example: 1. Uses the [`useOrganization()`](/docs/reference/hooks/use-organization) hook to fetch the active `organization`. - 1. Uses `organization` to call the `update()` method with the desired name to update the organization. To see what other attributes can be updated, see the [`update()` reference doc](/docs/reference/javascript/organization#update). + 1. Uses `organization` to call the `update()` method with the desired name to update the Organization. To see what other attributes can be updated, see the [`update()` reference doc](/docs/reference/javascript/organization#update). This example is written for Next.js App Router but can be adapted for any React-based framework. @@ -68,7 +68,7 @@ This guide will demonstrate how to use Clerk's API to build a custom flow for up - The following example uses the `organization.update()` method to update the [active organization's](!active-organization) name. To see what other attributes can be updated, see the [`update()` reference doc](/docs/reference/javascript/organization#update). + The following example uses the `organization.update()` method to update the [Active Organization's](!active-organization) name. To see what other attributes can be updated, see the [`update()` reference doc](/docs/reference/javascript/organization#update). Use the tabs to view the code necessary for the `index.html` and `main.js` files. @@ -109,7 +109,7 @@ This guide will demonstrate how to use Clerk's API to build a custom flow for up await clerk.load() if (clerk.isSignedIn) { - // Check for an active organization + // Check for an Active Organization if (clerk.organization) { const form = document.getElementById('update-organization') @@ -129,7 +129,7 @@ This guide will demonstrate how to use Clerk's API to build a custom flow for up .catch((error) => console.log('An error occurred:', error)) }) } else { - // If there is no active organization, + // If there is no Active Organization, // mount Clerk's // to allow the user to set an organization as active document.getElementById('app').innerHTML = ` diff --git a/docs/guides/development/custom-flows/overview.mdx b/docs/guides/development/custom-flows/overview.mdx index 274d3f5ef9..aa689e8103 100644 --- a/docs/guides/development/custom-flows/overview.mdx +++ b/docs/guides/development/custom-flows/overview.mdx @@ -90,7 +90,7 @@ The following steps outline the sign-in process: ### Session tasks -Session tasks require users to complete specific actions after authentication, such as selecting an organization. These tasks ensure that users meet all requirements before gaining full access to your application. +Session tasks require users to complete specific actions after authentication, such as selecting an Organization. These tasks ensure that users meet all requirements before gaining full access to your application. For detailed information about configuring and implementing session tasks, see the [dedicated guide](/docs/guides/configure/session-tasks). @@ -102,7 +102,7 @@ After completing the sign-up or sign-in process, you should check if the user ha 1. **Handle the task**: If a task exists, build UI to guide the user through completing the required action based on the task type. See the [available task types](/docs/guides/configure/session-tasks#available-tasks) to understand what actions may be required. 1. **Complete the flow**: Once all required tasks are completed, the session becomes fully `active` and the user can access protected content. -You can build your own UI to handle specific task types. For example, if the task is `choose-organization`, you can create a [custom organization creation component](/docs/guides/development/custom-flows/organizations/create-organizations) to allow users to create or select an organization before proceeding. +You can build your own UI to handle specific task types. For example, if the task is `choose-organization`, you can create a [custom Organization creation component](/docs/guides/development/custom-flows/organizations/create-organizations) to allow users to create or select an Organization before proceeding. ## Protect pages against pending task diff --git a/docs/guides/development/integrations/platforms/vercel-marketplace.mdx b/docs/guides/development/integrations/platforms/vercel-marketplace.mdx index 5be4f57cbc..c2f884c05f 100644 --- a/docs/guides/development/integrations/platforms/vercel-marketplace.mdx +++ b/docs/guides/development/integrations/platforms/vercel-marketplace.mdx @@ -23,7 +23,7 @@ The Vercel Marketplace allows Vercel users to install and configure third-party 1. Provide a name for your Clerk application. 1. Click **Create**. -Vercel will automatically provision a Clerk account, organization, and application for you. Vercel calls the provisioned application a **Resource**. +Vercel will automatically provision a Clerk account, Organization, and application for you. Vercel calls the provisioned application a **Resource**. Each Vercel team has an associated Clerk Organization. When you open the Clerk Dashboard from the Vercel Marketplace, Clerk will automatically provision a new account for you, or link to an existing Clerk account if an account is found with the same email address. An equivalent role in Clerk is assigned to the user based on their Vercel team role. Roles and Vercel team membership are automatically synced to Clerk. diff --git a/docs/guides/development/override-clerk-types-interfaces.mdx b/docs/guides/development/override-clerk-types-interfaces.mdx index 19e208b88d..0cedbf42f7 100644 --- a/docs/guides/development/override-clerk-types-interfaces.mdx +++ b/docs/guides/development/override-clerk-types-interfaces.mdx @@ -38,12 +38,12 @@ declare global { } ``` -## Example: custom roles and permissions +## Example: custom Roles and Permissions -When defining custom types for roles and permissions: +When defining custom types for Roles and Permissions: -- Custom permissions are merged with [system permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) -- Custom roles completely replace default roles (`org:admin` and `org:member`) +- Custom Permissions are merged with [System Permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) +- Custom Roles completely replace default Roles (`org:admin` and `org:member`) ```tsx {{ filename: 'types/globals.d.ts' }} export {} diff --git a/docs/guides/development/sdk-development/backend-only.mdx b/docs/guides/development/sdk-development/backend-only.mdx index 7ebe95f963..619689da03 100644 --- a/docs/guides/development/sdk-development/backend-only.mdx +++ b/docs/guides/development/sdk-development/backend-only.mdx @@ -12,7 +12,7 @@ The source of truth for all BAPI endpoints is the [BAPI reference docs](/docs/re - User only needs to provide their [Secret Key](/docs/guides/development/sdk-development/terminology) - Centralized request authentication (e.g. in a middleware or plugin) - Give access to the instance of BAPI client (so that users can use all methods) -- User should be able to limit access to routes by checking for [roles and permissions](/docs/guides/organizations/roles-and-permissions) +- User should be able to limit access to routes by checking for [Roles and Permissions](/docs/guides/organizations/roles-and-permissions) > [!IMPORTANT] > BAPI has [rate limits](/docs/guides/how-clerk-works/system-limits) to help protect users against brute-force attacks or stop abuse of Clerk's platform. Be sure to include a backoff mechanism into your fetching logic and respect the `Retry-After` header to gracefully handle any active rate limits. diff --git a/docs/guides/development/sdk-development/fullstack.mdx b/docs/guides/development/sdk-development/fullstack.mdx index 0ef762d88b..658f4ea202 100644 --- a/docs/guides/development/sdk-development/fullstack.mdx +++ b/docs/guides/development/sdk-development/fullstack.mdx @@ -14,7 +14,7 @@ A fullstack SDK combines the [frontend-only SDK](/docs/guides/development/sdk-de - User should be able to use [ClerkJS options](/docs/reference/javascript/clerk#clerk-options){{ target: '_blank' }} - Centralized request authentication (e.g. in a middleware or plugin) - Give access to the instance of [BAPI](/docs/guides/development/sdk-development/terminology) client (so that users can use all methods) -- User should be able to limit access to routes by checking for [roles and permissions](/docs/guides/organizations/roles-and-permissions) +- User should be able to limit access to routes by checking for [Roles and Permissions](/docs/guides/organizations/roles-and-permissions) ## Optional features diff --git a/docs/guides/development/sdk-development/terminology.mdx b/docs/guides/development/sdk-development/terminology.mdx index 3f16d66588..8b5914c295 100644 --- a/docs/guides/development/sdk-development/terminology.mdx +++ b/docs/guides/development/sdk-development/terminology.mdx @@ -10,7 +10,7 @@ A consistent terminology should be used across all user interactions with Clerk' | Client | A [client](/docs/reference/javascript/client){{ target: '_blank' }} represents the current device or software accessing an application such as your web browser, native application, Chrome Extension, or Electron app. | | Session | A [session](/docs/reference/javascript/session){{ target: '_blank' }} is a secure representation of the authentication state of the current user. Each client can hold multiple sessions on the same device. This is identical to how Gmail works in a browser. | | User | A user represents the current user of the session. The [`User`](/docs/reference/javascript/user){{ target: '_blank' }} object holds all the basic user information e.g. name, email addresses, phone numbers, etc… including their public, private, and unsafe metadata. | -| Organization | An [organization](/docs/reference/javascript/organization){{ target: '_blank' }} represents the current organization of the session. Users can belong to many organizations. One of them will be the [active organization](!active-organization) of the session. | +| Organization | An [Organization](/docs/reference/javascript/organization){{ target: '_blank' }} represents the current Organization of the session. Users can belong to many Organizations. One of them will be the [Active Organization](!active-organization) of the session. | | FAPI | [Frontend API of Clerk](https://clerk.com/docs/reference/frontend-api). Example: `https://random-name.clerk.accounts.dev` (Production example: `https://clerk.your-domain.com`). FAPI is the primary API for Clerk’s UI components. Every Clerk development/production instance has a dedicated FAPI. This is the authentication, session, user & organization management API you or your users will interact with. | | BAPI | [Backend API of Clerk](/docs/reference/backend-api){{ target: '_blank' }}. Currently set to `https://api.clerk.com`. A restful CRUD API for the server-side. | | Secret Key | Your app’s Secret Key for use in the backend. Do not expose this on the frontend with a public environment variable. Allows for CRUD operations. | diff --git a/docs/guides/development/trpc.mdx b/docs/guides/development/trpc.mdx index 53feb3eba8..589a289ead 100644 --- a/docs/guides/development/trpc.mdx +++ b/docs/guides/development/trpc.mdx @@ -21,7 +21,7 @@ sdk: nextjs ]} /> -Clerk's [`Auth`](/docs/reference/backend/types/auth-object) object includes important authentication information like the current user's session ID, user ID, and organization ID. It also contains methods to check for the current user's permissions and to retrieve their session token. You can use the `Auth` object to access the user's authentication information in your tRPC queries. +Clerk's [`Auth`](/docs/reference/backend/types/auth-object) object includes important authentication information like the current user's session ID, user ID, and Organization ID. It also contains methods to check for the current user's Permissions and to retrieve their session token. You can use the `Auth` object to access the user's authentication information in your tRPC queries. This guide demonstrates how to create a Clerk authentication context and use it in a tRPC query. It assumes that you have already integrated Clerk into your app by following the [quickstart](/docs/nextjs/getting-started/quickstart). diff --git a/docs/guides/development/upgrading/upgrade-guides/2025-11-10.mdx b/docs/guides/development/upgrading/upgrade-guides/2025-11-10.mdx index 72f6be1dd5..d9b6f25a62 100644 --- a/docs/guides/development/upgrading/upgrade-guides/2025-11-10.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/2025-11-10.mdx @@ -38,28 +38,28 @@ The following sections provide a detailed overview of the response type and endp - `user_id` - `string | null` - The `user_id` field will now be explicity `null` for organization payers, instead of omitted. + The `user_id` field will now be explicity `null` for Organization payers, instead of omitted. --- - `first_name` - `string | null` - The `first_name` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `first_name` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- - `last_name` - `string | null` - The `last_name` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `last_name` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- - `email` - `string | null` - The `email` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `email` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- @@ -470,28 +470,28 @@ The following endpoints have changed their URLs: - `user_id` - `string | null` - The `user_id` field will now be explicity `null` for organization payers, instead of omitted. + The `user_id` field will now be explicity `null` for Organization payers, instead of omitted. --- - `first_name` - `string | null` - The `first_name` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `first_name` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- - `last_name` - `string | null` - The `last_name` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `last_name` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- - `email` - `string | null` - The `email` field will now be explicitly `null` for organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. + The `email` field will now be explicitly `null` for Organization payers, instead of `""`. It can also be omitted from certain endpoints that do not provide that data. --- diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/backend.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/backend.mdx index 5001e255bb..effce20ccd 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/backend.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/backend.mdx @@ -694,7 +694,7 @@ As part of this major version, a number of previously deprecated props, argument const { orgRole } = useAuth() ``` - To support the existing roles `admin`, `basic_member`, and `guest_member` apply interface merging using the following snippet: + To support the existing Roles `admin`, `basic_member`, and `guest_member` apply interface merging using the following snippet: ```ts interface ClerkAuthorization { diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/chrome-extension.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/chrome-extension.mdx index 74ef824ba4..50674e783c 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/chrome-extension.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/chrome-extension.mdx @@ -470,7 +470,7 @@ As part of this major version, a number of previously deprecated props, argument - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -483,7 +483,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/expo.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/expo.mdx index a436a38a07..d9da6a96c0 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/expo.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/expo.mdx @@ -462,7 +462,7 @@ As part of this major version, a number of previously deprecated props, argument - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -475,7 +475,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/javascript.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/javascript.mdx index 5dbd7e43f8..f0904e4b0f 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/javascript.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/javascript.mdx @@ -535,7 +535,7 @@ As part of this major version, a number of previously deprecated props, argument titles={["setSession -> setActive", "Organization.create('x') -> Organization.create({ name: 'x' })", "Organization.getPendingInvitations() -> Organization.getInvitations({ status: 'pending' })", "MagicLinkError -> EmailLinkError", "isMagicLinkError -> isEmailLinkError", "MagicLinkErrorCode -> EmailLinkErrorCode", "useMagicLink -> useEmailLink", "handleMagicLinkVerification -> handleEmailLinkVerification", "[User|OrganizationMembershipPublicData].profileImageUrl -> [User|OrganizationMembershipPublicData].imageUrl", "Clerk.getOrganizationMemberships() -> user.getOrganizationMemberships()", "lastOrganizationInvitation and lastOrganizationMember dropped from event emitter", "Clerk.redirectToHome() removed", "Clerk.isReady() removed", "Replace signOutCallback prop on SignOutButton with redirectUrl", "Clerk import changed"]} > - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -548,7 +548,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/nextjs.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/nextjs.mdx index a8749e2cd0..6e938d0042 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/nextjs.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/nextjs.mdx @@ -79,7 +79,7 @@ const isDashboardRoute = createRouteMatcher(['/dashboard(.*)']) const isAdminRoute = createRouteMatcher(['/admin(.*)']) export default clerkMiddleware(async (auth, req) => { - // Restrict admin route to users with specific role + // Restrict admin route to users with specific Role if (isAdminRoute(req)) await auth.protect({ role: 'org:admin' }) // Restrict dashboard routes to signed in users @@ -1003,7 +1003,7 @@ As part of this major version, a number of previously deprecated props, argument - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -1016,7 +1016,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/react.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/react.mdx index faded75d62..0c753376fa 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/react.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/react.mdx @@ -741,7 +741,7 @@ As part of this major version, a number of previously deprecated props, argument - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -754,7 +754,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/upgrading/upgrade-guides/core-2/remix.mdx b/docs/guides/development/upgrading/upgrade-guides/core-2/remix.mdx index b6abe22513..f63445c95b 100644 --- a/docs/guides/development/upgrading/upgrade-guides/core-2/remix.mdx +++ b/docs/guides/development/upgrading/upgrade-guides/core-2/remix.mdx @@ -298,7 +298,7 @@ As part of this major version, a number of previously deprecated props, argument titles={["setSession -> setActive", "Organization.create('x') -> Organization.create({ name: 'x' })", "Organization.getPendingInvitations() -> Organization.getInvitations({ status: 'pending' })", "isMagicLinkError -> isEmailLinkError", "MagicLinkErrorCode -> EmailLinkErrorCode", "useMagicLink -> useEmailLink", "Replace signOutCallback prop on SignOutButton with redirectUrl"]} > - `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [active organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: + `setSession` should be replaced with `setActive`. The format of the parameters has changed slightly - `setActive` takes an object where `setSession` took params directly. The `setActive` function also can accept an `organization` param that is used to set the currently [Active Organization](!active-organization). The return signature did not change. Read the [API documentation](/docs/reference/javascript/clerk#set-active) for more detail. This function should be expected to be returned from one of the following Clerk hooks: `useSessionList`, `useSignUp`, or `useSignIn`. Some migration examples: ```js {{ prettier: false, del: [1, 4, 7], ins: [2, 5, 8] }} await setSession('sessionID', () => void) @@ -311,7 +311,7 @@ As part of this major version, a number of previously deprecated props, argument await setActive({ session: sessionObj, beforeEmit: () => void }) ``` - `setActive` also supports setting an [active organization](!active-organization): + `setActive` also supports setting an [Active Organization](!active-organization): ```js {{ prettier: false }} await setActive({ diff --git a/docs/guides/development/webhooks/billing.mdx b/docs/guides/development/webhooks/billing.mdx index 14c72f585d..85c5e7268e 100644 --- a/docs/guides/development/webhooks/billing.mdx +++ b/docs/guides/development/webhooks/billing.mdx @@ -14,26 +14,26 @@ A subscription is a top-level container unique to each user or organization. Sub | Event Name | Description | | - | - | -| `subscription.created` | The top-level subscription is created. This usually happens when a user or organization is created. For existing users and organizations, a subscription will be created when billing is enabled for the application. | +| `subscription.created` | The top-level subscription is created. This usually happens when a user or organization is created. For existing users and organizations, a subscription will be created when Billing is enabled for the application. | | `subscription.updated` | The top-level subscription is updated. This event is triggered when any property of the subscription has changed, except for status changes. For example, when the subscription items for the payer change. | -| `subscription.active` | The top-level subscription transitions to active from a non-active status. This happens when any subscription item is set to active, including items from the free default plan. | +| `subscription.active` | The top-level subscription transitions to active from a non-active status. This happens when any subscription item is set to active, including items from the free default Plan. | | `subscription.pastDue` | The top-level subscription contains a subscription item that has become past due. | ## Subscription items -A subscription item provides details about the relationship between the payer (user or organization) and a plan. A top-level subscription may contain multiple subscription items. +A subscription item provides details about the relationship between the payer (user or Organization) and a Plan. A top-level subscription may contain multiple subscription items. -There can only be one `active` subscription item per payer and plan. In addition, the subscription item for the default plan will always have the same `id` to allow easier tracking of which users and organizations are not paid customers. +There can only be one `active` subscription item per payer and Plan. In addition, the subscription item for the default Plan will always have the same `id` to allow easier tracking of which users and Organizations are not paid customers. | Event Name | Description | | - | - | | `subscriptionItem.updated` | The subscription item is updated. This event is triggered when a property of the subscription item has changed that does not result in a status change. For example, when a subscription item is renewed and the recurring monthly charge succeeds, the status doesn't change (remains `active`), but `period_start` and `period_end` are updated. This results in a `subscriptionItem.updated` event. | -| `subscriptionItem.active` | The subscription item is set to active. For paid plans, this happens on successful payment. | -| `subscriptionItem.canceled` | The subscription item is canceled. The payer retains plan features until the end of the current billing period. | -| `subscriptionItem.upcoming` | The subscription item is set as upcoming after the current billing period. This can happen in the case of a deferred plan change from a higher-priced to lower-priced plan. In the case a paid plan is canceled, the subscription item for the default, free plan will be set as `upcoming`. | +| `subscriptionItem.active` | The subscription item is set to active. For paid Plans, this happens on successful payment. | +| `subscriptionItem.canceled` | The subscription item is canceled. The payer retains Plan features until the end of the current billing period. | +| `subscriptionItem.upcoming` | The subscription item is set as upcoming after the current billing period. This can happen in the case of a deferred Plan change from a higher-priced to lower-priced Plan. In the case a paid Plan is canceled, the subscription item for the default, free Plan will be set as `upcoming`. | | `subscriptionItem.ended` | The subscription item has ended. | -| `subscriptionItem.abandoned` | The subscription item is abandoned. This can happen to `upcoming` subscription items if the payer subscribes to another plan, or re-subscribes to a currently canceled plan. | -| `subscriptionItem.incomplete` | The subscription item is incomplete. This means the payer has started a checkout for a plan, but the payment hasn't been successfully processed yet. Once payment succeeds, the subscription item transitions to an `active` status. | +| `subscriptionItem.abandoned` | The subscription item is abandoned. This can happen to `upcoming` subscription items if the payer subscribes to another Plan, or re-subscribes to a currently canceled Plan. | +| `subscriptionItem.incomplete` | The subscription item is incomplete. This means the payer has started a checkout for a Plan, but the payment hasn't been successfully processed yet. Once payment succeeds, the subscription item transitions to an `active` status. | | `subscriptionItem.pastDue` | The subscription item is past due because a recurring charge has failed. | | `subscriptionItem.freeTrialEnding` | The subscription item is a free trial and is ending soon. This event is sent three days before the trial ends. If the trial is shorter than three days, it's sent immediately. | diff --git a/docs/guides/development/webhooks/overview.mdx b/docs/guides/development/webhooks/overview.mdx index 25b0f62686..06f3bd5c93 100644 --- a/docs/guides/development/webhooks/overview.mdx +++ b/docs/guides/development/webhooks/overview.mdx @@ -24,7 +24,7 @@ To find a list of all the events Clerk supports: 1. In the Clerk Dashboard, navigate to the [**Webhooks**](https://dashboard.clerk.com/~/webhooks) page. 1. Select the **Event Catalog** tab. -There is also a [dedicated guide](/docs/guides/development/webhooks/billing) that describes the events Clerk supports for **billing**. +There is also a [dedicated guide](/docs/guides/development/webhooks/billing) that describes the events Clerk supports for Billing. ## Payload structure diff --git a/docs/guides/how-clerk-works/multi-tenant-architecture.mdx b/docs/guides/how-clerk-works/multi-tenant-architecture.mdx index e3df3403d5..80d77f1194 100644 --- a/docs/guides/how-clerk-works/multi-tenant-architecture.mdx +++ b/docs/guides/how-clerk-works/multi-tenant-architecture.mdx @@ -3,7 +3,7 @@ title: Multi-tenant architecture description: This guide outlines a number of the common architecture scenarios for building B2B, B2C, and Platform applications with Clerk, their characteristics, and limitations. --- -There are several ways to model how users and organizations fit into your application. The 3 scenarios that will be covered in this guide are: +There are several ways to model how users and Organizations fit into your application. The 3 scenarios that will be covered in this guide are: 1. B2C: Business to Consumer 1. B2B: Business to Business @@ -24,19 +24,19 @@ In a B2C scenario, applications generally share the following characteristics: - The application is accessible under a single domain (for example: `example.com` or `app.example.com`) > [!NOTE] -> In the B2C scenario, organizations are generally not necessary since users that sign up to your application typically do not exist as part of a team, organization, or workspace. +> In the B2C scenario, Organizations are generally not necessary since users that sign up to your application typically do not exist as part of a team, organization, or workspace. ## B2B: Business to Business B2B companies sell to other businesses. Some examples include: GitHub, Vercel, Salesforce, Sentry, and Clerk. -In the B2B model, multi-tenant SaaS applications generally leverage organizations (sometimes called teams or workspaces) to manage users and their memberships. This approach allows for control over what resources users have access to across different organizations based on their roles. +In the B2B model, multi-tenant SaaS applications generally leverage organizations (sometimes called teams or workspaces) to manage users and their memberships. This approach allows for control over what resources users have access to across different organizations based on their Roles. -Oftentimes such applications will also allow users to create personal accounts that are separate from other organizations. For example, GitHub allows users to create repositories under their own personal account or an organization they are part of. +Oftentimes such applications will also allow users to create Personal Accounts that are separate from other organizations. For example, GitHub allows users to create repositories under their own Personal Account or an organization they are part of. The user pool for multi-tenant, SaaS applications will generally fall into one of two categories: -1. **Shared user-pool**: the application has a single pool of users. A user can create one account and belong to multiple organizations. The user can have separate roles in each organization. +1. **Shared user-pool**: the application has a single pool of users. A user can create one account and belong to multiple organizations. The user can have separate Roles in each Organization. 1. **Isolated user-pool**: each organization has its own pool of users. A user must create a separate account for each organization. > [!NOTE] @@ -50,15 +50,15 @@ B2B SaaS applications with the following characteristics are well-supported with - The application may carry your own branding or some elements of your customer's branding - The application is served from a single domain (for example: `app.example.com`) -### Integrating organizations with your application +### Integrating Organizations with your application -Clerk offers a number of building blocks to help integrate organizations into your application: +Clerk offers a number of building blocks to help integrate Organizations into your application: -- The [`` component](/docs/reference/components/organization/organization-switcher) provides a way for your users to select which organization is active. The [`useOrganizationList()` hook](/docs/guides/development/custom-flows/organizations/organization-switcher) can be used for more control. -- The [`useOrganization()` hook](/docs/reference/hooks/use-organization) can be used to fetch the [active organization](!active-organization). +- The [`` component](/docs/reference/components/organization/organization-switcher) provides a way for your users to select which Organization is the [Active Organization](!active-organization). The [`useOrganizationList()` hook](/docs/guides/development/custom-flows/organizations/organization-switcher) can be used for more control. +- The [`useOrganization()` hook](/docs/reference/hooks/use-organization) can be used to fetch the [Active Organization](!active-organization). - The [`` component](/docs/reference/components/control/protect) enables you to limit who can view certain pages based on their role. Additionally, Clerk exposes a number of helper functions, such as [`auth()`](/docs/reference/nextjs/app-router/auth), and hooks, such as [`useAuth()`](/docs/reference/hooks/use-auth), to check the user's authorization throughout your app and API endpoints. -The organization's ID should be stored in your database alongside each resource so that it can be used to filter and query the resources that should be rendered or returned according to the [active organization](!active-organization). +The Organization's ID should be stored in your database alongside each resource so that it can be used to filter and query the resources that should be rendered or returned according to the [Active Organization](!active-organization). ## Platforms diff --git a/docs/guides/how-clerk-works/overview.mdx b/docs/guides/how-clerk-works/overview.mdx index 287f545ba2..6bafde6bbc 100644 --- a/docs/guides/how-clerk-works/overview.mdx +++ b/docs/guides/how-clerk-works/overview.mdx @@ -23,7 +23,7 @@ atob(keyWithoutPrefix) // => example.accounts.dev$ > [!NOTE] > In previous versions of Clerk, the Frontend API URL was exposed directly rather than being encoded within a Publishable Key. This was a source of confusion for users, so we transitioned to encoding it as base64 and making it a key. -FAPI manages authentication flows on a per-user basis. For instance, it handles flows for signing up a user, retrieving a user's active sessions, creating an organization on behalf of a user, or fetching a user's organization invites. You can find the complete FAPI documentation [here](/docs/reference/frontend-api){{ target: '_blank' }}. +FAPI manages authentication flows on a per-user basis. For instance, it handles flows for signing up a user, retrieving a user's active sessions, creating an Organization on behalf of a user, or fetching a user's Organization invites. You can find the complete FAPI documentation [here](/docs/reference/frontend-api){{ target: '_blank' }}. FAPI _does not_ handle administrative actions that impact multiple users, such as listing all users, banning users, or impersonating a user. These types of tasks are handled by [the backend API](#the-backend-api). @@ -55,7 +55,7 @@ Finally, if you need complete control over the authentication flow, Clerk provid ## The backend API -The frontend API (FAPI) is designed for use primarily from the frontend of your application. Its methods focus on signing in users and managing user-related resources and data once they are authenticated. However, as an application developer, you might also need to perform administrative tasks, such as modifying multiple user or organization details, retrieving a list of all users, banning or impersonating a user, and more. +The frontend API (FAPI) is designed for use primarily from the frontend of your application. Its methods focus on signing in users and managing user-related resources and data once they are authenticated. However, as an application developer, you might also need to perform administrative tasks, such as modifying multiple user or Organization details, retrieving a list of all users, banning or impersonating a user, and more. To maintain security, these administrative tasks should only be executed on the server side using a secret key inaccessible to your users or the browser. These operations are handled by a separate API known as the backend API (BAPI). You can find the BAPI documentation [here](/docs/reference/backend-api){{ target: '_blank' }}. diff --git a/docs/guides/organizations/org-slugs-in-urls.mdx b/docs/guides/organizations/org-slugs-in-urls.mdx index 995432a27d..57b38810f9 100644 --- a/docs/guides/organizations/org-slugs-in-urls.mdx +++ b/docs/guides/organizations/org-slugs-in-urls.mdx @@ -108,10 +108,10 @@ This guide shows you how to add organization slugs to your app's URLs, configure - ## Configure `clerkMiddleware()` to set the active organization + ## Configure `clerkMiddleware()` to set the Active Organization > [!TIP] - > If your app doesn't use `clerkMiddleware()`, or you prefer to manually set the [active organization](!active-organization), use the [`setActive()`](/docs/reference/javascript/clerk) method to control the active organization on the client-side. + > If your app doesn't use `clerkMiddleware()`, or you prefer to manually set the [Active Organization](!active-organization), use the [`setActive()`](/docs/reference/javascript/clerk) method to control the Active Organization on the client-side. With [`clerkMiddleware()`](/docs/reference/nextjs/clerk-middleware), you can use the [`organizationSyncOptions`](/docs/reference/nextjs/clerk-middleware#organization-sync-options) property to declare URL patterns that determine whether a specific organization should be activated. @@ -120,7 +120,7 @@ This guide shows you how to add organization slugs to your app's URLs, configure In the following example, two `organizationPatterns` are defined: one for the root (e.g., `/orgs/acmecorp`) and one as the wildcard matcher `(.*)` to match `/orgs/acmecorp/any/other/resource`. This configuration ensures that the path `/orgs/:slug` with any optional trailing path segments will set the organization indicated by the slug as the active one. > [!WARNING] - > If no organization with the specified slug exists, or if the user isn't a member of the organization, then `clerkMiddleware()` **won't** modify the active organization. Instead, it will leave the previously active organization unchanged on the Clerk session. + > If no organization with the specified slug exists, or if the user isn't a member of the organization, then `clerkMiddleware()` **won't** modify the Active Organization. Instead, it will leave the previously Active Organization unchanged on the Clerk session. ```tsx {{ filename: 'proxy.ts', mark: [[7, 13]] }} import { clerkMiddleware } from '@clerk/nextjs/server' @@ -153,7 +153,7 @@ This guide shows you how to add organization slugs to your app's URLs, configure Now that `clerkMiddleware()` is configured to activate organizations, you can build an organization-specific page while handling cases where the organization can't be activated. - Failed activation occurs if no organization with the specified slug exists, or if the given user isn't a member of the organization. When this happens, the middleware won't change the active organization, leaving the previously active one unchanged. + Failed activation occurs if no organization with the specified slug exists, or if the given user isn't a member of the organization. When this happens, the middleware won't change the Active Organization, leaving the previously active one unchanged. For troubleshooting, a message will also be logged on the server: @@ -161,7 +161,7 @@ This guide shows you how to add organization slugs to your app's URLs, configure It's ultimately the responsibility of the page to ensure that it renders the appropriate content for a given URL, and to handle the case where the expected organization **isn't** active. - In the following example, the organization slug is detected as a Next.js [Dynamic Route](https://nextjs.org/docs/pages/building-your-application/routing/dynamic-routes) param and passed as a parameter to the page. If the slug doesn't match the active organization slug, an error message is rendered and the [``](/docs/reference/components/organization/organization-list) component allows the user to select a valid organization. + In the following example, the organization slug is detected as a Next.js [Dynamic Route](https://nextjs.org/docs/pages/building-your-application/routing/dynamic-routes) param and passed as a parameter to the page. If the slug doesn't match the Active Organization slug, an error message is rendered and the [``](/docs/reference/components/organization/organization-list) component allows the user to select a valid organization. ```tsx {{ filename: 'app/orgs/[slug]/page.tsx' }} import { auth } from '@clerk/nextjs/server' @@ -172,7 +172,7 @@ This guide shows you how to add organization slugs to your app's URLs, configure const { slug } = await params // Check if the organization slug from the URL params doesn't match - // the active organization slug from the user's session. + // the Active Organization slug from the user's session. // If they don't match, show an error message and the list of valid organizations. if (slug != orgSlug) { return ( @@ -220,7 +220,7 @@ This guide shows you how to add organization slugs to your app's URLs, configure const { slug } = await params // Check if the organization slug from the URL params doesn't match - // the active organization slug from the user's session. + // the Active Organization slug from the user's session. // If they don't match, show an error message and the list of valid organizations. if (slug != orgSlug) { return ( @@ -252,11 +252,11 @@ This guide shows you how to add organization slugs to your app's URLs, configure import { OrganizationList, useOrganization } from '@clerk/nextjs' export default function Home({ params }: { params: { slug: string } }) { - // Use `useOrganization()` to access the currently active organization's `Organization` object + // Use `useOrganization()` to access the currently Active Organization's `Organization` object const { organization } = useOrganization() // Check if the organization slug from the URL params doesn't match - // the active organization slug from the user's session. + // the Active Organization slug from the user's session. // If they don't match, show an error message and the list of valid organizations. if (!organization || organization.slug != params.slug) { return ( diff --git a/docs/guides/organizations/overview.mdx b/docs/guides/organizations/overview.mdx index c91c3fca85..f2bc323b73 100644 --- a/docs/guides/organizations/overview.mdx +++ b/docs/guides/organizations/overview.mdx @@ -53,19 +53,19 @@ By default, organizations are deletable. Any member with the "Delete organizatio Verified domains can be used to streamline enrollment into an organization. For example, if the domain `@clerk.com` is added to an organization, any user with a `@clerk.com` email address can be automatically invited or be suggested to join this organization. This feature is useful for organizations that want to restrict membership to users with specific email domains. See the [guide on verified domains](/docs/guides/organizations/verified-domains) for more information. -## Allow personal accounts +## Allow Personal Accounts In the Clerk Dashboard, there are two types of workspaces: -- **Personal account**: A personal account/workspace is a user's unique, individual space, independent of any organization. -- **Organization workspace**: An organization workspace is owned and managed by an organization, which can have multiple members, also known as collaborators. The organization workspace that a user is currently viewing is called the [active organization](!active-organization). +- **Personal account**: A Personal Account/workspace is a user's unique, individual space, independent of any organization. +- **Organization workspace**: An organization workspace is owned and managed by an organization, which can have multiple members, also known as collaborators. The organization workspace that a user is currently viewing is called the [Active Organization](!active-organization). -Most multi-tenant applications want every user to be part of an organization rather than operating in an isolated personal account. Accordingly, **personal accounts are disabled by default** once you enable organizations. After signing up, [a user must create or join an organization before they can proceed](/docs/guides/configure/session-tasks). +Most multi-tenant applications want every user to be part of an organization rather than operating in an isolated Personal Account. Accordingly, **Personal Accounts are disabled by default** once you enable organizations. After signing up, [a user must create or join an organization before they can proceed](/docs/guides/configure/session-tasks). -To enable personal accounts for your application, toggle **Allow personal accounts** in the [**Organizations Settings**](https://dashboard.clerk.com/~/organizations-settings) page. +To enable Personal Accounts for your application, toggle **Allow Personal Accounts** in the [**Organizations Settings**](https://dashboard.clerk.com/~/organizations-settings) page. > [!IMPORTANT] -> Personal accounts being disabled by default was released on August 22, 2025. Applications created before this date will not be able to see the **Allow personal accounts** setting, because personal account were enabled by default. +> Personal accounts being disabled by default was released on August 22, 2025. Applications created before this date will not be able to see the **Allow Personal Accounts** setting, because Personal Account were enabled by default. ## Organization slugs @@ -80,11 +80,11 @@ When enabled, organization slugs will be displayed in the [``](/docs/reference/components/organization/organization-switcher) component. If the prebuilt components don't meet your specific needs or if you require more control over the logic, you can also use the `setActive()` method, which is returned by the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook. If you aren't using hooks, you can access the `setActive()` method from the [`Clerk`](/docs/reference/javascript/clerk#set-active) object. +When Personal Accounts are enabled, users initially sign in to their Personal Account with **no** Active Organization set. The easiest way to allow users to set an organization as active is to use the [``](/docs/reference/components/organization/organization-switcher) component. If the prebuilt components don't meet your specific needs or if you require more control over the logic, you can also use the `setActive()` method, which is returned by the [`useOrganizationList()`](/docs/reference/hooks/use-organization-list) hook. If you aren't using hooks, you can access the `setActive()` method from the [`Clerk`](/docs/reference/javascript/clerk#set-active) object. ## Monthly Active Organization (MAO) @@ -125,9 +125,9 @@ To manage organizations in the Clerk Dashboard: For managing organizations in your application, Clerk provides a set of prebuilt components: - [``](/docs/reference/components/organization/create-organization) - A form for a user to create a new organization. -- [``](/docs/reference/components/organization/organization-profile) - A profile page for the user's currently active organization. +- [``](/docs/reference/components/organization/organization-profile) - A profile page for the user's currently Active Organization. - [``](/docs/reference/components/organization/organization-list) - A list of organizations that a user is a member of. -- [``](/docs/reference/components/organization/organization-switcher) - A dropdown menu that handles all organization flows. It allows a user to create an organization, switch between organizations, and view their organization's profile, which allows them to manage the organization's settings, invitations, and current members. If [personal accounts are enabled](/docs/guides/organizations/overview#allow-personal-accounts), users can also switch to their personal account. +- [``](/docs/reference/components/organization/organization-switcher) - A dropdown menu that handles all organization flows. It allows a user to create an organization, switch between organizations, and view their organization's profile, which allows them to manage the organization's settings, invitations, and current members. If [Personal Accounts are enabled](/docs/guides/organizations/overview#allow-personal-accounts), users can also switch to their Personal Account. If the prebuilt components don't meet your specific needs or if you require more control over the logic, you can rebuild and customize the existing Clerk flows using the Clerk API. See the [custom flows](/docs/guides/development/custom-flows/overview) for more information. diff --git a/docs/guides/overview.mdx b/docs/guides/overview.mdx index debcc9f267..819d9dbf68 100644 --- a/docs/guides/overview.mdx +++ b/docs/guides/overview.mdx @@ -39,13 +39,13 @@ Clerk offers a variety of guides to help you build and work with Clerk. These gu --- - [Organizations (B2B)](/docs/guides/organizations/overview) - - Manage organizations with verified domains, roles and permissions, invitations, enterprise SSO, and organization metadata for scalable B2B workflows. + - Manage Organizations with Verified Domains, Roles and Permissions, invitations, Enterprise SSO, and Organization metadata for scalable B2B workflows. - {} --- - [Billing](/docs/guides/billing/overview) - - Set up and manage billing for B2C and B2B applications, including free trials, subscription plans, payments, and webhook events. + - Set up and manage Billing for B2C and B2B applications, including free trials, Subscription Plans, payments, and webhook events. - {} --- diff --git a/docs/guides/secure/authorization-checks.mdx b/docs/guides/secure/authorization-checks.mdx index 93dbbb36f7..c1a16b01b7 100644 --- a/docs/guides/secure/authorization-checks.mdx +++ b/docs/guides/secure/authorization-checks.mdx @@ -1,6 +1,6 @@ --- title: Authorize users -description: Learn how to verify and validate user roles and permissions within Clerk to maintain secure access control. We provide a collection of utility functions and components that allow developers to perform authorization checks. +description: Learn how to verify and validate user Roles and Permissions within Clerk to maintain secure access control. We provide a collection of utility functions and components that allow developers to perform authorization checks. metadata: title: Verifying user permissions with Clerk --- @@ -10,11 +10,11 @@ It's best practice to always verify whether or not a user is **authorized** to a Clerk provides two main features that can be used to implement authorization checks: - [Organizations](/docs/guides/organizations/overview) - - Users can be assigned [roles and permissions](/docs/guides/organizations/roles-and-permissions#permissions) - - Useful for role-based and permission-based access control + - Users can be assigned [Roles and Permissions](/docs/guides/organizations/roles-and-permissions#permissions) + - Useful for Role-based and Permission-based access control - [Billing](/docs/guides/billing/overview) - - Users can subscribe to plans and features - - Useful for subscription-based and feature-based access control + - Users can subscribe to Plans and Features + - Useful for Subscription-based and Feature-based access control You can use either options independently or combine them together depending on your application's needs. @@ -22,7 +22,7 @@ There are a few methods to perform authorization checks: - The [`has()`](/docs/reference/backend/types/auth-object#has) helper **(recommended)**: returns `false` if the user is unauthorized. - Benefits: it offers flexibility and control over the response; if a user is not authorized, you can choose how your app responds. - - Limitations: when checking for permissions, it only checks for custom permissions. To check for system permissions, you have to verify the user's role instead, which isn't as flexible. + - Limitations: when checking for Permissions, it only checks for custom Permissions. To check for system Permissions, you have to verify the user's Role instead, which isn't as flexible. - The [``](/docs/reference/components/control/protect) component: prevents content from rendering if the user is unauthorized. - Benefits: it can be used both client-side and server-side (in Server Components). - Limitations: this component only **visually hides** its children when the current user is not authorized. The contents of its children remain accessible via the browser's source code even if the user fails the authorization check. Do not use this component to hide sensitive information that should be completely inaccessible to unauthorized users. For truly sensitive data, it's recommended to use `has()` to perform authorization checks on the server before sending the data to the client. @@ -33,15 +33,15 @@ There are a few methods to perform authorization checks: - Limitations: doesn't offer control over the response, and can only be used on the server-side. -This guide will show you how to implement authorization checks in order to protect actions, content, or entire routes based on the user's **permissions**, but the same concepts can be applied to roles, features, and plans. When calling the `has()` helper, you would simply replace the `permission` parameter with the appropriate access control type, such as `role`, `feature`, or `plan`. +This guide will show you how to implement authorization checks in order to protect actions, content, or entire routes based on the user's **Permissions**, but the same concepts can be applied to Roles, Features, and Plans. When calling the `has()` helper, you would simply replace the `permission` parameter with the appropriate access control type, such as `role`, `feature`, or `plan`. ## Important considerations -- When doing authorization checks, it's recommended to use permission-based over role-based, and feature-based over plan-based authorization, as these approaches are more granular, flexible, and more secure. - - Note: Using `has()` **on the server-side** to check permissions works only with **custom permissions**, as [system permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) aren't included in the session token claims. To check system permissions, verify the user's role instead. -- Checking for a role or permission depends on the user having an [active organization](!active-organization). Without an active organization, the authorization checks will likely always evaluate to false by default. -- If you would like to perform role-based authorization checks **without** using Clerk's organizations feature, see [the Role Based Access Control (RBAC) guide](/docs/guides/secure/basic-rbac). -- If you have both organizations and billing enabled, a permission check will only work if the feature part of the permission key (`org::`) **is a feature included in the organization's active plan**. For example, say you want to check if an organization member has the custom permission `org:teams:manage`, where `teams` is the feature. Before performing the authorization check, you need to ensure that the user's organization is subscribed to a plan that has the `teams` feature. If not, the authorization check will always return `false`, _even if the user has the custom permission_. +- When doing authorization checks, it's recommended to use Permission-based over Role-based, and Feature-based over Plan-based authorization, as these approaches are more granular, flexible, and more secure. + - Note: Using `has()` **on the server-side** to check Permissions works only with **Custom Permissions**, as [System Permissions](/docs/guides/organizations/roles-and-permissions#system-permissions) aren't included in the session token claims. To check System Permissions, verify the user's Role instead. +- Checking for a Role or Permission depends on the user having an [Active Organization](!active-organization). Without an Active Organization, the authorization checks will likely always evaluate to false by default. +- If you would like to perform Role-based authorization checks **without** using Clerk's Organizations feature, see [the Role Based Access Control (RBAC) guide](/docs/guides/secure/basic-rbac). +- If you have both Organizations and Billing enabled, a Permission check will only work if the Feature part of the Permission key (`org::`) **is a Feature included in the Organization's active Plan**. For example, say you want to check if an Organization member has the Custom Permission `org:teams:manage`, where `teams` is the Feature. Before performing the authorization check, you need to ensure that the user's Organization is subscribed to a Plan that has the `teams` Feature. If not, the authorization check will always return `false`, _even if the user has the Custom Permission_. * Be cautious when doing authorization checks in layouts, as these don't re-render on navigation, meaning the user session won't be checked on every route change. [Read more in the Next.js docs](https://nextjs.org/docs/app/building-your-application/authentication#layouts-and-auth-checks). @@ -55,7 +55,7 @@ The [`has()`](/docs/reference/backend/types/auth-object#has) helper returns `fal - The following example demonstrates how to perform authorization checks in a page in order to protect the content from unauthorized access. It uses `has()` to check if the user has the `org:team_settings:manage` permission. If they aren't authorized, `null` is returned and the page isn't rendered. + The following example demonstrates how to perform authorization checks in a page in order to protect the content from unauthorized access. It uses `has()` to check if the user has the `org:team_settings:manage` Permission. If they aren't authorized, `null` is returned and the page isn't rendered. This example is written for Next.js App Router, but can be adapted to other frameworks by using [the appropriate method for accessing the `Auth` object](/docs/reference/backend/types/auth-object#how-to-access-the-auth-object). @@ -252,9 +252,9 @@ If you are not using React-based frameworks, you can use the [Clerk JavaScript S In order to enhance typesafety in your project, you can define a global `ClerkAuthorization` interface, which defines the acceptable values for custom access control types. > [!NOTE] -> By default, roles and permission types, such as `OrganizationCustomRoleKey` and `OrganizationCustomPermissionKey`, are assigned `string`. However, if a `ClerkAuthorization` type is defined, it will be utilized instead. +> By default, Roles and Permissions types, such as `OrganizationCustomRoleKey` and `OrganizationCustomPermissionKey`, are assigned `string`. However, if a `ClerkAuthorization` type is defined, it will be utilized instead. -The following example demonstrates how to define a global `ClerkAuthorization` interface with the default roles that Clerk provides. +The following example demonstrates how to define a global `ClerkAuthorization` interface with the default Roles that Clerk provides. ```tsx {{ filename: 'types/globals.d.ts' }} export {} @@ -267,7 +267,7 @@ declare global { } ``` -Because Clerk supports custom access control types, you can modify `ClerkAuthorization` to align with the custom access control types configured in your Clerk application. See the following example, where the default Clerk roles `org:admin` and `org:member` are replaced with custom roles `org:super_admin`, `org:teacher`, and `org:student`, and custom permissions are also added. +Because Clerk supports custom access control types, you can modify `ClerkAuthorization` to align with the custom access control types configured in your Clerk application. See the following example, where the default Clerk Roles `org:admin` and `org:member` are replaced with custom Roles `org:super_admin`, `org:teacher`, and `org:student`, and custom Permissions are also added. ```tsx {{ filename: 'types/globals.d.ts' }} export {} diff --git a/docs/guides/secure/basic-rbac.mdx b/docs/guides/secure/basic-rbac.mdx index 06aa291ad4..a404f0eead 100644 --- a/docs/guides/secure/basic-rbac.mdx +++ b/docs/guides/secure/basic-rbac.mdx @@ -4,14 +4,14 @@ description: Learn how to leverage Clerk's publicMetadata to implement your own sdk: nextjs --- -To control which users can access certain parts of your app, you can use the [roles feature](/docs/guides/organizations/roles-and-permissions#roles). Although Clerk offers roles as part of the [organizations](/docs/guides/organizations/overview) feature set, not every app implements organizations. **This guide covers a workaround to set up a basic Role Based Access Control (RBAC) system for products that don't use Clerk's organizations or roles.** +To control which users can access certain parts of your app, you can use the [Roles](/docs/guides/organizations/roles-and-permissions#roles) feature. Although Clerk offers Roles as part of the [Organizations](/docs/guides/organizations/overview) feature set, not every app implements Organizations. **This guide covers a workaround to set up a basic Role Based Access Control (RBAC) system for products that don't use Clerk's Organizations or Roles.** This guide assumes that you're using Next.js App Router, but the concepts can be adapted to Next.js Pages Router and Remix. ## Configure the session token - Clerk provides [user metadata](/docs/guides/users/extending), which can be used to store information, and in this case, it can be used to store a user's role. Since `publicMetadata` can only be read but not modified in the browser, it is the safest and most appropriate choice for storing information. + Clerk provides [user metadata](/docs/guides/users/extending), which can be used to store information, and in this case, it can be used to store a user's Role. Since `publicMetadata` can only be read but not modified in the browser, it is the safest and most appropriate choice for storing information. To build a basic RBAC system, you first need to make `publicMetadata` available to the application directly from the session token. By attaching `publicMetadata` to the user's session, you can access the data without needing to make a network request each time. @@ -27,12 +27,12 @@ This guide assumes that you're using Next.js App Router, but the concepts can be ## Create a global TypeScript definition 1. In your application's root folder, create a `types/` directory. - 1. Inside this directory, create a `globals.d.ts` file with the following code. This file will provide auto-completion and prevent TypeScript errors when working with roles. For this guide, only the `admin` and `moderator` roles will be defined. + 1. Inside this directory, create a `globals.d.ts` file with the following code. This file will provide auto-completion and prevent TypeScript errors when working with Roles. For this guide, only the `admin` and `moderator` roles will be defined. ```ts {{ filename: 'types/globals.d.ts' }} export {} - // Create a type for the roles + // Create a type for the Roles export type Roles = 'admin' | 'moderator' declare global { @@ -44,9 +44,9 @@ This guide assumes that you're using Next.js App Router, but the concepts can be } ``` - ## Set the admin role for your user + ## Set the admin Role for your user - Later in the guide, you will add a basic admin tool to change a user's role. For now, manually add the `admin` role to your own user account. + Later in the guide, you will add a basic admin tool to change a user's Role. For now, manually add the `admin` Role to your own user account. 1. In the Clerk Dashboard, navigate to the [**Users**](https://dashboard.clerk.com/~/users) page. 1. Select your own user account. @@ -59,12 +59,12 @@ This guide assumes that you're using Next.js App Router, but the concepts can be } ``` - ## Create a reusable function to check roles + ## Create a reusable function to check Roles - Create a helper function to simplify checking roles. + Create a helper function to simplify checking Roles. 1. In your application's root directory, create a `utils/` folder. - 1. Inside this directory, create a `roles.ts` file with the following code. The `checkRole()` helper uses the [`auth()`](/docs/reference/nextjs/app-router/auth) helper to access the user's session claims. From the session claims, it accesses the `metadata` object to check the user's role. The `checkRole()` helper accepts a role of type `Roles`, which you created in the [Create a global TypeScript definition](#create-a-global-type-script-definition) step. It returns `true` if the user has that role or `false` if they do not. + 1. Inside this directory, create a `roles.ts` file with the following code. The `checkRole()` helper uses the [`auth()`](/docs/reference/nextjs/app-router/auth) helper to access the user's session claims. From the session claims, it accesses the `metadata` object to check the user's Role. The `checkRole()` helper accepts a Role of type `Roles`, which you created in the [Create a global TypeScript definition](#create-a-global-type-script-definition) step. It returns `true` if the user has that Role or `false` if they do not. ```ts {{ filename: 'utils/roles.ts' }} import { Roles } from '@/types/globals' @@ -77,7 +77,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be ``` > [!NOTE] - > You can customize the behavior of the `checkRole()` helper function to suit your needs. For example, you could modify it to return the roles a user has or create a `protectByRole()` function that handles role-based redirects. + > You can customize the behavior of the `checkRole()` helper function to suit your needs. For example, you could modify it to return the Roles a user has or create a `protectByRole()` function that handles Role-based redirects. ## Create the admin dashboard @@ -88,7 +88,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be ```tsx {{ filename: 'app/admin/page.tsx' }} export default function AdminDashboard() { - return

This is the protected admin dashboard restricted to users with the `admin` role.

+ return

This is the protected admin dashboard restricted to users with the `admin` Role.

} ``` @@ -96,8 +96,8 @@ This guide assumes that you're using Next.js App Router, but the concepts can be To protect the `/admin` route, choose **one** of the two following methods: - 1. **Middleware**: Apply role-based access control globally at the route level. This method restricts access to all routes matching `/admin` before the request reaches the actual page. - 1. **Page-level role check**: Apply role-based access control directly in the `/admin` page component. This method protects this specific page. To protect other pages in the admin dashboard, apply this protection to each route. + 1. **Middleware**: Apply Role-based access control globally at the route level. This method restricts access to all routes matching `/admin` before the request reaches the actual page. + 1. **Page-level Role check**: Apply Role-based access control directly in the `/admin` page component. This method protects this specific page. To protect other pages in the admin dashboard, apply this protection to each route. > [!IMPORTANT] > You only need to follow **one** of the following methods to secure your `/admin` route. @@ -106,7 +106,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be - 1. In your app's root directory, create a `proxy.ts` file with the following code. The `createRouteMatcher()` function identifies routes starting with `/admin`. `clerkMiddleware()` intercepts requests to the `/admin` route, and checks the user's role in their `metadata` to verify that they have the `admin` role. If they don't, it redirects them to the home page. + 1. In your app's root directory, create a `proxy.ts` file with the following code. The `createRouteMatcher()` function identifies routes starting with `/admin`. `clerkMiddleware()` intercepts requests to the `/admin` route, and checks the user's Role in their `metadata` to verify that they have the `admin` Role. If they don't, it redirects them to the home page. ```tsx {{ filename: 'proxy.ts' }} import { clerkMiddleware, createRouteMatcher } from '@clerk/nextjs/server' @@ -134,7 +134,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be ### Option 2: Protect the `/admin` route at the page-level - 1. Add the following code to the `app/admin/page.tsx` file. The `checkRole()` function checks if the user has the `admin` role. If they don't, it redirects them to the home page. + 1. Add the following code to the `app/admin/page.tsx` file. The `checkRole()` function checks if the user has the `admin` Role. If they don't, it redirects them to the home page. ```tsx {{ filename: 'app/admin/page.tsx' }} import { checkRole } from '@/utils/roles' @@ -147,13 +147,13 @@ This guide assumes that you're using Next.js App Router, but the concepts can be redirect('/') } - return

This is the protected admin dashboard restricted to users with the `admin` role.

+ return

This is the protected admin dashboard restricted to users with the `admin` Role.

} ``` - ## Create server actions for managing a user's role + ## Create server actions for managing a user's Role - 1. In your `app/admin/` directory, create an `_actions.ts` file with the following code. The `setRole()` action checks that the current user has the `admin` role before updating the specified user's role using Clerk's [JS Backend SDK](/docs/reference/backend/user/update-user). The `removeRole()` action removes the role from the specified user. + 1. In your `app/admin/` directory, create an `_actions.ts` file with the following code. The `setRole()` action checks that the current user has the `admin` Role before updating the specified user's Role using Clerk's [JS Backend SDK](/docs/reference/backend/user/update-user). The `removeRole()` action removes the Role from the specified user. ```ts {{ filename: 'app/admin/_actions.ts' }} 'use server' @@ -164,7 +164,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be export async function setRole(formData: FormData) { const client = await clerkClient() - // Check that the user trying to set the role is an admin + // Check that the user trying to set the Role is an admin if (!checkRole('admin')) { return { message: 'Not Authorized' } } @@ -230,7 +230,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be With the server action and the search form set up, it's time to refactor the `app/admin/page.tsx`. - 1. Replace the code in your `app/admin/page.tsx` file with the following code. It checks whether a search parameter has been appended to the URL by the search form. If a search parameter is present, it queries for users matching the entered term. If one or more users are found, the component displays a list of users, showing their first and last names, primary email address, and current role. Each user has `Make Admin` and `Make Moderator` buttons, which include hidden inputs for the user ID and role. These buttons use the `setRole()` server action to update the user's role. + 1. Replace the code in your `app/admin/page.tsx` file with the following code. It checks whether a search parameter has been appended to the URL by the search form. If a search parameter is present, it queries for users matching the entered term. If one or more users are found, the component displays a list of users, showing their first and last names, primary email address, and current Role. Each user has `Make Admin` and `Make Moderator` buttons, which include hidden inputs for the user ID and Role. These buttons use the `setRole()` server action to update the user's Role. ```tsx {{ filename: 'app/admin/page.tsx' }} import { redirect } from 'next/navigation' @@ -254,7 +254,7 @@ This guide assumes that you're using Next.js App Router, but the concepts can be return ( <> -

This is the protected admin dashboard restricted to users with the `admin` role.

+

This is the protected admin dashboard restricted to users with the `admin` Role.

@@ -300,5 +300,5 @@ This guide assumes that you're using Next.js App Router, but the concepts can be ## Finished 🎉 - The foundation of a custom RBAC (Role-Based Access Control) system is now set up. Roles are attached directly to the user's session, allowing your application to access them without the need for additional network requests. The `checkRole()` helper function simplifies role checks and reduces code complexity. The final component is the admin dashboard, which enables admins to efficiently search for users and manage roles. + The foundation of a custom RBAC (Role-Based Access Control) system is now set up. Roles are attached directly to the user's session, allowing your application to access them without the need for additional network requests. The `checkRole()` helper function simplifies Role checks and reduces code complexity. The final component is the admin dashboard, which enables admins to efficiently search for users and manage Roles.
diff --git a/docs/guides/secure/features.mdx b/docs/guides/secure/features.mdx index 6b841f47a4..5a86fc19fa 100644 --- a/docs/guides/secure/features.mdx +++ b/docs/guides/secure/features.mdx @@ -7,7 +7,7 @@ Features are specific capabilities or functionalities in your application that y Features can be used in two ways: -- With Clerk's [organizations](/docs/guides/organizations/overview) feature to create custom permissions. Custom permissions are always tied to a feature, and are formatted as `org::`. For example, you could create a feature called **invoices** and then create a new permission called **create invoices**. The custom permission's key would be `org:invoices:create`. Learn more about [custom permissions](/docs/guides/organizations/roles-and-permissions). -- With Clerk's billing feature to create features specific to a subscription plan. See the [billing docs](/docs/guides/billing/overview) for more information. +- With Clerk's [Organizations](/docs/guides/organizations/overview) feature to create Custom Permissions. Custom Permissions are always tied to a Feature, and are formatted as `org::`. For example, you could create a Feature called **invoices** and then create a new Permission called **create invoices**. The Custom Permission's key would be `org:invoices:create`. Learn more about [Custom Permissions](/docs/guides/organizations/roles-and-permissions). +- With Clerk's Billing feature to create Features specific to a Subscription Plan. See the [Billing docs](/docs/guides/billing/overview) for more information. -To manage your features, navigate to the [**Features**](https://dashboard.clerk.com/~/features) page in the Clerk Dashboard. +To manage your Features, navigate to the [**Features**](https://dashboard.clerk.com/~/features) page in the Clerk Dashboard. diff --git a/docs/guides/sessions/manual-jwt-verification.mdx b/docs/guides/sessions/manual-jwt-verification.mdx index 03282a0d3d..f59451147f 100644 --- a/docs/guides/sessions/manual-jwt-verification.mdx +++ b/docs/guides/sessions/manual-jwt-verification.mdx @@ -43,7 +43,7 @@ The following example uses the `authenticateRequest()` method to verify the sess ### Optional: Check for a `sts` claim - If you are using Clerk's [organizations](/docs/guides/organizations/overview) feature and [have not enabled personal accounts](/docs/guides/organizations/overview#allow-personal-accounts), users are _required to be part of an organization before accessing your application_. If the user has completed registration, but is not yet part of an organization, a valid session token will be created, but the token will contain a `sts` (status) claim set to `pending`. You may want to reject requests to your backend with pending statuses to ensure that users are not able to work around the organization requirement. + If you are using Clerk's [Organizations](/docs/guides/organizations/overview) feature and [have not enabled Personal Accounts](/docs/guides/organizations/overview#allow-personal-accounts), users are _required to be part of an Organization before accessing your application_. If the user has completed registration, but is not yet part of an Organization, a valid session token will be created, but the token will contain a `sts` (status) claim set to `pending`. You may want to reject requests to your backend with pending statuses to ensure that users are not able to work around the Organization requirement. ### Finished diff --git a/docs/guides/sessions/session-tokens.mdx b/docs/guides/sessions/session-tokens.mdx index 25943f585a..644e35a90e 100644 --- a/docs/guides/sessions/session-tokens.mdx +++ b/docs/guides/sessions/session-tokens.mdx @@ -28,37 +28,37 @@ Read more about Clerk session tokens and how they work in [the guide on how Cler | `sid` | session ID | The ID of the current session. | `sess_123` | | `sub` | subject | The ID of the current user of the session. See [RFC 7519](https://datatracker.ietf.org/doc/html/rfc7519#section-4.1.2) for more information. | `user_123` | | `v` | version | The version number of the session token. | `2` | - | `pla` | plan | The plan that is active. The value is in the format `scope:planslug`, where `scope` can be `u` or `o` representing user or org-level plans, respectively. The `u:` prefix is used if no org is active, and the `o:` prefix appears if an org is active. | `u:free`,`o:pro` | - | `fea` | features | A list of enabled features and their scope. The scope can either be `o` for org-level features if there is an [active org](!active-organization), or `u` for user-level features or if there is no active org. | `o:dashboard,o:impersonation` | + | `pla` | plan | The Plan that is active. The value is in the format `scope:planslug`, where `scope` can be `u` or `o` representing user or Organization-level Plans, respectively. The `u:` prefix is used if no Organization is active, and the `o:` prefix appears if an Organization is active. | `u:free`,`o:pro` | + | `fea` | features | A list of enabled Features and their scope. The scope can either be `o` for Organization-level Features if there is an [Active Organization](!active-organization), or `u` for user-level Features or if there is no active Organization. | `o:dashboard,o:impersonation` | | `sts` | session status | The status of the current session | `pending` | ### Organization claim - The **`o` claim**, or organization claim, is only included if the user is part of an [organization](/docs/guides/organizations/overview) and that organization is [active](!active-organization). Its value is an object that contains the following properties: + The **`o` claim**, or Organization claim, is only included if the user is part of an [Organization](/docs/guides/organizations/overview) and that Organization is [active](!active-organization). Its value is an object that contains the following properties: | Claim | Abbreviation expanded | Description | Example | | | - | - | - | - | - | - | `id` | ID | The ID of the organization. | `org_123` | | - | `slg` | slug | The slug of the organization. | `org-slug` | | - | `rol` | role | The role of the user in the organization, without the `org:` prefix. | `admin` | | - | `per` | permissions | The names of the permissions the user has in the organization. | `read,manage` | | - | `fpm` | feature-permission map | feature-permission map | The mapping of features with permissions. [Learn how this value is constructed](#decode-o-fpm-manually). | `3,2` | + | `id` | ID | The ID of the Organization. | `org_123` | | + | `slg` | slug | The slug of the Organization. | `org-slug` | | + | `rol` | role | The Role of the user in the Organization, without the `org:` prefix. | `admin` | | + | `per` | permissions | The names of the Permissions the user has in the Organization. | `read,manage` | | + | `fpm` | feature-permission map | feature-permission map | The mapping of Features with Permissions. [Learn how this value is constructed](#decode-o-fpm-manually). | `3,2` | > [!WARNING] - > The organization claims above are intentionally designed to be as compact as possible to keep JWT tokens small. + > The Organization claims above are intentionally designed to be as compact as possible to keep JWT tokens small. > As a result, they can be difficult to decode manually. We strongly recommend using one of our SDKs that support API version [2025-04-10](/docs/guides/development/upgrading/versioning#2025-04-10) to handle decoding reliably. #### Decode `o.fpm` manually For those that need to decode the `o.fpm` claim manually, here is how the claim value is computed. - The `o.fpm` value is a list of comma-separated integers where the position of the integer corresponds to a feature in the same position in the `fea` claim. So, the first feature in the `fea` claim corresponds to the first integer in the `o.fpm` claim, and so on. + The `o.fpm` value is a list of comma-separated integers where the position of the integer corresponds to a Feature in the same position in the `fea` claim. So, the first Feature in the `fea` claim corresponds to the first integer in the `o.fpm` claim, and so on. - Each integer, when converted to binary, represents a bitmask where each bit's position corresponds to a permission in the `o.per` list, where `0` = `not-allowed` and `1` = `allowed`. The first bit position in the bitmask is the rightmost, least significant bit. It corresponds to the first permission in the `o.per` list, which is the leftmost element. This results in a sort of "reverse" mapping, seen in the example below. + Each integer, when converted to binary, represents a bitmask where each bit's position corresponds to a Permission in the `o.per` list, where `0` = `not-allowed` and `1` = `allowed`. The first bit position in the bitmask is the rightmost, least significant bit. It corresponds to the first Permission in the `o.per` list, which is the leftmost element. This results in a sort of "reverse" mapping, seen in the example below. #### Example - Consider a user with an active organization has role `admin`. This role has the following feature permissions: `dashboard:read`, `dashboard:manage`, `teams:read`. Therefore, the user's claims are as follows: + Consider a user with an Active Organization has Role `admin`. This Role has the following Feature-Permission mapping: `dashboard:read`, `dashboard:manage`, `teams:read`. Therefore, the user's claims are as follows: - `fea` claim has value `o:dashboard,o:teams` - `o.per` claim has value `manage,read` @@ -66,9 +66,9 @@ Read more about Clerk session tokens and how they work in [the guide on how Cler Now, let's manually decode the `o.fpm` claim. - The first integer `3` represents the feature-permission mapping for the `dashboard` feature, since it's the first feature in the `fea` claim. Then, converting `3` to binary, you get `11`, which means both permissions are allowed (`dashboard:read` and `dashboard:manage`). + The first integer `3` represents the Feature-Permission mapping for the `dashboard` Feature, since it's the first Feature in the `fea` claim. Then, converting `3` to binary, you get `11`, which means both Permissions are allowed (`dashboard:read` and `dashboard:manage`). - The second integer `2` represents the feature-permission mapping for the `teams` feature, since it's the second feature in the `fea` claim. Then, converting `2` to binary, you get `10`, which means the _second_ permission is allowed (`teams:read`). This is because **you read bitmask from right to left**, so the first bit, `0`, corresponds to the first permission in the `o.per` list (`manage`) and the second bit, `1`, corresponds to the second permission in the `o.per` list (`read`). + The second integer `2` represents the Feature-Permission mapping for the `teams` Feature, since it's the second Feature in the `fea` claim. Then, converting `2` to binary, you get `10`, which means the _second_ Permission is allowed (`teams:read`). This is because **you read bitmask from right to left**, so the first bit, `0`, corresponds to the first Permission in the `o.per` list (`manage`) and the second bit, `1`, corresponds to the second Permission in the `o.per` list (`read`). ### Actor claim @@ -98,14 +98,14 @@ Read more about Clerk session tokens and how they work in [the guide on how Cler | `sid` | session ID | The ID of the current session. | `sess_123` | | `sub` | subject | The ID of the current user of the session. See [RFC 7519](https://datatracker.ietf.org/doc/html/rfc7519#section-4.1.2) for more information. | `user_123` | - The following claims are only included if the user is part of an organization and that organization is [active](!active-organization): + The following claims are only included if the user is part of an Organization and that Organization is [active](!active-organization): | Claim | Abbreviation expanded | Description | Example | | - | - | - | - | - | `org_id` | organization ID | The ID of the [active organization](!active-organization) that the user belongs to. | `org_123` | - | `org_permissions` | organization permissions | The permissions of the user in the currently [active organization](!active-organization). System permissions are not included in the session token. | `["org:admin:example_permission", "org:member:example_permission"]` | - | `org_slug` | organization slug | The slug of the currently [active organization](!active-organization) that the user belongs to. | `org-slug` | - | `org_role` | organization role | The role of the user in the currently [active organization](!active-organization). | `org:admin` | + | `org_id` | Organization ID | The ID of the [Active Organization](!active-organization) that the user belongs to. | `org_123` | + | `org_permissions` | Organization Permissions | The Permissions of the user in the currently [Active Organization](!active-organization). System Permissions are not included in the session token. | `["org:admin:example_permission", "org:member:example_permission"]` | + | `org_slug` | Organization Slug | The slug of the currently [Active Organization](!active-organization) that the user belongs to. | `org-slug` | + | `org_role` | Organization Role | The role of the user in the currently [Active Organization](!active-organization). | `org:admin` | The **`act` (actor) claim** is only included if the user is [impersonating](/docs/guides/users/impersonation) another user. It's value is an object that contains the following properties: diff --git a/docs/guides/users/reading.mdx b/docs/guides/users/reading.mdx index 18ac80469d..b6a09b8051 100644 --- a/docs/guides/users/reading.mdx +++ b/docs/guides/users/reading.mdx @@ -78,7 +78,7 @@ The following example uses the [`auth()`](/docs/reference/nextjs/app-router/auth ### Pages Router -For Next.js applications using the Pages Router, the [`getAuth()`](/docs/reference/nextjs/pages-router/get-auth) helper will return the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and organization ID, as well as the `isAuthenticated` property which can be used to protect your API routes. +For Next.js applications using the Pages Router, the [`getAuth()`](/docs/reference/nextjs/pages-router/get-auth) helper will return the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and Organization ID, as well as the `isAuthenticated` property which can be used to protect your API routes. In some cases, you may need the full [`Backend User`](/docs/reference/backend/types/backend-user) object of the currently active user. This is helpful if you want to render information, like their first and last name, directly from the server. diff --git a/docs/guides/users/reading.nuxt.mdx b/docs/guides/users/reading.nuxt.mdx index 94d1629977..96d96275df 100644 --- a/docs/guides/users/reading.nuxt.mdx +++ b/docs/guides/users/reading.nuxt.mdx @@ -1,7 +1,7 @@ --- title: Protect content and read user data description: Learn how to use Clerk's composables to protect content and read user data in your Nuxt application. -metadata: +metadata: title: Read session and user data in your Nuxt app with Clerk sdk: nuxt --- @@ -36,7 +36,7 @@ const { isLoaded, isSignedIn, user } = useUser() ## Server-side -The `Auth` object is available at `event.context.auth()` in your [event handlers](https://h3.unjs.io/guide/event-handler). This JavaScript object contains important authentication information like the current user's session ID, user ID, and organization ID, and an `isAuthenticated` property to protect your API routes from unauthenticated users. +The `Auth` object is available at `event.context.auth()` in your [event handlers](https://h3.unjs.io/guide/event-handler). This JavaScript object contains important authentication information like the current user's session ID, user ID, and Organization ID, and an `isAuthenticated` property to protect your API routes from unauthenticated users. In some cases, you may need the full [`Backend User`](/docs/reference/backend/types/backend-user){{ target: '_blank' }} object of the currently active user. This is helpful if you want to render information, like their first and last name, directly from the server. The `clerkClient()` helper returns an instance of the [JS Backend SDK](/docs/js-backend/getting-started/quickstart){{ target: '_blank' }}, which exposes Clerk's Backend API resources through methods such as the [`getUser()`](/docs/reference/backend/user/get-user){{ target: '_blank' }} method. This method returns the full `Backend User` object. diff --git a/docs/guides/users/reading.react-router.mdx b/docs/guides/users/reading.react-router.mdx index e9945e3a73..f8ce51c782 100644 --- a/docs/guides/users/reading.react-router.mdx +++ b/docs/guides/users/reading.react-router.mdx @@ -1,7 +1,7 @@ --- title: Protect content and read user data description: Learn how to use Clerk's hooks and helpers to protect content and read user data in your React Router application. -metadata: +metadata: title: Read session and user data in your React Router app with Clerk sdk: react-router --- @@ -14,7 +14,7 @@ To access active session and user data on the server-side, use the [`getAuth()`] ### Server data loading -The [`getAuth()`](/docs/reference/react-router/get-auth) helper returns the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and organization ID, and the `isAuthenticated` property, which can be used to protect your API routes. +The [`getAuth()`](/docs/reference/react-router/get-auth) helper returns the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and Organization ID, and the `isAuthenticated` property, which can be used to protect your API routes. In some cases, you may need the full [`Backend User`](/docs/reference/backend/types/backend-user) object of the currently active user. This is helpful if you want to render information, like their first and last name, directly from the server. The `clerkClient()` helper returns an instance of the [JS Backend SDK](/docs/js-backend/getting-started/quickstart), which exposes Clerk's Backend API resources through methods such as the [`getUser()`](/docs/reference/backend/user/get-user){{ target: '_blank' }} method. This method returns the full `Backend User` object. diff --git a/docs/guides/users/reading.tanstack-react-start.mdx b/docs/guides/users/reading.tanstack-react-start.mdx index a4aacbee01..598ad04961 100644 --- a/docs/guides/users/reading.tanstack-react-start.mdx +++ b/docs/guides/users/reading.tanstack-react-start.mdx @@ -10,7 +10,7 @@ Clerk provides a set of [hooks and helpers](/docs/reference/tanstack-react-start ## Server-side -The [`auth()`](/docs/reference/tanstack-react-start/auth) helper returns the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and organization ID, and the `isAuthenticated` property, which can be used to protect your API routes. +The [`auth()`](/docs/reference/tanstack-react-start/auth) helper returns the [`Auth`](/docs/reference/backend/types/auth-object) object of the currently active user, which contains important information like the current user's session ID, user ID, and Organization ID, and the `isAuthenticated` property, which can be used to protect your API routes. In some cases, you may need the full [`Backend User`](/docs/reference/backend/types/backend-user) object of the currently active user. This is helpful if you want to render information, like their first and last name, directly from the server. The `clerkClient()` helper returns an instance of the [JS Backend SDK](/docs/js-backend/getting-started/quickstart), which exposes Clerk's Backend API resources through methods such as the [`getUser()`](/docs/reference/backend/user/get-user){{ target: '_blank' }} method. This method returns the full `Backend User` object. diff --git a/docs/index.mdx b/docs/index.mdx index 90dbd0d524..e2d7177e11 100644 --- a/docs/index.mdx +++ b/docs/index.mdx @@ -216,7 +216,7 @@ Find all the guides and resources you need to develop with Clerk. --- - [Organizations](/docs/guides/organizations/overview) - - Organizations are shared accounts, useful for project and team leaders. Members with elevated privileges can manage member access to the organization's data and resources. + - Organizations are shared accounts, useful for project and team leaders. Members with elevated privileges can manage member access to the Organization's data and resources. - {} --- @@ -241,8 +241,8 @@ Find all the guides and resources you need to develop with Clerk. --- - - [How do organizations work?](/docs/guides/organizations/overview) - - Organizations allow members to collaborate across shared resources. Each member of an organization needs to have a user account in your application. All organization members have access to most of the organization resources, but some members can take advantage of administrative features. + - [How do Organizations work?](/docs/guides/organizations/overview) + - Organizations allow members to collaborate across shared resources. Each member of an Organization needs to have a user account in your application. All Organization members have access to most of the Organization resources, but some members can take advantage of administrative features. - ![](/docs/images/home/organizations.png){{ dark: '/docs/images/home/organizations-dark.png' }} diff --git a/docs/manifest.json b/docs/manifest.json index 8ed5c409bd..6f4ed2b1f5 100644 --- a/docs/manifest.json +++ b/docs/manifest.json @@ -564,7 +564,7 @@ "href": "/docs/guides/secure/authorization-checks" }, { - "title": "Role-based access control (RBAC) without organizations", + "title": "Role-based access control (RBAC) without Organizations", "href": "/docs/guides/secure/basic-rbac" }, { @@ -665,7 +665,7 @@ "href": "/docs/guides/organizations/verified-domains" }, { - "title": "Roles and permissions", + "title": "Roles and Permissions", "href": "/docs/guides/organizations/roles-and-permissions" }, { @@ -1020,27 +1020,27 @@ "items": [ [ { - "title": "Accept organization invitation links", + "title": "Accept Organization invitation links", "href": "/docs/guides/development/custom-flows/organizations/accept-organization-invitations" }, { - "title": "Create an organization", + "title": "Create an Organization", "href": "/docs/guides/development/custom-flows/organizations/create-organizations" }, { - "title": "Create and manage organization invitations", + "title": "Create and manage Organization invitations", "href": "/docs/guides/development/custom-flows/organizations/manage-organization-invitations" }, { - "title": "List and switch between organizations", + "title": "List and switch between Organizations", "href": "/docs/guides/development/custom-flows/organizations/organization-switcher" }, { - "title": "Manage a user's organization invitations", + "title": "Manage a user's Organization invitations", "href": "/docs/guides/development/custom-flows/organizations/manage-user-org-invitations" }, { - "title": "Manage member roles", + "title": "Manage member Roles", "href": "/docs/guides/development/custom-flows/organizations/manage-roles" }, { @@ -1048,7 +1048,7 @@ "href": "/docs/guides/development/custom-flows/organizations/manage-membership-requests" }, { - "title": "Update an organization", + "title": "Update an Organization", "href": "/docs/guides/development/custom-flows/organizations/update-organizations" } ] diff --git a/docs/reference/astro/clerk-middleware.mdx b/docs/reference/astro/clerk-middleware.mdx index ece546a5a1..9e3f378ff4 100644 --- a/docs/reference/astro/clerk-middleware.mdx +++ b/docs/reference/astro/clerk-middleware.mdx @@ -33,7 +33,7 @@ const isProtectedRoute = createRouteMatcher(['/dashboard(.*)', '/forum(.*)']) You can protect routes by checking either or both of the following: - [User authentication status](#protect-routes-based-on-user-authentication-status) -- user is signed in or out -- [User authorization status](#protect-routes-based-on-user-authorization-status) -- user has the required role or permission +- [User authorization status](#protect-routes-based-on-user-authorization-status) -- user has the required Role or Permission ### Protect routes based on user authentication status @@ -57,7 +57,7 @@ export const onRequest = clerkMiddleware((auth, context) => { ### Protect routes based on user authorization status -To protect routes based on user authorization status, use [`auth().has()`](/docs/reference/backend/types/auth-object#has){{ target: '_blank' }} to check if the user has the required roles or custom permissions. +To protect routes based on user authorization status, use [`auth().has()`](/docs/reference/backend/types/auth-object#has){{ target: '_blank' }} to check if the user has the required Roles or Custom Permissions. ```tsx {{ filename: 'src/middleware.ts' }} import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server' @@ -67,12 +67,12 @@ const isProtectedRoute = createRouteMatcher(['/admin(.*)']) export const onRequest = clerkMiddleware((auth, context) => { const { has, redirectToSignIn } = auth() - // Restrict admin routes to users with specific permissions + // Restrict admin routes to users with specific Permissions if ( (isProtectedRoute(context.request) && !has({ permission: 'org:admin:example1' })) || !has({ permission: 'org:admin:example2' }) ) { - // Add logic to run if the user does not have the required permissions; for example, redirecting to the sign-in page + // Add logic to run if the user does not have the required Permissions; for example, redirecting to the sign-in page return redirectToSignIn() } }) diff --git a/docs/reference/astro/client-side-helpers/auth-store.mdx b/docs/reference/astro/client-side-helpers/auth-store.mdx index 3017d5a947..7fa7195008 100644 --- a/docs/reference/astro/client-side-helpers/auth-store.mdx +++ b/docs/reference/astro/client-side-helpers/auth-store.mdx @@ -26,21 +26,21 @@ The `$authStore` store provides a convenient way to access the current auth stat - `orgId` - `string` - The ID of the user's [active organization](!active-organization). + The ID of the user's [Active Organization](!active-organization). --- - `orgRole` - `string` - The current user's role in their [active organization](!active-organization). + The current user's Role in their [Active Organization](!active-organization). --- - `orgSlug` - `string` - The URL-friendly identifier of the user's [active organization](!active-organization). + The URL-friendly identifier of the user's [Active Organization](!active-organization). ## How to use the `$authStore` store diff --git a/docs/reference/astro/client-side-helpers/organization-store.mdx b/docs/reference/astro/client-side-helpers/organization-store.mdx index 81e8ce1e31..f2b74ea296 100644 --- a/docs/reference/astro/client-side-helpers/organization-store.mdx +++ b/docs/reference/astro/client-side-helpers/organization-store.mdx @@ -1,14 +1,14 @@ --- title: '`$organizationStore`' -description: Clerk's $organizationStore store retrieves the currently active organization. +description: Clerk's $organizationStore store retrieves the currently active Organization. sdk: astro --- -The `$organizationStore` store is used to retrieve attributes of the currently active organization. +The `$organizationStore` store is used to retrieve attributes of the currently [Active Organization](!active-organization). ## How to use the `$organizationStore` store -The following example demonstrates how to use the `$organizationStore` store to access the [`Organization`](/docs/reference/javascript/organization){{ target: '_blank' }} object, which allows you to access the current [active organization](!active-organization). +The following example demonstrates how to use the `$organizationStore` store to access the [`Organization`](/docs/reference/javascript/organization){{ target: '_blank' }} object, which allows you to access the current [Active Organization](!active-organization). ```tsx {{ filename: 'organization.tsx' }} @@ -24,7 +24,7 @@ The following example demonstrates how to use the `$organizationStore` store to } if (organization === null) { - // Add logic to handle no active organization state + // Add logic to handle no Active Organization state return null } @@ -49,7 +49,7 @@ The following example demonstrates how to use the `$organizationStore` store to
- +

This current organization is {{ organization.name }}

@@ -67,7 +67,7 @@ The following example demonstrates how to use the `$organizationStore` store to {#if $organization === undefined} {:else if $organization === null} - + {:else}

This current organization is {$organization.name}

@@ -78,7 +78,7 @@ The following example demonstrates how to use the `$organizationStore` store to ## Paginating data -The following example demonstrates how to implement pagination for organization memberships. The `memberships` state will be populated with the first page of the organization's memberships. When the "Previous page" or "Next page" button is clicked, the `fetchMemberships` function will be called to fetch the previous or next page of memberships. +The following example demonstrates how to implement pagination for Organization memberships. The `memberships` state will be populated with the first page of the Organization's memberships. When the "Previous page" or "Next page" button is clicked, the `fetchMemberships` function will be called to fetch the previous or next page of memberships. You can implement this pattern to any Clerk function that returns a [`ClerkPaginatedResponse`](/docs/reference/javascript/types/clerk-paginated-response){{ target: '_blank' }} object. diff --git a/docs/reference/astro/locals.mdx b/docs/reference/astro/locals.mdx index ee22249b79..530cffe466 100644 --- a/docs/reference/astro/locals.mdx +++ b/docs/reference/astro/locals.mdx @@ -8,7 +8,7 @@ Through Astro [`locals`](https://docs.astro.build/en/guides/middleware/#storing- ## `locals.auth()` -`Astro.locals.auth()` returns an `Auth` object. This JavaScript object contains important information like session data, your user's ID, as well as the ID of the [active organization](!active-organization). Learn more about the `Auth` object [here](/docs/reference/backend/types/auth-object){{ target: '_blank' }}. +`Astro.locals.auth()` returns an `Auth` object. This JavaScript object contains important information like session data, your user's ID, as well as the ID of the [Active Organization](!active-organization). Learn more about the `Auth` object [here](/docs/reference/backend/types/auth-object){{ target: '_blank' }}. ### `locals.auth()` options diff --git a/docs/reference/backend/authenticate-request.mdx b/docs/reference/backend/authenticate-request.mdx index dcbe92ecf0..0f367c7024 100644 --- a/docs/reference/backend/authenticate-request.mdx +++ b/docs/reference/backend/authenticate-request.mdx @@ -104,7 +104,7 @@ It is recommended to set these options as [environment variables](/docs/guides/d - `toAuth()` - `function` - A function that returns the `Auth` object. This JavaScript object contains important information like the current user's session ID, user ID, and organization ID. Learn more about the [`Auth` object](/docs/reference/backend/types/auth-object){{ target: '_blank' }}. + A function that returns the `Auth` object. This JavaScript object contains important information like the current user's session ID, user ID, and Organization ID. Learn more about the [`Auth` object](/docs/reference/backend/types/auth-object){{ target: '_blank' }}. ## Examples diff --git a/docs/reference/backend/billing/get-organization-billing-subscription.mdx b/docs/reference/backend/billing/get-organization-billing-subscription.mdx index 0730a07bcc..413ae705a3 100644 --- a/docs/reference/backend/billing/get-organization-billing-subscription.mdx +++ b/docs/reference/backend/billing/get-organization-billing-subscription.mdx @@ -1,6 +1,6 @@ --- title: '`getOrganizationBillingSubscription()`' -description: Use Clerk's JS Backend SDK to retrieve an organization's billing subscription. +description: Use Clerk's JS Backend SDK to retrieve an Organization's Billing Subscription. sdk: js-backend --- @@ -8,7 +8,7 @@ sdk: js-backend {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/BillingApi.ts */} -Retrieves an organization's billing subscription. Returns a [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription). +Retrieves an Organization's Billing Subscription. Returns a [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription). ```ts function getOrganizationBillingSubscription(organizationId: string): Promise diff --git a/docs/reference/backend/billing/get-plan-list.mdx b/docs/reference/backend/billing/get-plan-list.mdx index 6ec17bad99..21b12b3a9d 100644 --- a/docs/reference/backend/billing/get-plan-list.mdx +++ b/docs/reference/backend/billing/get-plan-list.mdx @@ -1,6 +1,6 @@ --- title: '`getPlanList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of billing plans. +description: Use Clerk's JS Backend SDK to retrieve a list of Billing Plans. sdk: js-backend --- @@ -8,7 +8,7 @@ sdk: js-backend {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/BillingApi.ts */} -Retrieves a list of billing plans. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`CommercePlan`](/docs/reference/backend/types/commerce-plan) objects, and a `totalCount` property that indicates the total number of plans. +Retrieves a list of Billing Plans. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`CommercePlan`](/docs/reference/backend/types/commerce-plan) objects, and a `totalCount` property that indicates the total number of Billing Plans. ```ts function getPlanList( @@ -36,7 +36,7 @@ function getPlanList( - `payerType?` - `'org' | 'user'` - Filter plans by payer type. + Filter Plans by payer type. ## Example diff --git a/docs/reference/backend/billing/get-user-billing-subscription.mdx b/docs/reference/backend/billing/get-user-billing-subscription.mdx index 346b26b89a..77bbf94c82 100644 --- a/docs/reference/backend/billing/get-user-billing-subscription.mdx +++ b/docs/reference/backend/billing/get-user-billing-subscription.mdx @@ -1,6 +1,6 @@ --- title: '`getUserBillingSubscription()`' -description: Use Clerk's JS Backend SDK to retrieve a user's billing subscription. +description: Use Clerk's JS Backend SDK to retrieve a user's Billing Subscription. sdk: js-backend --- @@ -8,7 +8,7 @@ sdk: js-backend {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/BillingApi.ts */} -Retrieves a user's billing subscription. Returns a [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription). +Retrieves a user's Billing Subscription. Returns a [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription). ```ts function getUserBillingSubscription(userId: string): Promise diff --git a/docs/reference/backend/organization/create-organization-invitation-bulk.mdx b/docs/reference/backend/organization/create-organization-invitation-bulk.mdx index 55a7f97b88..53910a1082 100644 --- a/docs/reference/backend/organization/create-organization-invitation-bulk.mdx +++ b/docs/reference/backend/organization/create-organization-invitation-bulk.mdx @@ -1,12 +1,12 @@ --- title: '`createOrganizationInvitationBulk()`' -description: Use Clerk's JS Backend SDK to create multiple invitations for new users to join an organization. +description: Use Clerk's JS Backend SDK to create multiple invitations for new users to join an Organization. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L292-L303 */} -Creates multiple [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation)s in bulk for new users to join an organization. +Creates multiple [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation)s in bulk for new users to join an Organization. ```ts function createOrganizationInvitationBulk( @@ -23,7 +23,7 @@ function createOrganizationInvitationBulk( - `organizationId` - `string` - The organization ID of the organization you want to invite users to. + The Organization ID of the Organization you want to invite users to. --- @@ -53,14 +53,14 @@ function createOrganizationInvitationBulk( - `role` - [`OrganizationCustomRoleKey`](/docs/reference/javascript/types/organization-custom-role-key) - The [role](/docs/guides/organizations/roles-and-permissions) to assign the invited user within the organization. + The [Role](/docs/guides/organizations/roles-and-permissions) to assign the invited user within the Organization. --- - `redirectUrl?` - `string` - The full URL or path where users will land once the organization invitation has been accepted. + The full URL or path where users will land once the Organization invitation has been accepted. --- diff --git a/docs/reference/backend/organization/create-organization-invitation.mdx b/docs/reference/backend/organization/create-organization-invitation.mdx index 74c0cb4551..0bd7a84d40 100644 --- a/docs/reference/backend/organization/create-organization-invitation.mdx +++ b/docs/reference/backend/organization/create-organization-invitation.mdx @@ -1,12 +1,12 @@ --- title: '`createOrganizationInvitation()`' -description: Use Clerk's JS Backend SDK to create an invitation for new users to join an organization. +description: Use Clerk's JS Backend SDK to create an invitation for new users to join an Organization. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L248 */} -Creates an [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) for new users to join an organization. +Creates an [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) for new users to join an Organization. ```ts function createOrganizationInvitation( @@ -20,7 +20,7 @@ function createOrganizationInvitation( - `organizationId` - `string` - The organization ID of the organization a user is being invited to. + The Organization ID of the Organization a user is being invited to. --- @@ -41,14 +41,14 @@ function createOrganizationInvitation( - `role` - `string` - The [role](/docs/guides/organizations/roles-and-permissions) to assign the invited user within the organization. + The [Role](/docs/guides/organizations/roles-and-permissions) to assign the invited user within the Organization. --- - `redirectUrl?` - `string` - The full URL or path where users will land once the organization invitation has been accepted. + The full URL or path where users will land once the Organization invitation has been accepted. --- diff --git a/docs/reference/backend/organization/create-organization-membership.mdx b/docs/reference/backend/organization/create-organization-membership.mdx index ba9e5f9ba3..fa09c0a151 100644 --- a/docs/reference/backend/organization/create-organization-membership.mdx +++ b/docs/reference/backend/organization/create-organization-membership.mdx @@ -1,12 +1,12 @@ --- title: '`createOrganizationMembership()`' -description: Use Clerk's JS Backend SDK to create a membership to an organization for a user directly (circumventing the need for an invitation). +description: Use Clerk's JS Backend SDK to create a membership to an Organization for a user directly (circumventing the need for an invitation). sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L187 */} -Creates a membership to an organization for a user directly (circumventing the need for an invitation). Returns a [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object. +Creates a membership to an Organization for a user directly (circumventing the need for an invitation). Returns a [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object. ```ts function createOrganizationMembership( @@ -20,28 +20,28 @@ function createOrganizationMembership( - `organizationId` - `string` - The ID of the organization the user is being added to. + The ID of the Organization the user is being added to. --- - `userId` - `string` - The ID of the user to be added to the organization. + The ID of the user to be added to the Organization. --- - `role` - `string` - The [role](/docs/guides/organizations/roles-and-permissions) to assign the added user within the organization. + The [Role](/docs/guides/organizations/roles-and-permissions) to assign the added user within the Organization. ## Example -In the following example, an [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) is created for a user with the role `org:member`. +In the following example, an [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) is created for a user with the Role `org:member`. ```tsx const organizationId = 'org_123' diff --git a/docs/reference/backend/organization/create-organization.mdx b/docs/reference/backend/organization/create-organization.mdx index 6072be0bb8..0ad6e9882e 100644 --- a/docs/reference/backend/organization/create-organization.mdx +++ b/docs/reference/backend/organization/create-organization.mdx @@ -1,6 +1,6 @@ --- title: '`createOrganization()`' -description: Use Clerk's JS Backend SDK to create an organization. +description: Use Clerk's JS Backend SDK to create an Organization. sdk: js-backend --- @@ -18,21 +18,21 @@ function createOrganization(params: CreateParams): Promise - `name` - `string` - Name of the organization. + Name of the Organization. --- - `createdBy` - `string` - The user ID for the user creating the organization. The user will become an administrator for the organization. + The user ID for the user creating the Organization. The user will become an administrator for the Organization. --- - `slug?` - `string` - Slug of the organization. + Slug of the Organization. --- @@ -53,7 +53,7 @@ function createOrganization(params: CreateParams): Promise - `maxAllowedMemberships?` - `number` - The maximum number of memberships allowed in the organization. Setting this value to `0` removes any limit, allowing an unlimited number of memberships. + The maximum number of memberships allowed in the Organization. Setting this value to `0` removes any limit, allowing an unlimited number of memberships. ## Example diff --git a/docs/reference/backend/organization/delete-organization-logo.mdx b/docs/reference/backend/organization/delete-organization-logo.mdx index 5e4c36089f..4a08a69f60 100644 --- a/docs/reference/backend/organization/delete-organization-logo.mdx +++ b/docs/reference/backend/organization/delete-organization-logo.mdx @@ -1,10 +1,10 @@ --- title: '`deleteOrganizationLogo()`' -description: Use Clerk's JS Backend SDK to delete an organization's logo. +description: Use Clerk's JS Backend SDK to delete an Organization's logo. sdk: js-backend --- -Deletes an organization's logo. +Deletes an Organization's logo. ```ts function deleteOrganizationLogo(organizationId: string): Promise @@ -16,7 +16,7 @@ function deleteOrganizationLogo(organizationId: string): Promise - `organizationId` - `string` - The ID of the organization for which the logo will be deleted. + The ID of the Organization for which the logo will be deleted. ## Example diff --git a/docs/reference/backend/organization/delete-organization-membership.mdx b/docs/reference/backend/organization/delete-organization-membership.mdx index 279a15bbe8..bd544999ec 100644 --- a/docs/reference/backend/organization/delete-organization-membership.mdx +++ b/docs/reference/backend/organization/delete-organization-membership.mdx @@ -1,12 +1,12 @@ --- title: '`deleteOrganizationMembership()`' -description: Use Clerk's JS Backend SDK to remove a user from the specified organization. +description: Use Clerk's JS Backend SDK to remove a user from the specified Organization. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L227 */} -Removes a user from the specified organization. Returns a [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object. +Removes a user from the specified Organization. Returns a [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object. ```ts function deleteOrganizationMembership( @@ -20,14 +20,14 @@ function deleteOrganizationMembership( - `organizationId` - `string` - The ID of the organization the user will be removed from. + The ID of the Organization the user will be removed from. --- - `userId` - `string` - The ID of the user to be removed from the organization. + The ID of the user to be removed from the Organization. ## Example diff --git a/docs/reference/backend/organization/delete-organization.mdx b/docs/reference/backend/organization/delete-organization.mdx index 44ab04aea2..d9a65b2c3c 100644 --- a/docs/reference/backend/organization/delete-organization.mdx +++ b/docs/reference/backend/organization/delete-organization.mdx @@ -1,6 +1,6 @@ --- title: '`deleteOrganization()`' -description: Use Clerk's JS Backend SDK to delete an organization. +description: Use Clerk's JS Backend SDK to delete an Organization. sdk: js-backend --- @@ -18,7 +18,7 @@ function deleteOrganization(organizationId: string): Promise ## Example diff --git a/docs/reference/backend/organization/get-organization-invitation-list.mdx b/docs/reference/backend/organization/get-organization-invitation-list.mdx index 2d167fc2b6..ce022fac77 100644 --- a/docs/reference/backend/organization/get-organization-invitation-list.mdx +++ b/docs/reference/backend/organization/get-organization-invitation-list.mdx @@ -1,12 +1,12 @@ --- title: '`getOrganizationInvitationList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of organization invitations. +description: Use Clerk's JS Backend SDK to retrieve a list of Organization invitations. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L237 */} -Retrieves a list of organization invitations. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) objects, and a `totalCount` property that indicates the total number of organization invitations in the system for the specified organization. +Retrieves a list of Organization invitations. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) objects, and a `totalCount` property that indicates the total number of Organization invitations in the system for the specified Organization. ```ts function getOrganizationInvitationList( @@ -20,7 +20,7 @@ function getOrganizationInvitationList( - `organizationId` - `string` - The ID of the organization to retrieve the list of pending invitations from. + The ID of the Organization to retrieve the list of pending invitations from. --- @@ -58,7 +58,7 @@ const response = await clerkClient.organizations.getOrganizationInvitationList({ ### Filter by invitation status -Retrieves organization invitation list that is filtered by the status of the invitation. +Retrieves Organization invitation list that is filtered by the status of the invitation. ```tsx const organizationId = 'org_123' @@ -72,7 +72,7 @@ const { data, totalCount } = await clerkClient.organizations.getOrganizationInvi ### Limit the number of results -Retrieves organization invitation list that is filtered by the number of results. +Retrieves Organization invitation list that is filtered by the number of results. ```tsx const organizationId = 'org_123' @@ -86,7 +86,7 @@ const { data, totalCount } = await clerkClient.organizations.getOrganizationInvi ### Skip results -Retrieves organization invitation list that is filtered by the number of results to skip. +Retrieves Organization invitation list that is filtered by the number of results to skip. ```tsx const organizationId = 'org_123' diff --git a/docs/reference/backend/organization/get-organization-invitation.mdx b/docs/reference/backend/organization/get-organization-invitation.mdx index 0f20b1aa12..4f8394f06b 100644 --- a/docs/reference/backend/organization/get-organization-invitation.mdx +++ b/docs/reference/backend/organization/get-organization-invitation.mdx @@ -1,6 +1,6 @@ --- title: '`getOrganizationInvitation()`' -description: Use Clerk's JS Backend SDK to retrieve an organization invitation. +description: Use Clerk's JS Backend SDK to retrieve an Organization invitation. sdk: js-backend --- @@ -20,7 +20,7 @@ function getOrganizationInvitation( - `organizationId` - `string` - The ID of the organization that the invitation is for. + The ID of the Organization that the invitation is for. --- diff --git a/docs/reference/backend/organization/get-organization-list.mdx b/docs/reference/backend/organization/get-organization-list.mdx index 801824a2ab..07a6ed14c6 100644 --- a/docs/reference/backend/organization/get-organization-list.mdx +++ b/docs/reference/backend/organization/get-organization-list.mdx @@ -1,12 +1,12 @@ --- title: '`getOrganizationList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of organizations. +description: Use Clerk's JS Backend SDK to retrieve a list of Organizations. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L101 */} -Retrieves a list of organizations. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`Organization`](/docs/reference/backend/types/backend-organization) objects, and a `totalCount` property that indicates the total number of organizations in the system. +Retrieves a list of Organizations. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`Organization`](/docs/reference/backend/types/backend-organization) objects, and a `totalCount` property that indicates the total number of Organizations in the system. ```ts function getOrganizationList( @@ -34,21 +34,21 @@ function getOrganizationList( - `includeMembersCount?` - `boolean` - Whether the member counts of each organization should be included in the response or not. + Whether the member counts of each Organization should be included in the response or not. --- - `query?` - `string` - Filters organizations with ID, name, or slug that match the given query. Uses exact match for organization ID and partial match for name and slug. + Filters Organizations with ID, name, or slug that match the given query. Uses exact match for Organization ID and partial match for name and slug. --- - `orderBy?` - `'name' | 'created_at' | 'members_count'` - Return organizations in a particular order. Prefix with a `-` to reverse the order. Prefix with a `+` to list in ascending order. Defaults to `'-created_at'`. + Return Organizations in a particular order. Prefix with a `-` to reverse the order. Prefix with a `+` to list in ascending order. Defaults to `'-created_at'`. ## Examples @@ -63,7 +63,7 @@ const response = await clerkClient.organizations.getOrganizationList() ### Limit the number of results -Retrieves organization list that is filtered by the number of results. +Retrieves Organization list that is filtered by the number of results. ```tsx const { data, totalCount } = await clerkClient.organizations.getOrganizationList({ @@ -74,7 +74,7 @@ const { data, totalCount } = await clerkClient.organizations.getOrganizationList ### Skip results -Retrieves organization list that is filtered by the number of results to skip. +Retrieves Organization list that is filtered by the number of results to skip. ```tsx const { data, totalCount } = await clerkClient.organizations.getOrganizationList({ @@ -85,7 +85,7 @@ const { data, totalCount } = await clerkClient.organizations.getOrganizationList ### Filter by query -Retrieves list of organizations that match the query. +Retrieves list of Organizations that match the query. ```tsx // returns organizations that have 'test' in their name diff --git a/docs/reference/backend/organization/get-organization-membership-list.mdx b/docs/reference/backend/organization/get-organization-membership-list.mdx index fd371f7c1b..bf5d896d96 100644 --- a/docs/reference/backend/organization/get-organization-membership-list.mdx +++ b/docs/reference/backend/organization/get-organization-membership-list.mdx @@ -1,12 +1,12 @@ --- title: '`getOrganizationMembershipList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of memberships for an organization. +description: Use Clerk's JS Backend SDK to retrieve a list of memberships for an Organization. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L176 */} -Retrieves a list of memberships for an organization. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) objects, and a `totalCount` property that indicates the total number of organization memberships in the system for the specified organization. +Retrieves a list of memberships for an Organization. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) objects, and a `totalCount` property that indicates the total number of organization memberships in the system for the specified Organization. ```ts function getOrganizationMembershipList( @@ -90,7 +90,7 @@ function getOrganizationMembershipList( - `organizationId` - `string` - The ID of the organization to retrieve the list of memberships from. + The ID of the Organization to retrieve the list of memberships from. --- @@ -118,7 +118,7 @@ function getOrganizationMembershipList( - `role?` - `string[]` - Filters memberships for the roles specified. Accepts up to 100 roles. Any roles not found are ignored. + Filters memberships for the Roles specified. Accepts up to 100 Roles. Any Roles not found are ignored. --- @@ -163,7 +163,7 @@ const response = await clerkClient.organizations.getOrganizationMembershipList({ ### `getOrganizationMembershipList({ organizationId, limit })` -Retrieves organization membership list that is filtered by the number of results. +Retrieves Organization membership list that is filtered by the number of results. ```tsx const organizationId = 'org_123' @@ -177,7 +177,7 @@ const { data, totalCount } = await clerkClient.organizations.getOrganizationMemb ### `getOrganizationMembershipList({ organizationId, offset })` -Retrieves organization membership list that is filtered by the number of results to skip. +Retrieves Organization membership list that is filtered by the number of results to skip. ```tsx const organizationId = 'org_123' diff --git a/docs/reference/backend/organization/get-organization.mdx b/docs/reference/backend/organization/get-organization.mdx index ee025001fd..45a225f216 100644 --- a/docs/reference/backend/organization/get-organization.mdx +++ b/docs/reference/backend/organization/get-organization.mdx @@ -1,6 +1,6 @@ --- title: '`getOrganization()`' -description: Use Clerk's JS Backend SDK to retrieve a single organization. +description: Use Clerk's JS Backend SDK to retrieve a single Organization. sdk: js-backend --- @@ -18,7 +18,7 @@ function getOrganization(params: GetOrganizationParams): Promise - `organizationId | slug` - `string` - The ID of the organization to retrieve, or the slug of the organization to retrieve. + The ID of the Organization to retrieve, or the slug of the Organization to retrieve. ## Examples @@ -35,7 +35,7 @@ const response = await clerkClient.organizations.getOrganization({ organizationI ### Retrieve by slug -Retrieve an organization by its slug instead of its ID. +Retrieve an Organization by its slug instead of its ID. ```tsx const slug = 'my-organization-slug' diff --git a/docs/reference/backend/organization/revoke-organization-invitation.mdx b/docs/reference/backend/organization/revoke-organization-invitation.mdx index 5368b5111d..4ee66c6f68 100644 --- a/docs/reference/backend/organization/revoke-organization-invitation.mdx +++ b/docs/reference/backend/organization/revoke-organization-invitation.mdx @@ -1,12 +1,12 @@ --- title: '`revokeOrganizationInvitation()`' -description: Use Clerk's JS Backend SDK to revoke an organization invitation from a user for a specified organization. +description: Use Clerk's JS Backend SDK to revoke an Organization invitation from a user for a specified Organization. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L270 */} -Revokes an [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) from a user for the specified organization. +Revokes an [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) from a user for the specified Organization. ```ts function revokeOrganizationInvitation( @@ -20,7 +20,7 @@ function revokeOrganizationInvitation( - `organizationId` - `string` - The ID of the organization the user was invited to. + The ID of the Organization the user was invited to. --- @@ -34,7 +34,7 @@ function revokeOrganizationInvitation( - `requestingUserId` - `string` - The ID of the user revoking the organization invitation. + The ID of the user revoking the Organization invitation. ## Example diff --git a/docs/reference/backend/organization/update-organization-logo.mdx b/docs/reference/backend/organization/update-organization-logo.mdx index b9676931bc..a681a8fc6b 100644 --- a/docs/reference/backend/organization/update-organization-logo.mdx +++ b/docs/reference/backend/organization/update-organization-logo.mdx @@ -1,12 +1,12 @@ --- title: '`updateOrganizationLogo()`' -description: Use Clerk's JS Backend SDK to update an organization's logo. +description: Use Clerk's JS Backend SDK to update an Organization's logo. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/OrganizationApi.ts#L136 */} -Updates the organization's logo. Returns an [`Organization`](/docs/reference/backend/types/backend-organization) object. +Updates the Organization's logo. Returns an [`Organization`](/docs/reference/backend/types/backend-organization) object. ```ts function updateOrganizationLogo( @@ -21,7 +21,7 @@ function updateOrganizationLogo( - `file` - `Blob | File` - The file to upload as the organization's logo. + The file to upload as the Organization's logo. --- @@ -36,7 +36,7 @@ function updateOrganizationLogo( > [!WARNING] -> Using JS Backend SDK methods can contribute towards rate limiting. To set an organization's logo, it's recommended to use the frontend [`organization.setLogo()`](/docs/reference/javascript/organization#set-logo) method instead. +> Using JS Backend SDK methods can contribute towards rate limiting. To set an Organization's logo, it's recommended to use the frontend [`organization.setLogo()`](/docs/reference/javascript/organization#set-logo) method instead. ```tsx const organizationId = 'org_123' diff --git a/docs/reference/backend/organization/update-organization-membership-metadata.mdx b/docs/reference/backend/organization/update-organization-membership-metadata.mdx index 0adaa4407a..54788ec1a8 100644 --- a/docs/reference/backend/organization/update-organization-membership-metadata.mdx +++ b/docs/reference/backend/organization/update-organization-membership-metadata.mdx @@ -1,6 +1,6 @@ --- title: '`updateOrganizationMembershipMetadata()`' -description: Use Clerk's JS Backend SDK to update the metadata associated with a user's organization membership. +description: Use Clerk's JS Backend SDK to update the metadata associated with a user's Organization membership. sdk: js-backend --- @@ -20,7 +20,7 @@ function updateOrganizationMembershipMetadata( - `organizationId` - `string` - The ID of the organization this membership belongs to. + The ID of the Organization this membership belongs to. --- diff --git a/docs/reference/backend/organization/update-organization-membership.mdx b/docs/reference/backend/organization/update-organization-membership.mdx index 8cd8b478a5..98b00e7dd9 100644 --- a/docs/reference/backend/organization/update-organization-membership.mdx +++ b/docs/reference/backend/organization/update-organization-membership.mdx @@ -1,6 +1,6 @@ --- title: '`updateOrganizationMembership()`' -description: Use Clerk's JS Backend SDK to update a user's organization membership. +description: Use Clerk's JS Backend SDK to update a user's Organization membership. sdk: js-backend --- @@ -20,7 +20,7 @@ function updateOrganizationMembership( - `organizationId` - `string` - The ID of the organization this membership belongs to. + The ID of the Organization this membership belongs to. --- @@ -34,7 +34,7 @@ function updateOrganizationMembership( - `role` - `string` - The [role](/docs/guides/organizations/roles-and-permissions) to assign user. + The [Role](/docs/guides/organizations/roles-and-permissions) to assign the user. ## Example diff --git a/docs/reference/backend/organization/update-organization-metadata.mdx b/docs/reference/backend/organization/update-organization-metadata.mdx index a789440dfb..ef8758fa5a 100644 --- a/docs/reference/backend/organization/update-organization-metadata.mdx +++ b/docs/reference/backend/organization/update-organization-metadata.mdx @@ -1,6 +1,6 @@ --- title: '`updateOrganizationMetadata()`' -description: Use Clerk's JS Backend SDK to update the metadata associated with a given organization. +description: Use Clerk's JS Backend SDK to update the metadata associated with a given Organization. sdk: js-backend --- @@ -21,7 +21,7 @@ function updateOrganizationMetadata( - `organizationId` - `string` - The ID of the organization to update. + The ID of the Organization to update. --- diff --git a/docs/reference/backend/organization/update-organization.mdx b/docs/reference/backend/organization/update-organization.mdx index fe630da799..1274c65558 100644 --- a/docs/reference/backend/organization/update-organization.mdx +++ b/docs/reference/backend/organization/update-organization.mdx @@ -1,6 +1,6 @@ --- title: '`updateOrganization()`' -description: Use Clerk's JS Backend SDK to update an organization's name. +description: Use Clerk's JS Backend SDK to update an Organization's name. sdk: js-backend --- @@ -16,21 +16,21 @@ function updateOrganization(params: UpdateOrganizationParams): Promise ## Example diff --git a/docs/reference/backend/overview.mdx b/docs/reference/backend/overview.mdx index 9fa6c35911..31f2637258 100644 --- a/docs/reference/backend/overview.mdx +++ b/docs/reference/backend/overview.mdx @@ -20,20 +20,20 @@ The **User** resource provides operations for creating, retrieving, and managing ### Organizations -The **Organization** resource provides operations for creating, retrieving, and managing organizations within your application. Most operations return, or work directly with, the following Backend objects: +The **Organization** resource provides operations for creating, retrieving, and managing Organizations within your application. Most operations return, or work directly with, the following Backend objects: -- [`Organization`](/docs/reference/backend/types/backend-organization) object holds information about an organization. -- [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) object is the model around an organization invitation. -- [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object is the model around an organization membership entity and describes the relationship between users and organizations. +- [`Organization`](/docs/reference/backend/types/backend-organization) object holds information about an Organization. +- [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) object is the model around an Organization invitation. +- [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) object is the model around an Organization membership entity and describes the relationship between users and Organizations. ### Billing -The **Billing** resource provides operations for creating and managing subscriptions plans and features within your application. Most operations return, or work directly with, the following Backend objects: +The **Billing** resource provides operations for creating and managing Subscription Plans and Features within your application. Most operations return, or work directly with, the following Backend objects: -- [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription) object holds information about a subscription, as well as methods for managing it. -- [`CommerceSubscriptionItem`](/docs/reference/backend/types/commerce-subscription-item) object holds information about a subscription item, as well as methods for managing it. -- [`CommercePlan`](/docs/reference/backend/types/commerce-plan) object holds information about a plan, as well as methods for managing it. -- [`Feature`](/docs/reference/backend/types/feature) object represents a feature of a subscription plan. +- [`CommerceSubscription`](/docs/reference/backend/types/commerce-subscription) object holds information about a Subscription, as well as methods for managing it. +- [`CommerceSubscriptionItem`](/docs/reference/backend/types/commerce-subscription-item) object holds information about a Subscription Item, as well as methods for managing it. +- [`CommercePlan`](/docs/reference/backend/types/commerce-plan) object holds information about a Plan, as well as methods for managing it. +- [`Feature`](/docs/reference/backend/types/feature) object represents a Feature of a Subscription Plan. ### Allowlist identifiers @@ -69,7 +69,7 @@ The **Phone Number** resource allows you to manage phone numbers associated with ### SAML connections -The **SAML Connection** resource allows you to manage SAML connections associated with your organizations. A SAML Connection holds configuration data required for facilitating a SAML SSO flow between your Clerk Instance (SP) and a particular SAML IdP. Most operations return, or work directly with, the Backend [`SamlConnection`](/docs/reference/backend/types/backend-saml-connection) object, which holds information about a SAML connection for an organization. +The **SAML Connection** resource allows you to manage SAML connections associated with your Organizations. A SAML Connection holds configuration data required for facilitating a SAML SSO flow between your Clerk Instance (SP) and a particular SAML IdP. Most operations return, or work directly with, the Backend [`SamlConnection`](/docs/reference/backend/types/backend-saml-connection) object, which holds information about a SAML connection for an Organization. ### Sign-in tokens diff --git a/docs/reference/backend/saml-connections/create-saml-connection.mdx b/docs/reference/backend/saml-connections/create-saml-connection.mdx index cfa77eb2d4..0371ca9e7a 100644 --- a/docs/reference/backend/saml-connections/create-saml-connection.mdx +++ b/docs/reference/backend/saml-connections/create-saml-connection.mdx @@ -30,14 +30,14 @@ function createSamlConnection(params: CreateSamlConnectionParams): Promise [!NOTE] > The structure of the `Auth` object varies depending on the type of request. @@ -50,35 +50,35 @@ The `Auth` object contains important information like the current user's session - [`has()`](#has) - (isAuthorizedParams: [CheckAuthorizationParamsWithCustomPermissions](#check-authorization-params-with-custom-permissions)) => boolean - A function that checks if the user has an organization role or custom permission. + A function that checks if the user has an Organization Role or custom Permission. --- - `orgId` - `string | undefined` - The ID of the user's [active organization](!active-organization). + The ID of the user's [Active Organization](!active-organization). --- - `orgPermissions` - [OrganizationCustomPermissionKey](/docs/reference/javascript/types/organization-custom-permission-key)\[] | undefined - The current user's [active organization](!active-organization) permissions. + The current user's [Active Organization](!active-organization) permissions. --- - `orgRole` - [OrganizationCustomRoleKey](/docs/reference/javascript/types/organization-custom-role-key) | undefined - The current user's role in their [active organization](!active-organization). + The current user's Role in their [Active Organization](!active-organization). --- - `orgSlug` - `string | undefined` - The URL-friendly identifier of the user's [active organization](!active-organization). + The URL-friendly identifier of the user's [Active Organization](!active-organization). --- @@ -120,7 +120,7 @@ The `Auth` object contains important information like the current user's session The `has()` helper can be used to do two types of checks: -- **Authorization:** Check if the user has been granted a specific type of access control (role, permission, feature, or plan) and returns a boolean value. For examples, see the [guide on verifying if a user is authorized](/docs/guides/secure/authorization-checks). +- **Authorization:** Check if the user has been granted a specific type of access control (Role, Permission, Feature, or Plan) and returns a boolean value. For examples, see the [guide on verifying if a user is authorized](/docs/guides/secure/authorization-checks). - **Reverification:** Check if the user has verified their credentials within a certain time frame and returns a boolean value. For examples, see the [guide on reverification](/docs/guides/secure/reverification). ```ts @@ -135,28 +135,28 @@ function has(isAuthorizedParams: CheckAuthorizationParamsWithCustomPermissions): - `role` - `string` - The [role](/docs/guides/organizations/roles-and-permissions) to check for. + The [Role](/docs/guides/organizations/roles-and-permissions) to check for. --- - `permission` - `string` - The [permission](/docs/guides/organizations/roles-and-permissions) to check for. + The [Permission](/docs/guides/organizations/roles-and-permissions) to check for. --- - `feature` - `string` - The [feature](/docs/guides/billing/overview) to check for. + The [Feature](/docs/guides/billing/overview) to check for. --- - `plan` - `string` - The [plan](/docs/guides/billing/overview) to check for. + The [Plan](/docs/guides/billing/overview) to check for. --- @@ -347,9 +347,9 @@ The `Auth` object is not available in the frontend. To use the `getToken()` meth -## `Auth` object example without active organization +## `Auth` object example without Active Organization -The following is an example of the `Auth` object without an [active organization](!active-organization). Notice that there is no `o` claim. Read more about token claims in the [guide on session tokens](/docs/guides/sessions/session-tokens). +The following is an example of the `Auth` object without an [Active Organization](!active-organization). Notice that there is no `o` claim. Read more about token claims in the [guide on session tokens](/docs/guides/sessions/session-tokens). @@ -403,9 +403,9 @@ The following is an example of the `Auth` object without an [active organization -## `Auth` object example with active organization +## `Auth` object example with Active Organization -The following is an example of the `Auth` object with an [active organization](!active-organization). Notice the addition of the `o` claim. Read more about token claims in the [guide on session tokens](/docs/guides/sessions/session-tokens). +The following is an example of the `Auth` object with an [Active Organization](!active-organization). Notice the addition of the `o` claim. Read more about token claims in the [guide on session tokens](/docs/guides/sessions/session-tokens). @@ -450,7 +450,7 @@ The following is an example of the `Auth` object with an [active organization](! orgId: 'org_123', orgRole: 'org:admin', orgSlug: undefined, - orgPermissions: ['org:example-feature:example-perm'], // Custom permissions + orgPermissions: ['org:example-feature:example-perm'], // Custom Permissions has: [Function (anonymous)], getToken: [AsyncFunction (anonymous)], claims: { @@ -592,7 +592,7 @@ The following is an example of the `Auth` object of a user without an MFA method - `subject` - `string` - The ID of the user or organization that the machine is associated with. + The ID of the user or Organization that the machine is associated with. --- @@ -641,7 +641,7 @@ The following is an example of the `Auth` object of a user without an MFA method The following is an example of the `Auth` object of an authenticated machine request (i.e. a request authenticated using a machine token like an API key). -Notice the addition of a `tokenType` property with the value of 'api\_key', which distinguishes the request as a machine request rather than a user session. The `scopes` array defines the permissions granted by the token. +Notice the addition of a `tokenType` property with the value of `'api_key'`, which distinguishes the request as a machine request rather than a user session. The `scopes` array defines the permissions granted by the token. ```js {{ prettier: false }} { diff --git a/docs/reference/backend/types/backend-organization-invitation.mdx b/docs/reference/backend/types/backend-organization-invitation.mdx index 8c48d0d86d..34d9044cd0 100644 --- a/docs/reference/backend/types/backend-organization-invitation.mdx +++ b/docs/reference/backend/types/backend-organization-invitation.mdx @@ -1,6 +1,6 @@ --- title: The Backend `OrganizationInvitation` object -description: The Backend OrganizationInvitation object is the model around an organization invitation. +description: The Backend OrganizationInvitation object is the model around an Organization invitation. sdk: js-backend --- diff --git a/docs/reference/backend/types/backend-organization-membership.mdx b/docs/reference/backend/types/backend-organization-membership.mdx index 7e217cbe1b..55e5acfbfb 100644 --- a/docs/reference/backend/types/backend-organization-membership.mdx +++ b/docs/reference/backend/types/backend-organization-membership.mdx @@ -1,6 +1,6 @@ --- title: The Backend `OrganizationMembership` object -description: The Backend OrganizationMembership object is the model around an organization membership entity and describes the relationship between users and organizations. +description: The Backend OrganizationMembership object is the model around an Organization membership entity and describes the relationship between users and Organizations. sdk: js-backend --- diff --git a/docs/reference/backend/types/backend-organization.mdx b/docs/reference/backend/types/backend-organization.mdx index 067d315684..304e98842a 100644 --- a/docs/reference/backend/types/backend-organization.mdx +++ b/docs/reference/backend/types/backend-organization.mdx @@ -1,6 +1,6 @@ --- title: The Backend `Organization` object -description: The Backend Organization object holds information about an organization, as well as methods for managing it. However, the it is different from the Organization object in that it is used in the Backend API and is not directly accessible from the Frontend API. +description: The Backend Organization object holds information about an Organization, as well as methods for managing it. However, the it is different from the Organization object in that it is used in the Backend API and is not directly accessible from the Frontend API. sdk: js-backend --- diff --git a/docs/reference/backend/types/backend-saml-connection.mdx b/docs/reference/backend/types/backend-saml-connection.mdx index c5094ec5df..7b7deac826 100644 --- a/docs/reference/backend/types/backend-saml-connection.mdx +++ b/docs/reference/backend/types/backend-saml-connection.mdx @@ -1,6 +1,6 @@ --- title: The Backend `SamlConnection` object -description: The Backend SamlConnection object holds information about a SAML connection for an organization. +description: The Backend SamlConnection object holds information about a SAML connection for an Organization. sdk: js-backend --- diff --git a/docs/reference/backend/types/commerce-plan.mdx b/docs/reference/backend/types/commerce-plan.mdx index 4125c85bc6..0c6a66f2cb 100644 --- a/docs/reference/backend/types/commerce-plan.mdx +++ b/docs/reference/backend/types/commerce-plan.mdx @@ -1,12 +1,12 @@ --- title: '`CommercePlan`' -description: The Backend `CommercePlan` object holds information about a plan of your application. +description: The Backend `CommercePlan` object holds information about a Plan of your application. sdk: js-backend --- -The `CommercePlan` object is similar to the [`BillingPlanResource`](/docs/reference/javascript/types/billing-plan-resource) object as it holds information about a plan, as well as methods for managing it. However, the `CommercePlan` object is different in that it is used in the [Backend API](https://clerk.com/docs/reference/backend-api/model/commerceplan){{ target: '_blank' }} and is not directly accessible from the Frontend API. +The `CommercePlan` object is similar to the [`BillingPlanResource`](/docs/reference/javascript/types/billing-plan-resource) object as it holds information about a Plan, as well as methods for managing it. However, the `CommercePlan` object is different in that it is used in the [Backend API](https://clerk.com/docs/reference/backend-api/model/commerceplan){{ target: '_blank' }} and is not directly accessible from the Frontend API. ## Properties @@ -14,96 +14,96 @@ The `CommercePlan` object is similar to the [`BillingPlanResource`](/docs/refere - `id` - `string` - The unique identifier for the plan. + The unique identifier for the Plan. --- - `productId` - `string` - The ID of the product the plan belongs to. + The ID of the product the Plan belongs to. --- - `name` - `string` - The name of the plan. + The name of the Plan. --- - `slug` - `string` - The URL-friendly identifier of the plan. + The URL-friendly identifier of the Plan. --- - `description` - `undefined | string` - The description of the plan. + The description of the Plan. --- - `isDefault` - `boolean` - Whether the plan is the default plan. + Whether the Plan is the default Plan. --- - `isRecurring` - `boolean` - Whether the plan is recurring. + Whether the Plan is recurring. --- - `hasBaseFee` - `boolean` - Whether the plan has a base fee. + Whether the Plan has a base fee. --- - `publiclyVisible` - `boolean` - Whether the plan is displayed in the `` component. + Whether the Plan is displayed in the `` component. --- - `fee` - [BillingMoneyAmount](/docs/reference/javascript/types/billing-money-amount) - The monthly fee of the plan. + The monthly fee of the Plan. --- - `annualFee` - [BillingMoneyAmount](/docs/reference/javascript/types/billing-money-amount) - The annual fee of the plan. + The annual fee of the Plan. --- - `annualMonthlyFee` - [BillingMoneyAmount](/docs/reference/javascript/types/billing-money-amount) - The annual fee of the plan on a monthly basis. + The annual fee of the Plan on a monthly basis. --- - `forPayerType` - `'user' | 'org'` - The type of payer for the plan. + The type of payer for the Plan. --- - `features` - [`Feature[]`](/docs/reference/backend/types/feature) - The features the plan offers. + The Features the Plan offers. diff --git a/docs/reference/backend/types/commerce-subscription-item.mdx b/docs/reference/backend/types/commerce-subscription-item.mdx index 32e693c713..0574d68d57 100644 --- a/docs/reference/backend/types/commerce-subscription-item.mdx +++ b/docs/reference/backend/types/commerce-subscription-item.mdx @@ -28,7 +28,7 @@ The `CommerceSubscriptionItem` object is similar to the [`BillingSubscriptionIte - `planPeriod` - `'month' | 'annual'` - The plan period for the subscription item. + The Plan period for the subscription item. --- @@ -63,14 +63,14 @@ The `CommerceSubscriptionItem` object is similar to the [`BillingSubscriptionIte - `plan` - [CommercePlan](/docs/reference/backend/types/commerce-plan) - The plan associated with this subscription item. + The Plan associated with this subscription item. --- - `planId` - `string` - The plan ID. + The Plan ID. --- diff --git a/docs/reference/backend/types/feature.mdx b/docs/reference/backend/types/feature.mdx index cae55a13b0..b2b2e1e47d 100644 --- a/docs/reference/backend/types/feature.mdx +++ b/docs/reference/backend/types/feature.mdx @@ -1,44 +1,44 @@ --- title: '`Feature`' -description: 'The Feature type represents a feature that a plan can offer.' +description: 'The Feature type represents a Feature that a Plan can offer.' sdk: js-backend --- -The `Feature` object represents a feature of a subscription plan. +The `Feature` object represents a Feature of a subscription Plan. - `id` - `string` - The unique identifier for the feature. + The unique identifier for the Feature. --- - `name` - `string` - The name of the feature. + The name of the Feature. --- - `description` - `string` - The description of the feature. + The description of the Feature. --- - `slug` - `string` - The URL-friendly identifier of the feature. + The URL-friendly identifier of the Feature. --- - `avatarUrl` - `string` - The URL of the feature's avatar image. + The URL of the Feature's avatar image. diff --git a/docs/reference/backend/user/get-organization-invitation-list.mdx b/docs/reference/backend/user/get-organization-invitation-list.mdx index 9ef8d58df2..6bdd711ebe 100644 --- a/docs/reference/backend/user/get-organization-invitation-list.mdx +++ b/docs/reference/backend/user/get-organization-invitation-list.mdx @@ -1,12 +1,12 @@ --- title: '`getOrganizationInvitationList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of organization invitations for a given user. +description: Use Clerk's JS Backend SDK to retrieve a list of Organization invitations for a given user. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/UserApi.ts#L330 */} -Retrieves a list of organization invitations for a given user. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) objects, and a `totalCount` property that indicates the total number of organization invitations in the system for the specified organization. +Retrieves a list of Organization invitations for a given user. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationInvitation`](/docs/reference/backend/types/backend-organization-invitation) objects, and a `totalCount` property that indicates the total number of Organization invitations in the system for the specified Organization. ```ts function getOrganizationInvitationList( @@ -20,7 +20,7 @@ function getOrganizationInvitationList( - `userId` - `string` - The ID of the user to retrieve the list of organizations invitations for. + The ID of the user to retrieve the list of Organization invitations for. --- @@ -58,7 +58,7 @@ const response = await clerkClient.users.getOrganizationInvitationList({ userId ### Filter by invitation status -Retrieves a list of a user's organization invitations that is filtered by the status of the invitation. +Retrieves a list of a user's Organization invitations that is filtered by the status of the invitation. ```tsx const userId = 'user_123' @@ -72,7 +72,7 @@ const { data, totalCount } = await clerkClient.users.getOrganizationInvitationLi ### Limit the number of results -Retrieves a list of a user's organization invitations that is filtered by the number of results. +Retrieves a list of a user's Organization invitations that is filtered by the number of results. ```tsx const userId = 'user_123' @@ -86,7 +86,7 @@ const { data, totalCount } = await clerkClient.users.getOrganizationInvitationLi ### Skip results -Retrieves a list of a user's organization invitations that is filtered by the number of results to skip. +Retrieves a list of a user's Organization invitations that is filtered by the number of results to skip. ```tsx const userId = 'user_123' diff --git a/docs/reference/backend/user/get-organization-membership-list.mdx b/docs/reference/backend/user/get-organization-membership-list.mdx index 84b4b40937..63e178e862 100644 --- a/docs/reference/backend/user/get-organization-membership-list.mdx +++ b/docs/reference/backend/user/get-organization-membership-list.mdx @@ -1,12 +1,12 @@ --- title: '`getOrganizationMembershipList()`' -description: Use Clerk's JS Backend SDK to retrieve a list of organization memberships for a given user. +description: Use Clerk's JS Backend SDK to retrieve a list of Organization memberships for a given user. sdk: js-backend --- {/* clerk/javascript file: https://github.com/clerk/javascript/blob/main/packages/backend/src/api/endpoints/UserApi.ts#L214 */} -Retrieves a list of organization memberships for a given user. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) objects, and a `totalCount` property that indicates the total number of organization memberships in the system for the specified organization. +Retrieves a list of Organization memberships for a given user. Returns a [`PaginatedResourceResponse`](/docs/reference/backend/types/paginated-resource-response) object with a `data` property that contains an array of [`OrganizationMembership`](/docs/reference/backend/types/backend-organization-membership) objects, and a `totalCount` property that indicates the total number of Organization memberships in the system for the specified Organization. ```ts function getOrganizationMembershipList( @@ -20,7 +20,7 @@ function getOrganizationMembershipList( - `userId` - `string` - The ID of the user to retrieve the list of organization memberships for. + The ID of the user to retrieve the list of Organization memberships for. --- @@ -49,7 +49,7 @@ const response = await clerkClient.users.getOrganizationMembershipList({ userId ### Limit the number of results -Retrieves a list of a user's organization memberships that is filtered by the number of results. +Retrieves a list of a user's Organization memberships that is filtered by the number of results. ```tsx const userId = 'user_123' @@ -63,7 +63,7 @@ const { data, totalCount } = await clerkClient.users.getOrganizationMembershipLi ### Skip results -Retrieves a list of a user's organization memberships that is filtered by the number of results to skip. +Retrieves a list of a user's Organization memberships that is filtered by the number of results to skip. ```tsx const userId = 'user_123' diff --git a/docs/reference/backend/user/get-user-list.mdx b/docs/reference/backend/user/get-user-list.mdx index adbb28bc84..dc333a2cf5 100644 --- a/docs/reference/backend/user/get-user-list.mdx +++ b/docs/reference/backend/user/get-user-list.mdx @@ -81,7 +81,7 @@ function getUserList(): (params: UserListParams) => Promise - `createOrganizationEnabled?` - `boolean` - If `true`, the user can create organizations with the Frontend API. + If `true`, the user can create Organizations with the Frontend API. --- - `createOrganizationsLimit?` - `number` - An integer indicating the number of organizations that can be created by the user. If the value is `0`, then the user can create unlimited organizations. Default is `null`. + An integer indicating the number of Organizations that can be created by the user. If the value is `0`, then the user can create unlimited Organizations. Default is `null`. --- diff --git a/docs/reference/components/billing/checkout-button.mdx b/docs/reference/components/billing/checkout-button.mdx index e8bee934da..950d6036b8 100644 --- a/docs/reference/components/billing/checkout-button.mdx +++ b/docs/reference/components/billing/checkout-button.mdx @@ -1,12 +1,12 @@ --- title: "`` component" -description: "Clerk's component renders a button that opens the checkout drawer for plan subscriptions." +description: "Clerk's component renders a button that opens the checkout drawer for Plan subscriptions." sdk: react, nextjs, vue --- ![The \ component renders a button that opens the checkout drawer.](/docs/images/ui-components/checkout-button.png) -The `` component renders a button that opens the checkout drawer when selected, allowing users to subscribe to a plan for either their personal account or an organization. It must be wrapped inside a [``](/docs/reference/components/control/signed-in) component to ensure the user is authenticated. +The `` component renders a button that opens the checkout drawer when selected, allowing users to subscribe to a Plan for either their Personal Account or an Organization. It must be wrapped inside a [``](/docs/reference/components/control/signed-in) component to ensure the user is authenticated. @@ -25,11 +25,11 @@ The `` component renders a button that opens the checkout draw ``` -`` will throw an error if the `for` prop is set to `'organization'` and no [active organization](!active-organization) is set. +`` will throw an error if the `for` prop is set to `'organization'` and no [Active Organization](!active-organization) is set. ```tsx <> - // ❌ This will throw an error if no organization is active + // ❌ This will throw an error if no Organization is active // ✅ Correct usage {auth.orgId ? : null} @@ -183,7 +183,7 @@ The `` component renders a button that opens the checkout draw - `planId` - `string` - The ID of the plan to subscribe to. + The ID of the Plan to subscribe to. --- @@ -197,7 +197,7 @@ The `` component renders a button that opens the checkout draw - `for?` - `'user' | 'organization'` - Determines whether the subscription is for the current user or organization. Defaults to `'user'`. + Determines whether the subscription is for the current user or Organization. Defaults to `'user'`. --- diff --git a/docs/reference/components/billing/plan-details-button.mdx b/docs/reference/components/billing/plan-details-button.mdx index 67261176c6..6b41e62141 100644 --- a/docs/reference/components/billing/plan-details-button.mdx +++ b/docs/reference/components/billing/plan-details-button.mdx @@ -1,18 +1,18 @@ --- title: "`` component" -description: "Clerk's component renders a button that opens the plan details drawer." +description: "Clerk's component renders a button that opens the Plan details drawer." sdk: react, nextjs, vue --- -![The \ component renders a button that opens the plan details drawer.](/docs/images/ui-components/plan-details.png){{ style: { maxWidth: '460px' } }} +![The \ component renders a button that opens the Plan details drawer.](/docs/images/ui-components/plan-details.png){{ style: { maxWidth: '460px' } }} -The `` component renders a button that opens the plan details drawer, allowing users to view detailed information about a specific plan, including pricing, features, and other plan-specific details. +The `` component renders a button that opens the Plan details drawer, allowing users to view detailed information about a specific Plan, including pricing, Features, and other Plan-specific details. ## Usage -`` preserves any click handlers attached to custom button elements, while maintaining the plan details drawer functionality. +`` preserves any click handlers attached to custom button elements, while maintaining the Plan details drawer functionality. ```tsx @@ -22,7 +22,7 @@ The `` component renders a button that opens the plan detai ``` -`` supports rendering the plan details drawer in a custom portal container. +`` supports rendering the Plan details drawer in a custom portal container. ```tsx {{ prettier: false }} const portalRoot = document.getElementById('custom-portal') @@ -47,10 +47,10 @@ const portalRoot = document.getElementById('custom-portal') export default function PricingPage() { return (
- {/* Basic usage with plan ID */} + {/* Basic usage with Plan ID */} - {/* Customizes the appearance of the plan details drawer */} + {/* Customizes the appearance of the Plan details drawer */} { return (
- {/* Basic usage with plan ID */} + {/* Basic usage with Plan ID */} - {/* Customizes the appearance of the plan details drawer */} + {/* Customizes the appearance of the Plan details drawer */}
- + - + `. diff --git a/docs/reference/components/billing/pricing-table.mdx b/docs/reference/components/billing/pricing-table.mdx index dca3c339ae..c1f551c0b8 100644 --- a/docs/reference/components/billing/pricing-table.mdx +++ b/docs/reference/components/billing/pricing-table.mdx @@ -245,7 +245,7 @@ All props are optional. - `collapseFeatures` - `boolean` - A boolean that indicates whether the features are collapsed. **Requires `layout` to be set to `'default'`**. Defaults to `false`. + A boolean that indicates whether the Features are collapsed. **Requires `layout` to be set to `'default'`**. Defaults to `false`. --- @@ -266,7 +266,7 @@ All props are optional. - `for` - `'user' | 'organization'` - A string that indicates whether the pricing table is for users or [organizations](/docs/guides/organizations/overview). If `'user'`, the pricing table will display a list of plans and features that **users** can subscribe to. If `'organization'`, the pricing table will display a list of plans and features that **organizations** can subscribe to. Defaults to `'user'`. + A string that indicates whether the pricing table is for users or [Organizations](/docs/guides/organizations/overview). If `'user'`, the pricing table will display a list of Plans and Features that **users** can subscribe to. If `'organization'`, the pricing table will display a list of Plans and Features that **Organizations** can subscribe to. Defaults to `'user'`. --- diff --git a/docs/reference/components/billing/subscription-details-button.mdx b/docs/reference/components/billing/subscription-details-button.mdx index 31e403dc90..28d6befb69 100644 --- a/docs/reference/components/billing/subscription-details-button.mdx +++ b/docs/reference/components/billing/subscription-details-button.mdx @@ -6,7 +6,7 @@ sdk: react, nextjs, vue ![The \ component renders a button that opens the subscription details drawer.](/docs/images/ui-components/subscription.png) -The `` component renders a button that opens the subscription details drawer when selected, allowing users to view and manage their subscription details, whether for their personal account or organization. It must be wrapped inside a [``](/docs/reference/components/control/signed-in) component to ensure the user is authenticated. +The `` component renders a button that opens the subscription details drawer when selected, allowing users to view and manage their subscription details, whether for their Personal Account or Organization. It must be wrapped inside a [``](/docs/reference/components/control/signed-in) component to ensure the user is authenticated. @@ -25,11 +25,11 @@ The `` component renders a button that opens the su ``` -`` will throw an error if the `for` prop is set to `'organization'` and no [active organization](!active-organization) is set. +`` will throw an error if the `for` prop is set to `'organization'` and no [Active Organization](!active-organization) is set. ```tsx <> - // ❌ This will throw an error if no organization is active + // ❌ This will throw an error if no Organization is active // ✅ Correct usage {auth.orgId ? : null} @@ -146,7 +146,7 @@ All props are optional. - `for?` - `'user' | 'organization'` - Determines whether to show subscription details for the current user or organization. Defaults to `'user'`. + Determines whether to show subscription details for the current user or Organization. Defaults to `'user'`. --- diff --git a/docs/reference/components/control/protect.mdx b/docs/reference/components/control/protect.mdx index 409f8885b4..1709e6736d 100644 --- a/docs/reference/components/control/protect.mdx +++ b/docs/reference/components/control/protect.mdx @@ -1,13 +1,13 @@ --- title: '``' -description: The Protect component protects content or even entire routes based on authentication, and optionally, authorization. It only renders its children when the current user is signed-in, and if performing authorization checks, if the user has been granted a specific type of access control (role, permission, feature, or plan). +description: The Protect component protects content or even entire routes based on authentication, and optionally, authorization. It only renders its children when the current user is signed-in, and if performing authorization checks, if the user has been granted a specific type of access control (Role, Permission, Feature, or Plan). sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue --- The [``](/docs/reference/components/control/protect) component protects content or even entire routes based on: - authentication: whether the user is signed-in or not. -- authorization: whether the user has been granted a specific type of access control (role, permission, feature, or plan) +- authorization: whether the user has been granted a specific type of access control (Role, Permission, Feature, or Plan) `` **always** performs authentication checks. To perform [authorization checks](!authorization-check), you can pass different props, like `role`, `permission`, `feature`, or `plan`. @@ -179,15 +179,15 @@ The [``](/docs/reference/components/control/protect) component protec ### Authorization checks -To limit who is able to see the content that `` renders, you can pass **one** of the access control props: `permission`, `role`, `feature`, or `plan`. It's recommended to use **permission-based** authorization over role-based authorization, and **feature-based** authorization over plan-based authorization, as they are more flexible, easier to manage, and more secure. +To limit who is able to see the content that `` renders, you can pass **one** of the access control props: `permission`, `role`, `feature`, or `plan`. It's recommended to use **Permission-based** authorization over **Role-based** authorization, and **Feature-based** authorization over **Plan-based** authorization, as they are more flexible, easier to manage, and more secure. -If you do not pass any of the access control props, `` will render its children if the user is signed in, regardless of their role or its permissions. +If you do not pass any of the access control props, `` will render its children if the user is signed in, regardless of their Role or its Permissions. For more complex authorization logic, [pass conditional logic to the `condition` prop](#render-content-conditionally). -### Render content by permissions +### Render content by Permissions -The following example demonstrates how to use the `` component to protect content by checking if the user has the `org:invoices:create` permission. +The following example demonstrates how to use the `` component to protect content by checking if the user has the `org:invoices:create` Permission. ```jsx {{ filename: 'app/protected/invoices/page.tsx' }} @@ -197,9 +197,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -214,9 +214,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -232,8 +232,8 @@ The following example demonstrates how to use the `` component to pro --- -

You do not have the permissions to create an invoice.

-

Users with permission org:invoices:create can see this.

+

You do not have the Permissions to create an invoice.

+

Users with Permission org:invoices:create can see this.

```
@@ -247,9 +247,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.} + fallback={You do not have the Permissions to create an invoice.} > - Users with permission org:invoices:create can see this. + Users with Permission org:invoices:create can see this. ) } @@ -264,9 +264,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -281,9 +281,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -298,9 +298,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -320,9 +320,9 @@ The following example demonstrates how to use the `` component to pro return ( You do not have the permissions to create an invoice.

} + fallback={

You do not have the Permissions to create an invoice.

} > -

Users with permission org:invoices:create can see this.

+

Users with Permission org:invoices:create can see this.

) } @@ -338,9 +338,9 @@ The following example demonstrates how to use the `` component to pro ``` @@ -355,19 +355,19 @@ The following example demonstrates how to use the `` component to pro ``` -### Render content by role +### Render content by Role While authorization by `permission` is **recommended**, for convenience, `` allows a `role` prop to be passed. -The following example demonstrates how to use the `` component to protect content by checking if the user has the `org:billing` role. +The following example demonstrates how to use the `` component to protect content by checking if the user has the `org:billing` Role. ```jsx {{ filename: 'app/protected/billing/page.tsx' }} @@ -379,7 +379,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -396,7 +396,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -413,7 +413,7 @@ The following example demonstrates how to use the `` component to pro

Only a member of the Billing department can access this content.

-

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

```
@@ -429,7 +429,7 @@ The following example demonstrates how to use the `` component to pro permission="org:billing" fallback={Only a member of the Billing department can access this content.} > - Users with role org:billing can see this. + Users with Role org:billing can see this. ) } @@ -446,7 +446,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -463,7 +463,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -480,7 +480,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -502,7 +502,7 @@ The following example demonstrates how to use the `` component to pro role="org:billing" fallback={

Only a member of the Billing department can access this content.

} > -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

) } @@ -520,7 +520,7 @@ The following example demonstrates how to use the `` component to pro -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

``` @@ -537,15 +537,15 @@ The following example demonstrates how to use the `` component to pro -

Users with role org:billing can see this.

+

Users with Role org:billing can see this.

``` -### Render content by plan +### Render content by Plan -The following example demonstrates how to use `` to protect content by checking if the user has a plan. +The following example demonstrates how to use `` to protect content by checking if the user has a Plan. ```tsx {{ filename: 'app/protected/bronze/page.tsx' }} @@ -721,9 +721,9 @@ The following example demonstrates how to use `` to protect content b ``` -### Render content by feature +### Render content by Feature -The following example demonstrates how to use `` to protect content by checking if the user has a feature. +The following example demonstrates how to use `` to protect content by checking if the user has a Feature. ```tsx {{ filename: 'app/protected/premium-access/page.tsx' }} @@ -919,7 +919,7 @@ The following example demonstrates how to use `` to protect content b ### Render content conditionally -The following example uses ``'s `condition` prop to conditionally render its children if the user has the correct role. +The following example uses ``'s `condition` prop to conditionally render its children if the user has the correct Role. ```tsx {{ filename: 'app/dashboard/settings/page.tsx' }} @@ -1116,28 +1116,28 @@ The following example uses ``'s `condition` prop to conditionally rende - `feature?` - `string` - Optional string corresponding to a [feature](/docs/guides/billing/overview). + Optional string corresponding to a [Feature](/docs/guides/billing/overview). --- - `plan?` - `string` - Optional string corresponding to a [plan](/docs/guides/billing/overview). + Optional string corresponding to a [Plan](/docs/guides/billing/overview). --- - `permission?` - `string` - Optional string corresponding to a [permission](/docs/guides/organizations/roles-and-permissions) in the format `org::` + Optional string corresponding to a [Permission](/docs/guides/organizations/roles-and-permissions) in the format `org::` --- - `role?` - `string` - Optional string corresponding to a [role](/docs/guides/organizations/roles-and-permissions) in the format `org:` + Optional string corresponding to a [Role](/docs/guides/organizations/roles-and-permissions) in the format `org:` --- diff --git a/docs/reference/components/control/redirect-to-create-organization.mdx b/docs/reference/components/control/redirect-to-create-organization.mdx index 411aff3b7d..53ed8ccb26 100644 --- a/docs/reference/components/control/redirect-to-create-organization.mdx +++ b/docs/reference/components/control/redirect-to-create-organization.mdx @@ -1,13 +1,13 @@ --- title: '`` (deprecated)' -description: The component will navigate to the create organization flow which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. +description: The component will navigate to the create Organization flow which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. sdk: nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue --- > [!WARNING] > This feature is deprecated. Please use the [`redirectToCreateOrganization()` method](/docs/reference/javascript/clerk#redirect-to-create-organization) instead. -The `` component will navigate to the create organization flow which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. +The `` component will navigate to the create Organization flow which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. ## Example @@ -21,7 +21,7 @@ The `` component will navigate to the create org - You need to sign in to create an organization. + You need to sign in to create an Organization. ) } @@ -38,7 +38,7 @@ The `` component will navigate to the create org - You need to sign in to create an organization. + You need to sign in to create an Organization. ) } @@ -55,7 +55,7 @@ The `` component will navigate to the create org - You need to sign in to create an organization. + You need to sign in to create an Organization. ) } @@ -73,7 +73,7 @@ The `` component will navigate to the create org
-

You need to sign in to create an organization.

+

You need to sign in to create an Organization.

) @@ -97,7 +97,7 @@ The `` component will navigate to the create org -

You need to sign in to create an organization.

+

You need to sign in to create an Organization.

) @@ -116,7 +116,7 @@ The `` component will navigate to the create org -

You need to sign in to create an organization.

+

You need to sign in to create an Organization.

``` @@ -133,7 +133,7 @@ The `` component will navigate to the create org -

You need to sign in to create an organization.

+

You need to sign in to create an Organization.

``` diff --git a/docs/reference/components/control/redirect-to-organization-profile.mdx b/docs/reference/components/control/redirect-to-organization-profile.mdx index b69e966921..efcc518e2c 100644 --- a/docs/reference/components/control/redirect-to-organization-profile.mdx +++ b/docs/reference/components/control/redirect-to-organization-profile.mdx @@ -1,13 +1,13 @@ --- title: '`` (deprecated)' -description: The component will navigate to the organization profile URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. +description: The component will navigate to the Organization profile URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. sdk: nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue --- > [!WARNING] > This feature is deprecated. Please use the [`redirectToOrganizationProfile()` method](/docs/reference/javascript/clerk#redirect-to-organization-profile) instead. -The `` component will navigate to the organization profile URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. +The `` component will navigate to the Organization profile URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack. ## Example @@ -21,7 +21,7 @@ The `` component will navigate to the organizat - You need to sign in to view your organization profile. + You need to sign in to view your Organization profile. ) } @@ -38,7 +38,7 @@ The `` component will navigate to the organizat - You need to sign in to view your organization profile. + You need to sign in to view your Organization profile. ) } @@ -55,7 +55,7 @@ The `` component will navigate to the organizat - You need to sign in to view your organization profile. + You need to sign in to view your Organization profile. ) } @@ -73,7 +73,7 @@ The `` component will navigate to the organizat -

You need to sign in to view your organization profile.

+

You need to sign in to view your Organization profile.

) @@ -97,7 +97,7 @@ The `` component will navigate to the organizat
-

You need to sign in to view your organization profile.

+

You need to sign in to view your Organization profile.

) @@ -116,7 +116,7 @@ The `` component will navigate to the organizat -

You need to sign in to view your organization profile.

+

You need to sign in to view your Organization profile.

``` @@ -133,7 +133,7 @@ The `` component will navigate to the organizat -

You need to sign in to view your organization profile.

+

You need to sign in to view your Organization profile.

``` diff --git a/docs/reference/components/organization/create-organization.mdx b/docs/reference/components/organization/create-organization.mdx index b10d10cd39..da082ec232 100644 --- a/docs/reference/components/organization/create-organization.mdx +++ b/docs/reference/components/organization/create-organization.mdx @@ -1,12 +1,12 @@ --- title: '`` component' -description: Clerk's component is used to render an organization creation UI that allows users to create brand new organizations within your application. +description: Clerk's component is used to render an Organization creation UI that allows users to create brand new Organizations within your application. sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue, js-frontend --- -![The \ component renders an organization creation UI that allows users to create brand new organizations within your application.](/docs/images/ui-components/create-organization.png){{ style: { maxWidth: '492px' } }} +![The \ component renders an Organization creation UI that allows users to create brand new organizations within your application.](/docs/images/ui-components/create-organization.png){{ style: { maxWidth: '492px' } }} -The `` component is used to render an organization creation UI that allows users to create brand new organizations in your application. +The `` component is used to render an Organization creation UI that allows users to create brand new Organizations in your application. ` component' -description: Clerk's component is used to display organization related memberships, invitations, and suggestions for the user. +description: Clerk's component is used to display Organization related memberships, invitations, and suggestions for the user. sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue, js-frontend --- -![The \ component displays organization-related memberships and automatic invitations and suggestions for the user.](/docs/images/ui-components/organization-list.png){{ style: { maxWidth: '460px' } }} +![The \ component displays Organization-related memberships and automatic invitations and suggestions for the user.](/docs/images/ui-components/organization-list.png){{ style: { maxWidth: '460px' } }} -The `` component displays organization-related memberships and automatic [invitations](/docs/guides/organizations/verified-domains#automatic-invitations) and [suggestions](/docs/guides/organizations/verified-domains#automatic-suggestions) for the user. +The `` component displays Organization-related memberships and automatic [invitations](/docs/guides/organizations/verified-domains#automatic-invitations) and [suggestions](/docs/guides/organizations/verified-domains#automatic-suggestions) for the user. ` component accepts the following properties, all of wh - `afterCreateOrganizationUrl` - ((org: [Organization][org-ref]) => string) | string - The full URL or path to navigate to after creating a new organization. + The full URL or path to navigate to after creating a new Organization. --- - `afterSelectOrganizationUrl` - ((org: [Organization][org-ref]) => string) | string - The full URL or path to navigate to after selecting an organization. Defaults to `undefined`. + The full URL or path to navigate to after selecting an Organization. Defaults to `undefined`. --- - `afterSelectPersonalUrl` - ((org: [Organization][org-ref]) => string) | string - The full URL or path to navigate to after selecting the [personal account](/docs/guides/organizations/overview#allow-personal-accounts). Defaults to `undefined`. + The full URL or path to navigate to after selecting the [Personal Account](/docs/guides/organizations/overview#allow-personal-accounts). Defaults to `undefined`. --- @@ -308,21 +308,21 @@ The `` component accepts the following properties, all of wh - `hidePersonal` - `boolean` - A boolean that controls whether `` will include the user's [personal account](/docs/guides/organizations/overview#allow-personal-accounts) in the organization list. Setting this to `true` will hide the personal account option, and users will only be able to switch between organizations. Defaults to `false`. + A boolean that controls whether `` will include the user's [Personal Account](/docs/guides/organizations/overview#allow-personal-accounts) in the Organization list. Setting this to `true` will hide the Personal Account option, and users will only be able to switch between Organizations. Defaults to `false`. --- - `hideSlug` - `boolean` - A boolean that controls whether the optional slug field in the organization creation screen is hidden. Defaults to `false`. + A boolean that controls whether the optional slug field in the Organization creation screen is hidden. Defaults to `false`. --- - `skipInvitationScreen` - `boolean | undefined` - A boolean that controls whether the screen for sending invitations after an organization is created is hidden. When `undefined`, Clerk will automatically hide the screen if the number of max allowed members is equal to 1. Defaults to `false`. + A boolean that controls whether the screen for sending invitations after an Organization is created is hidden. When `undefined`, Clerk will automatically hide the screen if the number of max allowed members is equal to 1. Defaults to `false`. ## Customization diff --git a/docs/reference/components/organization/organization-profile.mdx b/docs/reference/components/organization/organization-profile.mdx index c714b625fe..ebf5497458 100644 --- a/docs/reference/components/organization/organization-profile.mdx +++ b/docs/reference/components/organization/organization-profile.mdx @@ -1,18 +1,18 @@ --- title: '`` component' -description: Clerk's component is used to render a beautiful, full-featured organization management UI that allows users to manage their organization profile and security settings. +description: Clerk's component is used to render a beautiful, full-featured Organization management UI that allows users to manage their Organization profile and security settings. sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue, js-frontend --- -![The \ component allows users to manage their organization membership and security settings.](/docs/images/ui-components/organization-profile.png) +![The \ component allows users to manage their Organization membership and security settings.](/docs/images/ui-components/organization-profile.png) -The `` component allows users to manage their organization membership, security, and billing settings. +The `` component allows users to manage their Organization membership, security, and billing settings. -This component's **General** tab displays the organization's information and the **Leave organization** button. Admins will be able to see the **Update profile** button, **Verified domains** section, and **Delete organization** button. +This component's **General** tab displays the Organization's information and the **Leave organization** button. Admins will be able to see the **Update profile** button, **Verified domains** section, and **Delete organization** button. -The **Members** tab shows the organization's members along with their join dates and roles. Admins will have the ability to invite a member, change a member's role, or remove them from the organization. Admins will have tabs within the **Members** tab to view the organization's [invitations](/docs/guides/organizations/overview#organization-invitations) and [requests](/docs/guides/organizations/verified-domains#membership-requests). +The **Members** tab shows the Organization's members along with their join dates and Roles. Admins will have the ability to invite a member, change a member's Role, or remove them from the Organization. Admins will have tabs within the **Members** tab to view the Organization's [invitations](/docs/guides/organizations/overview#organization-invitations) and [requests](/docs/guides/organizations/verified-domains#membership-requests). -The **Billing** tab displays the plans and features that are available to the organization, as well as the user's billing information, such as their invoices and payment methods. +The **Billing** tab displays the Plans and Features that are available to the Organization, as well as the user's billing information, such as their invoices and payment methods. ` component accepts the following properties, all of - `afterLeaveOrganizationUrl` - `string` - The full URL or path to navigate to after leaving an organization. + The full URL or path to navigate to after leaving an Organization. --- - `customPages` - `CustomPages[]` - An array of custom pages to add to the organization profile. Only available for the [JavaScript SDK](/docs/reference/javascript/overview). To add custom pages with React-based SDK's, see the [dedicated guide](/docs/guides/customizing-clerk/adding-items/organization-profile). + An array of custom pages to add to the Organization profile. Only available for the [JavaScript SDK](/docs/reference/javascript/overview). To add custom pages with React-based SDK's, see the [dedicated guide](/docs/guides/customizing-clerk/adding-items/organization-profile). --- diff --git a/docs/reference/components/organization/organization-switcher.mdx b/docs/reference/components/organization/organization-switcher.mdx index b63cd362dd..7e38066a68 100644 --- a/docs/reference/components/organization/organization-switcher.mdx +++ b/docs/reference/components/organization/organization-switcher.mdx @@ -1,12 +1,12 @@ --- title: '`` component' -description: Clerk's component is used to enable the ability to switch between available organizations the user may be part of in your application. +description: Clerk's component is used to enable the ability to switch between available Organizations the user may be part of in your application. sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, remix, tanstack-react-start, vue, js-frontend --- -![The \ component allows a user to switch between their account types - their personal account and their joined organizations.](/docs/images/ui-components/organization-switcher.png){{ style: { maxWidth: '436px' } }} +![The \ component allows a user to switch between their account types - their Personal Account and their joined Organizations.](/docs/images/ui-components/organization-switcher.png){{ style: { maxWidth: '436px' } }} -The `` component allows a user to switch between their joined organizations. If [personal accounts are enabled](/docs/guides/organizations/overview#allow-personal-accounts), users can also switch to their personal account. This component is useful for applications that have a multi-tenant architecture, where users can be part of multiple organizations. It handles all organization-related flows, including full organization management for admins. Learn more about [organizations](/docs/guides/organizations/overview). +The `` component allows a user to switch between their joined Organizations. If [Personal Accounts are enabled](/docs/guides/organizations/overview#allow-personal-accounts), users can also switch to their Personal Account. This component is useful for applications that have a multi-tenant architecture, where users can be part of multiple Organizations. It handles all Organization-related flows, including full Organization management for admins. Learn more about [Organizations](/docs/guides/organizations/overview). ` component accepts the following properties, all o - `afterCreateOrganizationUrl` - `string` - The full URL or path to navigate to after creating a new organization. + The full URL or path to navigate to after creating a new Organization. --- - `afterLeaveOrganizationUrl` - `string` - The full URL or path to navigate to after the user leaves the currently [active organization](!active-organization). + The full URL or path to navigate to after the user leaves the currently [Active Organization](!active-organization). --- - `afterSelectOrganizationUrl` - `string` - The full URL or path to navigate to after a successful organization switch. + The full URL or path to navigate to after a successful Organization switch. --- @@ -287,14 +287,14 @@ The `` component accepts the following properties, all o - `hidePersonal` - `boolean` - A boolean that controls whether `` will include the user's [personal account](/docs/guides/organizations/overview#allow-personal-accounts) in the organization list. Setting this to `true` will hide the personal account option, and users will only be able to switch between organizations. Defaults to `false`. + A boolean that controls whether `` will include the user's [Personal Account](/docs/guides/organizations/overview#allow-personal-accounts) in the Organization list. Setting this to `true` will hide the Personal Account option, and users will only be able to switch between Organizations. Defaults to `false`. --- - `hideSlug` - `boolean` - A boolean that controls whether the optional slug field in the organization creation screen is hidden. + A boolean that controls whether the optional slug field in the Organization creation screen is hidden. --- diff --git a/docs/reference/composables/use-auth.mdx b/docs/reference/composables/use-auth.mdx index 371ccad7b6..aa2defff5d 100644 --- a/docs/reference/composables/use-auth.mdx +++ b/docs/reference/composables/use-auth.mdx @@ -40,21 +40,21 @@ The `useAuth()` composable provides access to the current user's authentication - `orgId` - `Ref` - The ID of the user's [active organization](!active-organization). + The ID of the user's [Active Organization](!active-organization). --- - `orgRole` - `Ref` - The current user's role in their [active organization](!active-organization). + The current user's Role in their [Active Organization](!active-organization). --- - `orgSlug` - `Ref` - The URL-friendly identifier of the user's [active organization](!active-organization). + The URL-friendly identifier of the user's [Active Organization](!active-organization). --- @@ -75,7 +75,7 @@ The `useAuth()` composable provides access to the current user's authentication - `has()` - `Ref<(isAuthorizedParams: CheckAuthorizationParamsWithCustomPermissions) => boolean>` - A function that checks if the user has specific permissions or roles. See the [reference doc](/docs/reference/backend/types/auth-object#has). + A function that checks if the user has specific Permissions or Roles. See the [reference doc](/docs/reference/backend/types/auth-object#has). ## How to use the `useAuth()` composable diff --git a/docs/reference/composables/use-organization.mdx b/docs/reference/composables/use-organization.mdx index 75df379fa0..1cc18cfe7c 100644 --- a/docs/reference/composables/use-organization.mdx +++ b/docs/reference/composables/use-organization.mdx @@ -1,10 +1,10 @@ --- title: useOrganization() | Vue -description: Access and manage the currently active organization in your Vue application with Clerk's useOrganization() composable. +description: Access and manage the currently Active Organization in your Vue application with Clerk's useOrganization() composable. sdk: vue, nuxt --- -The `useOrganization()` composable retrieves attributes of the currently [active organization](!active-organization). +The `useOrganization()` composable retrieves attributes of the currently [Active Organization](!active-organization). ## Returns @@ -19,19 +19,19 @@ The `useOrganization()` composable retrieves attributes of the currently [active - `organization` - Ref\<[Organization](/docs/reference/javascript/organization)> - The currently [active organization](!active-organization). + The currently [Active Organization](!active-organization). --- - `membership` - Ref\<[OrganizationMembership](/docs/reference/javascript/types/organization-membership)> - The current organization membership. + The current Organization membership. ## How to use the `useOrganization()` composable -### Retrieve the current active organization +### Retrieve the current Active Organization Use `useOrganization()` to access the current active [`Organization`](/docs/reference/javascript/organization) object. @@ -47,7 +47,7 @@ const { organization, isLoaded } = useOrganization()
-

This current organization is {{ organization?.name }}

+

This current Organization is {{ organization?.name }}

@@ -56,9 +56,9 @@ const { organization, isLoaded } = useOrganization() ``` -### Paginate organization memberships +### Paginate Organization memberships -The following example demonstrates how to use `useOrganization()` to access the organization's memberships. Pagination is implemented by fetching pages of memberships when the "Previous page" or "Next page" buttons are clicked. +The following example demonstrates how to use `useOrganization()` to access the Organization's memberships. Pagination is implemented by fetching pages of memberships when the "Previous page" or "Next page" buttons are clicked. ```vue {{ filename: 'MembershipList.vue', collapsible: true }}