78 lines
2.6 KiB
TypeScript
78 lines
2.6 KiB
TypeScript
"use client"
|
|
|
|
import { zodResolver } from "@hookform/resolvers/zod"
|
|
import { useForm } from "react-hook-form"
|
|
import { z } from "zod"
|
|
import { useRouter } from "next/navigation"
|
|
import { toast } from "sonner"
|
|
import { Lock } from "lucide-react"
|
|
|
|
import { Button } from "@/components/ui/button"
|
|
import {
|
|
Form,
|
|
FormControl,
|
|
FormField,
|
|
FormItem,
|
|
FormLabel,
|
|
FormMessage,
|
|
} from "@/components/ui/form"
|
|
import { Input } from "@/components/ui/input"
|
|
import { verifyPlanPassword } from "@/app/actions/auth"
|
|
|
|
const formSchema = z.object({
|
|
password: z.string().min(1, "Password is required"),
|
|
})
|
|
|
|
export function PlanLoginForm({ planId }: { planId: string }) {
|
|
const router = useRouter()
|
|
const form = useForm<z.infer<typeof formSchema>>({
|
|
resolver: zodResolver(formSchema),
|
|
defaultValues: {
|
|
password: "",
|
|
},
|
|
})
|
|
|
|
async function onSubmit(values: z.infer<typeof formSchema>) {
|
|
try {
|
|
const success = await verifyPlanPassword(planId, values.password)
|
|
if (success) {
|
|
toast.success("Access granted!")
|
|
router.refresh() // Refresh to trigger server re-render with cookie
|
|
} else {
|
|
toast.error("Invalid password")
|
|
}
|
|
} catch {
|
|
toast.error("Something went wrong")
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-col items-center justify-center min-h-[50vh] space-y-4">
|
|
<div className="p-4 bg-muted rounded-full">
|
|
<Lock className="w-8 h-8 opacity-50" />
|
|
</div>
|
|
<h2 className="text-xl font-semibold">Enter Plan Password</h2>
|
|
<Form {...form}>
|
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4 w-full max-w-xs">
|
|
<FormField
|
|
control={form.control}
|
|
name="password"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel className="sr-only">Password</FormLabel>
|
|
<FormControl>
|
|
<Input type="password" placeholder="Password" {...field} />
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
<Button type="submit" className="w-full">
|
|
Unlock Plan
|
|
</Button>
|
|
</form>
|
|
</Form>
|
|
</div>
|
|
)
|
|
}
|