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

package/v2Components/FormBuilder/messages.js

@@ -26,6 +26,10 @@ export default defineMessages({
     id: 'creatives.components.FormBuilder.missingTagsValidationError',
     defaultMessage: 'Missing tags: {missingTags}. Please add them to this message.',
   },
+  unsupportedTagsValidationError: {
+    id: 'creatives.components.FormBuilder.unsupportedTagsValidationError',
+    defaultMessage: 'Unsupported tags: {unsupportedTags}. Please remove them from this message.',
+  },
   genericTagsValidationError: {
     id: 'creatives.components.FormBuilder.genericTagsValidationError',
     defaultMessage: 'Please check the message content for unsupported/missing tags',
@@ -38,6 +42,10 @@ export default defineMessages({
     id: 'creatives.componentsV2.FormBuilder.missingTags',
     defaultMessage: 'Missing tags are:',
   },
+  unsupportedTags: {
+    id: 'creatives.componentsV2.FormBuilder.unsupportedTags',
+    defaultMessage: 'Unsupported tags are:',
+  },
   upload: {
     id: 'creatives.componentsV2.FormBuilder.upload',
     defaultMessage: 'Upload',

package/v2Components/HtmlEditor/HTMLEditor.js

@@ -94,6 +94,7 @@ const HTMLEditor = forwardRef(({
   injectedTags = {},
   location,
   eventContextTags = [],
+  waitEventContextTags = {},
   selectedOfferDetails = [],
   channel,
   userLocale = 'en',
@@ -102,6 +103,7 @@ const HTMLEditor = forwardRef(({
   onTagSelect = null,
   onContextChange = null,
   globalActions = null,
+  isLiquidEnabled = false, // Controls Liquid tab visibility in ValidationTabs
   isFullMode = true, // Full mode vs library mode - controls layout and visibility
   onErrorAcknowledged = null, // Callback when user clicks redirection icon to acknowledge errors
   onValidationChange = null, // Callback when validation state changes (for parent to track errors)
@@ -573,6 +575,7 @@ const HTMLEditor = forwardRef(({
     content,
     layout,
     validation,
+    isLiquidEnabled,
     editorRef: getActiveEditorRef(),
     handleLabelInsert,
     handleSave,
@@ -592,6 +595,7 @@ const HTMLEditor = forwardRef(({
     content,
     layout,
     validation,
+    isLiquidEnabled,
     getActiveEditorRef,
     handleLabelInsert,
     handleSave,
@@ -663,6 +667,7 @@ const HTMLEditor = forwardRef(({
               injectedTags={injectedTags}
               location={location}
               eventContextTags={eventContextTags}
+              waitEventContextTags={waitEventContextTags}
               selectedOfferDetails={selectedOfferDetails}
               channel={channel}
               userLocale={userLocale}
@@ -734,6 +739,7 @@ const HTMLEditor = forwardRef(({
                   injectedTags={injectedTags}
                   location={location}
                   eventContextTags={eventContextTags}
+                  waitEventContextTags={waitEventContextTags}
                   selectedOfferDetails={selectedOfferDetails}
                   channel={channel}
                   userLocale={userLocale}
@@ -772,6 +778,7 @@ HTMLEditor.propTypes = {
   injectedTags: PropTypes.object,
   location: PropTypes.object,
   eventContextTags: PropTypes.array,
+  waitEventContextTags: PropTypes.object,
   selectedOfferDetails: PropTypes.array,
   channel: PropTypes.string,
   userLocale: PropTypes.string,
@@ -780,6 +787,7 @@ HTMLEditor.propTypes = {
   onTagSelect: PropTypes.func,
   onContextChange: PropTypes.func, // Deprecated: use globalActions instead
   globalActions: PropTypes.object,
+  isLiquidEnabled: PropTypes.bool, // Controls Liquid tab visibility in validation
   isFullMode: PropTypes.bool, // Full mode vs library mode
   onErrorAcknowledged: PropTypes.func, // Callback when user clicks redirection icon to acknowledge errors
   onValidationChange: PropTypes.func, // Callback when validation state changes
@@ -805,6 +813,7 @@ HTMLEditor.defaultProps = {
   injectedTags: {},
   location: null,
   eventContextTags: [],
+  waitEventContextTags: {},
   selectedOfferDetails: [],
   channel: null,
   userLocale: 'en',
@@ -813,6 +822,7 @@ HTMLEditor.defaultProps = {
   onTagSelect: null,
   onContextChange: null,
   globalActions: null, // Redux actions for API calls
+  isLiquidEnabled: false,
   isFullMode: true, // Default to full mode
   onErrorAcknowledged: null, // Callback when user clicks redirection icon to acknowledge errors
   onValidationChange: null, // Callback when validation state changes

package/v2Components/HtmlEditor/__tests__/HTMLEditor.apiErrors.test.js

@@ -229,6 +229,7 @@ const defaultProps = {
   channel: 'EMAIL',
   userLocale: 'en',
   moduleFilterEnabled: true,
+  isLiquidEnabled: false,
   isFullMode: true,
   onErrorAcknowledged: jest.fn(),
   onValidationChange: jest.fn(),

package/v2Components/HtmlEditor/__tests__/HTMLEditor.test.js

@@ -3202,6 +3202,7 @@ describe('HTMLEditor', () => {
             onTagSelect={onTagSelect}
             onContextChange={onContextChange}
             globalActions={globalActions}
+            isLiquidEnabled={true}
             isFullMode={false}
             onErrorAcknowledged={onErrorAcknowledged}
             onValidationChange={onValidationChange}
@@ -3261,6 +3262,20 @@ describe('HTMLEditor', () => {
       expect(screen.getByTestId('device-toggle')).toBeInTheDocument();
     });
 
+    it('should handle isLiquidEnabled prop', () => {
+      render(
+        <TestWrapper>
+          <HTMLEditor isLiquidEnabled={true} />
+        </TestWrapper>
+      );
+
+      act(() => {
+        jest.runAllTimers();
+      });
+
+      expect(screen.getByTestId('editor-toolbar')).toBeInTheDocument();
+    });
+
     it('should handle isFullMode prop', () => {
       render(
         <TestWrapper>

package/v2Components/HtmlEditor/components/CodeEditorPane/index.js

@@ -59,6 +59,7 @@ const CodeEditorPaneComponent = ({
   injectedTags = {},
   location,
   eventContextTags = [],
+  waitEventContextTags = {},
   selectedOfferDetails = [],
   channel,
   userLocale = 'en',
@@ -69,7 +70,7 @@ const CodeEditorPaneComponent = ({
 }) => {
   const context = useEditorContext();
   const {
-    content, validation, variant,
+    content, validation, variant, isLiquidEnabled,
   } = context || {};
   const { content: contentValue, updateContent } = content || {};
   const editorRef = useRef(null);
@@ -289,6 +290,7 @@ const CodeEditorPaneComponent = ({
               location={location}
               selectedOfferDetails={selectedOfferDetails}
               eventContextTags={eventContextTags}
+              waitEventContextTags={waitEventContextTags}
               popoverPlacement="rightTop"
             />
           </CapRow>
@@ -298,6 +300,7 @@ const CodeEditorPaneComponent = ({
         <ValidationErrorDisplay
           validation={validation}
           onErrorClick={onErrorClick}
+          isLiquidEnabled={isLiquidEnabled}
           className="code-editor-pane__validation"
         />
       </div>
@@ -327,6 +330,7 @@ CodeEditorPane.propTypes = {
   injectedTags: PropTypes.object,
   location: PropTypes.object,
   eventContextTags: PropTypes.array,
+  waitEventContextTags: PropTypes.object,
   selectedOfferDetails: PropTypes.array,
   channel: PropTypes.string,
   userLocale: PropTypes.string,

package/v2Containers/BeeEditor/index.js

@@ -53,6 +53,7 @@ function BeeEditor(props) {
     BEESelect,
     currentOrgDetails,
     eventContextTags,
+    waitEventContextTags,
   } = props;
   const { saveRowRequest } = BEESelect;
   const {formatMessage} = intl;
@@ -368,6 +369,7 @@ function BeeEditor(props) {
         }}
         onContextChange={onContextChange}
         eventContextTags={eventContextTags}
+        waitEventContextTags={waitEventContextTags}
       />
       <CapModal
         className="custom-row-modal"
@@ -414,6 +416,7 @@ BeeEditor.propTypes = {
   onContextChange: PropTypes.func,
   userLocale: PropTypes.string,
   eventContextTags: PropTypes.array,
+  waitEventContextTags: PropTypes.object,
 };
 
 const mapStateToProps = () => createStructuredSelector({

package/v2Containers/Cap/mockData.js

@@ -2,9 +2,11 @@ export const expectedStateGetLiquidTagsRequest = {
   fetchingLiquidTags: true,
   fetchingSchema: true,
   fetchingSchemaError: "",
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: [],
+    tagLookupMap: {},
     tags: [],
   },
   orgID: "",
@@ -15,9 +17,11 @@ export const expectedStateGetLiquidTagsFailure = {
   fetchingLiquidTags: false,
   fetchingSchema: true,
   fetchingSchemaError: "",
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: [],
+    tagLookupMap: {},
     tags: [],
   },
   orgID: "",
@@ -28,9 +32,11 @@ export const expectedStateGetLiquidTagsSuccess = {
   fetchingLiquidTags: false,
   fetchingSchema: true,
   fetchingSchemaError: "",
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: [],
+    tagLookupMap: {},
     tags: [],
   },
   orgID: "",
@@ -41,9 +47,11 @@ export const expectedStateGetSchemaForEntitySuccessTAG = {
   fetchingLiquidTags: false,
   fetchingSchema: false,
   fetchingSchemaError: false,
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: undefined,
+    tagLookupMap: { undefined: { definition: {} } },
     tags: { standard: { random: "32" } },
   },
   orgID: "",
@@ -54,9 +62,11 @@ export const expectedStateGetSchemaForEntitySuccess = {
   fetchingLiquidTags: false,
   fetchingSchema: false,
   fetchingSchemaError: false,
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: undefined,
+    tagLookupMap: undefined,
     tags: undefined,
   },
   orgID: "",
@@ -68,9 +78,13 @@ export const expectedForwardedTags = {
   fetchingSchema: false,
   fetchingSchemaError: '',
   injectedTags: undefined,
+  liquidTags: [],
   messages: [],
   metaEntities: {
     layouts: [],
+    tagLookupMap: {
+
+    },
     tags: [],
   },
   orgID: "",

package/v2Containers/Cap/reducer.js

@@ -1,11 +1,13 @@
 /**
  * Created by vivek on 22/5/17.
  */
-import { fromJS } from 'immutable';
+import { fromJS, Map as ImmutableMap } from 'immutable';
 import _ from 'lodash';
 import * as types from './constants';
 import initialState from '../../initialState';
 import { FAILURE } from '../App/constants';
+import { TAG } from '../Whatsapp/constants';
+import { getTagMapValue, getForwardedMapValues, getLoyaltyTagsMapValue } from '../../utils/tagValidations';
 
 function capReducer(state = fromJS(initialState.cap), action) {
   switch (action.type) {
@@ -96,6 +98,39 @@ function capReducer(state = fromJS(initialState.cap), action) {
       return state
         .set('fetchingLiquidTags', false);
     case types.GET_SCHEMA_FOR_ENTITY_SUCCESS: {
+      //Process standard tags
+      const standardTagMapInitial = _.keyBy(
+        action?.data?.metaEntities?.standard,
+        item => item?.definition?.value
+      );
+      // Mapping only the `definition` object instead of the entire item, to reduce space used
+      const standardTagMap = _.mapValues(standardTagMapInitial, item => ({
+        definition: item?.definition ?? {},
+      }));
+
+      // Process custom tags
+      const customSubtags = getTagMapValue(action?.data?.metaEntities?.custom)
+      // Process extended tags
+      const extendedSubtags = getTagMapValue(action?.data?.metaEntities?.extended);
+
+      const loyaltySubTagsData = getLoyaltyTagsMapValue(action?.data?.metaEntities?.loyaltyTags);
+
+      const getExistingTagLookupMap = (state) => {
+        if (!state || !state.get) return {};
+        const tagLookupMap = state.getIn(['metaEntities', 'tagLookupMap']);
+        return state.get('metaEntities') && ImmutableMap.isMap(tagLookupMap)
+          ? tagLookupMap.toJS()
+          : {};
+      };
+
+      // Combine all maps
+      const combinedTagMap = {
+        ...standardTagMap,
+        ...customSubtags,
+        ...extendedSubtags,
+        ...loyaltySubTagsData,
+        ...getExistingTagLookupMap(state),
+      };
       const stateMeta = state.get("metaEntities");
       return state
         .set('fetchingSchema', false)
@@ -103,6 +138,7 @@ function capReducer(state = fromJS(initialState.cap), action) {
         .set('metaEntities', {
           layouts: action.data && action.entityType === 'LAYOUT' ? action.data.metaEntities : stateMeta?.layouts,
           tags: action.data && action.entityType === 'TAG' ? action.data.metaEntities : stateMeta?.tags,
+          tagLookupMap: action?.data && action?.entityType === TAG ? combinedTagMap : stateMeta?.tagLookupMap,
         })
         .set('fetchingSchemaError', false);
     }
@@ -110,6 +146,7 @@ function capReducer(state = fromJS(initialState.cap), action) {
       return state.set('metaEntities', {
         layouts: [],
         tags: [],
+        tagLookupMap: {},
       });
     // eslint-disable-next-line no-case-declarations
     case types.HIDE_TAGS:
@@ -117,8 +154,23 @@ function capReducer(state = fromJS(initialState.cap), action) {
       metaEntities.tags.standard = _.filter(state.get('metaEntities').tags.standard, (tag) => action.tagList.indexOf(tag.definition.value) === -1);
       metaEntities.tags.custom = _.filter(state.get('metaEntities').tags.custom, (tag) => action.tagList.indexOf(tag.name) === -1);
       return state.setIn(['metaEntities'], metaEntities);
-    case types.SET_INJECTED_TAGS:
-      return state.set("injectedTags", action.injectedTags);
+    case types.SET_INJECTED_TAGS: 
+
+      // Deep clone the tagLookupMap to avoid direct mutations
+      let updatedMetaEntitiesTagLookUp = _.cloneDeep(state.getIn(['metaEntities', 'tagLookupMap']));
+      const formattedInjectedTags = getForwardedMapValues(action?.injectedTags);
+      // Merge the injectedTags with the existing tagLookupMap
+      updatedMetaEntitiesTagLookUp = {
+        ...formattedInjectedTags || {},
+        ...updatedMetaEntitiesTagLookUp || {},
+      };
+      return state.set("injectedTags", action.injectedTags).setIn(
+        ["metaEntities"],
+        fromJS({
+          ...state.get("metaEntities"),
+          tagLookupMap: updatedMetaEntitiesTagLookUp
+        })
+      );
     case types.GET_TOPBAR_MENU_DATA_REQUEST:
       return state.set('topbarMenuData', fromJS({ status: 'request' }));
     case types.GET_TOPBAR_MENU_DATA_SUCCESS:

package/v2Containers/Cap/tests/reducer.test.js

@@ -21,6 +21,7 @@ import {
   expectedStateGetSchemaForEntitySuccessTAG,
   expectedStateGetSchemaForEntitySuccess,
 } from '../mockData';
+import { TAG } from '../../Whatsapp/constants';
 import { loadItem } from '../../../services/localStorageApi';
 
 
@@ -117,3 +118,104 @@ describe('should handle GET_SUPPORT_VIDEOS_CONFIG', () => {
     expect(reducer(mockedInitialState, action).toJS())?.fetchingSchema?.toEqual(true);
   });
 });
+
+describe('GET_SCHEMA_FOR_ENTITY_SUCCESS handler', () => {
+  it.concurrent('should handle existing tagLookupMap correctly when metaEntities and tagLookupMap exist', () => {
+    const initialStateTest = fromJS({
+      token: loadItem('token') || '',
+      orgID: loadItem('orgID') || '',
+      messages: [],
+      metaEntities: {
+        tags: [{ id: 1, name: 'tag1' }],
+        layouts: ['layout1', 'layout2'],
+        tagLookupMap: {
+          existingTag: { definition: { value: 'existing' } },
+          anotherTag: { definition: { value: 'another' } },
+        },
+        standard: [],
+      },
+      liquidTags: [],
+      fetchingLiquidTags: false,
+      fetchingSchema: false,
+      fetchingSchemaError: '',
+    });
+
+    let action = {
+      type: GET_SCHEMA_FOR_ENTITY_SUCCESS,
+      entityType: TAG,
+      data: {
+        metaEntities: {
+          standard: [],
+          custom: [],
+          extended: [],
+        },
+      },
+    };
+
+    let newState = reducer(initialStateTest, action);
+    let metaEntities = newState.get('metaEntities');
+
+    expect(metaEntities).toEqual(expect.objectContaining({
+      tagLookupMap: expect.objectContaining({
+        existingTag: expect.objectContaining({
+          definition: expect.objectContaining({
+            value: 'existing',
+          }),
+        }),
+      }),
+    }));
+
+    action = {
+      type: GET_SCHEMA_FOR_ENTITY_SUCCESS,
+      entityType: 'LAYOUT',
+      data: {
+        metaEntities: {
+          layouts: ['layout1', 'layout2'],
+          standard: [],
+        },
+      },
+    };
+    newState = reducer(initialStateTest, action);
+    metaEntities = newState.get('metaEntities');
+    expect(metaEntities).toEqual(expect.objectContaining({
+      layouts: expect.objectContaining({
+        layouts: expect.arrayContaining(['layout1', 'layout2']),
+      }),
+    }));
+  });
+
+  it.concurrent('should handle non-existent tagLookupMap by returning empty object', () => {
+    const initialStateTest = fromJS({
+      token: loadItem('token') || '',
+      orgID: loadItem('orgID') || '',
+      messages: [],
+      metaEntities: {
+        tagLookupMap: {},
+      },
+      liquidTags: [],
+      fetchingLiquidTags: false,
+      fetchingSchema: false,
+      fetchingSchemaError: '',
+    });
+
+    const action = {
+      type: GET_SCHEMA_FOR_ENTITY_SUCCESS,
+      entityType: TAG,
+      data: {
+        metaEntities: {
+          standard: [],
+          custom: [],
+          extended: [],
+        },
+      },
+    };
+
+    const newState = reducer(initialStateTest, action);
+    const metaEntities = newState.get('metaEntities');
+
+    // Updated assertions to handle plain object
+    expect(metaEntities).toBeDefined();
+    expect(metaEntities.tagLookupMap).toBeDefined();
+    expect(metaEntities.tagLookupMap).toEqual({});
+  });
+});