@capillarytech/creatives-library 2.0.23 → 2.0.25

package/containers/CreativesContainer/SlideBoxContent.js

@@ -36,17 +36,18 @@ function SlideBoxContent(props) {
     query,
     search: '',
   };
-  let isCreateSms = false;
+  const isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
   let isEditSms = false;
   let isEditEmailWithId = false;
   let isEmailEditWithContent = false;
   let isPreview = false;
   let isEmailPreview = false;
+  //let isEmailCreate = false;
   let channel = currentChannel;//for create mode
   if (templateData && channel) {
     channel = templateData.type;// for edit mode with template data
     isEditSms = slidBoxContent === 'editTemplate' && channel === constants.SMS;
-    isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
+    //isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
     isEditEmailWithId = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && templateData._id;
     isEmailEditWithContent = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && !templateData._id;
     isPreview = slidBoxContent === 'preview' && channel !== constants.EMAIL;
@@ -76,7 +77,7 @@ function SlideBoxContent(props) {
       {isEmailPreview && (
         <EmailPreviewV2
           templateData={templateData}
-        />
+         />
       )
       }
       {isEditSms && (
@@ -99,7 +100,7 @@ function SlideBoxContent(props) {
         getDefaultTags={type}
           />
         )}
-      {isEditEmailWithId && (
+      {(isEditEmailWithId || isEmailEditWithContent) && (
       <Email
         location={{
           pathname: `/email`,
@@ -114,21 +115,6 @@ function SlideBoxContent(props) {
         getDefaultTags={type}
           />
         )}
-      {isEmailEditWithContent && (
-      <Email
-        location={{
-          pathname: `/email`,
-          query,
-        }}
-        route={{ name: 'email' }}
-        isGetFormData={isGetFormData}
-        getFormdata={getFormData}
-        params={{ id: templateData._id }}
-        templateData={templateData}
-        getFormSubscriptionData={getFormData}
-        getDefaultTags={type}
-      />
-        )}
     </CreativesWrapper>
   );
 }

package/containers/Email/index.js

@@ -1005,21 +1005,23 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
 
       if (nextProps.metaEntities && nextProps.metaEntities.tags && nextProps.metaEntities.tags.custom && !_.isEqual(this.props.metaEntities.tags, nextProps.metaEntities.tags)) {
         let injectedTags = _.cloneDeep(this.state.injectedTags);
-        delete injectedTags["Registration custom fields"];
-        delete injectedTags["Store custom fields"];
-        delete injectedTags["Transaction custom fields"];
-        injectedTags = _.merge({}, injectedTags, nextProps.metaEntities.tags.custom);
-        console.log('new injected tags', nextProps.metaEntities.tags.custom);
-        if (!_.has(nextProps.metaEntities.tags.custom, "Registration custom fields")) {
+        if (!_.isEmpty(injectedTags)) {
           delete injectedTags["Registration custom fields"];
-        }
-        if (!_.has(nextProps.metaEntities.tags.custom, "Store custom fields")) {
           delete injectedTags["Store custom fields"];
-        }
-        if (!_.has(nextProps.metaEntities.tags.custom, "Transaction custom fields")) {
           delete injectedTags["Transaction custom fields"];
+          injectedTags = _.merge({}, injectedTags, nextProps.metaEntities.tags.custom);
+          console.log('new injected tags', nextProps.metaEntities.tags.custom);
+          if (!_.has(nextProps.metaEntities.tags.custom, "Registration custom fields")) {
+            delete injectedTags["Registration custom fields"];
+          }
+          if (!_.has(nextProps.metaEntities.tags.custom, "Store custom fields")) {
+            delete injectedTags["Store custom fields"];
+          }
+          if (!_.has(nextProps.metaEntities.tags.custom, "Transaction custom fields")) {
+            delete injectedTags["Transaction custom fields"];
+          }
+          this.setState({injectedTags});
         }
-        this.setState({injectedTags});
       }
 
       if ( !_.isEqual(nextProps.Email.uploadAssetSuccess, this.props.Email.uploadAssetSuccess) && nextProps.Email.uploadAssetSuccess) {

package/containers/TagList/index.js

@@ -38,7 +38,9 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
   }
 
   componentWillReceiveProps(nextProps) {
-    console.log('tag next props', nextProps.injectedTags, this.props.injectedTags);
+    if (_.isEmpty(this.props.injectedTags) && _.isEmpty(this.props.tags)) {
+      this.setState({loading: true});
+    }
     if (!_.isEqual(nextProps.injectedTags, this.props.injectedTags)) {
       console.log('received new tags', nextProps);
       this.setState({loading: false});
@@ -177,7 +179,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
   }
 
   render() {
-    console.log('tags props 2', this.props);
     let tags = {};
     let injectedTags = {};
     if (this.props.injectedTags && !_.isEmpty(this.props.injectedTags)) {
@@ -190,7 +191,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
     }
     tags = _.merge( {}, tags, injectedTags);
     console.log('merged tags', tags);
-        // console.log('tag list', this.renderTags(tags));
     return (
       <div className={this.props.className ? this.props.className : ''}>
         <CapTagList

package/containers/Templates/index.js

@@ -16,7 +16,7 @@ import _ from 'lodash';
 import { bindActionCreators } from 'redux';
 import { Row, Select, Spin, Dropdown, Col, Breadcrumb, Menu, Modal} from 'antd';
 import { CapPopover, CapSelect } from '@capillarytech/cap-react-ui-library';
-import {CapButton, CapInput} from '@capillarytech/cap-ui-library';
+import {CapButton, CapInput, CapIcon} from '@capillarytech/cap-ui-library';
 import { makeSelectTemplates, makeSelectTemplatesResponse } from './selectors';
 import { makeSelectCreate as makeSelectCreateSms} from '../Sms/Create/selectors';
 import { makeSelectCreate as makeSelectCreateMobilePush } from '../MobilePush/Create/selectors';
@@ -96,7 +96,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   componentWillMount() {
     if (this.state.channel === '') {
       let channel = '';
-      console.log('templates props', this.props);
+
       switch (this.props.route.name.toLowerCase()) {
         case "sms":
           channel = 'Sms';
@@ -151,11 +151,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       //   this.props.actions.getEdmDefaultTemplates();
       // }
     }
-    console.log('added listener templates,', this.props);
+
     window.addEventListener("message", this.handleFrameTasks);
   }
   componentWillReceiveProps(nextProps) {
-    console.log('nextProps templates', nextProps, this.props.Create);
     const params = {
       name: this.state.searchText,
       sortBy: this.state.sortBy,
@@ -185,7 +184,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       } else if (nextProps.route.name.toLowerCase() === 'line') {
         channel = 'Line';
       }
-      // console.log('Next Props details ', nextProps.route.name, channel);
+      //
       this.setState({ channel }, () => {
         if (this.state.channel.toLowerCase() === 'line' || this.state.channel.toLowerCase() === 'sms' || this.state.channel.toLowerCase() === 'email' || this.state.channel.toLowerCase() === 'ebill' || (this.state.channel.toLowerCase() === 'wechat' && !_.isEmpty(nextProps.Templates.selectedWeChatAccount))) {
           if (this.state.channel.toLowerCase() === 'wechat' && !_.isEmpty(nextProps.Templates.selectedWeChatAccount)) {
@@ -292,14 +291,12 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     }
     if (!nextProps.Templates.deleteTemplateInProgress && !_.isEqual(nextProps.Templates.deleteTemplateInProgress, this.props.Templates.deleteTemplateInProgress) &&
     nextProps.Templates.deleteResponse) {
-      console.log("delete");
       const message = getMessageObject('success', `${this.state.channel.toUpperCase()} ${this.props.intl.formatMessage(messages['Template deleted successfully'])}`, true);
       nextProps.globalActions.addMessageToQueue(message);
       this.getAllTemplates({params, resetPage: true});
     }
 
     if (!nextProps.Templates.sendingFile && !_.isEqual(this.props.Templates.sendingFile, nextProps.Templates.sendingFile) && !nextProps.Templates.errorSendingFile) {
-      console.log('Got html Content ', nextProps.Templates.selectedEmailLayout);
       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;
@@ -346,7 +343,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   componentWillUnmount() {
-    console.log('removed listener templates');
     window.removeEventListener("message", this.handleFrameTasks);
     this.props.actions.resetTemplateStoreData();
     this.props.globalActions.clearMetaEntities();
@@ -354,7 +350,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   onAccountSelect(value, option) {
-    console.log('Selected Account ', value, option);
     this.setState({selectedAccount: value}, () => {
       const params = {
         name: this.state.searchText,
@@ -378,7 +373,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     let queryParams = params;
     let page = this.state.page;
 
-    console.log('Get all templates ', this.props.Templates.getAllTemplatesInProgress, resetPage, page, this.state.templatesCount, this.state.perPageLimit, getNextPage);
+
     if (resetTemplates) {
       queryParams.name = this.state.searchText;
       queryParams.sortBy = this.state.sortBy;
@@ -434,11 +429,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     }
     locale = this.getMappedLocale(locale);
     //locale = 'zh';
-    console.log('Setting final locale as', locale);
+
     moment.locale(locale);
   };
   getCurrentWindow(e) {
-    console.log('in sms templates', e);
     const response = {
       action: e.action,
       value: 'templates',
@@ -457,7 +451,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     return creativesMode;
   }
   skipTemplateSelection = (e) => {
-    console.log("vvv", e);
     const type = this.props.location.query.type;
     const module = (type === 'embedded') ? this.props.location.query.module : 'default';
     let routeParams = {};
@@ -492,12 +485,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   handleMenuAction = (item, key) => {
-    console.log('Menu Clicked ', item.key, key);
     if (item.key.toLowerCase() === 'uploadfile') {
       document.getElementById('filename').click();
-      console.log('Upload File');
     } else if (item.key.toLowerCase() === 'useeditor') {
-      console.log('Use Editor');
       this.toggleEdmEmailTemplateSelection();
     }
   };
@@ -535,13 +525,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     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;
-    console.log('File Params ', fileExtension);
+
     if (supportedZipFormats.indexOf(fileExtension.toLowerCase()) !== -1) {
-      console.log('Zip Format got');
       this.props.actions.handleZipUpload(files[0]);
       document.getElementById("filename").value = "";
     } else if (fileExtension === 'html' || fileExtension === 'htm') {
-      console.log('html Format got');
       const reader = new FileReader();
       reader.onload = () => {
         const text = reader.result;
@@ -566,7 +554,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
 
   mapWechatTemplate() {
     // const index = _.findIndex(this.props.Templates.weCRMtemplates, {template_id: key});
-    // console.log('Wechat menu clicked ', item, key, index);
+    //
     const type = this.props.location.query.type;
     this.setState({routeParams: {
       pathname: `/wechat/create`,
@@ -666,17 +654,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     return result;
   }
   startLoading(ifEdit) {
-    console.log('startLoading', ifEdit);
     if (ifEdit) {
       this.setState({loading: true});
     }
   }
 
   startTemplateCreation(data) {
-    console.log('startTemplateCreation');
     if (data.edit) {
       const ifUnicode = checkUnicode(data.content);
-      console.log('smsDetails', ifUnicode, data.content);
+
       const content = data.content;
       const tempData = {
         'sms-editor': content,
@@ -691,10 +677,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   handleFrameTasks = (e) => {
-    console.log('data listened to is 222', e.data, e);
     const type = e.data;
     if (typeof type === 'object') {
-      console.log('received something', type);
       const action = type.action;
       switch (action) {
         case "startTemplateCreation":
@@ -718,11 +702,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         this.getFormData(e);
         break;
       case "startTemplateCreation":
-        console.log('Starting to create template');
+
         //this.getFormData(e);
         break;
       case "validateContent":
-        console.log('validating Content');
+
         this.validateContent(e);
         break;
       default:
@@ -753,7 +737,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   searchTemplate(data) {
-    console.log('searching template', data);
     this.setState({searchText: data}, () => {
       const params = {
         name: this.state.searchText,
@@ -805,14 +788,12 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     if (this.state.channel.toLowerCase() === 'ebill' || this.state.channel.toLowerCase() === 'email') {
       this.toggleEmailPreview();
     } else {
-      console.log('toggle Preview ', this.state.previewOpen);
       this.setState( (prevState) => ({
         previewOpen: !prevState.previewOpen}));
     }
   }
 
   toggleEdmEmailTemplateSelection = () => {
-    console.log('toggle Selection ', this.state.showEdmEmailTemplates);
     this.setState( (prevState) => ({
       showEdmEmailTemplates: !prevState.showEdmEmailTemplates}), () => {
       this.props.actions.getEdmDefaultTemplates();
@@ -820,13 +801,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   };
 
   deleteTemplate(template) {
-    console.log('deleting template', template);
     this.props.actions.deleteTemplate(this.state.channel.toUpperCase(), template._id);
     this.setState({actionTemplate: {}});
   }
 
   duplicateTemplate(template) {
-    console.log('dup template', template);
     const duplicateObj = _.cloneDeep(template);
     duplicateObj.name = `Copy of ${template.name} ${moment().format('MM-DD-YYYY hh:mma')}`;
     delete duplicateObj._id;
@@ -845,7 +824,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   handleOnHoverItem(isHovering, id) {
-    console.log('parent handle hover', isHovering, id);
     if (isHovering) {
       this.setState({hoveredItem: id});
     } else {
@@ -854,7 +832,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   handleOnItemClick(isClicked, id) {
-    console.log('parent handle click', isClicked, id);
     this.setState({clickedItem: id});
   }
 
@@ -866,7 +843,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       const isLanguageSupport = (this.props.location.query.isLanguageSupport) ? this.props.location.query.isLanguageSupport : true;
       const isEdmSupport = (this.props.location.query.isEdmSupport !== "false") || false;
       let getQuery = '';
-      console.log('Selected EDM Data ', data);
+
       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};
@@ -885,7 +862,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   };
 
   handleEditClick(e, id, modeType) {
-    console.log('inside props****', this.props);
     if (modeType && modeType !== undefined) {
       this.setState({modeType});
     }
@@ -894,9 +870,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     const isLanguageSupport = (this.props.location.query.isLanguageSupport) ? this.props.location.query.isLanguageSupport : false;
     const isEdmSupport = (this.props.location.query.isEdmSupport !== "false") || false;
     let getQuery = "";
-    console.log('type**** ', type);
+
     e.stopPropagation();
-    console.log('clicked', id);
+
     this.props.actions.resetTemplateData();
     let pathName = `/${this.state.channel === 'wechat' ? 'wechat' : 'sms'}/edit/${id}`;
     if (this.state.channel.toLowerCase() === 'mobilepush') {
@@ -942,7 +918,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       templateInfo.content = template.versions.base;
       templateInfo.appName = this.props.Templates.selectedWeChatAccount.name;
     } else if (this.state.channel.toLowerCase() === "email") {
-      console.log('Test ', template);
       this.props.actions.getTemplateDetails(template._id);
     } else if (this.state.channel.toLowerCase() === 'ebill') {
       this.props.actions.getTemplateDetails(template._id);
@@ -1016,26 +991,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           content,
         }
       );
-    } /*else if (type === 'embedded' && this.state.channel.toLowerCase() === "mobilepush") {
-      items.push({
-        id: 'blankTemplate',
-        content: <div className={this.state.clickedItem === 'blankTemplate' ? 'sms-text-blurred' : ''}>
-          <div>
-            <div
-              style={{textAlign: 'center', lineHeight: '260px'}}
-              className="sms-text">{this.props.intl.formatMessage(messages.blankTemplate)}</div>
-          </div>
-          {this.state.clickedItem === 'blankTemplate' && <CapButton
-            onClick={() => { this.createTemplate({key: 'text'}); }} key="text" className="edit-button" type="secondary">Text</CapButton>}
-          {this.state.clickedItem === 'blankTemplate' && <CapButton
-            onClick={() => { this.createTemplate({key: 'image'}); }} key="image" className="preview-button" type="secondary">image</CapButton>}
-        </div>,
-      });
-    }*/
+    }
     data.map( (template) => {
-      // console.log("Templates ", template._id, " Data ", template);
+      //
       const temp = {};
-      // console.log('template ', template);
+      //
       const updateDateTime = (moment().format('DD-MM-YYYY') === moment(template.updatedAt).format('DD-MM-YYYY')) ? moment(template.updatedAt).format('hh:mma') : moment(template.updatedAt).format('DD MMM YYYY');
       let content = '';
       temp.id = template._id;
@@ -1051,12 +1011,12 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             {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() === 'email' || this.state.channel.toLowerCase() === 'ebill') {
-        // console.log('Data Prepare');
-        console.log('Data Prepare');
+        //
+
         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%"/>;
-        console.log('qwerty template preview', imgSrc, template, ifPreviewGenerated, content);
+
         temp.content = (
           <div
             className="sms-template-content">
@@ -1224,7 +1184,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   render() {
-    console.log('templates props', this.props);
     let pageHeaderText = '';
     const moduleName = this.props.location.query.module;
     if (this.props.location.query.type !== 'embedded') {
@@ -1242,37 +1201,13 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         pageHeaderText = this.props.intl.formatMessage(messages.lineHeader);
       }
     }
-    // const options = [
-    //   {
-    //     value: "Most Recent",
-    //     label: this.props.intl.formatMessage(messages.mostRecentOption),
-    //   },
-    //   {
-    //     value: "Alphabetically",
-    //     label: this.props.intl.formatMessage(messages.alphabeticallyOption),
-    //   },
-    // ];
-    // const typeOptions = [
-    //   {
-    //     value: "All",
-    //     label: "All",
-    //   },
-    //   {
-    //     label: "Text",
-    //     value: 'Text',
-    //   },
-    //   {
-    //     label: "Image",
-    //     value: "Image",
-    //   },
-    // ];
     const filterContent = (
       <div className="action-container">
         <CapInput
           className="search-text"
           style={{width: '210px'}}
           placeholder={this.props.intl.formatMessage(messages.searchText)}
-          prefix={<i className="material-icons" style={{ margin: '0', fontSize: '16px'}}>search</i>}
+          prefix={<CapIcon type="search" size="s"/>}
           value={this.state.searchText}
           onChange={(e) => this.searchTemplate(e.target.value)}
         />

package/package.json

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