Managing a form with multiple actions

[Frantss]

Hi, I have a form where the user can trigger multiple actions on the same form, is there a community preferred way of doing so?

Like saving a entity as a draft or in it's entirety, something like this:

I want to handle different form validation for each and form.formState.isSubmitting states

[sega057]

Hello!
That's how I implemented it with zod validation and it looks good to me:

export const draftResolver = zodResolver<zod.ZodType<Partial<YourPayloadType>>>(
    zod.object({
        id: zod.string({
            required_error: 'id is required',
        }),
    }),
);

export const defaultResolver = zodResolver<zod.ZodType<YourPayloadType>>(
...

// Inside a component
const isDraft = React.useRef(false);

const methods = useForm({
    resolver: (...args) => {
        if (isDraft.current) {
            return draftResolver(...args);
        }
        return defaultResolver(...args);
    },
    defaultValues,
});

const onSubmit = (draft?: boolean) => {
    isDraft.current = Boolean(draft);

    methods.handleSubmit(async (data) => {
        // any logic you want to submit the form
    })();
};