Auth Redirect

1"use client"
2 
3import { getAuthRedirectAction } from "@better-auth-ui/core"
4import { useAuth, useSession } from "@better-auth-ui/react"
5import { useEffect, useRef } from "react"
6import { Spinner } from "@/components/ui/spinner"
7import { cn } from "@/lib/utils"
8 
9export type AuthRedirectProps = {
10  className?: string
11}
12 
13/**
14 * Redirects authenticated users to a validated same-origin target.
15 *
16 * Signed-out users are sent through the sign-in view first. The redirect view
17 * is preserved as the post-authentication destination so API callbacks receive
18 * a full-page request after the session is established.
19 *
20 * @param className - Optional additional class names applied to the spinner
21 * @returns The centered spinner shown while the session and redirect resolve
22 */
23export function AuthRedirect({ className }: AuthRedirectProps) {
24  const { authClient, basePaths, viewPaths } = useAuth()
25  const { data: session, isPending } = useSession(authClient)
26  const hasRedirected = useRef(false)
27 
28  useEffect(() => {
29    if (isPending || hasRedirected.current) return
30    hasRedirected.current = true
31 
32    const action = getAuthRedirectAction(
33      new URL(window.location.href),
34      Boolean(session),
35      `${basePaths.auth}/${viewPaths.auth.signIn}`
36    )
37 
38    window.location.replace(action.to)
39  }, [basePaths.auth, isPending, session, viewPaths.auth.signIn])
40 
41  return <Spinner className={cn("mx-auto my-auto", className)} />
42}