react-reform icon indicating copy to clipboard operation
react-reform copied to clipboard

Feature: Reset `globalErrors` on field change

Open jagged3dge opened this issue 7 years ago • 2 comments

Thank you for this awesome package! I'm using this in my project powering 4 forms of different sizes and I'm really happy how easily configurable and re-usable it is.

There's a wonderful option of reading globalErrors after form submission fails due to a backend error. It would be even better if this error could automatically reset if any of the internal field values changed.

Use case: In a simple login form, I can read the globalErrors prop to check & handle the most common post-submit error: invalid credentials. This error, once shown, stays shown until the next time form submit succeeds, or results in a different error. Until then, the error message stays put. I believe it could be better UX if the error disappears (reset internally) as the user interacts with the form fields to change/correct their login credentials.

jagged3dge avatar Jan 27 '17 11:01 jagged3dge

Ah, yes, I get what you mean.

How would you feel about being able something like a hasChanged to the renderForm options such that you could do

 renderForm: (FormContainer, children, {globalErrors, hasChanged, status}) => (
    <FormContainer>
      {globalErrors && !hasChanged ? (<div>{globalErrors}</div>) : null}
...

This would allow to customise the behaviour according to your needs which feels more in line with react-reform's philosophy of not being too opinionated.

danielberndt avatar Jan 27 '17 16:01 danielberndt

Sounds perfect! :+1:

jagged3dge avatar Jan 28 '17 06:01 jagged3dge