Added routes

2026-09-25 10:05:56 -03:00
parent 336e1af523
commit 94c353f4f2
100 changed files with 6126 additions and 183 deletions
--- a/apps/web/src/features/auth/VerifyEmailPage.tsx
+++ b/apps/web/src/features/auth/VerifyEmailPage.tsx
@@ -0,0 +1,91 @@
+import { useEffect, useState } from 'react'
+import { Link, useNavigate, useSearch } from '@tanstack/react-router'
+import { MailCheck, MailWarning, Loader2 } from 'lucide-react'
+import { authClient } from '../../lib/auth-client'
+import { AuthShell } from './AuthShell'
+
+type SearchParams = {
+  token?: string
+  email?: string
+}
+
+type Status = 'idle' | 'verifying' | 'success' | 'error'
+
+export function VerifyEmailPage() {
+  const { token, email } = useSearch({ strict: false }) as SearchParams
+  const navigate = useNavigate()
+  const [status, setStatus] = useState<Status>(token ? 'verifying' : 'idle')
+
+  useEffect(() => {
+    if (!token || status !== 'verifying') return
+    let cancelled = false
+    authClient
+      .verifyEmail({ query: { token } })
+      .then(async ({ error }) => {
+        if (cancelled) return
+        if (error) {
+          setStatus('error')
+          return
+        }
+        await authClient.getSession()
+        navigate({ to: '/' })
+      })
+      .catch(() => {
+        if (!cancelled) setStatus('error')
+      })
+    return () => {
+      cancelled = true
+    }
+  }, [token, status, navigate])
+
+  const title =
+    status === 'success'
+      ? 'Email verificado'
+      : status === 'error'
+        ? 'Vínculo inválido'
+        : 'Verificá tu email'
+
+  return (
+    <AuthShell title={title}>
+      <div className="flex flex-col items-center gap-4 py-2 text-center">
+        {status === 'verifying' ? (
+          <Loader2 className="size-10 animate-spin text-accent" />
+        ) : status === 'success' ? (
+          <MailCheck className="size-10 text-success" />
+        ) : (
+          <MailWarning className="size-10 text-warning" />
+        )}
+
+        {status === 'success' ? (
+          <p className="text-sm text-foreground/60">
+            Tu cuenta quedó verificada. Te estamos llevando a Gruperly…
+          </p>
+        ) : status === 'error' ? (
+          <p className="text-sm text-foreground/60">
+            El vínculo de verificación no es válido o expiró.
+          </p>
+        ) : (
+          <p className="text-sm text-foreground/60">
+            Te enviamos un correo a <span className="font-medium text-primary">{email}</span> para
+            confirmar tu cuenta.
+          </p>
+        )}
+
+        {status === 'success' ? (
+          <Link
+            to="/"
+            className="w-full rounded-xl bg-accent py-2 text-center text-sm font-medium text-on-accent hover:bg-accent-strong"
+          >
+            Ir a Gruperly
+          </Link>
+        ) : null}
+
+        {status === 'error' ? (
+          <Link to="/login" className="text-sm font-medium text-accent hover:underline">
+            Intentar iniciar sesión
+          </Link>
+        ) : null}
+      </div>
+    </AuthShell>
+  )
+}