TypeScript 97.5%
SQL 1.4%
Python 0.8%
1"use client";2import * as React from "react";3import Link from "next/link";4import { authClient } from "@/lib/auth-client";5import { AuthCard } from "@/components/auth/auth-card";6import { Button } from "@/components/ui/button";7import { Input } from "@/components/ui/input";8import { Field, Label } from "@/components/ui/label";9import { Alert } from "@/components/ui/alert";1011export default function ForgotPasswordPage() {12 const [email, setEmail] = React.useState("");13 const [sent, setSent] = React.useState(false);14 const [loading, setLoading] = React.useState(false);15 const [error, setError] = React.useState<string | null>(null);1617 async function onSubmit(e: React.FormEvent) {18 e.preventDefault();19 setLoading(true);20 setError(null);21 const { error } = await authClient.requestPasswordReset({ email: email.trim(), redirectTo: "/reset-password" });22 setLoading(false);23 if (error && error.status === 429) return setError("Too many attempts. Wait a minute and try again.");24 setSent(true); // Always confirm to avoid leaking whether an account exists.25 }2627 return (28 <AuthCard29 title="Reset your password"30 description="Enter your account email and we will send a link to choose a new password."31 footer={<Link href="/login" className="font-medium text-fg underline-offset-4 hover:underline">Back to log in</Link>}32 >33 {sent ? (34 <Alert variant="success" title="Check your inbox">If an account exists for {email}, a reset link is on its way. It expires in one hour.</Alert>35 ) : (36 <form onSubmit={onSubmit} className="grid gap-4" noValidate>37 {error ? <Alert variant="danger">{error}</Alert> : null}38 <Field>39 <Label htmlFor="email">Email</Label>40 <Input id="email" type="email" autoComplete="email" required value={email} onChange={(e) => setEmail(e.target.value)} placeholder="you@company.com" autoFocus />41 </Field>42 <Button type="submit" size="lg" loading={loading} className="w-full">Send reset link</Button>43 </form>44 )}45 </AuthCard>46 );47}48