@capillarytech/creatives-library 8.0.312-alpha.2 → 8.0.312-alpha.3

package/package.json

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

package/v2Components/ErrorInfoNote/index.js

@@ -204,6 +204,28 @@ export const ErrorInfoNote = (props) => {
   const isNotArray = !Array.isArray(rawLiquidErrors);
   const hasPlatformKeys = isObject && isNotArray && [ANDROID, IOS, GENERIC].some((key) => key in rawLiquidErrors);
 
+  // Hooks must execute on every render before any conditional return.
+  // Group into Errors (blocking) and Warnings (non-blocking)
+  const { errors: errorIssues, warnings: warningIssues } = useMemo(() => groupByErrorsAndWarnings(
+    Array.isArray(rawStandardErrors) ? rawStandardErrors : [],
+    Array.isArray(rawLiquidErrors) ? rawLiquidErrors : [],
+    Array.isArray(rawStandardWarnings) ? rawStandardWarnings : [],
+  ), [rawStandardErrors, rawLiquidErrors, rawStandardWarnings]);
+
+  const errorsCount = errorIssues.length;
+  const warningsCount = warningIssues.length;
+  const totalCount = errorsCount + warningsCount;
+  const hasLiquidErrors = Array.isArray(rawLiquidErrors) && rawLiquidErrors.length > 0;
+
+  // Default active tab: errors if any, else warnings
+  useEffect(() => {
+    if (errorsCount > 0) {
+      setActiveKey(ERROR_TAB_KEYS.ERRORS);
+    } else if (warningsCount > 0) {
+      setActiveKey(ERROR_TAB_KEYS.WARNINGS);
+    }
+  }, [errorsCount, warningsCount]);
+
   // For platform-specific errors or when useLegacyDisplay is true, use the legacy renderer
   if (hasPlatformKeys) {
     // Process errors for both platforms - they use the same structure but different platform parameters
@@ -255,27 +277,6 @@ export const ErrorInfoNote = (props) => {
     );
   }
 
-  // Group into Errors (blocking) and Warnings (non-blocking)
-  const { errors: errorIssues, warnings: warningIssues } = useMemo(() => groupByErrorsAndWarnings(
-    Array.isArray(rawStandardErrors) ? rawStandardErrors : [],
-    Array.isArray(rawLiquidErrors) ? rawLiquidErrors : [],
-    Array.isArray(rawStandardWarnings) ? rawStandardWarnings : [],
-  ), [rawStandardErrors, rawLiquidErrors, rawStandardWarnings]);
-
-  const errorsCount = errorIssues.length;
-  const warningsCount = warningIssues.length;
-  const totalCount = errorsCount + warningsCount;
-  const hasLiquidErrors = Array.isArray(rawLiquidErrors) && rawLiquidErrors.length > 0;
-
-  // Default active tab: errors if any, else warnings
-  useEffect(() => {
-    if (errorsCount > 0) {
-      setActiveKey(ERROR_TAB_KEYS.ERRORS);
-    } else if (warningsCount > 0) {
-      setActiveKey(ERROR_TAB_KEYS.WARNINGS);
-    }
-  }, [errorsCount, warningsCount]);
-
   // Handle close
   const handleClose = () => {
     setIsDismissed(true);

package/v2Containers/SmsTrai/Edit/index.js

@@ -54,6 +54,8 @@ import v2EditSmsReducer from '../../Sms/Edit/reducer';
 import { v2SmsEditSagas } from '../../Sms/Edit/sagas';
 import ErrorInfoNote from '../../../v2Components/ErrorInfoNote';
 import { validateLiquidTemplateContent } from '../../../utils/commonUtils';
+import { validateTags } from '../../../utils/tagValidations';
+import globalMessages from '../../Cap/messages';
 import { ANDROID } from '../../../v2Components/CommonTestAndPreview/constants';
 
 let varMap = {};
@@ -279,6 +281,31 @@ export const SmsTraiEdit = (props) => {
       return;
     }
     const content = updatedSmsEditor.join('');
+    const syncValidation = validateTags({
+      content,
+      tagsParam: tags,
+      location,
+      isFullMode,
+    });
+    if (!syncValidation?.valid) {
+      const standardErrors = [];
+      if (syncValidation?.isBraceError) {
+        standardErrors.push(formatMessage(globalMessages.unbalanacedCurlyBraces));
+      }
+      if (syncValidation?.missingTags?.length) {
+        standardErrors.push(
+          formatMessage(formBuilderMessages.missingTagsValidationError, {
+            missingTags: syncValidation.missingTags.join(', '),
+          })
+        );
+      }
+      setLiquidErrorMessages({
+        STANDARD_ERROR_MSG: standardErrors,
+        LIQUID_ERROR_MSG: [],
+      });
+      setIsLiquidValidationError(true);
+      return;
+    }
     const onError = ({ standardErrors, liquidErrors }) => {
       setLiquidErrorMessages({
         STANDARD_ERROR_MSG: standardErrors,