Refine Error Handling on Self-hosted Models Form

Error handling on the self-hosted models form is currently adequate for MVP but should be improved when there is an opportunity to do so.

Improvements to be made

  • Front-end validation that the endpoint value meets the expected http/https schema (i.e adding something like a regex to check values before mutation is invoked). At the moment, the validation is handled by the backend, but ideally we should be invalidating from the front-end, before it reaches the backend.
  • Optimise server errors for direct consumption from the frontend. Right now, the front-end holds the responsibility of mapping server errors to human-friendly strings, but ideally the backend should handle formatting while the client needs little knowledge and can just consume.

See following discussion from !160682 (merged) for more context:

  • @psjakubowska started a discussion: (+3 comments)

    question: I am not a big fun of mapping the backend errors to user-friendly strings like that. I assume these are generic errors. Ideally we would have the user-friendly error messages on the backend and just consume there here. Do you think it's feasible?

    issue (blocking): With these conditions and current error format (an array containing one string that is multiple errors), we only show the first matching error. See the example below, where I should see both this.$options.i18n.invalidEndpointError and this.$options.i18n.nonUniqueDeploymentNameError:

    Screenshot_2024-07-31_at_13.05.53

    We might need a little help from backend to rework that mutation resqued errors.

    question: What do you think about validating Endpoint input on frontend with regex, to check if it starts with http or https before we even submit the form? Optional: maybe include a placeholder text that will start with https to indicate what is expected?

Edited by 🤖 GitLab Bot 🤖