@capillarytech/creatives-library 8.0.87 → 8.0.88-alpha.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "8.0.87",
+  "version": "8.0.88-alpha.0",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/v2Containers/Zalo/index.js

@@ -282,11 +282,28 @@ export const Zalo = (props) => {
   const handleErrorValidation = (e, field) => {
     const { minLength, maxLength } = field;
     let error = e ? tagValidationErrorMessage(e) : '';
-    if (!e || e.length <= minLength || e.length > maxLength) {
+    
+    // Check if the value contains any tags
+    const containsTags = e && e.includes('{{') && e.includes('}}');
+    
+    if (!e || e.length <= minLength) {
       error = formatMessage(messages.maxMinLengthMessage, {
         minLength,
         maxLength,
       });
+    } else if (e.length > maxLength) {
+      if (containsTags) {
+        // Show warning message for tag values
+        error = formatMessage(messages.tagLengthWarning, {
+          maxLength,
+        });
+      } else {
+        // Show error message for static values
+        error = formatMessage(messages.maxMinLengthMessage, {
+          minLength,
+          maxLength,
+        });
+      }
     }
     return error;
   };
@@ -355,7 +372,10 @@ export const Zalo = (props) => {
       const errorMessage = !error
         ? handleErrorValidation(value, listParams)
         : error;
-      if (errorMessage) {
+      
+      // Only disable if there's an error and the value doesn't contain tags
+      const containsTags = value && value.includes('{{') && value.includes('}}');
+      if (errorMessage && !containsTags) {
         disableCheck = true;
       }
     });
@@ -397,7 +417,10 @@ export const Zalo = (props) => {
 
   const renderContent = () =>
     templateListParams?.map((listParam) => {
-      const { name = '', value = '', maxLength } = listParam;
+      const { name = '', value = '', maxLength = '' } = listParam;
+      const containsTags = value && value.includes('{{') && value.includes('}}');
+      const isExceedingLength = value.length > maxLength;
+      
       return (
         <>
           {renderTextBoxesForListParams(listParam)}
@@ -407,11 +430,21 @@ export const Zalo = (props) => {
                 name,
               })}
             </CapLabel>
-            <CapLabel className="variable-field-length">
-              {formatMessage(messages.charactersCount, {
-                variableLength: value.length,
-                maxLength,
-              })}
+            <CapLabel 
+              className="variable-field-length"
+            > 
+              {
+                containsTags && isExceedingLength ? (
+                  formatMessage(messages.tagLengthWarning, {
+                    maxLength,
+                  })
+                ) : (
+                  formatMessage(messages.charactersCount, {
+                    variableLength: value.length,
+                    maxLength,
+                  })
+                )
+              }
             </CapLabel>
           </CapRow>
         </>

package/v2Containers/Zalo/messages.js

@@ -83,4 +83,8 @@ export default defineMessages({
     id: `${prefix}.btnDisabledTooltip`,
     defaultMessage: 'Please add all mandatory fields to proceed further',
   },
+  tagLengthWarning: {
+    id: `${prefix}.tagLengthWarning`,
+    defaultMessage: "If the character count of the tag value exceeds {maxLength}, the campaign will fail.",
+  },
 });