diff --git a/packages/peregrine/lib/talons/FormError/useFormError.js b/packages/peregrine/lib/talons/FormError/useFormError.js index ae267552e4..a4e81f1ba8 100644 --- a/packages/peregrine/lib/talons/FormError/useFormError.js +++ b/packages/peregrine/lib/talons/FormError/useFormError.js @@ -14,7 +14,27 @@ export const useFormError = props => { defaultMessage: 'An error has occurred. Please check the input and try again.' }); - return deriveErrorMessage(errors, defaultErrorMessage); + + const firstError = errors + .filter(error => error !== null||undefined) + .map(error => Array.isArray(error) ? error[0] : error) + .find(message => message); + var graphqlErrorMessage; + + if (firstError) { + var category = firstError.graphQLErrors?.find(extensions => extensions).extensions?.category; + category = category ? category + .split('-') + .map((word, index) => index === 0 ? word : word.charAt(0).toUpperCase() + word.slice(1)) + .join('') : null; + const errorId = category ? 'formError.'+category : 'formError.responseError'; + graphqlErrorMessage = formatMessage({ + id: errorId, + defaultMessage: firstError.message + }); + } + + return (graphqlErrorMessage) ? deriveErrorMessage(errors, graphqlErrorMessage) : deriveErrorMessage(errors, defaultErrorMessage); }, [errors, formatMessage, allowErrorMessages]); return { diff --git a/packages/venia-ui/i18n/en_US.json b/packages/venia-ui/i18n/en_US.json index a11aff2969..eeac5adb0a 100644 --- a/packages/venia-ui/i18n/en_US.json +++ b/packages/venia-ui/i18n/en_US.json @@ -199,6 +199,7 @@ "forgotPasswordPage.header": "Forgot Your Password?", "forgotPasswordPage.title": "Forgot Your Password?", "formError.errorMessage": "An error has occurred. Please check the input and try again.", + "formError.graphqlAuthenticationEmailNotConfirmed": "Your account is created, You must confirm your account. Please check your email for the confirmation link.", "formSubmissionSuccessful.recoverPasswordText": "Recover Password", "formSubmissionSuccessful.textMessage": "If there is an account associated with {email} you will receive an email with a link to change your password.", "galleryItem.unavailableProduct": "Currently unavailable for purchase.",