Files
cat-sitting-planner/components/plan-login-form.tsx

64 lines
2.0 KiB
TypeScript

"use client"
import { useState } from "react"
import { useRouter } from "next/navigation"
import { verifyPlanPassword } from "@/app/actions/auth"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { toast } from "sonner"
interface PlanLoginFormProps {
planId: string;
dict: any;
}
export function PlanLoginForm({ planId, dict }: PlanLoginFormProps) {
const [password, setPassword] = useState("")
const [isPending, setIsPending] = useState(false)
const router = useRouter()
async function handleSubmit(e: React.FormEvent) {
e.preventDefault()
setIsPending(true)
try {
const success = await verifyPlanPassword(planId, password)
if (success) {
router.refresh()
} else {
toast.error(dict.error)
}
} catch (error) {
toast.error("An error occurred")
} finally {
setIsPending(false)
}
}
return (
<Card className="w-full max-w-sm">
<CardHeader>
<CardTitle>{dict.title}</CardTitle>
<CardDescription>
{dict.description}
</CardDescription>
</CardHeader>
<CardContent>
<form onSubmit={handleSubmit} className="space-y-4">
<Input
type="password"
placeholder="••••••••"
value={password}
onChange={(e) => setPassword(e.target.value)}
required
/>
<Button type="submit" className="w-full" disabled={isPending}>
{isPending ? "..." : dict.submit}
</Button>
</form>
</CardContent>
</Card>
)
}