9ea2d3325d
Some checks are pending
E2E / Playwright e2e (push) Waiting to run
- Updated login and signup components to utilize AuthCard for better user experience during redirection. - Introduced AuthentikEmbedDialog for seamless integration of Authentik's identity portal within the application. - Enhanced password recovery and signup flows with dynamic theme handling and improved loading states. - Refactored existing components to streamline authentication processes and improve maintainability.
84 lines
2.8 KiB
TypeScript
84 lines
2.8 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { useEffect } from "react"
|
|
import { useTheme } from "next-themes"
|
|
import { Loader2 } from "lucide-react"
|
|
import { AuthCard } from "@/components/auth/auth-card"
|
|
import { AuthFlowPage } from "@/components/auth/auth-flow-page"
|
|
import {
|
|
authentikEnrollmentFlowUrl,
|
|
resolveAuthentikTheme,
|
|
} from "@/lib/auth/authentik-user-url"
|
|
import { AUTH_FLOW_SLUGS } from "@/lib/auth/auth-flow-slugs"
|
|
import { useClientThemeStore } from "@/lib/stores/client-theme-store"
|
|
import { useNativeRuntime } from "@/lib/platform"
|
|
|
|
type SignupPageContentProps = {
|
|
returnTo?: string
|
|
}
|
|
|
|
export function SignupPageContent({ returnTo = "/mail/inbox" }: SignupPageContentProps) {
|
|
const native = useNativeRuntime()
|
|
const themeMode = useClientThemeStore((s) => s.themeMode)
|
|
const { resolvedTheme } = useTheme()
|
|
const authentikTheme = resolveAuthentikTheme(themeMode, resolvedTheme)
|
|
const flowUrl = authentikEnrollmentFlowUrl(authentikTheme)
|
|
const loginHref = `/login?returnTo=${encodeURIComponent(returnTo)}`
|
|
const oidcHref = `/api/auth/login?returnTo=${encodeURIComponent(returnTo)}`
|
|
|
|
useEffect(() => {
|
|
if (!native && flowUrl) {
|
|
window.location.replace(flowUrl)
|
|
}
|
|
}, [native, flowUrl])
|
|
|
|
if (native) {
|
|
return (
|
|
<AuthFlowPage
|
|
slug={AUTH_FLOW_SLUGS.enrollment}
|
|
defaultTitle="Créer un compte"
|
|
defaultDescription="Choisissez votre identifiant @ultisuite.fr et configurez votre profil."
|
|
successTitle="Compte créé"
|
|
successDescription="Votre compte UltiSpace est prêt. Connectez-vous pour accéder à la suite."
|
|
successActionLabel="Se connecter"
|
|
successHref={oidcHref}
|
|
successExternal
|
|
footer={
|
|
<p className="w-full text-center text-sm text-muted-foreground">
|
|
Déjà un compte ?{" "}
|
|
<Link className="font-medium text-primary underline" href={loginHref}>
|
|
Se connecter
|
|
</Link>
|
|
</p>
|
|
}
|
|
/>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<AuthCard
|
|
title="Créer un compte"
|
|
description="Redirection vers l'inscription…"
|
|
footer={
|
|
<p className="w-full text-center text-sm text-muted-foreground">
|
|
Déjà un compte ?{" "}
|
|
<Link className="font-medium text-primary underline" href={loginHref}>
|
|
Se connecter
|
|
</Link>
|
|
</p>
|
|
}
|
|
>
|
|
<div className="flex flex-col items-center gap-4 py-8">
|
|
<Loader2 className="size-6 animate-spin text-muted-foreground" aria-hidden />
|
|
<span className="sr-only">Redirection…</span>
|
|
{!flowUrl ? (
|
|
<p className="text-center text-sm text-destructive" role="alert">
|
|
Configuration Authentik indisponible.
|
|
</p>
|
|
) : null}
|
|
</div>
|
|
</AuthCard>
|
|
)
|
|
}
|