@capillarytech/creatives-library 7.17.192 → 7.17.193-alpha.1

package/package.json

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

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -153,6 +153,7 @@ export function SlideBoxContent(props) {
       hideTestAndPreviewBtn,
       getCmsTemplatesInProgress = false,
       moduleType,
+      creativesMode,
     } = props;
   const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
   const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
@@ -652,6 +653,7 @@ export function SlideBoxContent(props) {
           onTestContentClicked={onTestContentClicked}
           type={type}
           hideTestAndPreviewBtn={hideTestAndPreviewBtn}
+          creativesMode={creativesMode}
         />
         }
       {isCreateMPush &&
@@ -917,5 +919,6 @@ SlideBoxContent.propTypes = {
   smsRegister: PropTypes.any,
   getCmsTemplatesInProgress: PropTypes.bool,
   moduleType: PropTypes.string,
+  creativesMode: PropTypes.string,
 };
 export default SlideBoxContent;

package/v2Containers/CreativesContainer/index.js

@@ -1274,6 +1274,7 @@ export class Creatives extends React.Component {
               hideTestAndPreviewBtn={this.props.hideTestAndPreviewBtn}
               getCmsTemplatesInProgress={this.props.Templates?.getCmsTemplatesInProgress}
               moduleType={this.props.messageDetails?.type}
+              creativesMode={creativesMode}
           />
           }
           footer={this.shouldShowFooter() &&

package/v2Containers/MobilePush/Edit/index.js

@@ -105,8 +105,23 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     } else if (nextProps.isGetFormData && this.props.isGetFormData !== nextProps.isGetFormData && this.props.isFullMode && !this.props.Create.createTemplateInProgress) {
       this.startValidation();
     }
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount :
-    (!_.isEmpty(this.props.Edit.selectedWeChatAccount) ? this.props.Edit.selectedWeChatAccount : nextProps.Edit.selectedWeChatAccount));
+    console.log('this.props--->', this.props.creativesMode);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 112', selectedWeChatAccount);
+      } else {
+        selectedWeChatAccount = nextProps.Templates.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> else 115', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else if 119', selectedWeChatAccount);
+    }
+
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount :
+    // (!_.isEmpty(this.props.Edit.selectedWeChatAccount) ? this.props.Edit.selectedWeChatAccount : nextProps.Edit.selectedWeChatAccount));
     if (this.props.location.query.type === 'embedded' && !nextProps.Edit.fetchingWeCrmAccounts && !_.isEqual(this.props.Edit.weCrmAccounts, nextProps.Edit.weCrmAccounts) && (!selectedWeChatAccount || _.isEmpty(selectedWeChatAccount))) {
       this.setMobilePushAccountOptions(nextProps.Edit.weCrmAccounts, get(this.props, "templateData.definition.accountId"));
     }
@@ -214,7 +229,20 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   onLinkTypeChange = (eventTriggered, formData, field, currentTab, inputSchema) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 235', selectedWeChatAccount);
+      } else {
+        selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> else 239', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 239', selectedWeChatAccount);
+    }
+    //const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
     const tabIndex = currentTab || this.state.currentTab;
     const inputFields = get(schema, `containers[0].panes[${tabIndex - 1}].sections[0].childSections[0].childSections[0].inputFields`);
@@ -331,14 +359,24 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   getTransformedData = (formData) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 362', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 366', selectedWeChatAccount);
+    }
+    //const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const obj = _.cloneDeep(this.state.editData);
     obj.versions = {
       base: {},
     };
     obj.type = 'MOBILEPUSH';
     obj.name = formData['template-name'];
-    if(this.props?.Templates?.selectedWeChatAccount?.sourceTypeName === 'MAPP_SDK') {
+    if (selectedWeChatAccount?.sourceTypeName === 'MAPP_SDK') {
       obj.definition = {
         accountId: selectedWeChatAccount.id,
         licenseCode: selectedWeChatAccount.sourceAccountIdentifier,
@@ -561,7 +599,17 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   getLinkName = (link) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 602', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 606', selectedWeChatAccount);
+    }
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;
     const deepLinkOptions = _.filter(JSON.parse(ck ? selectedWeChatAccount.configs.deeplink : '[]'), (l) => l.link === link);
     if (deepLinkOptions[0]) {
@@ -960,7 +1008,17 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   showSelectedIosCta = (inputSchema, field, tab, selectedConfig) => {
     const currentTab = tab || this.state.currentTab;
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1011', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1015', selectedWeChatAccount);
+    }
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;
     const deepLinkOptions = _.map(JSON.parse(ck ? selectedWeChatAccount.configs.deeplink : '[]'), (link) => ({label: link.name, value: link.link, title: link.link }) );
 
@@ -1088,7 +1146,17 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   deletePrimaryCTA = (event) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1149', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1153', selectedWeChatAccount);
+    }
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const id = event.currentTarget.id;
     const schema = _.cloneDeep(this.state.schema);
     // const eventsMap = _.cloneDeep(this.state.eventsMap);
@@ -1188,7 +1256,17 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   deleteSecondaryCTA = (event) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1259', selectedWeChatAccount);
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1263', selectedWeChatAccount);
+    }
+    //const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const id = event.currentTarget.id;
     if (id === "secondary-cta-0-delete") {
       const secCta2 = document.getElementById("secondary-cta-1-delete");
@@ -1475,8 +1553,12 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
         if (this.props.location.query.type === 'embedded' && temp.id === "mobilepush-accounts" ) {
           temp.options = this.state.templateOptions ? this.state.accountsOptions : [];
         }
-        if (temp.id === "mobile-push-preview" && this.props.Templates.selectedWeChatAccount && !_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
-          temp.content.appName = this.props.Templates.selectedWeChatAccount.name;
+        if (temp.id === "mobile-push-preview") {
+          if ((this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') && this.props.Edit.selectedWeChatAccount && !_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+            temp.content.appName = this.props.Edit.selectedWeChatAccount.name;
+          } else if (this.props.Templates.selectedWeChatAccount && !_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+            temp.content.appName = this.props.Templates.selectedWeChatAccount.name;
+          }
         }
         _.forEach(col.supportedEvents, (event) => {
           temp.injectedEvents[event] = this.getMappedEvent(col.id, event);
@@ -1561,7 +1643,19 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   showCtaKeys = (eventTriggered, formData, field, tabIndex, schemaInput) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1642', selectedWeChatAccount);
+      } else {
+        selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1646', selectedWeChatAccount);
+    }
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const currentTab = tabIndex || this.state.currentTab;
     const schema = _.cloneDeep(schemaInput || this.state.schema);
     const eventsMap = _.cloneDeep(this.state.eventsMap);
@@ -1616,11 +1710,26 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     return schema;
   };
   addPrimaryCta = (flag, formData, field, inputSchema, currentTab) => {
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1707', selectedWeChatAccount);
+      } else {
+        selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1711', selectedWeChatAccount);
+    }
+    // const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const id = field.id;
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
+    console.log('schema--->', selectedWeChatAccount);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;
+    console.log('ck---->', ck);
     const deepLinkOptions = selectedWeChatAccount ? _.map(JSON.parse(ck ? selectedWeChatAccount.configs.deeplink : '[]'), (link) => ({label: link.name, value: link.link, title: link.link }) ) : [];
+    console.log('deepLinkOptions--->', deepLinkOptions);
     // const eventsMap = _.cloneDeep(this.state.eventsMap);
     const tabIndex = currentTab || this.state.currentTab;
     const inputFields = get(schema, `containers[0].panes[${tabIndex - 1}].sections[0].childSections[0].childSections[0].inputFields`);
@@ -1649,7 +1758,19 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     const tabIndex = currentTab || this.state.currentTab;
     const formDataCopy = cloneDeep(formData);
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
-    const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
+    let selectedWeChatAccount = {};
+    if (this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview') {
+      if (!_.isEmpty(this.props.Edit.selectedWeChatAccount)) {
+        selectedWeChatAccount = this.props.Edit.selectedWeChatAccount;
+        console.log('selectedWeChatAccount---> if 1746', selectedWeChatAccount);
+      } else {
+        selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      }
+    } else if (!_.isEmpty(this.props.Templates.selectedWeChatAccount)) {
+      selectedWeChatAccount = this.props.Templates.selectedWeChatAccount;
+      console.log('selectedWeChatAccount---> else 1754', selectedWeChatAccount);
+    }
+   //const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;
     const deepLinkOptions = selectedWeChatAccount ? _.map(JSON.parse(ck ? selectedWeChatAccount.configs.deeplink : '[]'), (link) => ({label: link.name, value: link.link, title: link.link }) ) : [];
     const inputFields = get(schema, `containers[0].panes[${tabIndex - 1}].sections[0].childSections[0].childSections[0].inputFields`);
@@ -1698,7 +1819,12 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
         if (!_.isEmpty(actionText)) {
           this.deleteSecondaryCtaIos();
         }
-        this.props.actions.getIosCtas(this.props.Templates.selectedWeChatAccount.sourceAccountIdentifier);//TODO: need to get license code of accoutn and send as arg
+        if ((this.props.creativesMode === 'edit' || this.props.creativesMode === 'preview')) {
+          this.props.actions.getIosCtas(this.props.Edit.selectedWeChatAccount.sourceAccountIdentifier);
+        } else {
+          this.props.actions.getIosCtas(this.props.Templates.selectedWeChatAccount.sourceAccountIdentifier);
+        }
+        //TODO: need to get license code of accoutn and send as arg
       } else {
         this.deleteSecondaryCtaIos(() => { // oncick of change
           this.setState({showIosCtaTable: true});
@@ -1953,6 +2079,7 @@ Edit.propTypes = {
   onValidationFail: PropTypes.bool,
   onPreviewContentClicked: PropTypes.func,
   onTestContentClicked: PropTypes.func,
+  creativesMode: PropTypes.string,
 };
 
 const mapStateToProps = createStructuredSelector({