@capillarytech/creatives-library 7.17.44 → 7.17.46-alpha.0

package/components/CapTagList/index.js

@@ -183,7 +183,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
           onVisibleChange={this.togglePopoverVisibility}
           content={<div>
             <Spin tip="Getting tags..." spinning={this.props.loading}>
-              <Search style={{ marginBottom: 8, width: '250px'}} placeholder="Search" onChange={this.onChange} />
+              <Search style={{ marginBottom: 8, width: '250px'}} placeholder={this.props.intl.formatMessage(messages.searchText)} onChange={this.onChange} />
               {this.props.moduleFilterEnabled ? <CapSelect getPopupContainer={(triggerNode) => triggerNode.parentNode} style={{width: '250px', marginBottom: '16px', minWidth: 'initial', display: 'inherit'}} onChange={this.props.onContextChange} defaultValue="All" options={options}>
               </CapSelect> : ''}
               <Tree

package/components/CapTagList/messages.js

@@ -34,4 +34,8 @@ export default defineMessages({
     id: 'creatives.components.CapTagList.loyalty',
     defaultMessage: 'Loyalty',
   },
+  "searchText": {
+    id: 'creatives.components.CapTagList.searchText',
+    defaultMessage: 'Search',
+  },
 });

package/components/FormBuilder/index.js

@@ -24,6 +24,7 @@ import EDMEditor from "../../components/Edmeditor";
 import CustomPopOver from '../../components/CustomPopOver';
 import './_formBuilder.scss';
 import {updateCharCount, checkUnicode} from "../../utils/smsCharCountV2";
+import globalMessages from '../../v2Containers/Cap/messages';
 import messages from './messages';
 const TabPane = Tabs.TabPane;
 const {Column} = Table;
@@ -1516,8 +1517,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       this.setState({errorData: formData});
     } else {
       const tempTab = ifError ? currentTab : this.state.currentTab;
-      const version = `Version ${this.state.currentTab}`;
-      formData[tabCount].name = `Copy of ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
+      const version = `${this.props.intl.formatMessage(messages.version)} ${this.state.currentTab}`;
+      formData[tabCount].name = `${this.props?.intl?.formatMessage(globalMessages.copyOf)} ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
       formData[tabCount].base = false;
       const initialTab = this.state.currentTab;
       this.setState({formData, tabCount: tabCount + 1, currentTab: tabCount + 1, tabKey: formData[tabCount].tabKey}, () => {

package/components/FormBuilder/messages.js

@@ -54,4 +54,8 @@ export default defineMessages({
     id: 'creatives.components.FormBuilder.ok',
     defaultMessage: 'Ok',
   },
+  Version: {
+    id: 'creatives.components.FormBuilder.version',
+    defaultMessage: 'Version',
+  },
 });

package/containers/App/constants.js

@@ -7,6 +7,8 @@ export const TRAI_DLT = 'TRAI_DLT';
 export const CARD_BASED_SCOPE = 'CARD_BASED_SCOPE';
 export const HOSPITALITY_BASED_SCOPE = 'HOSPITALITY_BASED_SCOPE';
 export const REGISTRATION_CUSTOM_FIELD = 'Registration custom fields';
+export const GIFT_CARDS = 'GIFT_CARDS';
+export const PROMO_ENGINE = 'PROMO_ENGINE';
 export const CUSTOM_TAG = 'CustomTagMessage';
 export const CUSTOMER_EXTENDED_FIELD = 'Customer extended fields';
 export const EXTENDED_TAG = 'ExtendedTagMessage';
@@ -43,5 +45,29 @@ export const HOSPITALITY_RELATED_TAGS = [
   "email",
   "resID_Source",
 ];
+export const GIFT_VOUCHER_RELATED_TAGS = [
+  "gift_voucher",
+  "gift_voucher_expiry_date.FORMAT_1",
+  "gift_voucher_expiry_date.FORMAT_2",
+  "gift_voucher_expiry_date.FORMAT_3",
+  "gift_voucher_expiry_date.FORMAT_4",
+  "gift_voucher_expiry_date.FORMAT_5",
+  "gift_voucher_expiry_date.FORMAT_6",
+  "gift_voucher_expiry_date.FORMAT_7",
+  "gift_voucher_expiry_date.FORMAT_8",
+  "gift_voucher_expiry_date",
+];
+export const PROMO_ENGINE_RELATED_TAGS = [
+  "promotion",
+  "promotion_expiry_date.FORMAT_1",
+  "promotion_expiry_date.FORMAT_2",
+  "promotion_expiry_date.FORMAT_3",
+  "promotion_expiry_date.FORMAT_4",
+  "promotion_expiry_date.FORMAT_5",
+  "promotion_expiry_date.FORMAT_6",
+  "promotion_expiry_date.FORMAT_7",
+  "promotion_expiry_date.FORMAT_8",
+  "promotion_expiry_date",
+];
 
 export const CUSTOMER_BARCODE_TAG = "customer_barcode";

package/containers/Assets/Gallery/index.js

@@ -336,7 +336,7 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
           <CapInput
             className="search-text"
             style={{width: '210px'}}
-            placeholder="Search"
+            placeholder={this.props.intl.formatMessage(messages.searchText)}
             prefix={<i className="material-icons" style={{color: '#707070', fontSize: '16px'}}>search</i>}
             value={this.state.searchText}
             onChange={(e) => this.searchAsset(e.target.value)}

package/containers/Assets/Gallery/messages.js

@@ -86,4 +86,8 @@ export default defineMessages({
     id: 'creatives.containers.Assets.Gallery.assetDeleteFailed',
     defaultMessage: 'Image deletion failed.',
   },
+  searchText: {
+    id: 'creatives.components.CapTagList.searchText',
+    defaultMessage: 'Search',
+  },
 });

package/containers/Email/index.js

@@ -3104,7 +3104,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           <CapInput
             className="search-text"
             style={{width: '210px'}}
-            placeholder="Search"
+            placeholder={this.props.intl.formatMessage(messages.searchText)}
             prefix={<i className="material-icons" style={{color: '#707070', fontSize: '16px'}}>search</i>}
             value={this.state.searchText}
             onChange={(e) => this.searchAsset(e.target.value)}

package/containers/Templates/index.js

@@ -866,7 +866,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   duplicateTemplate(template) {
     
     const duplicateObj = _.cloneDeep(template);
-    duplicateObj.name = `Copy of ${template.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
+    duplicateObj.name = `${this.props.intl.formatMessage(messages.copyOf)} ${template.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
     delete duplicateObj._id;
     if (this.state.channel.toLowerCase() === "sms") {
       this.props.smsActions.createTemplate(duplicateObj);

package/package.json

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

package/utils/common.js

@@ -7,12 +7,16 @@ import {
   CARD_BASED_SCOPE,
   HOSPITALITY_RELATED_TAGS,
   HOSPITALITY_BASED_SCOPE,
+  GIFT_CARDS,
+  PROMO_ENGINE,
   EXTENDED_TAG,
   CUSTOMER_EXTENDED_FIELD,
   CUSTOM_TAG,
   REGISTRATION_CUSTOM_FIELD,
   JP_LOCALE_HIDE_FEATURE,
   ENABLE_CUSTOMER_BARCODE_TAG,
+  PROMO_ENGINE_RELATED_TAGS,
+  GIFT_VOUCHER_RELATED_TAGS,
 } from '../containers/App/constants';
 import { apiMessageFormatHandler } from './commonUtils';
 
@@ -66,7 +70,15 @@ export const hasHospitalityBasedScope = Auth.hasFeatureAccess.bind(
   null,
   HOSPITALITY_BASED_SCOPE,
 );
+export const hasPromoFeature = Auth.hasFeatureAccess.bind(
+  null,
+  PROMO_ENGINE,
+);
 
+export const hasGiftVoucherFeature = Auth.hasFeatureAccess.bind(
+  null,
+  GIFT_CARDS,
+);
 export const hasJPLocaleHideFeatureEnabled = Auth.hasFeatureAccess.bind(
   null,
   JP_LOCALE_HIDE_FEATURE,
@@ -85,16 +97,25 @@ export const filterTags = (tagsToFilter, tagsList) => tagsList?.filter(
 export function getTreeStructuredTags({tagsList, userLocale = 'en', offerDetails = [], disableTagsDetails = {}}) {
   const mainTags = {};
   const { disableRelatedTags, childTagsToDisable, parentTagstoDisable} = disableTagsDetails;
+  const excludedTagList = [];
 
-  let clonedTags = tagsList;
   if (!hasCardBasedScope()) {
-    //filtering CARD_RELATED_TAGS if org does not have CARD_BASED_SCOPE feature enabled
-    clonedTags = filterTags(CARD_RELATED_TAGS, tagsList);
+    excludedTagList.push(CARD_RELATED_TAGS);
   }
+
   if (!hasHospitalityBasedScope()) {
-    //filtering HOSPITALITY_RELATED_TAGS if org does not have HOSPITALITY_BASED_SCOPE feature enabled
-    clonedTags = filterTags(HOSPITALITY_RELATED_TAGS, tagsList);
+    excludedTagList.push(HOSPITALITY_RELATED_TAGS);
+  }
+
+  if (!hasPromoFeature()) {
+    excludedTagList.push(PROMO_ENGINE_RELATED_TAGS);
   }
+
+  if (!hasGiftVoucherFeature()) {
+    excludedTagList.push(GIFT_VOUCHER_RELATED_TAGS);
+  }
+  const clonedTags = filterTags(excludedTagList, tagsList);
+
   _.forEach(clonedTags, (temp) => {
     const tag = temp.definition;
     if (!tag['tag-header']) { //if tag doesn't have subtag(s), which means this tag itself is tag and not a tag header.
@@ -294,8 +315,8 @@ export const isTraiDLTEnable = (isFullMode, smsRegister) => {
   return isTraiDltFeature;
 };
 
-
-export const intlKeyGenerator = (value = "") => String(value).replace(/[^a-zA-Z0-9_]/g, "").toLowerCase();
+//Input: " Spaces In Input "---> Output: "spaces_in_input"
+export const intlKeyGenerator = (value = "") => String(value).replace(/[^a-zA-Z0-9_ ]/g, "").replace(/ /g, "_").toLowerCase();
 
 export const handleInjectedData = (data, scope) => {
   let tagType;
@@ -307,6 +328,7 @@ export const handleInjectedData = (data, scope) => {
       } else if (tag?.name === CUSTOMER_EXTENDED_FIELD) {
         tagType = EXTENDED_TAG;
       }
+
       if (tag?.name) {
         const name = tag.name;
         const key = intlKeyGenerator(name);
@@ -350,4 +372,4 @@ export const handleInjectedData = (data, scope) => {
 
 export const handlePreviewInNewTab = (previewUrl) => {
   window.open(previewUrl, '_blank');
-}
+};

package/utils/tests/common.test.js

@@ -51,7 +51,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
     const intlKey = intlKeyGenerator("scope");
     expect(intlKey).toEqual('scope');
-    expect(result.tag1.name).toEqual(<FormattedMessage defaultMessage="Registration Fields" id="scope.registrationfields" values={{}} />);
+    expect(result.tag1.name).toEqual(<FormattedMessage defaultMessage="Registration Fields" id="scope.registration_fields" values={{}} />);
   });
 
   it("adds tagType for Registration custom fields", () => {
@@ -65,7 +65,7 @@ describe("handleInjectedData", () => {
     const intlKey = intlKeyGenerator();
     expect(intlKey).toEqual('');
     expect(result.tag1.name).toEqual(
-      <FormattedMessage defaultMessage="Registration custom fields" id="scope.registrationcustomfields_name.CustomTagMessage" values={{}} />
+      <FormattedMessage defaultMessage="Registration custom fields" id="scope.registration_custom_fields_name.CustomTagMessage" values={{}} />
     );
   });
 
@@ -79,7 +79,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.name).toEqual(
-      <FormattedMessage defaultMessage="Customer extended fields" id="scope.customerextendedfields_name.ExtendedTagMessage" values={{}} />
+      <FormattedMessage defaultMessage="Customer extended fields" id="scope.customer_extended_fields_name.ExtendedTagMessage" values={{}} />
     );
   });
   it("adds tagType for Customer extended fields fields", () => {
@@ -157,7 +157,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.subtags.subtag1.desc).toEqual(
-      <FormattedMessage defaultMessage="Enter your first name" id="scope.enteryourfirstname" values={{}} />
+      <FormattedMessage defaultMessage="Enter your first name" id="scope.enter_your_first_name" values={{}} />
     );
   });
   it("replaces subtag name desc with intl key", () => {
@@ -175,7 +175,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.subtags.subtag1.desc).toEqual(
-      <FormattedMessage defaultMessage="Enter your first name" id="scope.enteryourfirstname" values={{}} />
+      <FormattedMessage defaultMessage="Enter your first name" id="scope.enter_your_first_name" values={{}} />
     );
   });
 });

package/v2Components/FormBuilder/index.js

@@ -1669,7 +1669,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     } else {
       const tempTab = ifError ? currentTab : this.state.currentTab;
       const version = `Version ${this.state.currentTab}`;
-      formData[tabCount].name = `Copy of ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
+      formData[tabCount].name = `${this.props?.intl?.formatMessage(globalMessages.copyOf)} ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
       formData[tabCount].base = false;
       const initialTab = this.state.currentTab;
       this.setState({formData, tabCount: tabCount + 1, currentTab: tabCount + 1, tabKey: formData[tabCount].tabKey}, () => {

package/v2Containers/Cap/messages.js

@@ -201,5 +201,9 @@ export default defineMessages({
     id: `creatives.componentsV2.unbalanacedCurlyBraces`,
     defaultMessage: 'Invalid label, please close all curly braces'
   },
+  "copyOf": {
+    id: 'creatives.componentsV2.copyOf',
+    defaultMessage: 'Copy of',
+  },
 });
 

package/v2Containers/CreativesContainer/SlideBoxHeader.js

@@ -61,8 +61,9 @@ export function SlideBoxHeader(props) {
       email: <FormattedMessage {...messages.emailHeader} />,
       mobilepush: <FormattedMessage {...messages.pushNotificationHeader} />,
       wechat: <FormattedMessage {...messages.wechat} />,
-      no_communication: 'NO_COMMUNICATION',
-      ftp: 'FTP',
+      line: <FormattedMessage {...messages.lineHeader} />,
+      no_communication: <FormattedMessage {...messages.noCommunication} />,
+      ftp: <FormattedMessage {...messages.ftp} />,
       whatsapp: <FormattedMessage {...messages.whatsappTemplate} />,
       rcs: <FormattedMessage {...messages.rcsCreative} />,
       zalo: <FormattedMessage {...messages.zaloTemplate} />,

package/v2Containers/CreativesContainer/messages.js

@@ -341,5 +341,13 @@ export default defineMessages({
   "wechat": {
     id: `${scope}.wechat`,
     defaultMessage: `Wechat`,
-  }
+  },
+  "ftp": {
+    id: `${scope}.ftp`,
+    defaultMessage: `FTP`,
+  },
+  "noCommunication": {
+    id: `${scope}.noCommunication`,
+    defaultMessage: `NO_COMMUNICATION`,
+  },
 });

package/v2Containers/TagList/index.js

@@ -98,7 +98,7 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
     //Form tags object with tag headers
     _.forEach(tagsList, (temp) => {
       const tag = temp.definition;
-      const { locale : userLocale } = this.props?.intl || {};
+      const { locale: userLocale } = this.props?.intl || {};
       if (!tag['tag-header']) {
         mainTags[tag.value] = {
           "name": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
@@ -117,7 +117,7 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
     });
 
     const mainTagsCloned = _.cloneDeep(mainTags);
-    //Insert subtags in tag headers and reomve them from top level
+    //Insert subtags in tag headers and remove them from top level
     const result = {};
     _.forEach(mainTagsCloned, (tag, key) => {
       if (tag['tag-header']) {

package/v2Containers/Templates/_templates.scss

@@ -623,13 +623,24 @@
     margin: auto;
   }
 }
-.whatsapp-rcs-template-name, .zalo-template-name {
+.whatsapp-rcs-template-name {
   max-width: 170px;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
 }
 
+.zalo-template-name{
+  max-width: 170px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: $CAP_G01;
+  font-size: $FONT_SIZE_M;
+  font-weight: $FONT_WEIGHT_MEDIUM;
+  line-height: normal;
+}
+
 .zalo-view-tooltip {
   padding: $CAP_SPACE_06 $CAP_SPACE_12;
 }

package/v2Containers/Templates/index.js

@@ -108,7 +108,8 @@ import {
 import { ZALO_STATUS_OPTIONS, ZALO_STATUSES } from '../Zalo/constants';
 import { getWhatsappContent, getWhatsappStatus, getWhatsappCategory, getWhatsappCta } from '../Whatsapp/utils';
 import { getRCSContent } from '../Rcs/utils';
-import zaloMessages from '../Zalo/messages'
+import zaloMessages from '../Zalo/messages';
+import globalMessages from '../../v2Containers/Cap/messages';
 import { handlePreviewInNewTab } from '../../utils/common';
 
 import { MOBILE_PUSH, WECHAT, SMS, EMAIL, EBILL, LINE, VIBER, FACEBOOK, WHATSAPP, RCS, ZALO } from '../CreativesContainer/constants';
@@ -1202,7 +1203,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           } = template;
           templateData.title = (
             <CapRow>
-              <CapLabel label='label16' className="zalo-template-name">
+              <CapLabel className="zalo-template-name">
                 {templateId}
               </CapLabel>
               <CapRow
@@ -1755,7 +1756,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
 
   duplicateTemplate(template) {
     const duplicateObj = cloneDeep(template);
-    duplicateObj.name = `${this.props.intl.formatMessage(messages.copyOf)} ${template?.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
+    duplicateObj.name = `${this.props.intl.formatMessage(globalMessages.copyOf)} ${template?.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
     delete duplicateObj._id;
 
     if (this.state.channel.toLowerCase() === "mobilepush") {

package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap

@@ -267,7 +267,6 @@ exports[`Test Templates container Should render temlates when Zalo templates are
                         "title": <CapRow>
                           <CapLabel
                             className="zalo-template-name"
-                            label="label16"
                             type="label1"
                           >
                             
@@ -357,7 +356,6 @@ exports[`Test Templates container Should render temlates when Zalo templates are
                         "title": <CapRow>
                           <CapLabel
                             className="zalo-template-name"
-                            label="label16"
                             type="label1"
                           >
                             

package/v2Containers/Zalo/tests/selectors.test.js

@@ -0,0 +1,52 @@
+import { fromJS } from "immutable";
+import { makeSelectZalo, selectZaloDomain } from "../selectors";
+import { zaloTemplateInfoData } from "./mockData";
+
+describe("makeSelectZalo", () => {
+  it("returns the expected object with default values when substate is empty", () => {
+    // Arrange
+    const state = fromJS({ zalo: {} });
+    const expected = {
+      zaloTemplateInfoStatus: undefined,
+      zaloTemplateInfoValue: undefined,
+      zaloTemplateInfoError: undefined,
+      zaloTemplatePreviewData: undefined,
+    };
+    const selector = makeSelectZalo();
+
+    // Act
+    const result = selector(state);
+
+    // Assert
+    expect(result).toEqual(expected);
+  });
+
+  it("returns the expected object when substate has values", () => {
+    // Arrange
+    const state = fromJS({
+      zalo: zaloTemplateInfoData,
+    });
+    const expected = {
+      zaloTemplateInfoStatus: "success",
+      zaloTemplateInfoValue: fromJS(zaloTemplateInfoData.zaloTemplateInfoValue),
+      zaloTemplateInfoError: null,
+      zaloTemplatePreviewData: undefined,
+    };
+    const selector = makeSelectZalo();
+
+    // Act
+    const result = selector(state);
+
+    // Assert
+    expect(result).toEqual(expected);
+  });
+
+  it("returns the expected object with default values when substate is empty", () => {
+    // Arrange
+    const state = fromJS({ zalo: {} });
+    const expected = fromJS({});
+    const result = selectZaloDomain(state);
+    // Assert
+    expect(result).toEqual(expected);
+  });
+});