Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | 1x 1x 1x 1x 1x 16x 16x 16x 16x 16x 1x 1x 1x 16x 16x 16x 16x 1x 1x 1x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 5x 5x 5x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x | import { FormEventHandler } from 'react';
import { Head, Link, useForm } from '@inertiajs/react';
import GuestLayout from '@/Components/GuestLayout';
import { Button } from '@/Components/ui/Button';
import { Input } from '@/Components/ui/Input';
import { Label } from '@/Components/ui/Label';
export default function ForgotPassword({ status }: { status?: string }) {
const { data, setData, post, processing, errors } = useForm({
email: '',
});
const submit: FormEventHandler = (e) => {
e.preventDefault();
post(route('password.email'));
};
return (
<GuestLayout header="Forgot your password?" subheader="No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.">
<Head title="Forgot Password" />
{status && (
<div className="mb-4 p-3 bg-green-900 border border-green-800 rounded-md">
<p className="text-sm text-green-400">{status}</p>
</div>
)}
<form onSubmit={submit} className="space-y-4">
<div>
<Label htmlFor="email" className="">
Email Address
</Label>
<Input
id="email"
type="email"
name="email"
value={data.email}
className="mt-1 "
autoComplete="username"
error={!!errors.email}
onChange={(e) => setData('email', e.target.value)}
placeholder="Enter your email"
autoFocus
/>
{errors.email && (
<p className="mt-1 text-sm text-destructive">
{errors.email}
</p>
)}
</div>
<Button type="submit" loading={processing} className="w-full">
Email Password Reset Link
</Button>
<div className="text-center pt-4">
<Link
href={route('login')}
className="text-sm text-muted-foreground hover:text-foreground"
>
Back to login
</Link>
</div>
</form>
</GuestLayout>
);
} |