As was done in the usersXService, we should go through the frontend and make sure all error messages from the API are being unpacked properly to avoid over-reliance on default error messages, or displaying unhelpful error messages (the error has a less helpful message than the response). getErrorMessage and getFormErrors help with this.

To be done

• convert this to an epic
• create issues for each XService

Problem

The frontend does not always display the error messages sent from the backend, and even when it does, it does not display the detail that is sometimes sent along with it.

Definition of done for each ticket

• There are no uses of displayError in this XService. To replace the error snackbar, render ErrorSummary in the relevant components with the dismissible prop. This way, the user can expand the error detail if desired without the snackbar disappearing on them.
• There are no uses of getFormHelpers in the relevant components; switch to getFormHelpersWithError even if no error. (We will eventually rename it to replace the original getFormHelpers.)
• The XService always assigns the API error, rather than a hard-coded error message. If a hard-coded error message is needed as a fallback, send it as a prop to ErrorSummary.
• Errors are only unpacked in ErrorSummary and getFormHelpersWithError.
• Storybook has a story for when the error(s) are showing.

Tickets

• Create new component to display error messages with details #3106
• Fix error messages in authXService #3088
• Fix error messages in workspaceScheduleXService and workspaceScheduleBannerXService #3097
• Fix error messages in workspaceXService #3094
• Fix error messages in workspacesXService #3096
• Fix error messages in workspaceBuildXService #3095
• Fix error messages in usersXService #3093
• Fix error messages in templatesXService #3091
• Fix error messages in siteRolesXService #3090
• Fix error messages in buildInfoXService #3089
• Replace getFormHelpers #3209
• Fix error messages in createWorkspaceXService #3343