@capillarytech/creatives-library 8.0.87-alpha.24 → 8.0.87-alpha.3

package/containers/Templates/constants.js

@@ -43,9 +43,3 @@ export const RESET_TEMPLATE = "app/containers/Templates/RESET_TEMPLATE";
 export const RESET_TEMPLATE_DATA = "app/containers/Templates/RESET_TEMPLATE_DATA";
 export const RESET_UPLOAD_DATA = "app/containers/Templates/RESET_UPLOAD_DATA";
 export const CLEAR_TEMPLATE_STORE_DATA = "app/containers/Templates/CLEAR_TEMPLATE_STORE_DATA";
-
-
-export const TRUE = 'true';
-export const FALSE = 'false';
-export const EMAIL = 'email';
-export const TYPE_EMBEDDED = 'embedded';

package/containers/Templates/index.js

@@ -57,8 +57,6 @@ import lineCreateReducer from '../Line/Create/reducer';
 import { ebillSaga } from '../Ebill/sagas';
 import { lineCreateSaga } from '../Line/Create/sagas';
 import { duplicateMPushSaga } from '../MobilePush/Create/sagas';
-import { FALSE, TRUE, TYPE_EMBEDDED } from './constants';
-import { DEFAULT } from '../../v2Containers/Cap/constants';
 
 const MenuItem = Menu.Item;
 const Option = Select.Option;
@@ -916,49 +914,31 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
 
   handleEdmDefaultTemplateSelection = (isSelected, id) => {
     if (isSelected) {
-    const template = _.find(this.props?.Templates?.cmsTemplates, (template = []) => {
-        return template?.versions && template?.versions?.base && _.get(template, 'versions.base.drag_drop_id') === id;
-      });
-      const {type,module = DEFAULT} = this.props?.location?.query;
-    const isLanguageSupport = this.props?.location?.query?.isLanguageSupport === TRUE;
-    const isEdmSupport = this.props?.location?.query?.isEdmSupport !== FALSE;
+      const data = _.find(this.props.Templates.cmsTemplates, {_id: id});
+      const type = this.props.location.query.type
+      const module = this.props.location.query.module ? this.props.location.query.module : 'default';
+      const isLanguageSupport = this.props.location.query.isLanguageSupport ? this.props.location.query.isLanguageSupport : true;
+      const isEdmSupport = (this.props.location.query.isEdmSupport !== "false") || false;
       let getQuery = '';
-    
-      if (template) {
-    this.props.actions.setEdmTemplate({
-      ...template,
-      isEdmSupport,
-      isLanguageSupport,
-          projectId: template?.versions?.base?.drag_drop_id,
-        });
-
-        if (this.state.channel && this.state.channel.toLowerCase() === EMAIL) {
-          getQuery = (type === TYPE_EMBEDDED) ? {
-            type: TYPE_EMBEDDED, 
-      module,
-      isLanguageSupport: isLanguageSupport ? 1 : 0,
-      isEdmSupport: isEdmSupport ? 1 : 0,
-            projectId: template?.versions?.base?.drag_drop_id,
-    } : {
-      module,
-            isLanguageSupport: isLanguageSupport ? 1 : 0,
-            isEdmSupport: isEdmSupport ? 1 : 0,
-            projectId: template?.versions?.base?.drag_drop_id,
-    };
-        } else {
-          getQuery = (type === TYPE_EMBEDDED) ? {type: TYPE_EMBEDDED, module} : {module};
-        }
+      
+      this.props.actions.setEdmTemplate(data);
+      if (this.state.channel && this.state.channel.toLowerCase() === 'email') {
+        getQuery = (type === 'embedded') ? {type: 'embedded', module, isLanguageSupport, isEdmSupport} : {module, isLanguageSupport, isEdmSupport};
+      } else {
+        getQuery = (type === 'embedded') ? {type: 'embedded', module} : {module};
+      }
+      if (this.isEnabledInLibraryModule("callCreateFromProps")) {
+        this.props.createNew();
+        return;
+      }
 
-    if (this.isEnabledInLibraryModule("callCreateFromProps")) {
-      this.props.createNew();
-      return;
-    }
+      const queryParams = commonUtil.createQueryString(getQuery);
+      // this.props.router.push(`${pathName}${queryParams}`);
 
-    this.props.router.push({
-      pathname: `/${this.state.channel.toLowerCase()}/create`,
-          search: commonUtil.createQueryString(getQuery),
-        });
-      }
+      this.props.router.push({
+        pathname: `/${this.state.channel.toLowerCase()}/create`,
+        search: getQuery,
+      });
     }
   };
 
@@ -1148,7 +1128,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         const imgSrc = template && template.versions && template.versions.base ? template.versions.base.preview_http_url : '';
         const ifPreviewGenerated = template && template.versions && template.versions.base ? template.versions.base.isPreviewGenerated : 0;
         content = <img src={imgSrc || ''} alt={this.props.intl.formatMessage(messages.previewGenerateText)} width="100%" height="100%"/>;
-
+        
         temp.content = (
           <div
             className="sms-template-content">
@@ -1156,7 +1136,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
               {content}
             </div>
             {!layoutSelection && template._id === this.state.hoveredItem ? <CapButton onClick={(e) => this.handleEditClick(e, template._id)} className="edit-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectButton) : this.props.intl.formatMessage(messages.editButton)}</CapButton> : ''}
-            {layoutSelection && template._id === this.state.hoveredItem ? <CapButton onClick={(event) =>{this.handleEdmDefaultTemplateSelection(true, template?.versions?.base?.drag_drop_id); event.stopPropagation();}} className="select-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectDefaultButton) : this.props.intl.formatMessage(messages.selectDefaultButton)}</CapButton> : ''}
+            {layoutSelection && template._id === this.state.hoveredItem ? <CapButton onClick={(event) =>{this.handleEdmDefaultTemplateSelection(true, template._id); event.stopPropagation();}} className="select-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectDefaultButton) : this.props.intl.formatMessage(messages.selectDefaultButton)}</CapButton> : ''}
             {!layoutSelection && template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
           </div>);
       } else if (this.state.channel.toLowerCase() === 'mobilepush') {

package/initialState.js

@@ -50,5 +50,4 @@ export default {
   facebook: {
 
   },
-  metaDataStatus: '',
 };

package/package.json

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

package/services/api.js

@@ -9,7 +9,7 @@ import config from '../config/app';
 import pathConfig from '../config/path';
 import getSchema from './getSchema';
 import * as API from '../utils/ApiCaller';
-import { addBaseToTemplate, transformCustomFieldsData } from '../utils/commonUtils';
+import { addBaseToTemplate } from '../utils/commonUtils';
 import { EMAIL, SMS } from '../v2Containers/CreativesContainer/constants';
 let API_ENDPOINT = config.development.api_endpoint;
 let EXPORT_API_ENDPOINT = config.development.exports_api_endpoint;
@@ -118,7 +118,7 @@ function request(url, options, handleUnauthorizedStatus) {
     .catch((error) => error);
 }
 
-function getAPICallObject(method, body, isFileUpload = false, loadCampaignHeaders = false, orgUnitId = false, allowOrgInProd = false) {
+function getAPICallObject(method, body, isFileUpload = false, loadCampaignHeaders = false, orgUnitId = false) {
   const token = loadItem('token');
   const orgID = loadItem('orgID');
   const user = loadItem('user');
@@ -145,8 +145,8 @@ function getAPICallObject(method, body, isFileUpload = false, loadCampaignHeader
       headers['X-CAP-REMOTE-USER'] = user.refID;
     }
 
-    if ((allowOrgInProd || process.env.NODE_ENV !== "production") && orgID !== undefined) {
-      headers["X-CAP-API-AUTH-ORG-ID"] = orgID;
+    if (process.env.NODE_ENV !== 'production' && orgID !== undefined) {
+      headers['X-CAP-API-AUTH-ORG-ID'] = orgID;
     }
 
     if (process.env.NODE_ENV !== 'production' && token !== undefined) {
@@ -359,13 +359,7 @@ export const fetchSchemaForEntity = async ({queryParams}) => {
     });
   }
   const url = `${API_ENDPOINT}/meta/${queryParams.type}?query=${JSON.stringify(queryParams)}`;
-  const result = await request(url, getAPICallObject('GET'));// request(url, getAPICallObject('GET'));
-  const customFields = get(result, 'response.metaEntities.custom', {});
-  if (customFields && Object.keys(customFields)?.length > 0) {
-    const transformedData = transformCustomFieldsData(customFields);
-    result.response.metaEntities.custom = transformedData;
-  }
-  return result;
+  return request(url, getAPICallObject('GET'));// request(url, getAPICallObject('GET'));
 };
 
 export const fetchWeCrmAccounts = (sourceName) => {
@@ -477,12 +471,14 @@ export const getUnsubscribeUrl = () => {
   return request(url, getAPICallObject('POST', body));
 };
 
-export const getMarketingObjectives = (channel) => request(
-  `${CAMPAIGNS_API_ENDPOINT}/socialObjectives?channel=${channel}`,
-  getAPICallObject('GET', null, false, true),
-);
+export const getMarketingObjectives = (channel) =>
+  request(
+    `${CAMPAIGNS_API_ENDPOINT}/socialObjectives?channel=${channel}`,
+    getAPICallObject('GET', null, false, true),
+  );
 
-export const getAllLineStickers = () => request(`${API_ENDPOINT}/meta/sticker`, getAPICallObject('GET'));
+export const getAllLineStickers = () =>
+  request(`${API_ENDPOINT}/meta/sticker`, getAPICallObject('GET'));
 
 
 export const createCustomRow = (data) => {
@@ -524,13 +520,7 @@ export const checkBulkDuplicates = (data) => {
 export const createWhatsappTemplate = ({payload, gupshupMediaFile }) => {
   const data = new FormData();
   data.append('payload', JSON.stringify(payload));
-  if (Array.isArray(gupshupMediaFile) && gupshupMediaFile?.length) {
-    gupshupMediaFile.forEach((file, index) => {
-      data.append(`gupshupMediaFile_${index}`, file);
-    });
-  } else {
-    data.append('gupshupMediaFile', gupshupMediaFile);
-  }
+  data.append('gupshupMediaFile', gupshupMediaFile);
   const url = `${API_ENDPOINT}/templates/WHATSAPP`;
   return request(url, getAPICallObject('POST', data, true));
 };
@@ -579,9 +569,4 @@ export const getLiquidTags = (content) => {
   return request(url, getAPICallObject("POST", { content }, false, true));
 };
 
-export const createCentralCommsMetaId = (payload, metaType = 'TRANSACTION') => {
-  const url = `${API_ENDPOINT}/common/central-comms/meta-id/${metaType}`;
-  return request(url, getAPICallObject('POST', payload, false, false, false, true));
-};
-
 export {request, getAPICallObject};

package/services/tests/api.test.js

@@ -86,11 +86,7 @@ describe('uploadFile -- whatsapp image upload', () => {
 describe('createWhatsappTemplate -- Test with valid responses', () => {
   it('Should return correct response', () =>
     expect(
-      createWhatsappTemplate({gupshupMediaFile: [sampleFile], payload: mockData.createWhatsappPayload}),
-    ).toEqual(Promise.resolve()));
-  it('Should return correct response when single file is present', () =>
-    expect(
-      createWhatsappTemplate({gupshupMediaFile: sampleFile, payload: mockData.createWhatsappPayload}),
+      createWhatsappTemplate(sampleFile, mockData.createWhatsappPayload),
     ).toEqual(Promise.resolve()));
 });
 

package/utils/commonUtils.js

@@ -9,77 +9,23 @@ export const apiMessageFormatHandler = (id, fallback) => (
 );
 
 export const addBaseToTemplate = (template) => {
-  const {
-    versions: {
-      history = [],
-    } = {},
-  } = template || {};
+  const { versions: {
+    history = [],
+  } = {}} = template || {};
   if (history?.length) {
     return ({
       ...template,
       versions: {
         ...template.versions,
-        base: {
+        base:{
           ...history[0],
-          ...( !history?.[0]?.subject && { subject: get(template, 'versions.base.subject') }),
-        },
-      },
+          ...( !history?.[0]?.subject && { subject: get(template, 'versions.base.subject') })
+      }
+      }
     });
   }
-  return template;
-};
-
-export const isEmbeddedEditOrPreview = (queryType, creativesMode) => queryType === EMBEDDED && [EDIT, PREVIEW].includes(creativesMode);
-
-export const transformCustomFieldsData = (customFields) => {
-  // Define mapping of scopes to their display names
-  const scopeMapping = {
-    loyalty_registration: 'Registration custom fields',
-    loyalty_transaction: 'Registration custom fields',
-    store_custom_fields: 'Organization custom fields',
-    org_custom_field: 'Organization custom fields',
-  };
-
-  // Initialize result structure with all possible sections
-  const result = Object.values(scopeMapping).reduce((acc, sectionName) => {
-    acc[sectionName] = {
-      name: sectionName,
-      subtags: {},
-    };
-    return acc;
-  }, {});
-
-  // Process each custom field
-  Object.values(customFields).forEach((field) => {
-    const {scope = ''} = field;
-    const sectionName = scopeMapping[scope];
-
-    if (sectionName) {
-      // Determine the prefix based on scope
-      let prefix = 'custom_field';
-      if (scope === 'org_custom_field') {
-        prefix = 'org_custom_field';
-      } else if (scope === 'store_custom_fields') {
-        prefix = 'store_custom_field';
-      }
-
-      const fieldKey = `${prefix}.${field?.name}`;
-      // Add field to appropriate section
-      result[sectionName].subtags[fieldKey] = {
-        name: field?.name,
-        desc: field?.name || field?.label,
-      };
-    }
-  });
-
-  // Remove empty sections (those with no subtags)
-  Object.keys(result).forEach((sectionName) => {
-    if (Object.keys(result[sectionName]?.subtags)?.length === 0) {
-      delete result[sectionName];
-    }
-  });
-
-  return result;
+    return template;
 };
 
-export const isTagIncluded = (value) => value && value.includes('{{') && value.includes('}}');
+export const isEmbeddedEditOrPreview = (queryType, creativesMode) => queryType === EMBEDDED &&
+  [EDIT, PREVIEW].includes(creativesMode);

package/utils/tests/commonUtil.test.js

@@ -2,9 +2,10 @@ import "@testing-library/jest-dom";
 import get from 'lodash/get';
 import { getTreeStructuredTags } from "../common";
 import * as mockdata from "./common.mockdata";
-import { addBaseToTemplate, isEmbeddedEditOrPreview, transformCustomFieldsData } from "../commonUtils";
+import { addBaseToTemplate, isEmbeddedEditOrPreview } from "../commonUtils";
 import { EMBEDDED, FULL } from "../../v2Containers/Whatsapp/constants";
 import { CREATE, EDIT, PREVIEW } from "../../v2Containers/App/constants";
+import { query } from "express";
 
 jest.mock('@capillarytech/cap-ui-utils', () => ({
   Auth: {
@@ -37,7 +38,7 @@ describe('addBaseToTemplate', () => {
       versions: {
         history: ['v1', 'v2', 'v3'],
         base: {
-          0: "v", 1: "1", subject: undefined,
+          "0":"v","1":"1","subject":undefined,
         },
       },
     };
@@ -114,109 +115,3 @@ describe('isEmbeddedEditOrPreview', () => {
     expect(isEmbeddedEditOrPreview(queryType, creativesMode)).toBe(false);
   });
 });
-
-describe('transformCustomFieldsData', () => {
-  it('should transform registration custom fields correctly', () => {
-    const input = {
-      1: {
-        name: 'age_group',
-        label: 'Age Group',
-        scope: 'loyalty_registration',
-      },
-      2: {
-        name: 'gender',
-        label: 'Gender',
-        scope: 'loyalty_registration',
-      },
-    };
-
-    const expected = {
-      'Registration custom fields': {
-        name: 'Registration custom fields',
-        subtags: {
-          'custom_field.age_group': {
-            name: 'age_group',
-            desc: 'age_group',
-          },
-          'custom_field.gender': {
-            name: 'gender',
-            desc: 'gender',
-          },
-        },
-      },
-    };
-
-    expect(transformCustomFieldsData(input)).toEqual(expected);
-  });
-
-  it('should transform organization custom fields correctly', () => {
-    const input = {
-      1: {
-        name: 'org_phone',
-        label: 'Phone',
-        scope: 'org_custom_field',
-      },
-      2: {
-        name: 'store_location',
-        label: 'Location',
-        scope: 'store_custom_fields',
-      },
-    };
-
-    const expected = {
-      'Organization custom fields': {
-        name: 'Organization custom fields',
-        subtags: {
-          'org_custom_field.org_phone': {
-            name: 'org_phone',
-            desc: 'org_phone',
-          },
-          'store_custom_field.store_location': {
-            name: 'store_location',
-            desc: 'store_location',
-          },
-        },
-      },
-    };
-
-    expect(transformCustomFieldsData(input)).toEqual(expected);
-  });
-
-  it('should handle empty input correctly', () => {
-    expect(transformCustomFieldsData({})).toEqual({});
-  });
-
-  it('should handle fields with missing properties', () => {
-    const input = {
-      1: {
-        scope: 'loyalty_registration',
-      },
-    };
-
-    const expected = {
-      'Registration custom fields': {
-        name: 'Registration custom fields',
-        subtags: {
-          'custom_field.undefined': {
-            name: undefined,
-            desc: undefined,
-          },
-        },
-      },
-    };
-
-    expect(transformCustomFieldsData(input)).toEqual(expected);
-  });
-
-  it('should ignore fields with invalid scope', () => {
-    const input = {
-      1: {
-        name: 'test',
-        label: 'Test',
-        scope: 'invalid_scope',
-      },
-    };
-
-    expect(transformCustomFieldsData(input)).toEqual({});
-  });
-});

package/v2Components/CapImageUpload/index.js

@@ -44,7 +44,6 @@ function CapImageUpload(props) {
     imageData,
     channel,
     channelSpecificStyle,
-    showReUploadButton = true,
   } = props;
   const {
     formatMessage,
@@ -225,18 +224,16 @@ function CapImageUpload(props) {
         </>
       );
     }
-    if (showReUploadButton) {
-      return (
-        <CapButton
-          className="dragger-button re-upload"
-          type="flat"
-          onClick={onReUpload}
-          style={channelSpecificStyle ? { marginTop: '-16px'} : {}}
-        >
-          <FormattedMessage {...messages.imageReUpload} />
-        </CapButton>
-      );
-    }
+    return (
+      <CapButton
+        className="dragger-button re-upload"
+        type="flat"
+        onClick={onReUpload}
+        style={channelSpecificStyle ? { marginTop: '-16px'} : {}}
+       >
+        <FormattedMessage {...messages.imageReUpload} />
+      </CapButton>
+    );
   }, [isImageError, imageSrc]);
 
   return (

package/v2Components/CapVideoUpload/index.js

@@ -39,7 +39,6 @@ function CapVideoUpload(props) {
     errorMessage,
     showVideoNameAndDuration = true,
     formClassName = 'video-form',
-    showReUploadButton = true,
   } = props;
   const [isVideoError, updateVideoErrorMessage] = useState(false);
   const [isVideo, updateVideoStatus] = useState(false);
@@ -247,17 +246,15 @@ function CapVideoUpload(props) {
     const videoDurationValue = moment('1900-01-01 00:00:00').add(videoDuration, 'seconds').format("HH.mm.ss"); // to get the duration of video
     return (
       <Fragment key={videoSrc}>
-        {showReUploadButton && (
-          <div style={{ overflow: 'hidden' }}>
-            <CapButton
-              className="dragger-button video-reupload"
-              type="flat"
-              onClick={onReUpload}
-            >
-              <FormattedMessage {...messages.imageReUpload} />
-            </CapButton>
-          </div>
-        )}
+        <div style={{ overflow: 'hidden' }}>
+          <CapButton
+            className="dragger-button video-reupload"
+            type="flat"
+            onClick={onReUpload}
+          >
+            <FormattedMessage {...messages.imageReUpload} />
+          </CapButton>
+        </div>
         <div className={showVideoNameAndDuration ? 'video-panel' : 'video-panel-wp'}>
           <video
             width="230"

package/v2Components/CapWhatsappCTA/messages.js

@@ -104,8 +104,4 @@ export default defineMessages({
     id: `${prefix}.whatsappCtaTagListRevert`,
     defaultMessage: 'Reset website URL label to default value',
   },
-  url: {
-    id: `${prefix}.url`,
-    defaultMessage: 'URL',
-  },
 });

package/v2Components/FormBuilder/constants.js

@@ -1,9 +1 @@
 export const OUTBOUND = 'OUTBOUND';
-export const GLOBAL_CONVERT_OPTIONS = {
-    selectors: [
-      ...[1, 2, 3, 4, 5, 6].map(level => ({
-        selector: `h${level}`,
-        options: { uppercase: false }
-      }))
-    ]
-  };

package/v2Components/FormBuilder/index.js

@@ -44,7 +44,7 @@ import EDMEditor from "../Edmeditor";
 import BeeEditor from '../../v2Containers/BeeEditor';
 import CustomPopOver from '../CustomPopOver';
 import messages from './messages';
-import { makeSelectMetaEntities, selectCurrentOrgDetails, selectLiquidStateDetails, selectMetaDataStatus } from "../../v2Containers/Cap/selectors";
+import { makeSelectMetaEntities, selectCurrentOrgDetails, selectLiquidStateDetails } from "../../v2Containers/Cap/selectors";
 import * as actions from "../../v2Containers/Cap/actions";
 import './_formBuilder.scss';
 import {updateCharCount, checkUnicode} from "../../utils/smsCharCountV2";
@@ -52,11 +52,10 @@ import { checkSupport, extractNames, preprocessHtml, validateIfTagClosed } from
 import { SMS, MOBILE_PUSH, LINE, ENABLE_AI_SUGGESTIONS,AI_CONTENT_BOT_DISABLED, EMAIL, LIQUID_SUPPORTED_CHANNELS } from '../../v2Containers/CreativesContainer/constants';
 import globalMessages from '../../v2Containers/Cap/messages';
 import { convert } from 'html-to-text';
-import { GLOBAL_CONVERT_OPTIONS, OUTBOUND } from './constants';
+import { OUTBOUND } from './constants';
 import { GET_TRANSLATION_MAPPED } from '../../containers/TagList/constants';
 import moment from 'moment';
 import { CUSTOMER_BARCODE_TAG , COPY_OF, ENTRY_TRIGGER_TAG_REGEX} from '../../containers/App/constants';
-import { REQUEST } from '../../v2Containers/Cap/constants'
 import { hasLiquidSupportFeature, isEmailUnsubscribeTagMandatory } from '../../utils/common';
 import { isUrl } from '../../v2Containers/Line/Container/Wrapper/utils';
 import { bindActionCreators } from 'redux';
@@ -1083,7 +1082,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       }
     });}
   }
-  
   saveForm(saveForm) {
     if (this.props.isNewVersionFlow && !saveForm) {
       this.props.getValidationData();
@@ -1094,7 +1092,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         const templateContent = this.state.formData?.base?.en?.["template-content"] || "";
         //Converts given HTML content to plain text string.
         const content = convert(
-          templateContent, GLOBAL_CONVERT_OPTIONS
+          templateContent
         );
       /* 
         The `handleResult` function is used as a callback for `getLiquidTags` to handle the results post-processing. 
@@ -3795,7 +3793,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
 
 
     return (
-      <CapSpin spinning={Boolean((this.liquidFlow && this.props.liquidExtractionInProgress) || this.props.metaDataStatus === REQUEST)} tip={this.props.intl.formatMessage(messages.liquidSpinText)} >
+      <CapSpin spinning={Boolean(this.liquidFlow && this.props.liquidExtractionInProgress)} tip={this.props.intl.formatMessage(messages.liquidSpinText)} >
       <CapRow>
         {this.props.schema && this.renderForm()}
         <SlideBox
@@ -3829,7 +3827,6 @@ FormBuilder.defaultProps = {
   isNewVersionFlow: false,
   userLocale: localStorage.getItem('jlocale') || 'en',
   showLiquidErrorInFooter: () => {},
-  metaDataStatus: "",
 };
 
 FormBuilder.propTypes = {
@@ -3877,13 +3874,12 @@ FormBuilder.propTypes = {
   isFullMode: PropTypes.bool,
   currentOrgDetails: PropTypes.object,
   liquidExtractionInProgress: PropTypes.bool,
-  showLiquidErrorInFooter: PropTypes.func
+  showLiquidErrorInFooter: PropTypes.func,
 };
 
 const mapStateToProps = createStructuredSelector({
   currentOrgDetails: selectCurrentOrgDetails(),
   liquidExtractionInProgress: selectLiquidStateDetails(),
-  metaDataStatus: selectMetaDataStatus(),
   metaEntities: makeSelectMetaEntities(),
 });
 

package/v2Components/TemplatePreview/_templatePreview.scss

@@ -567,10 +567,6 @@
         font-size: 10px;
         font-family: 'open-sans';
       }
-      &.message-pop-carousel {
-        position: relative; 
-        margin-right: $CAP_SPACE_04;
-      }
     }
   }
   .android-push-message-Container, .iphone-push-message-Container{
@@ -751,22 +747,6 @@
       width: 153px;
     }
   }
-
-  .msg-container-carousel {
-    display: flex;
-    flex-direction: column;
-    .scroll-container {
-      overflow-x: auto;
-      display: flex;
-      padding-top: $CAP_SPACE_06;
-      padding-right: $CAP_SPACE_06;
-      white-space: nowrap;
-      scrollbar-width: none; // Hide scrollbar in Firefox
-      &::-webkit-scrollbar {
-        display: none; // Hide scrollbar in Chrome/Safari/Opera
-      }
-    }
-  }
 }
 
 .align-center {