Organization settings
An application needs a ready-made organization settings page covering profile details and leaving the organization.
Clerk · Component
OrganizationProfile
OrganizationProfile is Clerk’s prebuilt UI for managing an organization’s membership, security, and billing. It includes general organization controls and member administration, with additional tabs shown when supported by configuration and permissions.
How it works
OrganizationProfile is Clerk’s prebuilt organization-management interface. It presents organization details and membership controls, while exposing billing and security areas when the organization and member permissions support them.
Syntax
<OrganizationProfile />Parameters
| Name | Type | Description |
|---|---|---|
props | OrganizationProfileProps | Properties accepted by the component; all documented properties are optional. |
Returns
A rendered organization-management component; the OrganizationProfileProvider renders nothing without an active organization.
Key points
- It combines organization membership, security, and billing management in one prebuilt interface.
- The General tab gives users organization information and a way to leave the organization.
- Administrators receive profile-editing, verified-domain, and organization-deletion controls.
- Members are listed with their join dates and roles.
- Billing shows available plans and features together with relevant billing information.
- Eligible members can configure enterprise SSO and Directory Sync from Security.
Common mistakes
- The component renders nothing when no active organization is set.
- The Security tab is conditional: the member needs the documented permission and self-serve SSO must be enabled in the Clerk Dashboard.
Example: Render OrganizationProfile
import { OrganizationProfile } from '@clerk/react'
export default function OrganizationProfilePage() {
return <OrganizationProfile />
}Render the prebuilt organization-management UI in a React page with an active organization selected.
When to use it
Membership administration
Organization administrators need to invite, remove, or update members and review invitations or requests.
Organization billing
An organization uses Clerk billing features and needs users to view plans, invoices, or payment methods.
Enterprise security
An organization has self-serve SSO enabled and authorized members need to manage enterprise connections and Directory Sync.
Interview questions
QWhat does OrganizationProfile provide?
It is a prebuilt UI for managing organization membership, security, and billing. Its General and Members areas expose organization and member operations, while Billing and Security appear when applicable.
Follow-up: What controls access to the Security tab? It requires the org:sys_entconns:manage permission and self-serve SSO enabled for the organization in the Clerk Dashboard.
QWhat can administrators do in the Members area?
The Members tab lists members, join dates, and roles. Administrators can invite members, change roles, remove members, and inspect organization invitations and requests.
Follow-up: What organization context is needed for the component to display? An active organization must be selected; otherwise the profile provider renders nothing.
QHow can the JavaScript SDK render and control the component?
In the JavaScript SDK, the component can be mounted with mountOrganizationProfile(node, props?), which renders it into an HTML div. The SDK also provides matching unmount, open, and close methods.
Follow-up: What does the path property affect? It specifies where the component is mounted when routing uses path; hash- and virtual-based routing ignore it.
Related
OrganizationProfileProviderOrganizationSwitcherCreateOrganizationOrganizationListmountOrganizationProfileunmountOrganizationProfileopenOrganizationProfilecloseOrganizationProfile