Add enterprise_sso for session reverification

Author: LauraBeatris

packages/clerk-js/src/ui/components/UserVerification/UVFactorOneEnterpriseSSOCard.tsx

@@ -0,0 +1,29 @@
+import type { EnterpriseSSOFactor, SessionVerificationFirstFactor } from '@clerk/types';
+
+import { Card, Card } from '@/ui/elements/Card';
+import { Header } from '@/ui/elements/Header';
+
+import { localizationKeys } from '../../customizables';
+
+type UVFactorOneEnterpriseSSOCardProps = {
+  currentFactor: EnterpriseSSOFactor;
+  availableFactors: SessionVerificationFirstFactor[] | null;
+};
+
+export const UVFactorOneEnterpriseSSOCard = (_props: UVFactorOneEnterpriseSSOCardProps) => {
+  return (
+    <Card.Root>
+      <Card.Content>
+        <Header.Root showLogo>
+          {/* TODO - Display headers depending on whether there's a single or multiple connections */}
+          <Header.Title localizationKey={localizationKeys('reverification.enterprise_sso.title')} />
+          <Header.Subtitle localizationKey={localizationKeys('reverification.enterprise_sso.subtitle')} />
+        </Header.Root>
+        <Card.Alert>{card.error}</Card.Alert>
+        {/* TODO -> Display option to choose enterprise SSO */}
+      </Card.Content>
+
+      <Card.Footer />
+    </Card.Root>
+  );
+};

packages/clerk-js/src/ui/components/UserVerification/UserVerificationFactorOne.tsx

@@ -15,6 +15,7 @@ import { UserVerificationFactorOnePasswordCard } from './UserVerificationFactorO
 import { useUserVerificationSession, withUserVerificationSessionGuard } from './useUserVerificationSession';
 import { sortByPrimaryFactor } from './utils';
 import { UVFactorOneEmailCodeCard } from './UVFactorOneEmailCodeCard';
+import { UVFactorOneEnterpriseSSOCard } from './UVFactorOneEnterpriseSSOCard';
 import { UVFactorOnePasskeysCard } from './UVFactorOnePasskeysCard';
 import { UVFactorOnePhoneCodeCard } from './UVFactorOnePhoneCodeCard';
 
@@ -156,6 +157,13 @@ export function UserVerificationFactorOneInternal(): JSX.Element | null {
       );
     case 'passkey':
       return <UVFactorOnePasskeysCard onShowAlternativeMethodsClicked={toggleAllStrategies} />;
+    case 'enterprise_sso':
+      return (
+        <UVFactorOneEnterpriseSSOCard
+          currentFactor={currentFactor}
+          availableFactors={availableFactors}
+        />
+      );
     default:
       return <LoadingCard />;
   }