formState.isSubmitting doesn't reflect the correct state of form submission

[haivuw]

I need to read useTsController().formState.isSubmitting from input components, but it just flashes from true to false real quick. Shouldn't we await here? https://github.com/iway1/react-ts-form/blob/3fcd707eee60dc8e88cb2cac04f517aeb8796056/src/createSchemaForm.tsx#L381 I can contribute if needed.

[iway1]

Are you wanting isSubmitting to be true while some network request is being sent?

[haivuw]

Are you wanting isSubmitting to be true while some network request is being sent?

Exactly.

[iway1]

Would you be able to give a code example of what this looks like with vanilla react-hook-form?

Asking because I typically don't use the isSubmitting property of react hook form for form loading states and don't really know how it works (personally I use react-query's isLoading property`)

[haivuw]

If you pass an async function to handleSubmit it will await for it and set isSubmitting to false after it's resolved: https://github.com/react-hook-form/react-hook-form/blob/28e33c96644d845b9f6146e25e0c621ab117092f/src/logic/createFormControl.ts#L1024

You can read isSubmitting from useForm().formState.isSubmitting as well. Here's the example from RHF docs: https://codesandbox.io/s/react-hook-form-async-submit-validation-hy9oe