Service Validations should format error messages for form helpers

Not sure how I missed this, but I realized as I’m going back through the tutorial for 1.0 that the error messages raised by Service Validations aren’t quite the right format for Form Helpers to parse them apart and highlight the fields that are invalid.

When we setup validation from scratch in the tutorial we raise this error:

throw new UserInputError("Can't create new contact", {
  messages: {
    email: ['is not formatted like an email address'],
  },
})

Which, when using form helpers <FormError> and <FieldError> results in:

But replacing the custom validation with Service Validations like:

validate(input.email, 'Email', {
  email: true,
})

results in this:

Ideally it would highlight the errored field, in addition to providing the blanket message the top.

I should be able to add this without too much fuss, but may be a breaking change for error handling in user apps if they are doing something custom with errors outside of the form helpers.

[dthyresson]

Hmmm … but then the service is more tied to the form element:

export const createContact = ({ input }) => {
  validate(input.email, 'Email', {
    email: true,
    fieldName: 'email_4',
  })
  return db.contact.create({ data: input })
}

And that’s not great. And the key cannot be derived from the label to show because the human text may not be the input name.

Yeah, gotta think on this more.

[Tobbe]

Tangent: https://github.com/redwoodjs/redwood/issues/4547