formErrors is not (always?) cleared after submitting

[federico-ercoles]

Using vanilla formo, we're injecting some of the formErrors in fieldProps issues in order to show an inline error message next to the field that needs to be corrected. However, if on the next submission the field validation fails, formErrors are not cleared and therefore both the validation error and the injected form error are displayed.

Code to inject business errors in fieldProps issues:

  const emailIssues: NonEmptyArray<TextChildren> | undefined =
    formErrors &&
    formErrors!._tag === "APIError" &&
    option.isSome(formErrors.businessError) &&
    formErrors.businessError.value._type === "DuplicateUserEmail"
      ? pipe(
          fieldProps("email").issues,
          option.fromNullable,
          option.foldW(
            () => [formatMessage("FormField.DuplicateEmail")],
            (issues) => [...issues, formatMessage("FormField.DuplicateEmail")]
          )
        )
      : fieldProps("email").issues;

Failing test:

1. fill form with duplicate email federico.ercoles@buildo.io and submit: the API returns a 400 error, with a business error of type DuplicateUserEmail, which shows up in formErrors and gets injected in fieldProps("email").issues
2. change email to federico.ercoles and submit again: this is not a valid email and fails the corresponding validation, which adds the corresponding message to fieldProps("email").issues
3. at this point I expect the error message for the email field to show only the message regarding the failed validation (that is, I expect that pressing submit resets formErrors), instead I'm showed both error messages