'use client'
import { useState } from 'react'
import Link from 'next/link'
import { api } from '@/lib/api'

export default function ForgotPasswordPage() {
  const [email, setEmail] = useState('')
  const [sent, setSent] = useState(false)
  const [busy, setBusy] = useState(false)
  const submit = async (e: React.FormEvent) => {
    e.preventDefault(); setBusy(true)
    try { await api.post('/auth/forgot-password', { email }) } catch { /* ignore to avoid user enumeration */ }
    setSent(true); setBusy(false)
  }
  return (
    <div className="container-x flex justify-center py-12">
      <div className="card w-full max-w-md p-6">
        <h1 className="text-xl font-bold">Reset password</h1>
        {sent ? (
          <p className="mt-3 text-sm text-muted">If an account exists for {email}, we’ve sent a reset code. Check your email.</p>
        ) : (
          <form onSubmit={submit} className="mt-5 space-y-3">
            <input className="input" type="email" placeholder="Your email" value={email} onChange={(e) => setEmail(e.target.value)} />
            <button disabled={busy} className="btn btn-primary w-full disabled:opacity-60">{busy ? 'Sending…' : 'Send reset code'}</button>
          </form>
        )}
        <Link href="/login" className="mt-4 block text-center text-sm text-brand-strong hover:underline">Back to sign in</Link>
      </div>
    </div>
  )
}