1'use client';23import Link from 'next/link';4import { useActionState } from 'react';5import { forgotAction } from '@/lib/auth/actions';6import { idle } from '@/lib/auth/state';7import { Field, FormMessage, SubmitButton, TextInput } from '@/components/account/form';89export function ForgotForm() {10 const [state, action] = useActionState(forgotAction, idle);11 return (12 <form action={action} className="mt-6 space-y-4" noValidate>13 <FormMessage state={state} />14 <Field label="E-mail" name="email">15 <TextInput name="email" type="email" autoComplete="email" required autoFocus placeholder="you@example.com" />16 </Field>17 <SubmitButton className="w-full" pendingText="Sending…">18 Send reset code19 </SubmitButton>20 {state.ok ? (21 <p className="text-center text-xs text-muted">22 Got the code?{' '}23 <Link href="/reset" className="font-medium text-fg underline-offset-4 hover:underline">24 Enter it here25 </Link>26 </p>27 ) : null}28 </form>29 );30}31