58 lines
1.9 KiB
TypeScript
58 lines
1.9 KiB
TypeScript
import { forgotPasswordAction } from "@/app/actions";
|
|
import { FormMessage, Message } from "@/components/form-message";
|
|
import { SubmitButton } from "@/components/submit-button";
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/components/ui/card";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import { Separator } from "@radix-ui/react-dropdown-menu";
|
|
import { Sparkles } from "lucide-react";
|
|
import Link from "next/link";
|
|
|
|
export default function ForgotPassword({
|
|
searchParams,
|
|
}: {
|
|
searchParams: Message;
|
|
}) {
|
|
return (
|
|
<div className="flex-1 flex flex-col w-full px-8 sm:max-w-md justify-center gap-2">
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="flex flex-row gap-1 items-center">
|
|
Reset Password
|
|
<Sparkles size={20} fill="black" />
|
|
</CardTitle>
|
|
<CardDescription>
|
|
Enter your email to reset your account password.
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="grid gap-4">
|
|
{/* <ToyPreview /> */}
|
|
<form className="flex-1 flex flex-col w-full justify-center gap-4">
|
|
<div className="flex flex-col gap-2 [&>input]:mb-3">
|
|
<Label htmlFor="email">Email</Label>
|
|
<Input name="email" placeholder="you@example.com" required />
|
|
<SubmitButton formAction={forgotPasswordAction}>
|
|
Reset Password
|
|
</SubmitButton>
|
|
<FormMessage message={searchParams} />
|
|
</div>
|
|
<div>
|
|
<p className="text-sm text-secondary-foreground">
|
|
Already have an account?{" "}
|
|
<Link className="text-primary underline" href="/login">
|
|
Sign in
|
|
</Link>
|
|
</p>
|
|
</div>
|
|
</form>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|