@capillarytech/creatives-library 8.0.288 → 8.0.290-alpha.0

package/v2Containers/Cap/mockData.js

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

package/v2Containers/Cap/reducer.js

@@ -1,13 +1,11 @@
 /**
  * Created by vivek on 22/5/17.
  */
-import { fromJS, Map as ImmutableMap } from 'immutable';
+import { fromJS } 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) {
@@ -98,39 +96,6 @@ 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)
@@ -138,7 +103,6 @@ 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);
     }
@@ -146,7 +110,6 @@ 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:
@@ -154,23 +117,8 @@ 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: 
-
-      // 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.SET_INJECTED_TAGS:
+      return state.set("injectedTags", action.injectedTags);
     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,7 +21,6 @@ import {
   expectedStateGetSchemaForEntitySuccessTAG,
   expectedStateGetSchemaForEntitySuccess,
 } from '../mockData';
-import { TAG } from '../../Whatsapp/constants';
 import { loadItem } from '../../../services/localStorageApi';
 
 
@@ -118,104 +117,3 @@ 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({});
-  });
-});

package/v2Containers/CreativesContainer/SlideBoxFooter.js

@@ -53,6 +53,7 @@ function SlideBoxFooter(props) {
   // Only apply validation state checks for EMAIL channel in HTML Editor mode (not BEE/DragDrop)
   // For other channels, BEE editor, or when htmlEditorValidationState is not provided, don't disable based on validation
   const isEmailChannel = currentChannel?.toUpperCase() === 'EMAIL';
+  const isSmsChannel = currentChannel?.toUpperCase() === 'SMS';
   const isEditMode = slidBoxContent === 'editTemplate';
 
   // Use selectedEmailCreateMode for accurate mode detection in create mode (emailCreateMode is mapped for backwards compatibility)
@@ -129,8 +130,9 @@ function SlideBoxFooter(props) {
   const isBEEEditorModeInCreate = !isHTMLEditorMode && !isEditMode;
   const isBEEEditorMode = isBEEEditorModeInEdit || isBEEEditorModeInCreate;
   const hasBEEEditorErrors = isEmailChannel && isBEEEditorMode && (hasStandardErrors || hasLiquidErrors) && (!htmlEditorValidationState || !htmlEditorHasErrors);
+  const hasSmsValidationErrors = isSmsChannel && hasStandardErrors;
 
-  const shouldShowErrorInfoNote = hasBEEEditorErrors || isSupportCKEditor;
+  const shouldShowErrorInfoNote = hasBEEEditorErrors || hasSmsValidationErrors || isSupportCKEditor;
 
   // Check for personalization tokens in title/message when anonymous user tries to save
   const hasPersonalizationTokens = () => {

package/v2Containers/CreativesContainer/index.js

@@ -132,7 +132,6 @@ export class Creatives extends React.Component {
       },
       hasPersonalizationTokenError: false, // Track personalization token errors in form
     };
-    this.liquidFlow = Boolean(commonUtil.hasLiquidSupportFeature());
     this.creativesTemplateSteps = {
       1: 'modeSelection',
       2: 'templateSelection', // only for email in current flows wil be used for mpush, line and wechat as well.
@@ -256,12 +255,23 @@ export class Creatives extends React.Component {
   };
 
   onShowTemplates = () => {
-    this.setState({ slidBoxContent: 'templates', showSlideBox: true, isGetFormData: false });
+    this.setState({
+      slidBoxContent: 'templates',
+      showSlideBox: true,
+      isGetFormData: false,
+      liquidErrorMessage: { STANDARD_ERROR_MSG: [], LIQUID_ERROR_MSG: [] },
+      isLiquidValidationError: false,
+    });
     this.resetStep();
   };
 
   onChannelChange = (channel) => {
-    this.setState({ currentChannel: channel, templateData: null });
+    this.setState({
+      currentChannel: channel,
+      templateData: null,
+      liquidErrorMessage: { STANDARD_ERROR_MSG: [], LIQUID_ERROR_MSG: [] },
+      isLiquidValidationError: false,
+    });
   }
 
   onCreateNextStep = () => {
@@ -1469,11 +1479,12 @@ export class Creatives extends React.Component {
   }
 
   getFormData = (template) => {
+    // Always reset isGetFormData so the child does not re-send form data on every re-render
+    // (e.g. when user fixes validation error by typing, we must not auto-close the slidebox)
+    this.setState({ isGetFormData: false });
     if (template.validity) {
       this.setState(
-        {
-          isGetFormData: false,
-        },
+        {},
         () => {
           const templateData = this.state.templateData ? this.state.templateData : template; //select existing or create new content
           const channel = templateData.type;
@@ -1557,6 +1568,8 @@ export class Creatives extends React.Component {
       ...prevState,
       templateData: undefined,
       showSlideBox: false,
+      liquidErrorMessage: { STANDARD_ERROR_MSG: [], LIQUID_ERROR_MSG: [] },
+      isLiquidValidationError: false,
     }), () => this.props.handleCloseCreatives(reloadTemplates));
   };
 

package/v2Containers/Email/index.js

@@ -26,7 +26,7 @@ import * as globalActions from '../Cap/actions';
 import './_email.scss';
 import {getMessageObject} from '../../utils/messageUtils';
 import EmailPreview from '../../v2Components/EmailPreview';
-import { getDecodedFileName, hasLiquidSupportFeature, hasSupportCKEditor } from '../../utils/common';
+import { getDecodedFileName, hasSupportCKEditor } from '../../utils/common';
 import Pagination from '../../v2Components/Pagination';
 import * as creativesContainerActions from '../CreativesContainer/actions';
 import withCreatives from '../../hoc/withCreatives';
@@ -170,7 +170,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         deleteLanguage: this.deleteLanguage,
       },
     };
-    this.liquidFlow =  hasLiquidSupportFeature();
   }
   componentWillMount() {
     const formData = this.initFormData(this.props, true); //_.cloneDeep(this.state.formData);
@@ -255,7 +254,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       layout: 'EMAIL',
       type: 'LAYOUT',
       version: 'v2',
-      liquidFlow:this.liquidFlow,
     };
     this.props.globalActions.fetchSchemaForEntity(query);
     window.addEventListener("message", this.handleFrameTasks);
@@ -347,7 +345,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           type: 'TAG',
           context: this.props.location.query.type === 'embedded' ? this.props.location.query.module : 'default',
           embedded: this.props.location.query.type === 'embedded' ? this.props.location.query.type : 'full',
-          liquidFlow:this.liquidFlow
         };
         if (this.props.getDefaultTags) {
           query.context = this.props.getDefaultTags;
@@ -2373,7 +2370,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       type: 'TAG',
       context: (data || '').toLowerCase() === 'all' ? 'default' : (data || '').toLowerCase(),
       embedded: 'full',
-      liquidFlow:this.liquidFlow
     };
     this.props.globalActions.fetchSchemaForEntity(query);
   }

package/v2Containers/EmailWrapper/components/EmailHTMLEditor.js

@@ -15,7 +15,7 @@ import HTMLEditor from '../../../v2Components/HtmlEditor';
 import CapTagListWithInput from '../../../v2Components/CapTagListWithInput';
 import formBuilderMessages from '../../../v2Components/FormBuilder/messages';
 import { validateLiquidTemplateContent } from '../../../utils/commonUtils';
-import { hasLiquidSupportFeature, isEmailUnsubscribeTagMandatory } from '../../../utils/common';
+import { isEmailUnsubscribeTagOptional } from '../../../utils/common';
 import history from '../../../utils/history';
 import messages from '../messages';
 import emailMessages from '../../Email/messages';
@@ -108,13 +108,10 @@ const EmailHTMLEditor = (props) => {
     standardErrors: [],
   });
 
-  // Merge tag validation errors (unsupported/missing) into apiValidationErrors so they show in ValidationErrorDisplay
+  // Merge tag validation errors (missing) into apiValidationErrors so they show in ValidationErrorDisplay
   const mergedApiValidationErrors = useMemo(() => {
     const tagMessages = [];
-    if (tagValidationError?.unsupportedTags?.length) {
-      tagMessages.push(`Unsupported tags are: ${tagValidationError.unsupportedTags.join(', ')}`);
-    }
-    if (tagValidationError?.missingTags?.length && !isEmailUnsubscribeTagMandatory()) {
+    if (tagValidationError?.missingTags?.length && !isEmailUnsubscribeTagOptional()) {
       tagMessages.push(`Missing tags are: ${tagValidationError.missingTags.join(', ')}`);
     }
     if (tagMessages.length === 0) {
@@ -190,9 +187,6 @@ const EmailHTMLEditor = (props) => {
     },
   }), [htmlContent, subject, currentOrgDetails]);
 
-  // Check if liquid support is enabled
-  const isLiquidEnabled = hasLiquidSupportFeature();
-
   // Detect edit mode: when isEditEmail is false (create flow), never treat as edit or fetch template details
   const hasParamsId = params?.id || location?.query?.id || location?.params?.id || location?.pathname?.includes('/edit/');
   const currentTemplateId = isEditEmail
@@ -493,10 +487,8 @@ const EmailHTMLEditor = (props) => {
       const validationResult = validateTags({
         content,
         tagsParam: tags,
-        injectedTagsParams: injectedTags,
         location,
         tagModule: getDefaultTags,
-        eventContextTags,
         isFullMode,
       });
 
@@ -650,7 +642,7 @@ const EmailHTMLEditor = (props) => {
     // IMPORTANT: Clear API validation errors FIRST before checking for validation errors
     // This ensures that old API errors don't block the save when user fixes content and clicks Update again
     // We'll re-validate with fresh API call anyway
-    if (isLiquidEnabled && getLiquidTags) {
+    if (getLiquidTags) {
       setApiValidationErrors({
         liquidErrors: [],
         standardErrors: [],
@@ -712,7 +704,7 @@ const EmailHTMLEditor = (props) => {
     // When EMAIL_UNSUBSCRIBE_TAG_MANDATORY is false: validate and require unsubscribe tag.
     // Run for both library and full mode so liquid-enabled orgs also get the error (notification + ValidationErrorDisplay).
     const isModuleTypeOutbound = (moduleType || '').toUpperCase() === OUTBOUND;
-    if (!isEmailUnsubscribeTagMandatory() && isModuleTypeOutbound) {
+    if (!isEmailUnsubscribeTagOptional() && isModuleTypeOutbound) {
       const unsubscribeRegex = /{{unsubscribe(\(#[a-zA-Z\d]{6}\))?}}/g; // eslint-disable-line no-useless-escape
       const hasUnsubscribeTag = unsubscribeRegex.test(htmlContent);
 
@@ -744,52 +736,17 @@ const EmailHTMLEditor = (props) => {
       const validationResult = validateTags({
         content: htmlContent,
         tagsParam: tags,
-        injectedTagsParams: injectedTags,
         location,
         tagModule: getDefaultTags,
-        eventContextTags,
         isFullMode,
       });
 
-      const hasUnsupportedTags = validationResult?.unsupportedTags?.length > 0;
-      if (!validationResult?.valid || (hasUnsupportedTags && !isFullMode)) {
+      if (!validationResult?.valid) {
         setTagValidationError(validationResult);
-        // IMPORTANT: For non-liquid orgs, block save (like CK/BEE editor)
-        // For liquid orgs, continue (extractTags API will validate)
-        if (!isLiquidEnabled) {
-          // Show notification popup like CK/BEE editor
-          const baseLanguage = get(currentOrgDetails, 'basic_details.base_language', 'en');
-
-          const contentNotValidMsg = intl.formatMessage(formBuilderMessages.contentNotValidLanguage);
-          let errorMessage = `${contentNotValidMsg} ${baseLanguage}`;
-
-          if (hasUnsupportedTags) {
-            const unsupportedTagsMsg = intl.formatMessage(formBuilderMessages.unsupportedTags);
-            errorMessage += `\n${unsupportedTagsMsg} ${validationResult?.unsupportedTags?.join(', ')}`;
-          }
-          if (validationResult?.missingTags?.length > 0) {
-            const missingTagsMsg = intl.formatMessage(formBuilderMessages.missingTags);
-            errorMessage += `\n${missingTagsMsg} ${validationResult?.missingTags?.join(', ')}`;
-          }
-
-          const type = 'error';
-          CapNotification[type]({
-            message: `${type.toUpperCase()} ! ! ! `,
-            description: errorMessage,
-            duration: 5,
-          });
-
-          // Reset parent state so next click is detected as a change
-          if (onValidationFail) {
-            onValidationFail();
-          }
-          // Block save for non-liquid orgs
-          return;
-        }
-        // For liquid orgs, just show warning and continue
+        // For liquid orgs, show warning and continue (extractTags API will validate)
       }
       // Clear tag errors if valid
-      if (tagValidationError && validationResult?.valid && !hasUnsupportedTags) {
+      if (tagValidationError && validationResult?.valid) {
         setTagValidationError(null);
       }
     }
@@ -956,8 +913,8 @@ const EmailHTMLEditor = (props) => {
       }
     };
 
-    // If liquid enabled, validate first using extractTags API
-    if (isLiquidEnabled && getLiquidTags) {
+    // Validate first using extractTags API
+    if (getLiquidTags) {
       // Note: API validation errors are already cleared at the start of handleSave
       // This ensures fresh validation on every save attempt
 
@@ -998,10 +955,6 @@ const EmailHTMLEditor = (props) => {
         messages: formBuilderMessages,
         onError,
         onSuccess,
-        tagLookupMap: metaEntities?.tagLookupMap,
-        eventContextTags,
-        isLiquidFlow: true,
-        forwardedTags: forwardedTags || {},
       });
     } else {
       performSave();
@@ -1013,7 +966,6 @@ const EmailHTMLEditor = (props) => {
     injectedTags,
     location,
     getDefaultTags,
-    eventContextTags,
     formatMessage,
     subjectError,
     isFullMode,
@@ -1025,11 +977,8 @@ const EmailHTMLEditor = (props) => {
     emailActions,
     getFormdata,
     isGetFormData,
-    isLiquidEnabled,
     getLiquidTags,
     showLiquidErrorInFooter,
-    metaEntities,
-    forwardedTags,
     globalActions,
     intl,
     extractedTemplateName,
@@ -1175,7 +1124,6 @@ const EmailHTMLEditor = (props) => {
             userLocale={intl.locale || 'en'}
             moduleFilterEnabled={location?.query?.type !== EMBEDDED}
             onTagContextChange={handleOnTagsContextChange}
-            isLiquidEnabled={isLiquidEnabled}
             isFullMode={isFullMode}
             onErrorAcknowledged={handleErrorAcknowledged}
             onValidationChange={handleValidationChange}