Zod schema:
export const createOrEditInvoiceSchema = z.object({
clientId: z.number(),
items: invoiceItemsSchema,
currency: z.string().optional().default("BDT"), // TODO: Handle Default Value without creating bugs
status: invoiceStatusSchema,
});
export type createOrEditInvoiceType = z.infer<typeof createOrEditInvoiceSchema>;
Form definition:
const defaultValues: createOrEditInvoiceType = {
clientId: clients[0].id,
items: [{ name: "", quantity: 1, price: 0 }],
currency: "BDT",
status: "draft",
};
const form = useAppForm({
defaultValues,
validators: {
onSubmit: createOrEditInvoiceSchema,
},
onSubmit: async ({ value }) => {
// TODO: Add Invoice Creation Mutation
try {
await createInvoiceServer({
data: value,
});
toast.success("Invoice created successfully!");
form.reset();
} catch (error) {
toast.error(
error instanceof Error ? error.message : "Failed to create invoice",
);
}
},
});
Error:
Type 'ZodObject<{ clientId: ZodNumber; items: ZodArray<ZodObject<{ name: ZodString; quantity: ZodNumber; price: ZodNumber; }, $strip>>; currency: ZodDefault<...>; status: ZodEnum<...>; }, $strip>' is not assignable to type 'FormValidateOrFn<{ clientId: number; items: { name: string; quantity: number; price: number; }[]; currency: string; status: "draft" | "sent" | "cancelled" | "paid"; }> | undefined'.
... Very long error
The types of 'input.currency' are incompatible between these types.
Type 'string | undefined' is not assignable to type 'string'.
Type 'undefined' is not assignable to type 'string'.