Decouple errors into errors, asyncErrors, and submitErrors

[vincentjames501]

🚀 Feature request

Right now there is only FormikState.errors (top level FormikState.error prop looks deprecated).

Let's say I was using Yup:

{
  username: string().required(),
  email: string().email().required()
}

I submit the form but the server returns a validation error saying that email is in use. I can call FormikActions.setFieldError, FormikActions.setErrors, etc to set this error.

The issue is, if the user goes and types in the username field only, the email validation error will disappear even though the user hasn't touched it since the submission error.

React Final Form and Redux form decouple these concepts which makes it easier to build more powerful validation constructs IMO. We could abuse the FormikActions.setStatus, but really that feels wrong and that this should be a first class citizen and submission errors get cleared only after?

Is there any way to easily accomplish this with Formik at the moment?

This is sort of a duplicate of #748 which was closed due to inactivity.

[Andreyco]

Do Final Form and Redux Form merge them, in order to pass it to context, or child component? Or do you receive multiple error bags?

Edit: there is #1445 PR open to start discussion

[vincentjames501]

Redux form supplies it into a single error prop on meta passed to the field component:

meta.error : String [optional]
The error for this field if its value is not passing validation. Both synchronous, asynchronous, and submit validation errors will be reported here.

https://redux-form.com/8.2.0/docs/api/field.md/

Final form splits it into error and submitError

https://github.com/final-form/react-final-form#metasubmiterror-any

I personally like the clear separation between the two like final form.

[Granipouss]

Hello, I think it would indeed be a great feature. Do you imagine having a submit per form or one per field similar to current validation errors ?

[devarsh]

Any updates on this, I understand we can have the state managed in their own parent component but would create a problem for FieldArray use-cases. Hopefully, formik decouples errors.