@capillarytech/creatives-library 0.0.8 → 0.1.0

package/components/Card/_customCard.scss

@@ -24,7 +24,7 @@
 
   .footer-wrapper {
     width: 100%;
-    height: 64px;
+   // height: 64px;
   }
 
   .seperator-line{

package/components/Card/index.js

@@ -30,8 +30,9 @@ class CustomCard extends React.Component { // eslint-disable-line react/prefer-s
     };
   }
 
-  handleMouseHover() {
-    this.setState(this.toggleHoverState);
+  handleMouseHover(data) {
+    console.log('hover mouse data', data);
+    this.setState({isHovering: data});
     this.props.onHover(!this.state.isHovering, this.props.id);
   }
 
@@ -48,13 +49,13 @@ class CustomCard extends React.Component { // eslint-disable-line react/prefer-s
         id={this.props.id}
         title={this.props.title}
         style={{ width: this.props.width, height: this.props.height }}
-        onMouseEnter={this.handleMouseHover}
+        onMouseEnter={() => this.handleMouseHover(true)}
         onClick={this.handleMouseClick}
-        onMouseLeave={this.handleMouseHover}>
+        onMouseLeave={() => this.handleMouseHover(false)}>
         <div>
           <div className="content-wrapper">{this.props.content}</div>
-          {<hr className="seperator-line" />}
-          <div className="footer-wrapper">{this.props.footer}</div>
+          {this.props.footer ? <hr className="seperator-line" /> : ''}
+          {this.props.footer ? <div className="footer-wrapper">{this.props.footer}</div> : ''}
         </div>
       </Card>
     );

package/components/CardGrid/index.js

@@ -39,7 +39,7 @@ class CardGrid extends React.Component { // eslint-disable-line react/prefer-sta
           <Row gutter={this.props.gutterSize}>
             { this.props.listItem ? this.props.listItem.map( (item) => (
               <Col style={{ width: `${100 / this.props.colNumber}%`, paddingBottom: '16px'}} key={item.id} span={parseInt(24 / this.props.colNumber, 10)}>
-                <CustomCard id={item.id} onHover={this.handleOnItemHover} onClick={this.handleOnItemClick} content={item.content} footer={item.footer} height="312px"></CustomCard>
+                <CustomCard id={item.id} onHover={this.handleOnItemHover} onClick={this.handleOnItemClick} content={item.content} footer={item.footer} height={item.footer ? "312px" : "258px"}></CustomCard>
               </Col>
             )) : ''}
           </Row>

package/components/Ckeditor/index.js

@@ -35,8 +35,8 @@ const CKEditorConfig = {
   toolbarCanCollapse: true,
   toolbarStartupExpanded: true,
   uiColor: '#e3e3e3',
-  width: '100%',
-  height: '300',
+  width: 'calc(100% - 2px)',
+  height: 'calc(100vh - 290px)',
   fullPage: true,
   htmlEncodeOutput: true,
   startupFocus: true,
@@ -118,6 +118,9 @@ class Ckeditor extends React.Component { // eslint-disable-line react/prefer-sta
     this.unmounting = true;
     if (this.editorInstance) {
       this.editorInstance.destroy();
+      if (window.CKEDITOR && !_.isEmpty(window.CKEDITOR.instances)) {
+        window.CKEDITOR.instances = {};
+      }
     }
   }
 

package/components/CustomPopOver/index.js

@@ -49,7 +49,7 @@ class CustomPopOver extends React.Component { // eslint-disable-line react/prefe
             this.renderPopoverContent()
           }
         >
-          <p style={{fontFamily: "open-sans", fontWeight: '600', paddingTop: '12px', display: `${this.props.popOverList.length === this.props.excludeList.length ? 'none' : ''}`}}>+ Languages</p>
+          <p style={{fontFamily: "open-sans", fontWeight: '600', display: `${this.props.popOverList.length === this.props.excludeList.length ? 'none' : ''}`}}>+ Languages</p>
         </CapPopover>
       </div>
     );

package/components/Edmeditor/index.js

@@ -42,7 +42,7 @@ class Edmeditor extends React.Component { // eslint-disable-line react/prefer-st
     console.log('current language edm editor loading', this.props.id, this.props.edmSrc);
     return (
       this.props.edmSrc ?
-        (<iframe id={this.props.id} className={this.props.activeClass} src={this.props.edmSrc} height="460" width="100%"></iframe>)
+        (<iframe id={this.props.id} className={this.props.activeClass} src={this.props.edmSrc} height="460" width="100%" style={{"height": "calc(100vh - 180px)"}}></iframe>)
       : 'aaasass'
     );
   }

package/components/FormBuilder/_formBuilder.scss

@@ -11,6 +11,9 @@
 .form-tab-header{
   display: flex;
   align-items: center;
+  font-family: open-sans, sans-serif !important;
+  font-style: normal;
+  font-weight: 600;
 }
 
 .ant-tabs-tab{

package/components/FormBuilder/index.js

@@ -414,11 +414,12 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       }
     }
     console.log('Hello World ', formData, tabCount);
-    if ((formData.base && formData.base.tabKey && formData.base.tabKey !== '' && !changeDefaultTab) || (this.props.isEdit && formData.base && this.state.tabKey !== formData.base.tabKey)) {
+    if ((formData.base && formData.base.tabKey && formData.base.tabKey !== '' && !changeDefaultTab) || (formData.base && this.state.tabKey !== formData.base.tabKey)) {
       console.log('setting tab key', formData.base.tabKey, this.state.tabKey);
       if (this.state.currentTab === 1 && !this.props.isNewVersionFlow) {
         this.setState({tabKey: formData.base.tabKey});
       } else if (this.props.isNewVersionFlow && this.state.tabKey !== formData[this.state.currentTab - 1].tabKey) {
+        console.log('outgoing changing tab key');
         this.setState({tabKey: formData[this.state.currentTab - 1].tabKey});
       }
     }
@@ -427,7 +428,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       this.setState({tabKey: formData.base.tabKey});
     }
     console.log('form data before adding key', formData);
-    console.log('outgoing reset final before set', formData);
+    console.log('outgoing reset final before set', formData, this.state.tabKey);
     if (changeDefaultTab) {
       this.setState({formData}, () => {
         console.log('outgoing reset set data', formData);
@@ -2759,7 +2760,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
               return result;
             });
             columns.push(
-              <Col style={val.colStyle ? val.colStyle : {}} span={val.width}>
+              <Col style={val.colStyle ? val.colStyle : {}} span={val.width} offset={val.offset}>
                 <CapPopover
                   trigger={val.trigger}
                   placement={val.placement}
@@ -2802,6 +2803,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 width={val.width ? val.width : 1}
                 onClick={(data) => this.callChildEvent(data, val, val.submitAction)}
                 className={val.className ? val.className : ''}
+                style={val.colStyle ? val.colStyle : {}}
               >
                 <i style={val.style ? val.style : {}} className="material-icons">{val.value ? val.value : '&#xE313;'}</i>
               </Col>

package/components/Sidebar/index.js

@@ -61,9 +61,12 @@ class Sidebar extends React.Component { // eslint-disable-line react/prefer-stat
     return (<Accordion.Content key={keyValue}>{links}</Accordion.Content>);
   }
 
-  getLinkElement(to, text, value) {
+  getLinkElement(to, text, value, isExternal) {
     const selectedItem = (value && value.trim().toLowerCase() === this.state.activeItem) ? 'selected' : '';
     if (text.toLowerCase().includes(this.state.searchText.toLowerCase())) {
+      if (isExternal) {
+        return ((text.toLowerCase().includes(this.state.searchText.toLowerCase())) ? <a key={to} className={`item menu-item ${selectedItem}`} href={to}>{text}</a> : '');
+      }
       return (
           (text.toLowerCase().includes(this.state.searchText.toLowerCase())) ?
             <Link to={to} className={`item menu-item ${selectedItem}`} onClick={this.handleItemClick} key={to} title={text}>{text}</Link>
@@ -114,7 +117,7 @@ class Sidebar extends React.Component { // eslint-disable-line react/prefer-stat
     const accordian = [];
     accordian.push(this.getAccordionTitle(title));
     const contentLink = contentItems.map((key) =>
-      this.getLinkElement(key.link, key.text, key.value),
+      this.getLinkElement(key.link, key.text, key.value, key.external),
     );
     accordian.push(this.getAccordionContent(contentLink));
     return accordian;

package/containers/Cap/index.js

@@ -227,7 +227,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
         group: this.props.intl.formatMessage(messages.campaignsDashboard),
         items: [
           {
-            link: '../../campaign/index',
+            link: '/campaign/index',
             text: this.props.intl.formatMessage(messages.campaignsHome),
             value: 'Campaigns Home',
             external: true,

package/containers/Email/_email.scss

@@ -81,6 +81,10 @@
     height: 42px;
   }
 
+  .ant-tabs-nav.ant-tabs-nav-animated {
+    display: flex;
+  }
+
   #image-preview-content{
     .card-footer-wrapper{
       padding-left: 16px;

package/containers/Email/index.js

@@ -774,9 +774,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         this.showSubject();
       }, 0);
     }
-    if (nextProps.location.query.module === 'library' && nextProps.isGetFormData) {
-      this.getFormData();
-    }
     if (nextProps.Global.currentOrgDetails && nextProps.Global.currentOrgDetails.basic_details && !_.isEmpty(nextProps.Global.currentOrgDetails.basic_details) && _.isEmpty(this.state.formData)) {
       const formData = this.initFormData(nextProps);
       formData['template-version-options'] = [
@@ -845,9 +842,12 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           this.setEditData(nextProps.Email.templateDetails);
         });
       }
-      if (this.state.isEdit && nextProps.location.query.module === "library" && !_.isEmpty(nextProps.templateData) && !this.props.params.id) {
+      if (this.state.isEdit && nextProps.location.query.module === "library" && !_.isEmpty(nextProps.templateData) && !this.props.params.id && !nextProps.isGetFormData) {
         this.startTemplateCreation(nextProps.templateData);
       }
+      if (nextProps.location.query.module === 'library' && nextProps.isGetFormData) {
+        this.getFormData();
+      }
 
       if (!_.isEmpty(nextProps.Email.CmsSettings) && !_.isEqual(this.props.Email.CmsSettings, nextProps.Email.CmsSettings)) {
         const apiLangId = nextProps.Email.CmsSettings.langId;
@@ -945,7 +945,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       }
       if (!nextProps.Email.fetchingCmsData && !_.isEqual(nextProps.Email.cmsData, this.props.Email.cmsData)) {
         const formData = _.cloneDeep(this.state.formData);
-        if (nextProps.Email.langId) {
+        if (nextProps.Email.langId && nextProps.Email.langId !== 'undefined') {
           console.log('setting template content', nextProps.Email.cmsData, decodeURIComponent(nextProps.Email.cmsData));
           const langId = nextProps.Email.langId;
           formData[`${this.state.currentTab - 1}`][langId]['template-content'] = decodeURIComponent(nextProps.Email.cmsData);
@@ -1041,7 +1041,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           }
           this.edmEvent = undefined;
         } else {
-          this.resetCkEditorInstance(this.state.currentTab, this.state.formData, true, nextProps.Email.uploadedAssetData, true);
+          this.state.editorInstanse.insertHtml(`<img src='${nextProps.Email.uploadedAssetData.metaInfo.secure_file_path}' alt='Capillary Image'>`);
+          //this.resetCkEditorInstance(this.state.currentTab, this.state.formData, true, nextProps.Email.uploadedAssetData, true);
         }
         this.setState({showImageSelectionBox: false});
       }
@@ -1078,21 +1079,21 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     //this.resetCkEditorInstance(currentTab, formData);
   }
 
-  onChange = (evt, id) => {
+  onChange = (evt) => {
     const formData = _.cloneDeep(this.state.formData);
     console.log('oncontentchange onChange ', evt, evt.editor.getData());
     //if (evt.editor.name.indexOf('editor') === -1) {
-    _.forEach(window.CKEDITOR.instances, (winInstance) => {
-      const temp = winInstance;
-      if (winInstance.name === evt.editor.name) {
-        console.log('setting instance name after loading', winInstance, name);
-        // setTimeout(() => {
-        //   //temp.name = id;
-        // }, 1000);
-        temp.name = id;
-        console.log('setting instance name after loading 2', winInstance, name);
-      }
-    });
+    // _.forEach(window.CKEDITOR.instances, (winInstance) => {
+    //   const temp = winInstance;
+    //   if (winInstance.name === evt.editor.name) {
+    //     console.log('setting instance name after loading', winInstance, name);
+    //     setTimeout(() => {
+    //       //temp.name = id;
+    //     }, 1000);
+    //     //temp.name = id;
+    //     console.log('setting instance name after loading 2', winInstance, name);
+    //   }
+    // });
     //}
     if (!formData[this.state.currentTab - 1][formData[`${this.state.currentTab - 1}`].activeTab].is_drag_drop) {
       formData[`${this.state.currentTab - 1}`][formData[`${this.state.currentTab - 1}`].activeTab][`template-content`] = _.cloneDeep(evt.editor.getData());
@@ -1112,7 +1113,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
 
   onTabChange(data, formData) {
     console.log('inside parent ontabchange', data, this.state);
-    this.resetCkEditorInstance(data, formData);
+    //this.resetCkEditorInstance(data, formData);
     const schema = _.cloneDeep(this.state.schema);
     const container = schema.containers[`${data - 1}`];
     if (formData[`${data - 1}`][formData[`${data - 1}`].activeTab].is_drag_drop) {
@@ -1150,7 +1151,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       const win = document.getElementById(`edmeditor${(langIndex + 1) > 1 ? (langIndex + 1) : ''}`).contentWindow;
       win.postMessage(msgString, '*');
     } else {
-      this.resetCkEditorInstance(currentTab, formData, true, data);
+      console.log('tag', this.state, this.state.editorInstanse);
+      this.state.editorInstanse.insertHtml(`{{${data}}}`);
+      //this.resetCkEditorInstance(currentTab, formData, true, data);
     }
   }
 
@@ -1412,6 +1415,12 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
 
   getEditorInstanse = (instance, id) => {
     console.log('Got editor Instance ', instance, id);
+    window.CKEDITOR.on( 'instanceReady', ( event ) => {
+      event.editor.on( 'focus', () => {
+        console.log( 'focused', event.editor, this );
+        this.setState({editorInstanse: event.editor});
+      });
+    });
     //this.setState({editorInstanse: instance});
   }
 
@@ -1720,7 +1729,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     const schema = _.cloneDeep(this.state.schema);
     schema.containers[this.state.currentTab - 1].panes.splice(val, 1);
     schema.containers[this.state.currentTab - 1].tabBarExtraContent.sections[0].inputFields[0].cols[4].content.sections[0].inputFields[2].cols[0].style = {display: "none"};
-    this.resetCkEditorInstance(this.state.currentTab, formData);
+    //this.resetCkEditorInstance(this.state.currentTab, formData);
     this.setState({schema, formData, showModal: false});
     console.log('Schema ', schema, formData, val);
   }
@@ -2024,7 +2033,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           }
           this.edmEvent = undefined;
         } else {
-          this.resetCkEditorInstance(this.state.currentTab, this.state.formData, true, data, true);
+          this.state.editorInstanse.insertHtml(`<img src='${data.metaInfo.secure_file_path}' alt='Capillary Image'>`);
+          //this.resetCkEditorInstance(this.state.currentTab, this.state.formData, true, data, true);
         }
       }
       this.setState({ showImageSelectionBox: false });
@@ -2450,6 +2460,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
   }
 
   injectEvents = (schema) => {
+    const type = this.props.location.query.type;
     console.log('now injecting events');
     const temp = schema;
     temp.standalone.sections = this.injectSections(temp.standalone.sections);
@@ -2459,43 +2470,49 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       return tempContainer;
     });
     console.log("Lang Test ", this.props.location.query.isLanguageSupport, (this.props.location.query.isLanguageSupport === false));
-    if ( this.props.location.query.type === 'embedded' && ((this.props.location.query.isLanguageSupport === "false" || this.props.location.query.isLanguageSupport === undefined) || this.props.location.query.isLanguageSupport === "true")) {
-      const ifLangSupported = this.props.location.query.isLanguageSupport === "true";
-      _.forEach(temp.containers, (container) => {
-        if (container.isActive) {
-          let hideLang = false;
-          _.forEach(container.tabBarExtraContent.sections[0].inputFields[0].cols, (containerInputFieldCol) => {
-            if (hideLang && !ifLangSupported) {
-              const newContainerInputFieldCol = containerInputFieldCol;
-              hideLang = false;
-              newContainerInputFieldCol.offset = 18;
-            } else if (hideLang) {
-              const newContainerInputFieldCol = containerInputFieldCol;
-              hideLang = false;
-              newContainerInputFieldCol.offset = 14;
-            }
-            if (containerInputFieldCol.id === 'add-language-button' && !ifLangSupported) {
-              const newContainerInputFieldCol = containerInputFieldCol;
-              newContainerInputFieldCol.colStyle.display = "none";
-              hideLang = true;
-            } else if (containerInputFieldCol.id === 'add-language-button') {
-              hideLang = true;
-            }
-            if (containerInputFieldCol.id === "mark-final-version-label") {
-              const newContainerInputFieldCol = containerInputFieldCol;
-              newContainerInputFieldCol.colStyle.display = "none";
-            }
-            if (containerInputFieldCol.id === "tab-options-popover") {
-              const newContainerInputFieldCol = containerInputFieldCol;
-              newContainerInputFieldCol.colStyle.display = "none";
-            }
-          });
-        }
-      });
-    }
+    // if (type !== "embedded" || (type === "embedded" && (this.props.location.query.isLanguageSupport === "false" || (this.props.location.query.isLanguageSupport === undefined || this.props.location.query.isLanguageSupport === "true")))) {
+    const ifLangSupported = this.props.location.query.isLanguageSupport === "true" || type !== "embedded";
+    _.forEach(temp.containers, (container) => {
+      if (container.isActive) {
+        let hideLang = false;
+        _.forEach(container.tabBarExtraContent.sections[0].inputFields[0].cols, (containerInputFieldCol) => {
+          if (hideLang && !ifLangSupported) {
+            const newContainerInputFieldCol = containerInputFieldCol;
+            hideLang = false;
+            newContainerInputFieldCol.offset = 18;
+          } else if (hideLang) {
+            const newContainerInputFieldCol = containerInputFieldCol;
+            hideLang = false;
+            newContainerInputFieldCol.offset = 14;
+          }
+          if (containerInputFieldCol.id === 'add-language-button' && !ifLangSupported) {
+            const newContainerInputFieldCol = containerInputFieldCol;
+            newContainerInputFieldCol.colStyle.display = "none";
+            hideLang = true;
+          } else if (containerInputFieldCol.id === 'add-language-button') {
+            hideLang = true;
+          }
+          if (containerInputFieldCol.id === "mark-final-version-label") {
+            const newContainerInputFieldCol = containerInputFieldCol;
+            newContainerInputFieldCol.colStyle.display = "none";
+          }
+          // if (containerInputFieldCol.id === "tab-options-popover") {
+          //   const newContainerInputFieldCol = containerInputFieldCol;
+          //   newContainerInputFieldCol.colStyle.display = "none";
+          // }
+        });
+      }
+    });
+    _.forEach(temp.standalone.sections[1].inputFields[0].cols, (inputField) => {
+      if (inputField.id === "template-version") {
+        const iF = inputField;
+        iF.colStyle = {};
+        iF.colStyle.display = "none";
+      }
+    });
+    //}
     console.log('final injected schema', schema);
     this.setState({schema, isSchemaChanged: true}, () => {
-      const type = this.props.location.query.type;
       if (type === 'embedded') {
         this.removeStandAlone();
       }

package/containers/Templates/_templates.scss

@@ -106,6 +106,13 @@
   width: 33%;
 }
 
+.select-button{
+  position: absolute;
+  top: 40.33%;
+  left: 33.625%;
+  width: 33%;
+}
+
 .preview-button{
   position: absolute;
   top: 43%;

package/containers/Templates/index.js

@@ -862,7 +862,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     this.setState({showModal: false});
   }
 
-  populateTemplatesList = (data, blankTemplateRequired) => {
+  populateTemplatesList = (data, blankTemplateRequired, layoutSelection) => {
     if (!data) {
       return [];
     }
@@ -953,8 +953,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             <div className={`sms-text ${this.state.hoveredItem === template._id ? 'sms-text-blurred' : ''}`}>
 
             </div>
-            {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> : ''}
-            {template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
+            {!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={() => this.handleEdmDefaultTemplateSelection(true, template._id)} 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') {
         content = this.prepareMobilePushPreviewData(template.versions.base);
@@ -988,37 +989,39 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       } else if (template.versions && template.versions.base && template.versions.base.IOS) {
         availableTemplates = 'iOS';
       }
-      temp.footer = (
-        <div className="footer-container">
-          <div className="card-title">
-            <span className="template-name" style={{ fontWeight: `${this.state.channel.toLowerCase() === 'wechat' ? '400' : '600'}` }}>
-              { template && template.versions && template.versions.history && template.versions.history.length > 1 && this.state.channel.toLowerCase() !== 'mobilepush' && <i style={{fontSize: '16px', margin: '0 8px 0 0', verticalAlign: 'middle'}} className="material-icons">filter_none</i>}
-              {template.name}
-            </span>
-            {this.props.location.query.type !== 'embedded' && <CapPopover
-              trigger="click"
-              content={
-                <div className="popover-content">
-                  {this.state.channel !== 'wechat' && <div className="popover-action-container">
-                    <span onClick={() => this.duplicateTemplate(template)} className="popover-action" style={{cursor: 'pointer', padding: '8px 0px'}}>{this.props.intl.formatMessage(messages.duplicateButton)}</span>
-                  </div>}
-                  <div className="popover-action-container">
-                    <span onClick={() => this.toggleDeleteTemplateModal(template)} className="popover-action" style={{cursor: 'pointer', padding: '8px 0px'}}>{this.state.channel !== 'wechat' ? this.props.intl.formatMessage(messages.deleteButton) : this.props.intl.formatMessage(messages.unMapButton)}</span>
+      if (!layoutSelection) {
+        temp.footer = (
+          <div className="footer-container">
+            <div className="card-title">
+              <span className="template-name" style={{ fontWeight: `${this.state.channel.toLowerCase() === 'wechat' ? '400' : '600'}` }}>
+                { template && template.versions && template.versions.history && template.versions.history.length > 1 && this.state.channel.toLowerCase() !== 'mobilepush' && <i style={{fontSize: '16px', margin: '0 8px 0 0', verticalAlign: 'middle'}} className="material-icons">filter_none</i>}
+                {template.name}
+              </span>
+              {this.props.location.query.type !== 'embedded' && <CapPopover
+                trigger="click"
+                content={
+                  <div className="popover-content">
+                    {this.state.channel !== 'wechat' && <div className="popover-action-container">
+                      <span onClick={() => this.duplicateTemplate(template)} className="popover-action" style={{cursor: 'pointer', padding: '8px 0px'}}>{this.props.intl.formatMessage(messages.duplicateButton)}</span>
+                    </div>}
+                    <div className="popover-action-container">
+                      <span onClick={() => this.toggleDeleteTemplateModal(template)} className="popover-action" style={{cursor: 'pointer', padding: '8px 0px'}}>{this.state.channel !== 'wechat' ? this.props.intl.formatMessage(messages.deleteButton) : this.props.intl.formatMessage(messages.unMapButton)}</span>
+                    </div>
                   </div>
-                </div>
-              }
-              placement="bottomRight"
-              >
-              <i className="material-icons options-icon">&#xE5D4;</i>
-            </CapPopover>}
+                }
+                placement="bottomRight"
+                >
+                <i className="material-icons options-icon">&#xE5D4;</i>
+              </CapPopover>}
+            </div>
+            {this.state.channel.toLowerCase() === "mobilepush" ?
+              <p className="card-detail">{availableTemplates}</p>
+              :
+              <p className="card-detail">{this.props.intl.formatMessage(messages.uploadedAt)}: {updateDateTime}</p>
+            }
           </div>
-          {this.state.channel.toLowerCase() === "mobilepush" ?
-            <p className="card-detail">{availableTemplates}</p>
-            :
-            <p className="card-detail">{this.props.intl.formatMessage(messages.uploadedAt)}: {updateDateTime}</p>
-          }
-        </div>
-      );
+        );
+      }
       items.push(temp);
       return true;
     });
@@ -1261,7 +1264,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     const cmsTemplateSelectionContent = (
       <CardGrid
         className={""}
-        listItem={this.populateTemplatesList(this.props.Templates.cmsTemplates, false)}
+        listItem={this.populateTemplatesList(this.props.Templates.cmsTemplates, false, true)}
         // filterContent={filterContent}
         onHoverItem={this.handleOnHoverItem}
         onItemClick={this.handleEdmDefaultTemplateSelection}
@@ -1346,7 +1349,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
               updatedByName={commonUtil.getUserNameById(parseInt(this.state.previewTemplate.updatedBy, 10), commonUtil.getMergedUserList(this.props.Templates.userList))}
             />}
             <SlideBox
-              header={(<h3>{this.props.intl.formatMessage(messages.templateSelection)}</h3>)}
+              header={(<h3>{this.props.intl.formatMessage(messages.layoutSelection)}</h3>)}
               width={60}
               content={cmsTemplateSelectionContent}
               show={this.state.showEdmEmailTemplates}

package/containers/Templates/messages.js

@@ -206,6 +206,10 @@ export default defineMessages({
     id: 'app.containers.Templates.templateSelection',
     defaultMessage: 'Template Selection',
   },
+  layoutSelection: {
+    id: 'app.containers.Templates.layoutSelection',
+    defaultMessage: 'Select Layout',
+  },
   textTemplate: {
     id: 'app.containers.Templates.textTemplate',
     defaultMessage: 'Text',
@@ -214,4 +218,8 @@ export default defineMessages({
     id: 'app.containers.Templates.imageTemplate',
     defaultMessage: 'Image',
   },
+  selectDefaultButton: {
+    id: 'app.containers.Templates.selectDefaultButton',
+    defaultMessage: 'Select',
+  },
 });

package/package.json

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

package/translations/en.json

@@ -303,6 +303,7 @@
   "app.containers.Templates.header": "This is Templates container !",
   "app.containers.Templates.imageTemplate": "Image",
   "app.containers.Templates.invalidUploadFileError": "File cannot be uploaded. Please select another file with valid file format.",
+  "app.containers.Templates.layoutSelection": "Select Layout",
   "app.containers.Templates.mapTemplate": "Map Template",
   "app.containers.Templates.mobilepushHeader": "Mobile Push",
   "app.containers.Templates.mostRecentOption": "Most Recent",
@@ -314,6 +315,7 @@
   "app.containers.Templates.searchText": "Search",
   "app.containers.Templates.selectAccount": "Select Account",
   "app.containers.Templates.selectButton": "Select",
+  "app.containers.Templates.selectDefaultButton": "Select",
   "app.containers.Templates.selectSmsHeader": "Select SMS Template",
   "app.containers.Templates.selectWechatHeader": "Select WECHAT Template",
   "app.containers.Templates.smsChannelTemplatesHeader": "SMS Templates",

package/translations/zh.json

@@ -1,9 +1,9 @@
 {
   "app.components.BreadCrumbs.header": "",
   "app.components.CapTagList.Cancel": "取消",
-  "app.components.CapTagList.Ok": "",
-  "app.components.CapTagList.dynamic_days_before_expiry": "",
-  "app.components.CapTagList.numberOfDaysBeforeExpiry": "",
+  "app.components.CapTagList.Ok": "OK",
+  "app.components.CapTagList.dynamic_days_before_expiry": "到期前（动态）天数",
+  "app.components.CapTagList.numberOfDaysBeforeExpiry": "到期前......天",
   "app.components.Ckeditor.header": "",
   "app.components.CustomPopOver.header": "",
   "app.components.DateRange.header": "",
@@ -12,14 +12,14 @@
   "app.components.EmailPreview.uploadedBy": "",
   "app.components.Footer.header": "",
   "app.components.FormBuilder.header": "",
-  "app.components.ImagePreview.loadingImage": "",
+  "app.components.ImagePreview.loadingImage": "加载图片",
   "app.components.NotFoundPage.header": "",
   "app.components.PageHeader.header": "",
   "app.components.PreviewSideBar.duplicate": "重复",
   "app.components.PreviewSideBar.edit": "编辑",
   "app.components.PreviewSideBar.header": "",
   "app.components.PreviewSideBar.lastModified": "最后修改于",
-  "app.components.PreviewSideBar.select": "",
+  "app.components.PreviewSideBar.select": "选择",
   "app.components.PreviewSideBar.uploadedBy": "最后修改人",
   "app.components.Sidebar.creatives": "广告创意",
   "app.components.Sidebar.input.placeholder": "搜索",
@@ -31,12 +31,12 @@
   "app.components.TestPage.header": "",
   "app.components.Toastr.header": "",
   "app.components.ToastrMessage.header": "",
-  "app.components.TopBar.brand.dropdown": "你好 ",
+  "app.components.TopBar.brand.dropdown": "你好",
   "app.containers.Assets.Gallery.alphabetically": "字母排序",
-  "app.containers.Assets.Gallery.assetDeleteFailed": "资源删除失败",
-  "app.containers.Assets.Gallery.assetDeleteSuccess": "资源删除成功",
-  "app.containers.Assets.Gallery.assetUploadFailed": "资源上传失败",
-  "app.containers.Assets.Gallery.assetUploadSuccess": "资源上传成功",
+  "app.containers.Assets.Gallery.assetDeleteFailed": "图片删除失败",
+  "app.containers.Assets.Gallery.assetDeleteSuccess": "图片删除成功",
+  "app.containers.Assets.Gallery.assetUploadFailed": "图片上传失败",
+  "app.containers.Assets.Gallery.assetUploadSuccess": "图片上传成功",
   "app.containers.Assets.Gallery.backToGallery": "返回画廊",
   "app.containers.Assets.Gallery.delete": "删除",
   "app.containers.Assets.Gallery.dimensions": "像素",
@@ -56,43 +56,43 @@
   "app.containers.Create.deleteLabel": "删除",
   "app.containers.Create.discardChangesButton": "取消修改",
   "app.containers.Create.duplicateLabel": "重复",
-  "app.containers.Create.emptyTemplateErrorMessage": "模板名称不能为空",
+  "app.containers.Create.emptyTemplateErrorMessage": "请提供模板名称",
   "app.containers.Create.markFinalVersionLabel": "标记为最终版本",
   "app.containers.Create.messageLabel": "信息",
   "app.containers.Create.newVersionLabel": "新版本",
   "app.containers.Create.renameLabel": "重新命名",
   "app.containers.Create.saveButton": "保存",
   "app.containers.Create.saveTemplateLoader": "报错模板",
-  "app.containers.Create.smsEditorPlaceholder": "导入SMS模板内容",
+  "app.containers.Create.smsEditorPlaceholder": "请输入消息内容",
   "app.containers.Create.somethingWentWrong": "",
-  "app.containers.Create.tagsErrorMessage": "模板内容中有不支持的或不存在的标签",
+  "app.containers.Create.tagsErrorMessage": "请检查缺失/不支持的标签内容",
   "app.containers.Create.tagsLabel": "标签",
   "app.containers.Create.templateNamePlaceHolder": "输入模板名称",
-  "app.containers.Create.unicodeErrorMessage": "请检查你确定要使用Unicode字符",
+  "app.containers.Create.unicodeErrorMessage": "请确认是否使用Unicode字符",
   "app.containers.Create.unicodeLabel": "允许unicode字符",
   "app.containers.Create.versionLabel": "版本",
   "app.containers.Dashboard.header": "仪表板",
-  "app.containers.Ebill.Cancel": "",
-  "app.containers.Ebill.Preview": "",
-  "app.containers.Ebill.Save": "",
-  "app.containers.Ebill.campaigns": "",
-  "app.containers.Ebill.creatives": "",
-  "app.containers.Ebill.ebill": "",
-  "app.containers.Ebill.ebillCreateSuccess": "",
-  "app.containers.Ebill.ebillEditSuccess": "",
-  "app.containers.Ebill.ebillPreview": "",
-  "app.containers.Ebill.emptyTemplateErrorMessage": "",
-  "app.containers.Ebill.enterTemplateName": "",
-  "app.containers.Ebill.loading": "",
-  "app.containers.Ebill.newVersionLabel": "",
-  "app.containers.Ebill.somethingWentWrong": "",
-  "app.containers.Ebill.tagsErrorMessage": "",
-  "app.containers.Ebill.tagsLabel": "",
+  "app.containers.Ebill.Cancel": "取消",
+  "app.containers.Ebill.Preview": "预览",
+  "app.containers.Ebill.Save": "保存",
+  "app.containers.Ebill.campaigns": "活动",
+  "app.containers.Ebill.creatives": "活动模板",
+  "app.containers.Ebill.ebill": "电子账单",
+  "app.containers.Ebill.ebillCreateSuccess": "电子账单模板创建成功",
+  "app.containers.Ebill.ebillEditSuccess": "电子账单模板编辑成功",
+  "app.containers.Ebill.ebillPreview": "电子账单预览",
+  "app.containers.Ebill.emptyTemplateErrorMessage": "请提供模板名称",
+  "app.containers.Ebill.enterTemplateName": "输入模板名称",
+  "app.containers.Ebill.loading": "加载中...",
+  "app.containers.Ebill.newVersionLabel": "新模板",
+  "app.containers.Ebill.somethingWentWrong": "系统报错",
+  "app.containers.Ebill.tagsErrorMessage": "请检查缺失/不支持的标签内容",
+  "app.containers.Ebill.tagsLabel": "标签",
   "app.containers.Edit.cancelButton": "取消",
   "app.containers.Edit.deleteLabel": "删除",
   "app.containers.Edit.discardChangesButton": "取消修改",
   "app.containers.Edit.duplicateLabel": "重复",
-  "app.containers.Edit.emptyTemplateErrorMessage": "模板名称不能为空",
+  "app.containers.Edit.emptyTemplateErrorMessage": "请提供模板名称",
   "app.containers.Edit.getTemplateDetailsLoader": "获取模板详情",
   "app.containers.Edit.markFinalVersionLabel": "标记为最终版本",
   "app.containers.Edit.messageLabel": "信息",
@@ -100,213 +100,214 @@
   "app.containers.Edit.renameLabel": "重新命名",
   "app.containers.Edit.saveButton": "保存",
   "app.containers.Edit.saveTemplateLoader": "报错模板",
-  "app.containers.Edit.smsEditorPlaceholder": "导入SMS模板内容",
+  "app.containers.Edit.smsEditorPlaceholder": "请输入消息内容",
   "app.containers.Edit.somethingWentWrong": "",
-  "app.containers.Edit.tagsErrorMessage": "模板内容中有不支持的或不存在的标签",
+  "app.containers.Edit.tagsErrorMessage": "请检查缺失/不支持的标签内容",
   "app.containers.Edit.tagsLabel": "标签",
   "app.containers.Edit.templateNamePlaceHolder": "输入模板名称",
   "app.containers.Edit.unicodeErrorMessage": "请检查你确定要使用Unicode字符",
   "app.containers.Edit.unicodeLabel": "允许unicode字符",
   "app.containers.Edit.versionLabel": "版本",
-  "app.containers.Email.Campaigns": "",
-  "app.containers.Email.Cancel": "",
-  "app.containers.Email.Creatives": "",
-  "app.containers.Email.Preview": "",
-  "app.containers.Email.Save": "",
-  "app.containers.Email.Subject": "",
-  "app.containers.Email.Tags": "",
-  "app.containers.Email.alphabetically": "",
-  "app.containers.Email.alphabeticallyOption": "",
-  "app.containers.Email.assetUploadFailed": "",
-  "app.containers.Email.blankTemplate": "",
-  "app.containers.Email.cancel": "",
-  "app.containers.Email.createHeading": "",
-  "app.containers.Email.delete": "",
-  "app.containers.Email.deleteLanguage": "",
-  "app.containers.Email.deleteLanguageConfirmation": "",
-  "app.containers.Email.deleteVersion": "",
-  "app.containers.Email.deleteVersionConfirm": "",
-  "app.containers.Email.dupicateVersion": "",
-  "app.containers.Email.editButton": "",
-  "app.containers.Email.editHeading": "",
-  "app.containers.Email.edmSwitchAcceptText": "",
-  "app.containers.Email.edmSwtichMessage": "",
-  "app.containers.Email.emailCreateSuccess": "",
-  "app.containers.Email.emailEditSuccess": "",
-  "app.containers.Email.emailPreview": "",
-  "app.containers.Email.emailSubject": "",
-  "app.containers.Email.emailSubjectNotEmplty": "",
-  "app.containers.Email.emailText": "",
-  "app.containers.Email.imageSelection": "",
-  "app.containers.Email.insertImage": "",
-  "app.containers.Email.markAsFinal": "",
-  "app.containers.Email.moreThanFiveVersionNotAllowed": "",
-  "app.containers.Email.mostRecent": "",
-  "app.containers.Email.mostRecentOption": "",
-  "app.containers.Email.preview": "",
-  "app.containers.Email.previewButton": "",
-  "app.containers.Email.saveTemplateLoader": "",
-  "app.containers.Email.searchText": "",
-  "app.containers.Email.select": "",
-  "app.containers.Email.selectButton": "",
-  "app.containers.Email.somethingWentWrong": "",
-  "app.containers.Email.sortBy": "",
-  "app.containers.Email.sortby": "",
-  "app.containers.Email.switchEditor": "",
-  "app.containers.Email.templateLoader": "",
-  "app.containers.Email.templateMarkedFinalSuccess": "",
-  "app.containers.Email.templateNameNotEmpty": "",
-  "app.containers.Email.templateNamePlaceholder": "",
-  "app.containers.Email.upload": "",
-  "app.containers.Email.uploadSizeError": "",
-  "app.containers.Email.uploadedAt": "",
-  "app.containers.Email.uploadedBy": "",
-  "app.containers.Email.uploadingImage": "",
-  "app.containers.Email.yes": "",
+  "app.containers.Email.Campaigns": "活动",
+  "app.containers.Email.Cancel": "取消",
+  "app.containers.Email.Creatives": "活动模板",
+  "app.containers.Email.Preview": "预览",
+  "app.containers.Email.Save": "保存",
+  "app.containers.Email.Subject": "活动主题",
+  "app.containers.Email.Tags": "标签",
+  "app.containers.Email.alphabetically": "按字母顺序排列",
+  "app.containers.Email.alphabeticallyOption": "按字母顺序排列",
+  "app.containers.Email.assetUploadFailed": "图片上传失败",
+  "app.containers.Email.blankTemplate": "空白模板",
+  "app.containers.Email.cancel": "取消",
+  "app.containers.Email.createHeading": "创建邮箱模板",
+  "app.containers.Email.delete": "删除",
+  "app.containers.Email.deleteLanguage": "删除语言",
+  "app.containers.Email.deleteLanguageConfirmation": "你是否想删除此语言？",
+  "app.containers.Email.deleteVersion": "删除模板",
+  "app.containers.Email.deleteVersionConfirm": "你是否想删除此模板？",
+  "app.containers.Email.dupicateVersion": "复制模板",
+  "app.containers.Email.editButton": "编辑",
+  "app.containers.Email.editHeading": "编辑邮箱模板",
+  "app.containers.Email.edmSwitchAcceptText": "已理解此操作无法恢复",
+  "app.containers.Email.edmSwtichMessage": "当选择使用HTML语言编辑时，邮箱模板设计快捷操作，如：拖拉操作将不再适用此模板",
+  "app.containers.Email.emailCreateSuccess": "邮箱模板创建成功",
+  "app.containers.Email.emailEditSuccess": "邮箱模板编辑成功",
+  "app.containers.Email.emailPreview": "邮件预览",
+  "app.containers.Email.emailSubject": "输入邮件主题",
+  "app.containers.Email.emailSubjectNotEmplty": "电子邮件主题不能为空值",
+  "app.containers.Email.emailText": "电子邮件",
+  "app.containers.Email.imageSelection": "选择图片",
+  "app.containers.Email.insertImage": "插入图片",
+  "app.containers.Email.markAsFinal": "标为终版",
+  "app.containers.Email.moreThanFiveVersionNotAllowed": "最多创建5个模板",
+  "app.containers.Email.mostRecent": "最近一次",
+  "app.containers.Email.mostRecentOption": "最近一次",
+  "app.containers.Email.preview": "预览",
+  "app.containers.Email.previewButton": "预览",
+  "app.containers.Email.saveTemplateLoader": "保存模板",
+  "app.containers.Email.searchText": "查找",
+  "app.containers.Email.select": "选择",
+  "app.containers.Email.selectButton": "选择",
+  "app.containers.Email.somethingWentWrong": "系统报错",
+  "app.containers.Email.sortBy": "排序方式",
+  "app.containers.Email.sortby": "排序方式",
+  "app.containers.Email.switchEditor": "切换编辑器",
+  "app.containers.Email.templateLoader": "加载模板...",
+  "app.containers.Email.templateMarkedFinalSuccess": "成功将模板标记为终版",
+  "app.containers.Email.templateNameNotEmpty": "请提供模板名称",
+  "app.containers.Email.templateNamePlaceholder": "输入模板名称",
+  "app.containers.Email.upload": "上传图片",
+  "app.containers.Email.uploadSizeError": "文档太大无法上传.请上传不超过5MB的文档",
+  "app.containers.Email.uploadedAt": "已修改",
+  "app.containers.Email.uploadedBy": "上传人",
+  "app.containers.Email.uploadingImage": "上传图片...",
+  "app.containers.Email.yes": "是",
   "app.containers.Login.header": "",
   "app.containers.Login.invalidCredential": "无效的用户名或密码",
   "app.containers.Login.pageTitle": "登录",
-  "app.containers.MobilePush.Create.Android": "",
-  "app.containers.MobilePush.Create.Campaigns": "",
-  "app.containers.MobilePush.Create.Creatives": "",
-  "app.containers.MobilePush.Create.Image": "",
-  "app.containers.MobilePush.Create.ImageUploadLabel": "",
-  "app.containers.MobilePush.Create.Tags": "",
-  "app.containers.MobilePush.Create.accountId": "",
-  "app.containers.MobilePush.Create.addAnotherCTA": "",
-  "app.containers.MobilePush.Create.addPrimaryCTA": "",
-  "app.containers.MobilePush.Create.addSecondaryCTA": "",
-  "app.containers.MobilePush.Create.button1": "",
-  "app.containers.MobilePush.Create.button2": "",
-  "app.containers.MobilePush.Create.cancel": "",
-  "app.containers.MobilePush.Create.copyFromAndroid": "",
-  "app.containers.MobilePush.Create.copyFromIos": "",
-  "app.containers.MobilePush.Create.ctaLabelCantEmpty": "",
-  "app.containers.MobilePush.Create.deleteSecondCTAFirst": "",
-  "app.containers.MobilePush.Create.discardChanges": "",
-  "app.containers.MobilePush.Create.enterCTALabel": "",
-  "app.containers.MobilePush.Create.enterTemplateName": "",
-  "app.containers.MobilePush.Create.enterTemplateNameImportant": "",
-  "app.containers.MobilePush.Create.externalLink": "",
-  "app.containers.MobilePush.Create.externalLinkCantEmpty": "",
-  "app.containers.MobilePush.Create.goBackConfirmation": "",
-  "app.containers.MobilePush.Create.iOS": "",
-  "app.containers.MobilePush.Create.inputMobilePushTemplateContent": "",
-  "app.containers.MobilePush.Create.maxUploadFileSize": "",
-  "app.containers.MobilePush.Create.message": "",
-  "app.containers.MobilePush.Create.messageHasUnsupportedTag": "",
-  "app.containers.MobilePush.Create.messageLabel": "",
-  "app.containers.MobilePush.Create.messageTitleWithUnsupportedTag": "",
-  "app.containers.MobilePush.Create.mobilePush": "",
-  "app.containers.MobilePush.Create.nameAndDescription": "",
-  "app.containers.MobilePush.Create.pleaseUploadImage": "",
-  "app.containers.MobilePush.Create.primaryCTA": "",
-  "app.containers.MobilePush.Create.save": "",
-  "app.containers.MobilePush.Create.secondaryCTA": "",
-  "app.containers.MobilePush.Create.selectADeeplink": "",
-  "app.containers.MobilePush.Create.selectDeepLink": "",
-  "app.containers.MobilePush.Create.selectDeeplink": "",
-  "app.containers.MobilePush.Create.selectLinkType": "",
-  "app.containers.MobilePush.Create.selectMobilePushAccount": "",
-  "app.containers.MobilePush.Create.selectMobilePushTemplate": "",
-  "app.containers.MobilePush.Create.somethingWentWrong": "",
-  "app.containers.MobilePush.Create.template": "",
-  "app.containers.MobilePush.Create.templateCantEmpty": "",
-  "app.containers.MobilePush.Create.templateCreatedSuccessfully": "",
-  "app.containers.MobilePush.Create.templateNameNotEmpty": "",
-  "app.containers.MobilePush.Create.title": "",
-  "app.containers.MobilePush.Create.titleHasUnsupportedTag": "",
-  "app.containers.MobilePush.Create.titleLabel": "",
-  "app.containers.MobilePush.Create.titleNameInvalid": "",
-  "app.containers.MobilePush.Create.uploadFileSizeError": "",
-  "app.containers.MobilePush.Create.uploadImage": "",
-  "app.containers.MobilePush.Create.uploadingImage": "",
-  "app.containers.MobilePush.Create.valueCantEmpty": "",
-  "app.containers.MobilePush.Edit.Android": "",
-  "app.containers.MobilePush.Edit.Campaigns": "",
-  "app.containers.MobilePush.Edit.Creatives": "",
-  "app.containers.MobilePush.Edit.Image": "",
-  "app.containers.MobilePush.Edit.ImageUploadLabel": "",
-  "app.containers.MobilePush.Edit.Tags": "",
-  "app.containers.MobilePush.Edit.accountId": "",
-  "app.containers.MobilePush.Edit.addAnotherCTA": "",
-  "app.containers.MobilePush.Edit.addPrimaryCTA": "",
-  "app.containers.MobilePush.Edit.addSecondaryCTA": "",
-  "app.containers.MobilePush.Edit.androidTemplateNotConfigured": "",
-  "app.containers.MobilePush.Edit.button1": "",
-  "app.containers.MobilePush.Edit.button2": "",
-  "app.containers.MobilePush.Edit.cancel": "",
-  "app.containers.MobilePush.Edit.copyFromAndroid": "",
-  "app.containers.MobilePush.Edit.copyFromIos": "",
-  "app.containers.MobilePush.Edit.ctaLabelCantEmpty": "",
-  "app.containers.MobilePush.Edit.deleteSecondCTAFirst": "",
-  "app.containers.MobilePush.Edit.discardChanges": "",
-  "app.containers.MobilePush.Edit.enterCTALabel": "",
-  "app.containers.MobilePush.Edit.enterTemplateName": "",
-  "app.containers.MobilePush.Edit.enterTemplateNameImportant": "",
-  "app.containers.MobilePush.Edit.externalLink": "",
-  "app.containers.MobilePush.Edit.externalLinkCantEmpty": "",
-  "app.containers.MobilePush.Edit.externalLinkCantEmpty1": "",
-  "app.containers.MobilePush.Edit.goBackConfirmation": "",
-  "app.containers.MobilePush.Edit.iOS": "",
-  "app.containers.MobilePush.Edit.inputMobilePushTemplateContent": "",
-  "app.containers.MobilePush.Edit.iosTemplateNotConfigured": "",
-  "app.containers.MobilePush.Edit.maxUploadFileSize": "",
-  "app.containers.MobilePush.Edit.message": "",
-  "app.containers.MobilePush.Edit.messageHasUnsupportedTag": "",
-  "app.containers.MobilePush.Edit.messageLabel": "",
-  "app.containers.MobilePush.Edit.messageTitleWithUnsupportedTag": "",
-  "app.containers.MobilePush.Edit.mobilePush": "",
-  "app.containers.MobilePush.Edit.nameAndDescription": "",
-  "app.containers.MobilePush.Edit.pleaseUploadImage": "",
-  "app.containers.MobilePush.Edit.primaryCTA": "",
-  "app.containers.MobilePush.Edit.save": "",
-  "app.containers.MobilePush.Edit.secondaryCTA": "",
-  "app.containers.MobilePush.Edit.selectADeeplink": "",
-  "app.containers.MobilePush.Edit.selectDeepLink": "",
-  "app.containers.MobilePush.Edit.selectDeeplink": "",
-  "app.containers.MobilePush.Edit.selectLinkType": "",
-  "app.containers.MobilePush.Edit.selectMobilePushAccount": "",
-  "app.containers.MobilePush.Edit.selectMobilePushTemplate": "",
-  "app.containers.MobilePush.Edit.somethingWentWrong": "",
-  "app.containers.MobilePush.Edit.template": "",
-  "app.containers.MobilePush.Edit.templateCantEmpty": "",
-  "app.containers.MobilePush.Edit.templateEditedSuccessfully": "",
-  "app.containers.MobilePush.Edit.templateNameNotEmpty": "",
-  "app.containers.MobilePush.Edit.templateNotConfigured": "",
-  "app.containers.MobilePush.Edit.title": "",
-  "app.containers.MobilePush.Edit.titleHasUnsupportedTag": "",
-  "app.containers.MobilePush.Edit.titleLabel": "",
-  "app.containers.MobilePush.Edit.titleNameInvalid": "",
-  "app.containers.MobilePush.Edit.uploadFileSizeError": "",
-  "app.containers.MobilePush.Edit.uploadImage": "",
-  "app.containers.MobilePush.Edit.uploadingImage": "",
-  "app.containers.MobilePush.Edit.valueCantEmpty": "",
+  "app.containers.MobilePush.Create.Android": "Android",
+  "app.containers.MobilePush.Create.Campaigns": "活动",
+  "app.containers.MobilePush.Create.Creatives": "活动模板",
+  "app.containers.MobilePush.Create.Image": "图片",
+  "app.containers.MobilePush.Create.ImageUploadLabel": "上传图片",
+  "app.containers.MobilePush.Create.Tags": "标签",
+  "app.containers.MobilePush.Create.accountId": "客户名称",
+  "app.containers.MobilePush.Create.addAnotherCTA": "添加其它CTA",
+  "app.containers.MobilePush.Create.addPrimaryCTA": "添加一级CTA",
+  "app.containers.MobilePush.Create.addSecondaryCTA": "添加二级CTA",
+  "app.containers.MobilePush.Create.button1": "按钮1",
+  "app.containers.MobilePush.Create.button2": "按钮2",
+  "app.containers.MobilePush.Create.cancel": "取消",
+  "app.containers.MobilePush.Create.copyFromAndroid": "从Android系统中复制标题和内容",
+  "app.containers.MobilePush.Create.copyFromIos": "从IOS系统中复制标题和内容",
+  "app.containers.MobilePush.Create.ctaLabelCantEmpty": "CTA值不能为空",
+  "app.containers.MobilePush.Create.deleteSecondCTAFirst": "请先删除二级CTA",
+  "app.containers.MobilePush.Create.discardChanges": "放弃修改",
+  "app.containers.MobilePush.Create.enterCTALabel": "此处输入CTA值",
+  "app.containers.MobilePush.Create.enterTemplateName": "输入模板名称",
+  "app.containers.MobilePush.Create.enterTemplateNameImportant": "输入模板名称*",
+  "app.containers.MobilePush.Create.externalLink": "External Link",
+  "app.containers.MobilePush.Create.externalLinkCantEmpty": "External Link不能为空",
+  "app.containers.MobilePush.Create.goBackConfirmation": "返回上一步将放弃当前的所有修改，是否继续？",
+  "app.containers.MobilePush.Create.iOS": "iOS",
+  "app.containers.MobilePush.Create.inputMobilePushTemplateContent": "请输入消息内容",
+  "app.containers.MobilePush.Create.maxUploadFileSize": "可上传的最大文件大小是5MB",
+  "app.containers.MobilePush.Create.message": "消息",
+  "app.containers.MobilePush.Create.messageHasUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Create.messageLabel": "消息*",
+  "app.containers.MobilePush.Create.messageTitleWithUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Create.mobilePush": "Mobile Push",
+  "app.containers.MobilePush.Create.nameAndDescription": "名称和描述",
+  "app.containers.MobilePush.Create.pleaseUploadImage": "请上传图片",
+  "app.containers.MobilePush.Create.primaryCTA": "一级CTA",
+  "app.containers.MobilePush.Create.save": "保存",
+  "app.containers.MobilePush.Create.secondaryCTA": "二级CTA",
+  "app.containers.MobilePush.Create.selectADeeplink": "选择Deep link",
+  "app.containers.MobilePush.Create.selectDeepLink": "选择Deep link",
+  "app.containers.MobilePush.Create.selectDeeplink": "选择Deep link",
+  "app.containers.MobilePush.Create.selectLinkType": "请选择链接类型",
+  "app.containers.MobilePush.Create.selectMobilePushAccount": "请选择Mobile push的账户",
+  "app.containers.MobilePush.Create.selectMobilePushTemplate": "请选择Mobile push的模板",
+  "app.containers.MobilePush.Create.somethingWentWrong": "系统报错",
+  "app.containers.MobilePush.Create.template": "模板",
+  "app.containers.MobilePush.Create.templateCantEmpty": "请填写模板名称",
+  "app.containers.MobilePush.Create.templateCreatedSuccessfully": "Mobile push模板创建成功",
+  "app.containers.MobilePush.Create.templateNameNotEmpty": "请提供模板名称",
+  "app.containers.MobilePush.Create.title": "标题",
+  "app.containers.MobilePush.Create.titleHasUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Create.titleLabel": "标题*",
+  "app.containers.MobilePush.Create.titleNameInvalid": "请输入消息标题",
+  "app.containers.MobilePush.Create.uploadFileSizeError": "文件大小不能超过5MB",
+  "app.containers.MobilePush.Create.uploadImage": "上传图片",
+  "app.containers.MobilePush.Create.uploadingImage": "加载图片",
+  "app.containers.MobilePush.Create.valueCantEmpty": "值不能为空",
+  "app.containers.MobilePush.Edit.Android": "Android",
+  "app.containers.MobilePush.Edit.Campaigns": "活动",
+  "app.containers.MobilePush.Edit.Creatives": "活动模板",
+  "app.containers.MobilePush.Edit.Image": "图片",
+  "app.containers.MobilePush.Edit.ImageUploadLabel": "上传图片",
+  "app.containers.MobilePush.Edit.Tags": "标签",
+  "app.containers.MobilePush.Edit.accountId": "Account Id",
+  "app.containers.MobilePush.Edit.addAnotherCTA": "添加其它CTA",
+  "app.containers.MobilePush.Edit.addPrimaryCTA": "添加一级CTA",
+  "app.containers.MobilePush.Edit.addSecondaryCTA": "添加二级CTA",
+  "app.containers.MobilePush.Edit.androidTemplateNotConfigured": "Android 模板没有配置，是否保存？",
+  "app.containers.MobilePush.Edit.button1": "按钮1",
+  "app.containers.MobilePush.Edit.button2": "按钮2",
+  "app.containers.MobilePush.Edit.cancel": "取消",
+  "app.containers.MobilePush.Edit.copyFromAndroid": "从Android复制标题和内容",
+  "app.containers.MobilePush.Edit.copyFromIos": "从IOS复制标题和内容 ",
+  "app.containers.MobilePush.Edit.ctaLabelCantEmpty": "CTA值不能为空",
+  "app.containers.MobilePush.Edit.deleteSecondCTAFirst": "请先删除二级CTA",
+  "app.containers.MobilePush.Edit.discardChanges": "放弃修改",
+  "app.containers.MobilePush.Edit.enterCTALabel": "此处输入CTA值",
+  "app.containers.MobilePush.Edit.enterTemplateName": "输入模板名称",
+  "app.containers.MobilePush.Edit.enterTemplateNameImportant": "输入模板名称*",
+  "app.containers.MobilePush.Edit.externalLink": "External Link",
+  "app.containers.MobilePush.Edit.externalLinkCantEmpty": "External Link不能为空值",
+  "app.containers.MobilePush.Edit.externalLinkCantEmpty1": "External Link不能为空值",
+  "app.containers.MobilePush.Edit.goBackConfirmation": "你是否想退回上一步操作?所有修改将会丢失！",
+  "app.containers.MobilePush.Edit.iOS": "iOS",
+  "app.containers.MobilePush.Edit.inputMobilePushTemplateContent": "请输入消息内容",
+  "app.containers.MobilePush.Edit.iosTemplateNotConfigured": "IOS模板没有配置，是否保存？",
+  "app.containers.MobilePush.Edit.maxUploadFileSize": "文件大小不能超过5MB",
+  "app.containers.MobilePush.Edit.message": "消息",
+  "app.containers.MobilePush.Edit.messageHasUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Edit.messageLabel": "消息*",
+  "app.containers.MobilePush.Edit.messageTitleWithUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Edit.mobilePush": "Mobile push",
+  "app.containers.MobilePush.Edit.nameAndDescription": "姓名和描述",
+  "app.containers.MobilePush.Edit.pleaseUploadImage": "请上传图片",
+  "app.containers.MobilePush.Edit.primaryCTA": "一级CTA",
+  "app.containers.MobilePush.Edit.save": "保存",
+  "app.containers.MobilePush.Edit.secondaryCTA": "二级CTA",
+  "app.containers.MobilePush.Edit.selectADeeplink": "选择Deep link",
+  "app.containers.MobilePush.Edit.selectDeepLink": "选择Deep link",
+  "app.containers.MobilePush.Edit.selectDeeplink": "选择Deep link",
+  "app.containers.MobilePush.Edit.selectLinkType": "请选择链接类型",
+  "app.containers.MobilePush.Edit.selectMobilePushAccount": "请选择Mobile push的账户",
+  "app.containers.MobilePush.Edit.selectMobilePushTemplate": "请选择Mobile push的模板",
+  "app.containers.MobilePush.Edit.somethingWentWrong": "系统报错",
+  "app.containers.MobilePush.Edit.template": "模板",
+  "app.containers.MobilePush.Edit.templateCantEmpty": "请填写模板名称",
+  "app.containers.MobilePush.Edit.templateEditedSuccessfully": "Mobile Push模板编辑成功",
+  "app.containers.MobilePush.Edit.templateNameNotEmpty": "请提供模板名称",
+  "app.containers.MobilePush.Edit.templateNotConfigured": "模板不能配置",
+  "app.containers.MobilePush.Edit.title": "标题",
+  "app.containers.MobilePush.Edit.titleHasUnsupportedTag": "请检查缺失/不支持的标签内容",
+  "app.containers.MobilePush.Edit.titleLabel": "标题*",
+  "app.containers.MobilePush.Edit.titleNameInvalid": "请输入消息内容",
+  "app.containers.MobilePush.Edit.uploadFileSizeError": "文件大小不能超过5MB",
+  "app.containers.MobilePush.Edit.uploadImage": "上传图片",
+  "app.containers.MobilePush.Edit.uploadingImage": "上传图片...",
+  "app.containers.MobilePush.Edit.valueCantEmpty": "值不能为空",
   "app.containers.TagList.header": "",
   "app.containers.Templates.alphabeticallyOption": "字母排序",
   "app.containers.Templates.blankTemplate": "空白模板",
-  "app.containers.Templates.campaigns": "",
+  "app.containers.Templates.campaigns": "活动",
   "app.containers.Templates.cancelText": "",
-  "app.containers.Templates.createEmailActionButton": "",
+  "app.containers.Templates.createEmailActionButton": "创建邮件",
   "app.containers.Templates.createSmsActionButton": "创建短信",
-  "app.containers.Templates.creatives": "",
+  "app.containers.Templates.creatives": "活动模板",
   "app.containers.Templates.deleteButton": "删除",
   "app.containers.Templates.deletedSuccssfully": "",
   "app.containers.Templates.deletionFailed": "",
   "app.containers.Templates.duplicateButton": "重复",
-  "app.containers.Templates.ebillHeader": "",
-  "app.containers.Templates.ebillPreview": "",
+  "app.containers.Templates.ebillHeader": "电子账单",
+  "app.containers.Templates.ebillPreview": "电子账单预览",
   "app.containers.Templates.editButton": "编辑",
-  "app.containers.Templates.emailHeader": "",
-  "app.containers.Templates.emailPreview": "",
+  "app.containers.Templates.emailHeader": "邮箱",
+  "app.containers.Templates.emailPreview": "邮箱预览",
   "app.containers.Templates.gettingAllTemplates": "获取所有模板",
   "app.containers.Templates.header": "",
-  "app.containers.Templates.imageTemplate": "",
-  "app.containers.Templates.invalidUploadFileError": "",
+  "app.containers.Templates.imageTemplate": "图片",
+  "app.containers.Templates.invalidUploadFileError": "文档无法上传.请选择正确的文档格式。",
+  "app.containers.Templates.layoutSelection": "",
   "app.containers.Templates.mapTemplate": "创建模板",
-  "app.containers.Templates.mobilepushHeader": "",
+  "app.containers.Templates.mobilepushHeader": "Mobile push",
   "app.containers.Templates.mostRecentOption": "最近",
-  "app.containers.Templates.newTemplate": "",
+  "app.containers.Templates.newTemplate": "新模板",
   "app.containers.Templates.noAccountMessage": "请选择需要处理的公众号",
   "app.containers.Templates.noTemplatesMessage": "没有可用的模板",
   "app.containers.Templates.preview": "",
@@ -314,27 +315,28 @@
   "app.containers.Templates.searchText": "搜索",
   "app.containers.Templates.selectAccount": "选择公众号",
   "app.containers.Templates.selectButton": "选择",
+  "app.containers.Templates.selectDefaultButton": "",
   "app.containers.Templates.selectSmsHeader": "选择短信模板",
   "app.containers.Templates.selectWechatHeader": "选择微信模板",
   "app.containers.Templates.smsChannelTemplatesHeader": "短信模板",
   "app.containers.Templates.smsHeader": "短信",
   "app.containers.Templates.somethingWentWrong": "出现问题!!",
   "app.containers.Templates.sortBy": "排序",
-  "app.containers.Templates.templateDeleteConfirm": "",
+  "app.containers.Templates.templateDeleteConfirm": "你确认要删除此模板吗？",
   "app.containers.Templates.templateDeleteSuccess": "短信模板复制成功",
-  "app.containers.Templates.templateDuplicateSuccess": "短信模板删除成功",
-  "app.containers.Templates.templateSelection": "",
-  "app.containers.Templates.textTemplate": "",
+  "app.containers.Templates.templateDuplicateSuccess": "模板复制成功",
+  "app.containers.Templates.templateSelection": "选择模板",
+  "app.containers.Templates.textTemplate": "文本",
   "app.containers.Templates.unMapButton": "取消模板",
-  "app.containers.Templates.uploadFile": "",
+  "app.containers.Templates.uploadFile": "上传文件",
   "app.containers.Templates.uploadedAt": "最后修改于",
   "app.containers.Templates.uploadedBy": "被上传",
-  "app.containers.Templates.uploadingFile": "",
-  "app.containers.Templates.useEditor": "",
+  "app.containers.Templates.uploadingFile": "上传文件中",
+  "app.containers.Templates.useEditor": "使用编辑器",
   "app.containers.Templates.wechatChannelTemplatesHeader": "微信模板",
   "app.containers.Templates.wechatHeader": "微信",
   "app.containers.Templates.yesText": "",
-  "app.containers.Templates.zipUploadFailed": "",
+  "app.containers.Templates.zipUploadFailed": "不能上传zip文件",
   "app.containers.Testv2.header": "",
   "app.containers.WeChat.accountId": "账户ID",
   "app.containers.WeChat.cancel": "取消",
@@ -350,31 +352,31 @@
   "app.containers.WeChat.tagsLabel": "标签",
   "app.containers.WeChat.template": "模板",
   "app.containers.WeChat.templateMapping": "模板对应",
-  "app.containers.WeChat.wechatCreateSuccess": "成功创建微信模板",
-  "app.containers.WeChat.wechatEditSuccess": "成功修改微信模板",
+  "app.containers.WeChat.wechatCreateSuccess": "微信模板映射成功",
+  "app.containers.WeChat.wechatEditSuccess": "微信模板取消映射成功",
   "customdatepicker.cancel": "取消",
-  "customdatepicker.done": "",
-  "reon.components.Cap.Workbench": "",
-  "reon.components.Cap.campaigns": "",
-  "reon.components.Cap.creatives": "",
-  "reon.components.Cap.creativesDashboard": "",
-  "reon.components.Cap.ebill": "",
-  "reon.components.Cap.email": "",
-  "reon.components.Cap.gallery": "",
-  "reon.components.Cap.loyalty": "",
-  "reon.components.Cap.memberCare": "",
-  "reon.components.Cap.sms": "",
-  "reon.components.Cap.storeCare": "",
-  "reon.components.Cap.storePerformance": "",
-  "reon.components.Cap.wechat": "",
+  "customdatepicker.done": "完成",
+  "reon.components.Cap.Workbench": "工作台",
+  "reon.components.Cap.campaigns": "活动",
+  "reon.components.Cap.creatives": "活动模板",
+  "reon.components.Cap.creativesDashboard": "活动模板",
+  "reon.components.Cap.ebill": "电子账单",
+  "reon.components.Cap.email": "邮件",
+  "reon.components.Cap.gallery": "图片库",
+  "reon.components.Cap.loyalty": "忠诚度引擎",
+  "reon.components.Cap.memberCare": "会员中心",
+  "reon.components.Cap.sms": "短信",
+  "reon.components.Cap.storeCare": "门店",
+  "reon.components.Cap.storePerformance": "门店绩效",
+  "reon.components.Cap.wechat": "微信",
   "reon.components.DateFilter.editText": "编辑",
-  "reon.components.DateFilter.loaderMessage": "",
-  "reon.components.TopBar.brand.dropdown": "",
+  "reon.components.DateFilter.loaderMessage": "获取数据",
+  "reon.components.TopBar.brand.dropdown": "选择品牌",
   "reon.components.TopBar.logout": "登出",
   "reon.components.TopBar.profile": "简况",
   "reon.components.TopBar.settings": "设置",
-  "reon.components.campaignsDashboard": "",
-  "reon.components.campaignsHome": "",
+  "reon.components.campaignsDashboard": "活动",
+  "reon.components.campaignsHome": "活动中心",
   "reon.modules.Login.components.LoginForm.input.loginButton": "登录",
   "reon.modules.Login.components.LoginForm.input.password": "密码",
   "reon.modules.Login.components.LoginForm.input.username": "用户名或密码"