Reset submission error when the field is changed #5962
Conversation
alanpoulain
force-pushed
the
reset-submit-errors
branch
from
06f039b
to
f812776
Compare
| @@ -41,7 +41,7 @@ describe('FormWithRedirect', () => { | |||
|
|
|||
| expect(renderProp.mock.calls[1][0].pristine).toEqual(true); | |||
| expect(getByDisplayValue('Foo')).not.toBeNull(); | |||
| expect(renderProp).toHaveBeenCalledTimes(2); | |||
| expect(renderProp).toHaveBeenCalledTimes(3); | |||
There was a problem hiding this comment.
Using useFormState triggers a rerender.
There was a problem hiding this comment.
That's a problem... This feature impacts the performance of all forms to allow a feature that isn't so common...
| @@ -51,7 +53,10 @@ const FormWithRedirect: FC<FormWithRedirectProps> = ({ | |||
| initialValues, | |||
| initialValuesEqual, | |||
| keepDirtyOnReinitialize = true, | |||
| mutators = arrayMutators as any, // FIXME see https://github.com/final-form/react-final-form/issues/704 and https://github.com/microsoft/TypeScript/issues/35771 | |||
| mutators = { | |||
There was a problem hiding this comment.
I'd create a defaultMutators outside of the component, to avoid that the mutators value change at each render
| */ | ||
| const useResetSubmitErrors = () => { | ||
| const { mutators } = useForm(); | ||
| const { values } = useFormState({ subscription: { values: true } }); |
There was a problem hiding this comment.
I find it weird that you need to call useFormState twice, especially since you've already called useForm. Maybe that's why you had to update the FormWithRedirect unit test.
I assume you could do the same with form.subscribe(), without even calling useFormState once.
Could you try that and see if it removes the extra render?
| @@ -41,7 +41,7 @@ describe('FormWithRedirect', () => { | |||
|
|
|||
| expect(renderProp.mock.calls[1][0].pristine).toEqual(true); | |||
| expect(getByDisplayValue('Foo')).not.toBeNull(); | |||
| expect(renderProp).toHaveBeenCalledTimes(2); | |||
| expect(renderProp).toHaveBeenCalledTimes(3); | |||
There was a problem hiding this comment.
That's a problem... This feature impacts the performance of all forms to allow a feature that isn't so common...
|
@fzaninotto is it better now? |
|
sorry to jump in the discussion, but i wanted to show my appreciation to your work @alanpoulain |
alanpoulain
force-pushed
the
reset-submit-errors
branch
from
0416ce3
to
56e6733
Compare
|
I am getting an error message after upgrading to a version with this change. I am using mutators in FormWithRedirect to implement some data manipulation logic, and the form doesn't work anymore. Should I open a bug or there is a solution? |
|
If you added custom mutators, make sure you include the one we need as well. We should document that though. Besides please don't comment on PR like that, open issues instead |
|
We need array mutators and https://github.com/ignatevdev/final-form-submit-errors which has been introduced in this very PR |
Fixes #5938.
Use https://github.com/ignatevdev/final-form-submit-errors to reset the submission error when the field is changed.
I'm not using the
SubmitErrorsSpycomponent but a new hook instead to make it work in theFormWithRedirectcomponent.I've also opened a PR in https://github.com/ignatevdev/final-form-submit-errors to add the hook there: ignatevdev/final-form-submit-errors#6.