@capillarytech/creatives-library 8.0.307-alpha.0 → 8.0.307-alpha.5

package/v2Containers/WebPush/Create/index.js

@@ -83,6 +83,7 @@ const MemoizedTagList = memo(({
   injectedTags,
   selectedOfferDetails,
   eventContextTags,
+  waitEventContextTags,
   forwardedTags,
   onTagSelect,
   restrictPersonalization = false,
@@ -98,6 +99,7 @@ const MemoizedTagList = memo(({
     injectedTags={injectedTags}
     selectedOfferDetails={selectedOfferDetails}
     eventContextTags={eventContextTags}
+    waitEventContextTags={waitEventContextTags}
     forwardedTags={forwardedTags}
     onTagSelect={onTagSelect}
     restrictPersonalization={restrictPersonalization}
@@ -115,6 +117,7 @@ const MemoizedTagList = memo(({
     && prevProps.injectedTags === nextProps.injectedTags
     && prevProps.selectedOfferDetails === nextProps.selectedOfferDetails
     && prevProps.eventContextTags === nextProps.eventContextTags
+    && prevProps.waitEventContextTags === nextProps.waitEventContextTags
     && prevProps.forwardedTags === nextProps.forwardedTags
     && prevProps.onTagSelect === nextProps.onTagSelect
     && prevProps.restrictPersonalization === nextProps.restrictPersonalization
@@ -151,6 +154,7 @@ const WebPushCreate = ({
   forwardedTags,
   selectedOfferDetails = [],
   eventContextTags = [],
+  waitEventContextTags = {},
   templateActions: templateActionsProps,
   Templates,
   restrictPersonalization = false,
@@ -230,6 +234,7 @@ const WebPushCreate = ({
     supportedTags: memoizedSupportedTags,
     injectedTags,
     eventContextTags,
+    waitEventContextTags,
   });
   const { tags, handleOnTagsContextChange, validationConfig } = tagState;
   const { weCrmAccounts } = Templates;
@@ -295,8 +300,8 @@ const WebPushCreate = ({
   const validateTemplateName = useCallback((value) => validateTemplateNameUtil(value), []);
 
   const validateTitle = useCallback(
-    (value) => validateTitleUtil(value, formatMessage, messages, restrictPersonalization, validationConfig, isFullMode),
-    [formatMessage, restrictPersonalization, validationConfig, isFullMode],
+    (value) => validateTitleUtil(value, formatMessage, messages, restrictPersonalization),
+    [formatMessage, restrictPersonalization],
   );
 
   const validateUrl = useCallback(
@@ -835,12 +840,13 @@ const WebPushCreate = ({
       injectedTags,
       selectedOfferDetails,
       eventContextTags,
+      waitEventContextTags,
       forwardedTags,
       restrictPersonalization,
       disabled: restrictPersonalization,
       disableTooltipMsg: restrictPersonalization ? formatMessage(messages.personalizationNotSupportedAnonymous) : undefined,
     }),
-    [tags, injectedTags, selectedOfferDetails, eventContextTags, forwardedTags, restrictPersonalization, formatMessage],
+    [tags, injectedTags, selectedOfferDetails, eventContextTags, waitEventContextTags, forwardedTags, restrictPersonalization, formatMessage],
   );
 
   // Memoized TagList components with optimized props
@@ -1080,6 +1086,7 @@ WebPushCreate.propTypes = {
   forwardedTags: PropTypes.object,
   selectedOfferDetails: PropTypes.array,
   eventContextTags: PropTypes.array,
+  waitEventContextTags: PropTypes.object,
   templateActions: PropTypes.object,
   restrictPersonalization: PropTypes.bool,
 };
@@ -1108,6 +1115,7 @@ WebPushCreate.defaultProps = {
   forwardedTags: {},
   selectedOfferDetails: [],
   eventContextTags: [],
+  waitEventContextTags: {},
   templateActions: {},
   Templates: {},
   restrictPersonalization: false,

package/v2Containers/WebPush/Create/utils/validation.js

@@ -11,34 +11,19 @@ import { hasPersonalizationTags } from '../../../../utils/commonUtils';
 export const validateTemplateName = (value) => !value || value.trim() === '';
 
 /**
- * Validates notification title (required and optional tag validation)
+ * Validates notification title
  * @param {string} value - The title value
  * @param {Function} formatMessage - i18n format message function
  * @param {Object} messages - Message definitions
- * @param {Object} [validationConfig] - Optional config for tag validation
- * @param {boolean} [isFullMode] - Optional; when set with validationConfig, runs tag validation
  * @returns {string} Error message if invalid, empty string if valid
  */
-export const validateTitle = (value, formatMessage, messages, restrictPersonalization, validationConfig, isFullMode) => {
+export const validateTitle = (value, formatMessage, messages, restrictPersonalization) => {
   if (!value || value.trim() === '') {
     return formatMessage(messages.titleRequired);
   }
   if (restrictPersonalization && hasPersonalizationTags(value)) {
     return formatMessage(messages.personalizationTokensErrorMessage);
   }
-
-  if (validationConfig != null) {
-    const validationResponse = validateTags({
-      content: value,
-      ...validationConfig,
-      isFullMode,
-    }) || {};
-
-    if (validationResponse?.isBraceError) {
-      return formatMessage(globalMessages.unbalanacedCurlyBraces);
-    }
-  }
-
   return '';
 };
 
@@ -80,6 +65,12 @@ export const validateMessageContent = (value, formatMessage, messages, validatio
     isFullMode,
   }) || {};
 
+  if (validationResponse?.unsupportedTags?.length) {
+    return formatMessage(globalMessages.unsupportedTagsValidationError, {
+      unsupportedTags: validationResponse.unsupportedTags.join(', '),
+    });
+  }
+
   if (validationResponse?.isBraceError) {
     return formatMessage(globalMessages.unbalanacedCurlyBraces);
   }

package/v2Containers/WebPush/Create/utils/validation.test.js

@@ -127,40 +127,6 @@ describe('validation', () => {
       expect(result).toBe('Personalization tags are not supported for anonymous customers');
       expect(mockFormatMessage).toHaveBeenCalledWith(mockMessages.personalizationTokensErrorMessage);
     });
-
-    it('should return brace error when validationConfig is provided and validateTags returns isBraceError', () => {
-      const validationConfig = { tagsParam: [], location: {}, tagModule: '' };
-      validateTags.mockReturnValue({ isBraceError: true });
-      const result = validateTitle(
-        'Valid Title',
-        mockFormatMessage,
-        mockMessages,
-        false,
-        validationConfig,
-        false
-      );
-      expect(result).toBe('Unbalanced curly braces');
-      expect(mockFormatMessage).toHaveBeenCalledWith(globalMessages.unbalanacedCurlyBraces);
-      expect(validateTags).toHaveBeenCalledWith({
-        content: 'Valid Title',
-        ...validationConfig,
-        isFullMode: false,
-      });
-    });
-
-    it('should not run tag validation when validationConfig is null', () => {
-      validateTags.mockClear();
-      const result = validateTitle('Valid Title', mockFormatMessage, mockMessages, false, null);
-      expect(result).toBe('');
-      expect(validateTags).not.toHaveBeenCalled();
-    });
-
-    it('should not run tag validation when validationConfig is undefined', () => {
-      validateTags.mockClear();
-      const result = validateTitle('Valid Title', mockFormatMessage, mockMessages, false, undefined);
-      expect(result).toBe('');
-      expect(validateTags).not.toHaveBeenCalled();
-    });
   });
 
   describe('validateUrl', () => {
@@ -217,8 +183,11 @@ describe('validation', () => {
   describe('validateMessageContent', () => {
     const mockValidationConfig = {
       tagsParam: [],
+      injectedTagsParams: [],
       location: {},
       tagModule: '',
+      eventContextTags: [],
+      waitEventContextTags: {},
     };
 
     beforeEach(() => {
@@ -257,6 +226,17 @@ describe('validation', () => {
       });
     });
 
+    it('should return error message for unsupported tags', () => {
+      validateTags.mockReturnValue({
+        unsupportedTags: ['tag1', 'tag2'],
+      });
+      const result = validateMessageContent('Message with {tag1} and {tag2}', mockFormatMessage, mockMessages, mockValidationConfig);
+      expect(result).toBe('Unsupported tags: tag1, tag2');
+      expect(mockFormatMessage).toHaveBeenCalledWith(globalMessages.unsupportedTagsValidationError, {
+        unsupportedTags: 'tag1, tag2',
+      });
+    });
+
     it('should return error message for unbalanced curly braces', () => {
       validateTags.mockReturnValue({
         isBraceError: true,
@@ -266,11 +246,23 @@ describe('validation', () => {
       expect(mockFormatMessage).toHaveBeenCalledWith(globalMessages.unbalanacedCurlyBraces);
     });
 
+    it('should return error message for both unsupported tags and brace error (unsupported tags takes precedence)', () => {
+      validateTags.mockReturnValue({
+        unsupportedTags: ['tag1'],
+        isBraceError: true,
+      });
+      const result = validateMessageContent('Message with {tag1}', mockFormatMessage, mockMessages, mockValidationConfig);
+      expect(result).toBe('Unsupported tags: tag1');
+    });
+
     it('should pass validation config to validateTags', () => {
       const customConfig = {
         tagsParam: [{ id: 1, name: 'Tag1' }],
+        injectedTagsParams: [{ id: 2, name: 'Tag2' }],
         location: { query: { type: 'test' } },
         tagModule: 'custom',
+        eventContextTags: [{ id: 3, name: 'Tag3' }],
+        waitEventContextTags: {},
       };
       validateTags.mockReturnValue({});
       validateMessageContent('Valid message', mockFormatMessage, mockMessages, customConfig);
@@ -316,16 +308,6 @@ describe('validation', () => {
       expect(result).toBe('Personalization tags are not supported for anonymous customers');
       expect(mockFormatMessage).toHaveBeenCalledWith(mockMessages.personalizationTokensErrorMessage);
     });
-
-    it('should pass isFullMode to validateTags when provided', () => {
-      validateTags.mockReturnValue({});
-      validateMessageContent('Valid message', mockFormatMessage, mockMessages, mockValidationConfig, true);
-      expect(validateTags).toHaveBeenCalledWith({
-        content: 'Valid message',
-        ...mockValidationConfig,
-        isFullMode: true,
-      });
-    });
   });
 });
 

package/v2Containers/Whatsapp/index.js

@@ -182,6 +182,7 @@ export const Whatsapp = (props) => {
     selectedOfferDetails,
     currentOrgDetails,
     eventContextTags,
+    waitEventContextTags,
     metaDataStatus = "",
     showTestAndPreviewSlidebox: propsShowTestAndPreviewSlidebox,
     handleTestAndPreview: propsHandleTestAndPreview,
@@ -637,21 +638,23 @@ export const Whatsapp = (props) => {
         validateTags({
           content: contentData.join(""),
           tagsParam: tags,
+          injectedTagsParams: injectedTags,
           location,
           tagModule: getDefaultTags,
+          eventContextTags,
+          waitEventContextTags,
           isFullMode,
         }) || {};
+      const unsupportedTagsLengthCheck =
+        validationResponse?.unsupportedTags?.length > 0;
       if (type === HEADER_TEXT) {
         headerTagValidationResponse = validationResponse;
-        updateIsHeaderTagValidationError(validationResponse.isBraceError);
+        updateIsHeaderTagValidationError(unsupportedTagsLengthCheck);
       } else if (type === CAROUSEL_TEXT) {
-        return [
-          { fieldName: "carouselTagValidationErrMessage", value: validationResponse.isBraceError ? validationResponse : {} },
-          { fieldName: "carouselTagValidationErr", value: validationResponse.isBraceError },
-        ];
+        return [{fieldName: "carouselTagValidationErrMessage", value: validationResponse}, {fieldName: "carouselTagValidationErr", value: unsupportedTagsLengthCheck}];
       } else {
         tagValidationResponse = validationResponse;
-        updateIsTagValidationError(validationResponse.isBraceError);
+        updateIsTagValidationError(unsupportedTagsLengthCheck);
       }
     }
   };
@@ -955,6 +958,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
               injectedTags={injectedTags || {}}
               selectedOfferDetails={selectedOfferDetails}
               eventContextTags={eventContextTags}
+              waitEventContextTags={waitEventContextTags}
             />
           )}
         </>
@@ -1956,6 +1960,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
                             injectedTags={injectedTags || {}}
                             selectedOfferDetails={selectedOfferDetails}
                             eventContextTags={eventContextTags}
+                            waitEventContextTags={waitEventContextTags}
                           />
                         )
                       : !isAuthenticationTemplate && (
@@ -2681,11 +2686,18 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
     } else {
       validationResponse = tagValidationResponse;
     }
-    const { isBraceError } = validationResponse || {};
+    const { unsupportedTags = [], isBraceError } = validationResponse;
+
+    let tagError = "";
+    if (unsupportedTags.length > 0) {
+      tagError = formatMessage(globalMessages.unsupportedTagsValidationError, {
+        unsupportedTags,
+      });
+    }
     if (isBraceError) {
-      return <CapError>{formatMessage(globalMessages.unbalanacedCurlyBraces)}</CapError>;
+      tagError = formatMessage(globalMessages.unbalanacedCurlyBraces);
     }
-    return null;
+    return <CapError>{tagError}</CapError>;
   };
 
   const editModeContent = () => (
@@ -2762,6 +2774,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
                 injectedTags={injectedTags || {}}
                 selectedOfferDetails={selectedOfferDetails}
                 eventContextTags={eventContextTags}
+                waitEventContextTags={waitEventContextTags}
               />
             )
           }
@@ -2880,6 +2893,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
               injectedTags={injectedTags || {}}
               selectedOfferDetails={selectedOfferDetails}
               eventContextTags={eventContextTags}
+              waitEventContextTags={waitEventContextTags}
             />
           )}
           {isBtnTypeQuickReply && (

package/v2Containers/Zalo/index.js

@@ -76,6 +76,7 @@ export const Zalo = (props) => {
     selectedOfferDetails,
     hostName: zaloHostName = '',
     eventContextTags,
+    waitEventContextTags,
     metaDataStatus = "",
     // TestAndPreviewSlidebox props
     showTestAndPreviewSlidebox: propsShowTestAndPreviewSlidebox,
@@ -270,15 +271,24 @@ export const Zalo = (props) => {
       validateTags({
         content: message,
         tagsParam: tags,
+        injectedTagsParams: injectedTags,
         location,
         tagModule: getDefaultTags,
+        eventContextTags,
+        waitEventContextTags,
         isFullMode,
       }) || {};
-    const { isBraceError } = tagValidationResponse;
+    const { unsupportedTags = [], isBraceError } = tagValidationResponse;
+    let tagError = '';
+    if (unsupportedTags.length > 0) {
+      tagError = formatMessage(globalMessages.unsupportedTagsValidationError, {
+        unsupportedTags,
+      });
+    }
     if (isBraceError) {
-      return formatMessage(globalMessages.unbalanacedCurlyBraces);
+      tagError = formatMessage(globalMessages.unbalanacedCurlyBraces);
     }
-    return '';
+    return tagError;
   };
 
   //this function is used for checking errror validation in this it validate tags error and length error
@@ -519,6 +529,7 @@ export const Zalo = (props) => {
                     injectedTags={injectedTags || {}}
                     selectedOfferDetails={selectedOfferDetails}
                     eventContextTags={eventContextTags}
+                    waitEventContextTags={waitEventContextTags}
                   />
                 }
               />

package/v2Containers/Sms/tests/commonMethods.test.js

@@ -1,122 +0,0 @@
-import CapNotification from '@capillarytech/cap-ui-library/CapNotification';
-import { showError } from '../commonMethods';
-
-jest.mock('@capillarytech/cap-ui-library/CapNotification', () => ({
-  error: jest.fn(),
-}));
-
-jest.mock('../Create/messages', () => ({
-  __esModule: true,
-  default: {
-    validationError: { defaultMessage: 'Validation error' },
-  },
-}));
-
-describe('Sms commonMethods', () => {
-  describe('showError', () => {
-    beforeEach(() => {
-      jest.clearAllMocks();
-    });
-
-    it('should call CapNotification.error when formData is not empty, isFormValid is false, and errorData has at least one true value', () => {
-      const context = {
-        props: {
-          intl: { formatMessage: jest.fn((msg) => msg.defaultMessage || 'Validation error') },
-        },
-        state: {
-          formData: { message: 'test' },
-          isFormValid: false,
-          errorData: [{ message: true }],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).toHaveBeenCalledWith({
-        key: 'validation-error',
-        message: 'Validation error',
-      });
-    });
-
-    it('should not call CapNotification.error when formData is empty', () => {
-      const context = {
-        props: { intl: { formatMessage: jest.fn() } },
-        state: {
-          formData: {},
-          isFormValid: false,
-          errorData: [{ message: true }],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).not.toHaveBeenCalled();
-    });
-
-    it('should not call CapNotification.error when isFormValid is true', () => {
-      const context = {
-        props: { intl: { formatMessage: jest.fn() } },
-        state: {
-          formData: { message: 'test' },
-          isFormValid: true,
-          errorData: [{ message: true }],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).not.toHaveBeenCalled();
-    });
-
-    it('should not call CapNotification.error when no errorData entry has a true value', () => {
-      const context = {
-        props: { intl: { formatMessage: jest.fn() } },
-        state: {
-          formData: { message: 'test' },
-          isFormValid: false,
-          errorData: [{ message: false, title: false }],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).not.toHaveBeenCalled();
-    });
-
-    it('should not call CapNotification.error when errorData is empty', () => {
-      const context = {
-        props: { intl: { formatMessage: jest.fn() } },
-        state: {
-          formData: { message: 'test' },
-          isFormValid: false,
-          errorData: [],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).not.toHaveBeenCalled();
-    });
-
-    it('should not call CapNotification.error when errorData[0] is undefined', () => {
-      const context = {
-        props: { intl: { formatMessage: jest.fn() } },
-        state: {
-          formData: { message: 'test' },
-          isFormValid: false,
-          errorData: [],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).not.toHaveBeenCalled();
-    });
-
-    it('should call CapNotification.error when errorData[0] has multiple keys and one is true', () => {
-      const context = {
-        props: {
-          intl: { formatMessage: jest.fn((msg) => msg.defaultMessage || 'Validation error') },
-        },
-        state: {
-          formData: { message: 'hello' },
-          isFormValid: false,
-          errorData: [{ message: false, title: true }],
-        },
-      };
-      showError.call(context);
-      expect(CapNotification.error).toHaveBeenCalledWith({
-        key: 'validation-error',
-        message: 'Validation error',
-      });
-    });
-  });
-});