From f16572a85cf70d51891ef55ac3aeb23eba132cb6 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 14:16:53 -0300 Subject: [PATCH 1/6] Rename `Organization Profile` to `profile` --- packages/localizations/src/bg-BG.ts | 2 +- packages/localizations/src/en-US.ts | 2 +- packages/localizations/src/uk-UA.ts | 2 +- packages/localizations/src/utils/enUS_v4.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/localizations/src/bg-BG.ts b/packages/localizations/src/bg-BG.ts index 3fafa4fca48..d98d6349b75 100644 --- a/packages/localizations/src/bg-BG.ts +++ b/packages/localizations/src/bg-BG.ts @@ -501,7 +501,7 @@ export const bgBG: LocalizationResource = { headerTitle__members: 'Членове', profileSection: { primaryButton: undefined, - title: 'Organization Profile', + title: 'Profile', uploadAction__title: 'Logo', }, }, diff --git a/packages/localizations/src/en-US.ts b/packages/localizations/src/en-US.ts index a60df798890..84f4721e63c 100644 --- a/packages/localizations/src/en-US.ts +++ b/packages/localizations/src/en-US.ts @@ -1111,7 +1111,7 @@ export const enUS: LocalizationResource = { membershipSeatUsageLabel: '{{count}} of {{limit}} seats used', profileSection: { primaryButton: 'Update profile', - title: 'Organization Profile', + title: 'Profile', uploadAction__title: 'Logo', }, }, diff --git a/packages/localizations/src/uk-UA.ts b/packages/localizations/src/uk-UA.ts index e981b3644c5..8e91330ca7f 100644 --- a/packages/localizations/src/uk-UA.ts +++ b/packages/localizations/src/uk-UA.ts @@ -500,7 +500,7 @@ export const ukUA: LocalizationResource = { headerTitle__members: 'Учасники', profileSection: { primaryButton: undefined, - title: 'Organization Profile', + title: 'Profile', uploadAction__title: 'Logo', }, }, diff --git a/packages/localizations/src/utils/enUS_v4.ts b/packages/localizations/src/utils/enUS_v4.ts index 39441e435f1..ab01682207c 100644 --- a/packages/localizations/src/utils/enUS_v4.ts +++ b/packages/localizations/src/utils/enUS_v4.ts @@ -556,7 +556,7 @@ export const enUS_v4: any = { headerSubtitle__settings: 'Manage organization settings', }, profilePage: { - title: 'Organization Profile', + title: 'Profile', subtitle: 'Manage organization profile', successMessage: 'The organization has been updated.', dangerSection: { From 7c8775baa0f2513dcf9edd8d761cd22943e22c83 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 14:20:37 -0300 Subject: [PATCH 2/6] Do not show `Verified domains` section with empty domains list --- .../OrganizationProfile/OrganizationGeneralPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx index 43e30fed3d4..e998d0ce3c0 100644 --- a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx +++ b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx @@ -136,13 +136,13 @@ const OrganizationProfileSection = () => { const OrganizationDomainsSection = () => { const { organizationSettings } = useEnvironment(); - const { organization } = useOrganization(); + const { organization, domains } = useOrganization(); if (!organizationSettings || !organization) { return null; } - if (!organizationSettings.domains.enabled) { + if (!organizationSettings.domains.enabled || !domains?.data?.length) { return null; } From 50d1caf154b7a484ec985291c53dcc237612e348 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 14:26:38 -0300 Subject: [PATCH 3/6] Hide section based on permission besides empty list check --- .../OrganizationGeneralPage.tsx | 9 +++++- .../OrganizationGeneralPage.test.tsx | 28 +++++++++++++++++-- 2 files changed, 33 insertions(+), 4 deletions(-) diff --git a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx index e998d0ce3c0..ee282ac8cd8 100644 --- a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx +++ b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx @@ -137,12 +137,19 @@ const OrganizationProfileSection = () => { const OrganizationDomainsSection = () => { const { organizationSettings } = useEnvironment(); const { organization, domains } = useOrganization(); + const canManageDomains = useProtect({ permission: 'org:sys_domains:manage' }); if (!organizationSettings || !organization) { return null; } - if (!organizationSettings.domains.enabled || !domains?.data?.length) { + if (!organizationSettings.domains.enabled) { + return null; + } + + // Hide the section when there are no domains to show and the user cannot add + // any + if (!domains?.data?.length && !canManageDomains) { return null; } diff --git a/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx b/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx index d4f8767ff5c..1994c00b3f5 100644 --- a/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx +++ b/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx @@ -145,8 +145,8 @@ describe('OrganizationSettings', () => { }); fixtures.clerk.organization?.getDomains.mockReturnValue( Promise.resolve({ - data: [], - total_count: 0, + data: [createFakeDomain({ id: '1', organizationId: '1', name: 'clerk.com' })], + total_count: 1, }), ); const { queryByText } = await act(() => render(, { wrapper })); @@ -157,7 +157,29 @@ describe('OrganizationSettings', () => { expect(fixtures.clerk.organization?.getDomains).toBeCalled(); }); - it('shows domains and shows the Add domain button when `org:sys_domains:manage` exists', async () => { + it('hides domains when the list is empty and the user cannot manage domains', async () => { + const { wrapper, fixtures } = await createFixtures(f => { + f.withOrganizations(); + f.withOrganizationDomains(); + f.withUser({ + email_addresses: ['test@clerk.dev'], + organization_memberships: [{ name: 'Org1', permissions: ['org:sys_domains:read'] }], + }); + }); + fixtures.clerk.organization?.getDomains.mockReturnValue( + Promise.resolve({ + data: [], + total_count: 0, + }), + ); + const { queryByText } = await act(() => render(, { wrapper })); + + await new Promise(r => setTimeout(r, 100)); + expect(queryByText('Verified domains')).not.toBeInTheDocument(); + expect(queryByText('Add domain')).not.toBeInTheDocument(); + }); + + it('shows domains and shows the Add domain button when `org:sys_domains:manage` exists even with an empty list', async () => { const { wrapper, fixtures } = await createFixtures(f => { f.withOrganizations(); f.withOrganizationDomains(); From aa64c12e24e2125db2f4d98602ee67d0e77057b5 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 15:38:26 -0300 Subject: [PATCH 4/6] Align enterprise accounts vertically --- .../OrganizationProfile/OrganizationGeneralPage.tsx | 2 +- .../components/UserProfile/ConnectedAccountsSection.tsx | 5 ++++- .../components/UserProfile/EnterpriseAccountsSection.tsx | 7 +++++-- 3 files changed, 10 insertions(+), 4 deletions(-) diff --git a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx index ee282ac8cd8..c9682e18069 100644 --- a/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx +++ b/packages/ui/src/components/OrganizationProfile/OrganizationGeneralPage.tsx @@ -136,7 +136,7 @@ const OrganizationProfileSection = () => { const OrganizationDomainsSection = () => { const { organizationSettings } = useEnvironment(); - const { organization, domains } = useOrganization(); + const { organization, domains } = useOrganization({ domains: { infinite: true } }); const canManageDomains = useProtect({ permission: 'org:sys_domains:manage' }); if (!organizationSettings || !organization) { diff --git a/packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx b/packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx index dd4a86cc5f2..6b3f60e3400 100644 --- a/packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx +++ b/packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx @@ -158,7 +158,10 @@ const ConnectedAccount = ({ account }: { account: ExternalAccountResource }) => return ( - ({ overflow: 'hidden', gap: t.space.$2 })}> + ({ overflow: 'hidden', gap: t.space.$2 })} + > { {card.error} - ({ overflow: 'hidden', gap: t.space.$2 })}> + ({ overflow: 'hidden', gap: t.space.$2 })} + > ); }; From be7bf65c804ddf85b9a7037182e1b18b35123c84 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 15:38:41 -0300 Subject: [PATCH 5/6] Align vertically email address with badge --- packages/ui/src/components/UserProfile/EmailsSection.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ui/src/components/UserProfile/EmailsSection.tsx b/packages/ui/src/components/UserProfile/EmailsSection.tsx index 31f40774c79..e37666e7a72 100644 --- a/packages/ui/src/components/UserProfile/EmailsSection.tsx +++ b/packages/ui/src/components/UserProfile/EmailsSection.tsx @@ -61,7 +61,7 @@ export const EmailsSection = ({ return ( - ({ overflow: 'hidden', gap: t.space.$1 })}> + ({ overflow: 'hidden', gap: t.space.$1, alignItems: 'center' })}> ({ color: t.colors.$colorForeground })} truncate From 0d1b192ef1b04105185e34fb57a1ca17d73e7243 Mon Sep 17 00:00:00 2001 From: Laura Beatris Date: Wed, 17 Jun 2026 15:43:15 -0300 Subject: [PATCH 6/6] Add changeset --- .changeset/frank-spoons-stick.md | 10 ++++++++++ .../__tests__/OrganizationGeneralPage.test.tsx | 7 ++++--- 2 files changed, 14 insertions(+), 3 deletions(-) create mode 100644 .changeset/frank-spoons-stick.md diff --git a/.changeset/frank-spoons-stick.md b/.changeset/frank-spoons-stick.md new file mode 100644 index 00000000000..327b99bfb08 --- /dev/null +++ b/.changeset/frank-spoons-stick.md @@ -0,0 +1,10 @@ +--- +'@clerk/localizations': minor +'@clerk/clerk-js': minor +'@clerk/ui': minor +--- + +Improve `OrganizationProfile` UI: +- Hide the `Verified domains` section when there are no domains and the user lacks permission to add them +- Rename the `Organization profile` section to `Profile` for consistency with `UserProfile` +- Align the enterprise accounts section with the account data diff --git a/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx b/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx index 1994c00b3f5..89d9c8d8b4b 100644 --- a/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx +++ b/packages/ui/src/components/OrganizationProfile/__tests__/OrganizationGeneralPage.test.tsx @@ -174,9 +174,10 @@ describe('OrganizationSettings', () => { ); const { queryByText } = await act(() => render(, { wrapper })); - await new Promise(r => setTimeout(r, 100)); - expect(queryByText('Verified domains')).not.toBeInTheDocument(); - expect(queryByText('Add domain')).not.toBeInTheDocument(); + await waitFor(() => { + expect(queryByText('Verified domains')).not.toBeInTheDocument(); + expect(queryByText('Add domain')).not.toBeInTheDocument(); + }); }); it('shows domains and shows the Add domain button when `org:sys_domains:manage` exists even with an empty list', async () => {