Merge pull request #2845 from glific/correction-in-error-message

Updated the error message in HSM templates

src/components/UI/Form/Input/Input.module.css

@@ -87,4 +87,4 @@
   .Input {
     width: 100%;
   }
-}
+}

src/containers/Template/Form/HSM/HSM.test.tsx

@@ -108,7 +108,7 @@ describe('Add mode', () => {
       // expect an error
       expect(
         screen.getByText(
-          'Message and sample look different. Please check for any characters, extra spaces or new lines.'
+          'Message and sample look different. You have to replace variables eg. {{1}} with actual values enclosed in [ ] eg. Replace {{1}} with [Monica].'
         )
       ).toBeInTheDocument();
     });

src/containers/Template/Form/Template.tsx

@@ -30,30 +30,6 @@ import styles from './Template.module.css';
 
 const regexForShortcode = /^[a-z0-9_]+$/g;
 
-const HSMValidation = {
-  example: Yup.string()
-    .max(1024, 'Maximum 1024 characters are allowed')
-    .when('body', ([body], schema: any) =>
-      schema.test({
-        test: (exampleValue: any) => {
-          const finalmessageValue = body && body.replace(/\{\{([1-9]|1[0-9])\}\}/g, '[]');
-          const finalExampleValue = exampleValue && exampleValue.replace(/\[[^\]]*\]/g, '[]');
-          return finalExampleValue === finalmessageValue;
-        },
-        message:
-          'Message and sample look different. Please check for any characters, extra spaces or new lines.',
-      })
-    )
-    .required('Example is required.'),
-  category: Yup.object().nullable().required('Category is required.'),
-  shortcode: Yup.string()
-    .required('Element name is required.')
-    .matches(
-      regexForShortcode,
-      'Only lowercase alphanumeric characters and underscores are allowed.'
-    ),
-};
-
 const dialogMessage = ' It will stop showing when you are drafting a customized message.';
 
 const queries = {
@@ -398,6 +374,31 @@ const Template = ({
     }
   };
 
+  const HSMValidation = {
+    example: Yup.string()
+      .max(1024, t('Maximum 1024 characters are allowed'))
+      .when('body', ([body], schema: any) =>
+        schema.test({
+          test: (exampleValue: any) => {
+            const finalmessageValue = body && body.replace(/\{\{([1-9]|1[0-9])\}\}/g, '[]');
+            const finalExampleValue = exampleValue && exampleValue.replace(/\[[^\]]*\]/g, '[]');
+            return finalExampleValue === finalmessageValue;
+          },
+          message: t(
+            'Message and sample look different. You have to replace variables eg. {{1}} with actual values enclosed in [ ] eg. Replace {{1}} with [Monica].'
+          ),
+        })
+      )
+      .required('Example is required.'),
+    category: Yup.object().nullable().required(t('Category is required.')),
+    shortcode: Yup.string()
+      .required(t('Element name is required.'))
+      .matches(
+        regexForShortcode,
+        'Only lowercase alphanumeric characters and underscores are allowed.'
+      ),
+  };
+
   const validateURL = (value: string) => {
     if (value && type) {
       setValidatingURL(true);

src/i18n/en/en.json

@@ -465,5 +465,9 @@
   "No conversations found!": "No conversations found!",
   "Add group to collection": "Add group to collection",
   "Contact": "Contact",
-  "Remove Contact": "Remove Contact"
+  "Remove Contact": "Remove Contact",
+  "Message and sample look different. You have to replace variables eg. {{1}} with actual values enclosed in [ ] eg. Replace {{1}} with [Monica].": "Message and sample look different. You have to replace variables eg. {{1}} with actual values enclosed in [ ] eg. Replace {{1}} with [Monica].",
+  "Maximum 1024 characters are allowed": "Maximum 1024 characters are allowed",
+  "Element name is required.": "Element name is required.",
+  "Category is required.": "Category is required."
 }

src/i18n/hi/hi.json

@@ -444,5 +444,9 @@
   "Your personal WhatsApp number": "आपका निजी WhatsApp नंबर",
   "Register with ": "Register with ",
   "Validating URL": "URL मान्य करना",
-  "Enter name, label, keyword": "नाम, लेबल, कीवर्ड दर्ज करें"
+  "Enter name, label, keyword": "नाम, लेबल, कीवर्ड दर्ज करें",
+  "Message and sample look different. You have to replace variables eg. {{1}} with actual values enclosed in [ ] eg. Replace {{1}} with [Monica].": "संदेश और नमूना अलग दिखते हैं. आपको वेरिएबल्स को बदलना होगा जैसे। {{1}} उदाहरण के लिए [ ] में संलग्न वास्तविक मानों के साथ। {{1}} को [मोनिका] से बदलें।",
+  "Maximum 1024 characters are allowed": "अधिकतम 1024 वर्णों की अनुमति है",
+  "Element name is required.": "तत्व का नाम आवश्यक है.",
+  "Category is required.": "श्रेणी आवश्यक है."
 }