feat(auth): enable email verification with Resend (#173)

feat(auth): enable email verification with Resend

src/pages/Register.tsx

@@ -8,6 +8,9 @@ export function Register() {
   const [password, setPassword] = useState('')
   const [error, setError] = useState('')
   const [loading, setLoading] = useState(false)
+  const [registrationComplete, setRegistrationComplete] = useState(false)
+  const [resendLoading, setResendLoading] = useState(false)
+  const [resendMessage, setResendMessage] = useState('')
   const navigate = useNavigate()
 
   async function handleSubmit(e: React.FormEvent) {
@@ -36,15 +39,7 @@ export function Register() {
         throw new Error(authError.message ?? 'Registration failed')
       }
 
-      // After successful signUp, force a session fetch to confirm the cookie is set
-      // before navigating to the protected route
-      const sessionResult = await authClient.getSession()
-      if (sessionResult.data) {
-        navigate('/')
-      } else {
-        // Session not established — show success message and link to login
-        setError('Account created! Please sign in.')
-      }
+      setRegistrationComplete(true)
     } catch {
       setError('Registration failed. Please try again.')
     } finally {
@@ -52,6 +47,49 @@ export function Register() {
     }
   }
 
+  async function handleResendVerification() {
+    setResendLoading(true)
+    setResendMessage('')
+    try {
+      const { error } = await authClient.sendVerificationEmail({ email })
+      if (error) {
+        setResendMessage('Failed to resend. Please try again.')
+      } else {
+        setResendMessage('Verification email sent!')
+      }
+    } finally {
+      setResendLoading(false)
+    }
+  }
+
+  if (registrationComplete) {
+    return (
+      <div className="flex min-h-screen flex-col items-center justify-center px-4">
+        <h1 className="mb-2 text-3xl font-bold text-gray-900">Check your email</h1>
+        <p className="mb-8 text-sm text-gray-500">
+          We sent a verification link to {email}. Click it to activate your account.
+        </p>
+        <button
+          type="button"
+          onClick={handleResendVerification}
+          disabled={resendLoading}
+          className="min-h-12 rounded-xl bg-brand-blue px-6 py-3 text-base font-medium text-white active:bg-brand-blue/90 disabled:opacity-60"
+        >
+          {resendLoading ? 'Sending...' : 'Resend email'}
+        </button>
+        {resendMessage && (
+          <p className="mt-4 text-sm text-gray-500">{resendMessage}</p>
+        )}
+        <p className="mt-6 text-sm text-gray-500">
+          Already have an account?{' '}
+          <Link to="/login" className="text-brand-blue">
+            Sign in
+          </Link>
+        </p>
+      </div>
+    )
+  }
+
   return (
     <div className="flex min-h-screen flex-col items-center justify-center px-4">
       <h1 className="mb-2 text-3xl font-bold text-gray-900">Create Account</h1>