From 6d696f3c5063e9cc6b1c1c122883c9cabf9ef649 Mon Sep 17 00:00:00 2001 From: Bharathidasan Elangovan Date: Thu, 17 Oct 2024 10:44:18 +0530 Subject: [PATCH] Added code to display error message from grapqhl response in form --- .../lib/talons/FormError/useFormError.js | 22 ++++++++++++++++++- packages/venia-ui/i18n/en_US.json | 1 + 2 files changed, 22 insertions(+), 1 deletion(-) 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.",