@capillarytech/creatives-library 7.17.33 → 7.17.35-alpha.2

package/components/Ckeditor/index.js

@@ -13,7 +13,8 @@ import React from 'react';
 import _ from 'lodash';
 // import messages from './messages';
 const loadScript = require('load-script');
-const defaultScriptUrl = "https://storage.crm.n.content-cdn.io/ckeditor_full/ckeditor/ckeditor.js";
+// fetching ckeditor from s3 by rerouting through arya whitelisted services
+const defaultScriptUrl = `${window.location.origin}/arya/ui/library/ckeditor/ckeditor.js`;
 const user = localStorage.getItem('user');
 let locale = 'en';
 if (user && JSON.parse(user).lang) {

package/containers/App/constants.js

@@ -11,6 +11,7 @@ export const CUSTOM_TAG = 'CustomTagMessage';
 export const CUSTOMER_EXTENDED_FIELD = 'Customer extended fields';
 export const EXTENDED_TAG = 'ExtendedTagMessage';
 export const JP_LOCALE_HIDE_FEATURE = 'JP_LOCALE_HIDE_FEATURE';
+export const ENABLE_CUSTOMER_BARCODE_TAG = "ENABLE_CUSTOMER_BARCODE_TAG";
 
 export const CARD_RELATED_TAGS = [
   'card_series',
@@ -42,3 +43,5 @@ export const HOSPITALITY_RELATED_TAGS = [
   "email",
   "resID_Source",
 ];
+
+export const CUSTOMER_BARCODE_TAG = "customer_barcode";

package/package.json

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

package/utils/common.js

@@ -12,6 +12,8 @@ import {
   CUSTOM_TAG,
   REGISTRATION_CUSTOM_FIELD,
   JP_LOCALE_HIDE_FEATURE,
+  ENABLE_CUSTOMER_BARCODE_TAG,
+  CUSTOMER_BARCODE_TAG,
 } from '../containers/App/constants';
 import { apiMessageFormatHandler } from './commonUtils';
 
@@ -71,6 +73,11 @@ export const hasJPLocaleHideFeatureEnabled = Auth.hasFeatureAccess.bind(
   JP_LOCALE_HIDE_FEATURE,
 );
 
+export const hasCustomerBarcodeFeatureEnabled = Auth.hasFeatureAccess.bind(
+  null,
+  ENABLE_CUSTOMER_BARCODE_TAG,
+);
+
 //filtering tags based on scope
 export const filterTags = (tagsToFilter, tagsList) => tagsList?.filter(
     (tag) => !tagsToFilter?.includes(tag?.definition?.value)
@@ -89,6 +96,10 @@ export function getTreeStructuredTags({tagsList, userLocale = 'en', offerDetails
     //filtering HOSPITALITY_RELATED_TAGS if org does not have HOSPITALITY_BASED_SCOPE feature enabled
     clonedTags = filterTags(HOSPITALITY_RELATED_TAGS, tagsList);
   }
+  if (!hasCustomerBarcodeFeatureEnabled()) {
+    //filtering CUSTOMER_BARCODE_TAG if org does not have CUSTOMER_BARCODE_TAG feature enabled
+    clonedTags = filterTags(CUSTOMER_BARCODE_TAG, clonedTags);
+  }
   _.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.

package/utils/tests/cdnTransformation.test.js

@@ -6,6 +6,7 @@ import * as cdnTransformationHandler from './cdnTransformation.handler.mockdata'
 
 var bugsnagSpy;
 var localStorageMock;
+jest.setTimeout(10000);
 beforeEach(() => {
   localStorageMock = (function () {
     var store = {

package/v2Components/CapTagList/index.js

@@ -17,8 +17,8 @@ import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import messages from './messages';
 import { makeSelectLoyaltyPromotionDisplay } from '../../v2Containers/Cap/selectors';
-import { CARD_RELATED_TAGS, HOSPITALITY_RELATED_TAGS } from '../../containers/App/constants';
-import { hasCardBasedScope, hasHospitalityBasedScope } from '../../utils/common';
+import { CARD_RELATED_TAGS, HOSPITALITY_RELATED_TAGS, CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
+import { hasCardBasedScope, hasCustomerBarcodeFeatureEnabled, hasHospitalityBasedScope } from '../../utils/common';
 
 import {
   GET_TRANSLATION_MAPPED,
@@ -178,6 +178,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
     const hideDateTagsForJpLocale = accessibleFeatures.includes(JP_LOCALE_HIDE_FEATURE);
     const list = [];
     const loyaltyAttrDisableText = <FormattedMessage {...messages.loyaltyAttributeDisable} />;
+    const customerBarcodeDisableText = <FormattedMessage {...messages.customerBarcodeDisable} />;
     let clonedTags = _.cloneDeep(tags);
     if (!hasCardBasedScope()) {
       clonedTags = _.omit(clonedTags, CARD_RELATED_TAGS);
@@ -207,10 +208,15 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
         );
         hidingDateTagsForJpLocale(hideDateTagsForJpLocale, val, list, tagValue);
       } else if (searchString === '' || !searchString || ((val.name || '').toLowerCase().indexOf(searchString.toLowerCase()) !== -1)) {
-        const childDisabled = disableRelatedTags ? childTagsToDisable.includes(key) : false;
+        let childDisabled = true;
+        if (key === CUSTOMER_BARCODE_TAG && !hasCustomerBarcodeFeatureEnabled()) {
+          childDisabled = true;
+        } else {
+          childDisabled = disableRelatedTags ? childTagsToDisable.includes(key) : false;
+        }
         const tempNode = (
           <CapTreeNode
-            title={childDisabled ? <CapTooltip title={loyaltyAttrDisableText}>{val.desc || val.name}</CapTooltip> : (val.desc || val.name)}
+            title={childDisabled ? <CapTooltip title={key === CUSTOMER_BARCODE_TAG ? customerBarcodeDisableText : loyaltyAttrDisableText}>{val.desc || val.name}</CapTooltip> : (val.desc || val.name)}
             tag={val}
             isLeaf
             key={val.couponSeriesId ? `${key}(${val.couponSeriesId})` : `${key}`}

package/v2Components/CapTagList/messages.js

@@ -46,4 +46,8 @@ export default defineMessages({
     id: `creatives.componentsV2.CapTagList.loyaltyAttributeDisable`,
     defaultMessage: 'You won’t be able to add loyalty related attributes since the loyalty program/ card series is None.',
   },
+  "customerBarcodeDisable": {
+    id: `creatives.componentsV2.CapTagList.customerBarcodeDisable`,
+    defaultMessage: 'This label is not enabled for your organization. Please connect with your Capillary POC',
+  },
 });

package/v2Components/Ckeditor/index.js

@@ -13,7 +13,10 @@ import React from 'react';
 import _ from 'lodash';
 // import messages from './messages';
 const loadScript = require('load-script');
-const defaultScriptUrl = "https://storage.crm.n.content-cdn.io/ckeditor_full/ckeditor/ckeditor.js";
+const defaultScriptUrl = `${window.location.origin}/arya/ui/library/ckeditor/ckeditor.js`;
+/*const defaultScriptUrl = 'https://nightly.intouch.capillarytech.com/arya/ui/library/ckeditor/ckeditor.js';
+**Uncomment the above line to use CKEDITOR in local
+*/
 const user = localStorage.getItem('user');
 let locale = 'en';
 if (user && JSON.parse(user).lang) {

package/v2Components/FormBuilder/index.js

@@ -54,6 +54,7 @@ import { convert } from 'html-to-text';
 import { AI_SUGGESTION_API_URL } from './constants';
 import { GET_TRANSLATION_MAPPED } from '../../containers/TagList/constants';
 import moment from 'moment';
+import { CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
 const TabPane = Tabs.TabPane;
 const {Column} = Table;
 const {TextArea} = CapInput;
@@ -1138,7 +1139,11 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       });
       const regex = /{{[(A-Z\w+(\s\w+)*$\(\)@!#$%^&*~.,/\\]+}}/g;
       let match = regex.exec(content);
-      while (match !== null) {
+      const regexImgSrc=/<img[^>]*\bsrc\s*=\s*"[^"]*{{customer_barcode}}[^"]*"/;
+      let matchImg = regexImgSrc.exec(content);
+      const regexCustomerBarcode = /{{customer_barcode}}(?![^<]*>)/g;
+      let matchCustomerBarcode = regexCustomerBarcode.exec(content);
+      while (match !== null ) {
         const tagValue = match[0].substring(this.indexOfEnd(match[0], '{{'), match[0].indexOf('}}'));
         match = regex.exec(content);
         let ifSupported = false;
@@ -1146,6 +1151,9 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
           if (tag.definition.value === tagValue) {
             ifSupported = true;
           }
+          if(tagValue === CUSTOMER_BARCODE_TAG && (matchImg === null || matchCustomerBarcode !== null)){
+            ifSupported = false;
+          }
         });
         const ifSkipped = this.skipTags(tagValue);
         if (ifSkipped) {

package/v2Containers/Email/index.js

@@ -36,6 +36,7 @@ import { FONT_COLOR_05 } from '@capillarytech/cap-ui-library/styled/variables';
 import { gtmPush } from '../../utils/gtmTrackers';
 const {CapCustomCardList} = CapCustomCard;
 import {transformEmailTemplates, storeS3FileSizeDetails, CREATIVES_S3_ASSET_FILESIZES} from '../../utils/cdnTransformation';
+import { CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
 
 export class Email extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
@@ -643,7 +644,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     } else if (data === "unsubscribe" && this.state.editorInstanse) {
       const anchor = `<a href='{{${data}}}'>${data}</a>`;
       this.state.editorInstanse.insertHtml(`${anchor}`);
-    } else if (this.state.editorInstanse) {
+    } else if (data === CUSTOMER_BARCODE_TAG && this.state.editorInstanse) {
+      this.state.editorInstanse.insertHtml(`<img src="https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/8ebc8301-e262-45a6-bdab-ff0de91a.png?code={{${data}}}" />`);
+    } else if (this.state.editorInstanse){
       this.state.editorInstanse.insertHtml(`{{${data}}}`);
     }
       //this.resetCkEditorInstance(currentTab, formData, true, data);