set date of birth to undefined to avoid hydration errors
All checks were successful
Lint / Lint (push) Successful in 32s

This commit is contained in:
Felix Schulze 2024-10-29 21:19:58 +01:00
parent cc7d97e961
commit 908f4491d4

View File

@ -5,15 +5,7 @@ import { useForm } from "react-hook-form";
import { z } from "zod"; import { z } from "zod";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { format } from "date-fns"; import { format } from "date-fns";
import { CalendarIcon } from "lucide-react"; import { CalendarIcon } from "lucide-react";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
@ -39,7 +31,7 @@ export default function SignUp() {
defaultValues: { defaultValues: {
name: "", name: "",
email: "", email: "",
dob: youngestDate, dob: undefined,
}, },
}); });
async function onSubmit(values: z.infer<typeof signupFormSchema>) { async function onSubmit(values: z.infer<typeof signupFormSchema>) {
@ -59,9 +51,7 @@ export default function SignUp() {
<FormControl> <FormControl>
<Input placeholder="name@example.com" {...field} /> <Input placeholder="name@example.com" {...field} />
</FormControl> </FormControl>
<FormDescription> <FormDescription>We will contact you here with information about events.</FormDescription>
We will contact you here with information about events.
</FormDescription>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
@ -91,10 +81,7 @@ export default function SignUp() {
<FormControl> <FormControl>
<Button <Button
variant={"outline"} variant={"outline"}
className={cn( className={cn("w-[240px] pl-3 text-left font-normal", !field.value && "text-muted-foreground")}
"w-[240px] pl-3 text-left font-normal",
!field.value && "text-muted-foreground"
)}
> >
{field.value ? format(field.value, "PPP") : <span>Pick a date</span>} {field.value ? format(field.value, "PPP") : <span>Pick a date</span>}
<CalendarIcon className="ml-auto h-4 w-4 opacity-50" /> <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />