Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .changeset/nice-loops-fail.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@clerk/localizations': minor
'@clerk/clerk-js': minor
'@clerk/shared': minor
---

Display message in `TaskChooseOrganization` when user is not allowed to create organizations
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import { useClerk, useSession, useUser } from '@clerk/shared/react';
import { useState } from 'react';
import { type ComponentType, useState } from 'react';

import { useSignOutContext, withCoreSessionSwitchGuard } from '@/ui/contexts';
import { descriptors, Flex, Flow, localizationKeys, Spinner } from '@/ui/customizables';
import { Card } from '@/ui/elements/Card';
import { withCardStateProvider } from '@/ui/elements/contexts';
import { Header } from '@/ui/elements/Header';
import { useMultipleSessions } from '@/ui/hooks/useMultipleSessions';
import { useOrganizationListInView } from '@/ui/hooks/useOrganizationListInView';

Expand All @@ -13,24 +14,10 @@ import { ChooseOrganizationScreen } from './ChooseOrganizationScreen';
import { CreateOrganizationScreen } from './CreateOrganizationScreen';

const TaskChooseOrganizationInternal = () => {
const { signOut } = useClerk();
const { user } = useUser();
const { session } = useSession();
const { userMemberships, userSuggestions, userInvitations } = useOrganizationListInView();
const { otherSessions } = useMultipleSessions({ user });
const { navigateAfterSignOut, navigateAfterMultiSessionSingleSignOutUrl } = useSignOutContext();

const handleSignOut = () => {
if (otherSessions.length === 0) {
return signOut(navigateAfterSignOut);
}

return signOut(navigateAfterMultiSessionSingleSignOutUrl, { sessionId: session?.id });
};

const isLoading = userMemberships?.isLoading || userInvitations?.isLoading || userSuggestions?.isLoading;
const hasExistingResources = !!(userMemberships?.count || userInvitations?.count || userSuggestions?.count);
const identifier = user?.primaryEmailAddress?.emailAddress ?? user?.username;

return (
<Flow.Root flow='taskChooseOrganization'>
Expand Down Expand Up @@ -58,34 +45,56 @@ const TaskChooseOrganizationInternal = () => {
)}
</Card.Content>

<Card.Footer>
<Card.Action
elementId='signOut'
gap={2}
justify='center'
sx={() => ({ width: '100%' })}
>
{identifier && (
<Card.ActionText
truncate
localizationKey={localizationKeys('taskChooseOrganization.signOut.actionText', {
identifier,
})}
/>
)}
<Card.ActionLink
sx={() => ({ flexShrink: 0 })}
onClick={handleSignOut}
localizationKey={localizationKeys('taskChooseOrganization.signOut.actionLink')}
/>
</Card.Action>
</Card.Footer>
<TaskChooseOrganizationCardFooter />
</Card.Root>
</Flow.Part>
</Flow.Root>
);
};

const TaskChooseOrganizationCardFooter = () => {
const { signOut } = useClerk();
const { user } = useUser();
const { session } = useSession();
const { otherSessions } = useMultipleSessions({ user });
const { navigateAfterSignOut, navigateAfterMultiSessionSingleSignOutUrl } = useSignOutContext();

const handleSignOut = () => {
if (otherSessions.length === 0) {
return signOut(navigateAfterSignOut);
}

return signOut(navigateAfterMultiSessionSingleSignOutUrl, { sessionId: session?.id });
};

const identifier = user?.primaryEmailAddress?.emailAddress ?? user?.username;

return (
<Card.Footer>
<Card.Action
elementId='signOut'
gap={2}
justify='center'
sx={() => ({ width: '100%' })}
>
{identifier && (
<Card.ActionText
truncate
localizationKey={localizationKeys('taskChooseOrganization.signOut.actionText', {
identifier,
})}
/>
)}
<Card.ActionLink
sx={() => ({ flexShrink: 0 })}
onClick={handleSignOut}
localizationKey={localizationKeys('taskChooseOrganization.signOut.actionLink')}
/>
</Card.Action>
</Card.Footer>
);
};

type TaskChooseOrganizationFlowsProps = {
initialFlow: 'create' | 'choose';
};
Expand All @@ -104,6 +113,44 @@ const TaskChooseOrganizationFlows = withCardStateProvider((props: TaskChooseOrga
return <ChooseOrganizationScreen onCreateOrganizationClick={() => setCurrentFlow('create')} />;
});

export const withOrganizationCreationEnabledGuard = <T extends object>(Component: ComponentType<T>) => {
return (props: T) => {
const { user } = useUser();

if (!user?.createOrganizationEnabled) {
return <OrganizationCreationDisabledScreen />;
}

return <Component {...props} />;
};
};

function OrganizationCreationDisabledScreen() {
return (
<Flow.Root flow='taskChooseOrganization'>
<Flow.Part part='organizationCreationDisabled'>
<Card.Root>
<Card.Content>
<Header.Root showLogo>
<Header.Title
localizationKey={localizationKeys('taskChooseOrganization.organizationCreationDisabled.title')}
/>
<Header.Subtitle
localizationKey={localizationKeys('taskChooseOrganization.organizationCreationDisabled.subtitle')}
/>
</Header.Root>
</Card.Content>

<TaskChooseOrganizationCardFooter />
</Card.Root>
</Flow.Part>
</Flow.Root>
);
}

export const TaskChooseOrganization = withCoreSessionSwitchGuard(
withTaskGuard(withCardStateProvider(TaskChooseOrganizationInternal), 'choose-organization'),
withTaskGuard(
withCardStateProvider(withOrganizationCreationEnabledGuard(TaskChooseOrganizationInternal)),
'choose-organization',
),
);
1 change: 1 addition & 0 deletions packages/clerk-js/src/ui/elements/contexts/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,7 @@ export type FlowMetadata = {
| 'complete'
| 'accountSwitcher'
| 'chooseOrganization'
| 'organizationCreationDisabled'
| 'enterpriseConnections'
| 'chooseWallet';
};
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/ar-SA.ts
Original file line number Diff line number Diff line change
Expand Up @@ -867,6 +867,10 @@ export const arSA: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'يجب أن تنتمي إلى منظمة',
subtitle: 'تواصل مع مسؤول منظمتك للحصول على دعوة.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/be-BY.ts
Original file line number Diff line number Diff line change
Expand Up @@ -875,6 +875,10 @@ export const beBY: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Вы павінны належаць да арганізацыі',
subtitle: 'Звярніцеся да адміністратара вашай арганізацыі для атрымання запрашэння.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/bg-BG.ts
Original file line number Diff line number Diff line change
Expand Up @@ -871,6 +871,10 @@ export const bgBG: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Трябва да принадлежите към организация',
subtitle: 'Свържете се с администратора на вашата организация за покана.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/bn-IN.ts
Original file line number Diff line number Diff line change
Expand Up @@ -875,6 +875,10 @@ export const bnIN: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'আপনাকে অবশ্যই একটি সংগঠনের অন্তর্ভুক্ত হতে হবে',
subtitle: 'আমন্ত্রণের জন্য আপনার সংগঠনের প্রশাসকের সাথে যোগাযোগ করুন।',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/ca-ES.ts
Original file line number Diff line number Diff line change
Expand Up @@ -870,6 +870,10 @@ export const caES: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Heu de pertànyer a una organització',
subtitle: "Contacteu amb l'administrador de la vostra organització per obtenir una invitació.",
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/cs-CZ.ts
Original file line number Diff line number Diff line change
Expand Up @@ -881,6 +881,10 @@ export const csCZ: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Musíte patřit do organizace',
subtitle: 'Kontaktujte administrátora vaší organizace pro pozvánku.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/da-DK.ts
Original file line number Diff line number Diff line change
Expand Up @@ -868,6 +868,10 @@ export const daDK: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Du skal tilhøre en organisation',
subtitle: 'Kontakt din organisationsadministrator for en invitation.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/de-DE.ts
Original file line number Diff line number Diff line change
Expand Up @@ -885,6 +885,10 @@ export const deDE: LocalizationResource = {
subtitle: 'Geben Sie Ihre Organisationsdetails ein, um fortzufahren',
title: 'Organisation einrichten',
},
organizationCreationDisabled: {
title: 'Sie müssen einer Organisation angehören',
subtitle: 'Kontaktieren Sie Ihren Organisationsadministrator für eine Einladung.',
},
signOut: {
actionLink: 'Abmelden',
actionText: 'Angemeldet als {{identifier}}',
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/el-GR.ts
Original file line number Diff line number Diff line change
Expand Up @@ -872,6 +872,10 @@ export const elGR: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Πρέπει να ανήκετε σε έναν οργανισμό',
subtitle: 'Επικοινωνήστε με τον διαχειριστή του οργανισμού σας για πρόσκληση.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/en-GB.ts
Original file line number Diff line number Diff line change
Expand Up @@ -872,6 +872,10 @@ export const enGB: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'You must belong to an organisation',
subtitle: 'Contact your organisation admin for an invitation.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/en-US.ts
Original file line number Diff line number Diff line change
Expand Up @@ -869,6 +869,10 @@ export const enUS: LocalizationResource = {
subtitle: 'Enter your organization details to continue',
title: 'Setup your organization',
},
organizationCreationDisabled: {
title: 'You must belong to an organization',
subtitle: 'Contact your organization admin for an invitation.',
},
signOut: {
actionLink: 'Sign out',
actionText: 'Signed in as {{identifier}}',
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/es-CR.ts
Original file line number Diff line number Diff line change
Expand Up @@ -877,6 +877,10 @@ export const esCR: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Debe pertenecer a una organización',
subtitle: 'Contacte al administrador de su organización para obtener una invitación.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/es-ES.ts
Original file line number Diff line number Diff line change
Expand Up @@ -871,6 +871,10 @@ export const esES: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Debe pertenecer a una organización',
subtitle: 'Contacte al administrador de su organización para obtener una invitación.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/es-MX.ts
Original file line number Diff line number Diff line change
Expand Up @@ -878,6 +878,10 @@ export const esMX: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Debe pertenecer a una organización',
subtitle: 'Contacte al administrador de su organización para obtener una invitación.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/es-UY.ts
Original file line number Diff line number Diff line change
Expand Up @@ -877,6 +877,10 @@ export const esUY: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Debés pertenecer a una organización',
subtitle: 'Contactá al administrador de tu organización para obtener una invitación.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/fa-IR.ts
Original file line number Diff line number Diff line change
Expand Up @@ -881,6 +881,10 @@ export const faIR: LocalizationResource = {
subtitle: 'سازمان جدیدی برای شروع کار ایجاد کنید',
title: 'ایجاد سازمان جدید',
},
organizationCreationDisabled: {
title: 'شما باید عضو یک سازمان باشید',
subtitle: 'برای دریافت دعوتنامه با مدیر سازمان خود تماس بگیرید.',
},
signOut: {
actionLink: 'خروج از همه حساب‌ها',
actionText: 'می‌خواهید خارج شوید؟',
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/fi-FI.ts
Original file line number Diff line number Diff line change
Expand Up @@ -871,6 +871,10 @@ export const fiFI: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'Sinun täytyy kuulua organisaatioon',
subtitle: 'Ota yhteyttä organisaatiosi ylläpitäjään saadaksesi kutsun.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/fr-FR.ts
Original file line number Diff line number Diff line change
Expand Up @@ -886,6 +886,10 @@ export const frFR: LocalizationResource = {
subtitle: 'Entrez les détails de votre organisation pour continuer',
title: 'Configurer votre organisation',
},
organizationCreationDisabled: {
title: 'Vous devez appartenir à une organisation',
subtitle: "Contactez l'administrateur de votre organisation pour obtenir une invitation.",
},
signOut: {
actionLink: 'Se déconnecter',
actionText: 'Connecté en tant que {{identifier}}',
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/he-IL.ts
Original file line number Diff line number Diff line change
Expand Up @@ -861,6 +861,10 @@ export const heIL: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'עליך להשתייך לארגון',
subtitle: 'פנה למנהל הארגון שלך לקבלת הזמנה.',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
4 changes: 4 additions & 0 deletions packages/localizations/src/hi-IN.ts
Original file line number Diff line number Diff line change
Expand Up @@ -875,6 +875,10 @@ export const hiIN: LocalizationResource = {
subtitle: undefined,
title: undefined,
},
organizationCreationDisabled: {
title: 'आपको किसी संगठन से संबंधित होना चाहिए',
subtitle: 'आमंत्रण के लिए अपने संगठन के व्यवस्थापक से संपर्क करें।',
},
signOut: {
actionLink: undefined,
actionText: undefined,
Expand Down
Loading