Set default values in new participant form when user is logged in (#1501)

This commit is contained in:
Luke Vella 2025-01-17 11:39:24 +00:00 committed by GitHub
parent aad31ff722
commit bbf9bae28f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -9,13 +9,13 @@ import { TRPCClientError } from "@trpc/client";
import clsx from "clsx"; import clsx from "clsx";
import { useTranslation } from "next-i18next"; import { useTranslation } from "next-i18next";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { useMount } from "react-use";
import z from "zod"; import z from "zod";
import { usePoll } from "@/contexts/poll"; import { usePoll } from "@/contexts/poll";
import { useAddParticipantMutation } from "./poll/mutations"; import { useAddParticipantMutation } from "./poll/mutations";
import VoteIcon from "./poll/vote-icon"; import VoteIcon from "./poll/vote-icon";
import { useUser } from "./user-provider";
const requiredEmailSchema = z.object({ const requiredEmailSchema = z.object({
requireEmail: z.literal(true), requireEmail: z.literal(true),
@ -90,17 +90,23 @@ export const NewParticipantForm = (props: NewParticipantModalProps) => {
const isEmailRequired = poll.requireParticipantEmail; const isEmailRequired = poll.requireParticipantEmail;
const { register, setError, formState, setFocus, handleSubmit } = const { user } = useUser();
const isLoggedIn = !user.isGuest;
const { register, setError, formState, handleSubmit } =
useForm<NewParticipantFormData>({ useForm<NewParticipantFormData>({
resolver: zodResolver(schema), resolver: zodResolver(schema),
defaultValues: { defaultValues: {
requireEmail: isEmailRequired, requireEmail: isEmailRequired,
...(isLoggedIn
? { name: user.name, email: user.email ?? "" }
: {
name: "",
email: "",
}),
}, },
}); });
const addParticipant = useAddParticipantMutation(); const addParticipant = useAddParticipantMutation();
useMount(() => {
setFocus("name");
});
return ( return (
<form <form
@ -131,6 +137,7 @@ export const NewParticipantForm = (props: NewParticipantModalProps) => {
<Input <Input
className="w-full" className="w-full"
data-1p-ignore="true" data-1p-ignore="true"
autoFocus={true}
error={!!formState.errors.name} error={!!formState.errors.name}
disabled={formState.isSubmitting} disabled={formState.isSubmitting}
placeholder={t("namePlaceholder")} placeholder={t("namePlaceholder")}