refactor: type EventForm with explicit EventFormValues
This commit is contained in:
1 parent
d0f9b3ef95
commit
4991008159
1 file changed
+21
-11
@@ -16,7 +16,7 @@ import {
|
|||||||
} from "@/components/ui/select";
|
} from "@/components/ui/select";
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
import { useServerAction } from "@/hooks/use-server-action";
|
import { useServerAction } from "@/hooks/use-server-action";
|
||||||
import type { CreateEventInput } from "@/lib/validators/event";
|
import type { CreateEventInput, UpdateEventInput } from "@/lib/validators/event";
|
||||||
|
|
||||||
interface EventType {
|
interface EventType {
|
||||||
id: number;
|
id: number;
|
||||||
@@ -30,29 +30,41 @@ interface EventFormProps {
|
|||||||
defaultValues?: Partial<CreateEventInput> & { id?: number };
|
defaultValues?: Partial<CreateEventInput> & { id?: number };
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface EventFormValues {
|
||||||
|
title: string;
|
||||||
|
description: string;
|
||||||
|
image?: string | null;
|
||||||
|
maxPlayers?: string | null;
|
||||||
|
roomId?: string | null;
|
||||||
|
typeId: number;
|
||||||
|
status: string;
|
||||||
|
isRecurring: number;
|
||||||
|
startsAt?: Date | null;
|
||||||
|
endsAt?: Date | null;
|
||||||
|
}
|
||||||
|
|
||||||
export function EventForm({ eventTypes, defaultValues }: EventFormProps) {
|
export function EventForm({ eventTypes, defaultValues }: EventFormProps) {
|
||||||
const { run, isPending } = useServerAction();
|
const { run, isPending } = useServerAction();
|
||||||
const isEditing = !!defaultValues?.id;
|
const isEditing = !!defaultValues?.id;
|
||||||
|
|
||||||
const form = useForm({
|
const form = useForm<EventFormValues>({
|
||||||
defaultValues: {
|
defaultValues: {
|
||||||
title: "",
|
title: "",
|
||||||
description: "",
|
description: "",
|
||||||
typeId: eventTypes[0]?.id,
|
typeId: eventTypes[0]?.id ?? 0,
|
||||||
status: "draft",
|
status: "draft",
|
||||||
isRecurring: 0,
|
isRecurring: 0,
|
||||||
...defaultValues,
|
...defaultValues,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
// biome-ignore lint/suspicious/noExplicitAny: form values typed by useForm defaults; createEvent does its own zod validation
|
function onSubmit(data: EventFormValues) {
|
||||||
function onSubmit(data: any) {
|
|
||||||
if (isEditing && defaultValues?.id) {
|
if (isEditing && defaultValues?.id) {
|
||||||
run(() => updateEvent({ id: defaultValues.id!, ...data }), {
|
run(() => updateEvent({ id: defaultValues.id!, ...data } as UpdateEventInput), {
|
||||||
successMessage: "Event updated!",
|
successMessage: "Event updated!",
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
run(() => createEvent(data), {
|
run(() => createEvent(data as CreateEventInput), {
|
||||||
successMessage: "Event created!",
|
successMessage: "Event created!",
|
||||||
onSuccess: (result) => {
|
onSuccess: (result) => {
|
||||||
const data = result.data as Record<string, unknown> | undefined;
|
const data = result.data as Record<string, unknown> | undefined;
|
||||||
@@ -116,9 +128,8 @@ export function EventForm({ eventTypes, defaultValues }: EventFormProps) {
|
|||||||
<Label>Starts At</Label>
|
<Label>Starts At</Label>
|
||||||
<DateTimePicker
|
<DateTimePicker
|
||||||
value={form.watch("startsAt")}
|
value={form.watch("startsAt")}
|
||||||
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
|
|
||||||
onChange={(d) =>
|
onChange={(d) =>
|
||||||
form.setValue("startsAt", d as any, { shouldDirty: true })
|
form.setValue("startsAt", d, { shouldDirty: true })
|
||||||
}
|
}
|
||||||
placeholder="Select start date"
|
placeholder="Select start date"
|
||||||
/>
|
/>
|
||||||
@@ -127,9 +138,8 @@ export function EventForm({ eventTypes, defaultValues }: EventFormProps) {
|
|||||||
<Label>Ends At</Label>
|
<Label>Ends At</Label>
|
||||||
<DateTimePicker
|
<DateTimePicker
|
||||||
value={form.watch("endsAt")}
|
value={form.watch("endsAt")}
|
||||||
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
|
|
||||||
onChange={(d) =>
|
onChange={(d) =>
|
||||||
form.setValue("endsAt", d as any, { shouldDirty: true })
|
form.setValue("endsAt", d, { shouldDirty: true })
|
||||||
}
|
}
|
||||||
placeholder="Select end date"
|
placeholder="Select end date"
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in new issue
Block a user