One FormProvider, many forms

[sebaveg]

Hello everyone

I have a StepWizard with some steps in a modal. In every step I have a form. I would like get context of forms in Modal for disable or enable next button.

So this is my code:

<Modal {...modalProps}>
  <FormProvider {...methods}>
    <StepWizard>
      <FirstForm />
      <SecondForm />
      <ThirdForm />
      {...}
    </<StepWizard>
  </FormProvider>
</Modal>

So, FirstForm, SecondForm, ThirdForm have

every one.

In the modal I get the context:

// modal.js
const { control } = useFormContext();
const { isDirty, isSubmitting } = useFormState({ control });
const disabledNextButton = !isDirty || isSubmitting;
return (
         <Button
              disabled={disabledNextButton}
          >
 )

This is correct? Or, Should I have one in every form.

Thanks.

[bluebill1049]

Should be per form per context.