72 lines
2.2 KiB
TypeScript
72 lines
2.2 KiB
TypeScript
'use client'
|
|
|
|
import { useState } from 'react'
|
|
import { AuthForm, AuthFormData } from '@/components/AuthForm'
|
|
|
|
export default function ForgotPasswordPage() {
|
|
const [isLoading, setIsLoading] = useState(false)
|
|
const [error, setError] = useState<string>()
|
|
const [success, setSuccess] = useState(false)
|
|
|
|
const handleSubmit = async (data: AuthFormData) => {
|
|
setIsLoading(true)
|
|
setError(undefined)
|
|
|
|
try {
|
|
const res = await fetch('/api/auth/forgot-password', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ email: data.email }),
|
|
})
|
|
|
|
const result = await res.json()
|
|
|
|
if (!res.ok) {
|
|
setError(result.error || 'Failed to send reset link')
|
|
return
|
|
}
|
|
|
|
setSuccess(true)
|
|
} catch {
|
|
setError('Something went wrong. Please try again.')
|
|
} finally {
|
|
setIsLoading(false)
|
|
}
|
|
}
|
|
|
|
if (success) {
|
|
return (
|
|
<main className="min-h-screen bg-zinc-950 flex items-center justify-center p-4">
|
|
<div className="w-full max-w-md text-center">
|
|
<div className="w-16 h-16 mx-auto mb-6 rounded-full bg-green-500/20 flex items-center justify-center">
|
|
<svg className="w-8 h-8 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
|
|
</svg>
|
|
</div>
|
|
<h1 className="text-2xl font-bold text-white mb-2">Check your email</h1>
|
|
<p className="text-zinc-400">
|
|
If an account exists with that email, we've sent a password reset link.
|
|
</p>
|
|
</div>
|
|
</main>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<main className="min-h-screen bg-zinc-950 flex items-center justify-center p-4">
|
|
<div className="w-full max-w-md">
|
|
<div className="text-center mb-8">
|
|
<h1 className="text-4xl font-bold text-white mb-2">Reset Password</h1>
|
|
<p className="text-zinc-400">Enter your email to receive a reset link</p>
|
|
</div>
|
|
<AuthForm
|
|
mode="forgot-password"
|
|
onSubmit={handleSubmit}
|
|
isLoading={isLoading}
|
|
error={error}
|
|
/>
|
|
</div>
|
|
</main>
|
|
)
|
|
}
|