@capillarytech/creatives-library 3.1.23 → 3.1.25

package/package.json

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

package/v2Components/TemplatePreview/WechatRichmediaTemplatePreview/index.js

@@ -8,7 +8,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 // import { connect } from 'react-redux';
 import { CapRow, CapColumn, CapButton } from '@capillarytech/cap-react-ui-library/';
-import { CapHeading } from '@capillarytech/cap-ui-library/';
+import { CapHeading, CapLabel } from '@capillarytech/cap-ui-library/';
 import { FormattedMessage } from 'react-intl';
 import _ from 'lodash';
 import './_wechatRichmediaTemplatePrev.scss';
@@ -35,14 +35,14 @@ class WechatRichmediaTemplatePreview extends React.PureComponent { // eslint-dis
       previewMsg.push(
         <div className="name-container-with-abstract">
           <CapHeading type="h4">{contentData.title}</CapHeading>
-          <CapHeading type="label7">{contentData.digest}</CapHeading>
+          <CapLabel type="label9">{contentData.digest}</CapLabel>
         </div>
       );
     }
     content.splice(1, 2).forEach((data) => {
       previewMsg.push(
         <div className="additional-richmedia-container">
-          <div><CapHeading type="label7" style={{width: '170px', top: '12px', position: 'relative'}}>{data.title}</CapHeading></div>
+          <div><CapLabel type="label9" style={{width: '170px', top: '12px', position: 'relative'}}>{data.title}</CapLabel></div>
           <img alt="default" width="34px" height="34px" src={data.image_url} />
         </div>
       );

package/v2Containers/CreativesContainer/index.js

@@ -137,13 +137,13 @@ class Creatives extends React.Component {
     const {isFullMode} = this.props;
     if (!isFullMode && templateData) { // for component mode
       const {channel} = templateData;
-      let creativesTeplateData = {type: channel };
+      let creativesTemplateData = {type: channel };
       switch (channel) {
         case constants.SMS: {
           const formData = {
             "sms-editor": templateData.messageBody,
           };
-          creativesTeplateData = {
+          creativesTemplateData = {
             type: channel,
             name: "Campaign message SMS content",
             versions: {
@@ -163,7 +163,7 @@ class Creatives extends React.Component {
             language: templateData.language,
             drag_drop_id: templateData.drag_drop_id,
           };
-          creativesTeplateData = {
+          creativesTemplateData = {
             base: formData,
             edit: true,
             type: channel,
@@ -171,7 +171,7 @@ class Creatives extends React.Component {
           break;
         }
         case constants.CALL_TASK: {
-          creativesTeplateData = {
+          creativesTemplateData = {
             subject: templateData.subject,
             messageBody: templateData.messageBody,
             description: templateData.description,
@@ -182,7 +182,7 @@ class Creatives extends React.Component {
         }
         case constants.MOBILE_PUSH: {
           const mode = get(templateData, 'androidContent.type') || get(templateData, 'iosContent.type');
-          creativesTeplateData = {
+          creativesTemplateData = {
             type: channel,
             name: templateData.messageSubject,
             versions: {
@@ -197,16 +197,18 @@ class Creatives extends React.Component {
         }
         case constants.WECHAT: {
           const messageBody = JSON.parse(templateData.messageBody);
-          creativesTeplateData = messageBody.data || {};
-          creativesTeplateData.type = channel;
-          creativesTeplateData._id = messageBody.template_id;
-          creativesTeplateData.isEditFromCampaigns = true;
+          creativesTemplateData = {
+            ...messageBody.data,
+            type: channel,
+            _id: messageBody.template_id,
+            isEditFromCampaigns: true,
+          };
           break;
         }
         default:
           break;
       }
-      return creativesTeplateData;
+      return creativesTemplateData;
     }
     return templateData || null;
   }
@@ -242,7 +244,7 @@ class Creatives extends React.Component {
             } );
             androidContent.custom = custom;
             templateData.androidContent = androidContent;
-            templateData.androidContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
+            templateData.androidContent.type = get(mobilpushTemplate, 'definition.mode', '').toUpperCase();
             templateData.androidContent.deviceType = 'ANDROID';
           }
           const iosContent = get(mobilpushTemplate, 'versions.base.IOS');
@@ -288,7 +290,6 @@ class Creatives extends React.Component {
   }
 
   getFormData = (template) => {
-    console.log("Inside getFormData", template);
     if (template.validity) {
       this.setState(
         {

package/v2Containers/TemplatesV2/index.js

@@ -102,7 +102,6 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
   );
 
   getTemplatesComponent(channel) {
-    console.log("getTemplatesComponent", channel);
     // const templates = this.props.Templates[`${channel}Templates`];
     let query = {};
     if (!this.props.isFullMode) {
@@ -128,7 +127,7 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
     />);
     }
   }
-  
+
   setChannelContent = (selectedChannel, argsPanes) => (
     argsPanes.map((pane) => {
       let content = null;
@@ -144,7 +143,6 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
   );
 
   channelChange = (selectedChannel) => {
-    console.log("channelChange", selectedChannel);
     const panes = this.setChannelContent(selectedChannel, this.state.panes);
     this.setState({panes, selectedChannel}, () => { if (!this.props.isFullMode) this.props.onChannelChange(selectedChannel); });
   }

package/v2Containers/WeChat/MapTemplates/index.js

@@ -165,6 +165,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
   }
 
   componentWillReceiveProps(nextProps) {
+    const { location } = this.props;
     if (nextProps.isGetFormData && !this.props.isFullMode && this.state.isEdit) {
       this.props.getFormData(this.getFormData());
     } else if (nextProps.isGetFormData && this.props.isGetFormData !== nextProps.isGetFormData && (this.props.isFullMode || !this.state.isEdit)) {
@@ -179,8 +180,8 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
         layout: 'WECHAT',
         type: 'TAG',
         version: 'v2', //gets initial schema when v2 is specified
-        context: this.props.location.query.type === 'embedded' ? this.props.location.query.module : 'default',
-        embedded: this.props.location.query.type === 'embedded' ? this.props.location.query.type : 'full',
+        context: location.query.type === 'embedded' ? location.query.module : 'default',
+        embedded: location.query.type === 'embedded' ? location.query.type : 'full',
       };
       if (this.props.getDefaultTags) { // handling dynamic tags in library mode, but handling static and synamic tags in email and sms.
         query.context = this.props.getDefaultTags;
@@ -196,7 +197,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
           this.setTemplateOptions(nextProps.WeChat.weChatDefaultTemplate);
         }
       }
-      if ((this.props.location.query.type === 'embedded' && (this.props.location.query.module === 'loyalty' || this.props.location.query.module === 'outbound')) && !isEmpty(nextProps.WeChat.templateDetails) && !isEqual(this.props.WeChat.templateDetails, this.state.editTemplateData) && this.isAccountChange === false) {
+      if ((location.query.type === 'embedded' && (location.query.module === 'loyalty' || location.query.module === 'outbound')) && !isEmpty(nextProps.WeChat.templateDetails) && !isEqual(this.props.WeChat.templateDetails, this.state.editTemplateData) && this.isAccountChange === false) {
         this.setState({editTemplateData: nextProps.WeChat.templateDetails}, () => {
           if ( !isEmpty(this.state.baseSchema)) {
             this.setEditData();
@@ -232,7 +233,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
       }
       //To do => Uncomment in loyalty mode
       // if (nextProps.location.query.type === 'embedded') {
-      //   if (this.props.location.query.module !== 'loyalty') {
+      //   if (location.query.module !== 'loyalty') {
       //     this.removeActionButtons();
       //   }
       // }
@@ -258,19 +259,19 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
       // const query = {
       //   layout: 'WECHAT',
       //   type: 'TAG',
-      //   context: this.props.location.query.type === 'embedded' ? this.props.location.query.module : 'default',
+      //   context: location.query.type === 'embedded' ? location.query.module : 'default',
       // };
       // this.props.globalActions.fetchSchemaForEntity(query);
-      if (this.props.location.query.type === 'embedded') {
+      if (location.query.type === 'embedded') {
         this.showNext();
       }
 
-      if (!this.fetchedWeCrmAccount && !isEmpty(this.props.WeChat.weCrmAccounts) && (this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty')) {
+      if (!this.fetchedWeCrmAccount && !isEmpty(this.props.WeChat.weCrmAccounts) && (location.query.type === 'embedded' && location.query.module === 'loyalty')) {
         this.injectEvents(this.state.schema);
         this.setWechatAccountOptions(nextProps.WeChat.weCrmAccounts);
         this.fetchedWeCrmAccount = true;
       }
-      if (!isEmpty(nextProps.WeChat.selectedWeChatAccount) && !isEqual(this.props.WeChat.selectedWeChatAccount, nextProps.WeChat.selectedWeChatAccount) && (this.props.location.query.type === 'embedded')) {
+      if (!isEmpty(nextProps.WeChat.selectedWeChatAccount) && !isEqual(this.props.WeChat.selectedWeChatAccount, nextProps.WeChat.selectedWeChatAccount) && (location.query.type === 'embedded')) {
         const params = {
           name: '',
           sortBy: 'Most Recent',
@@ -281,11 +282,11 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
         this.props.actions.getDefaultWeChatTemplates('wechat', params);
       }
 
-      if (isEmpty(nextProps.WeChat.selectedWeChatAccount) && (this.props.location.query.type === 'embedded')) {
+      if (isEmpty(nextProps.WeChat.selectedWeChatAccount) && (location.query.type === 'embedded')) {
         let selectedAccount = {};
         forEach(nextProps.WeChat.weCrmAccounts, (account) => {
           if (account.configs && account.configs.is_wecrm_enabled) {
-            if (account.sourceAccountIdentifier === this.props.location.query.source_account_id) {
+            if (account.sourceAccountIdentifier === location.query.source_account_id) {
               selectedAccount = account;
             }
           }
@@ -295,7 +296,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
         }
       }
 
-      // if (this.props.location.query.type.type === 'embedded' && this.props.location.query.module === 'loyalty' && this.state.formData['wechat-template'] !== '') {
+      // if (location.query.type.type === 'embedded' && location.query.module === 'loyalty' && this.state.formData['wechat-template'] !== '') {
       // }
       if (!nextProps.WeChat.fetchingDefaultTemplates && nextProps.location.query.module === 'outbound' && nextProps.params.id !== undefined) {
         this.setState({ isLoading: false});
@@ -785,7 +786,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
       //const {schema, baseSchema} = this.state;
       const schema = cloneDeep(this.state.schema);
       const baseSchema = cloneDeep(this.state.schema);
-      const baseSchemaTemplateOptionEmpty = (!isEmpty(baseSchema) && isEmpty(baseSchema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options));
+      const baseSchemaTemplateOptionEmpty = (!isEmpty(baseSchema) && isEmpty(get(baseSchema, 'standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options', [])));
       schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options = [];
       if (!isEmpty(baseSchema)) {
         baseSchema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options = [];

package/v2Containers/WeChat/RichmediaTemplates/Create/index.js

@@ -9,7 +9,6 @@ import PropTypes from 'prop-types';
 
 import React from 'react';
 import { connect } from 'react-redux';
-import Helmet from 'react-helmet';
 import { bindActionCreators } from 'redux';
 import { createStructuredSelector } from 'reselect';
 import { injectIntl, intlShape } from 'react-intl';
@@ -18,7 +17,7 @@ import cloneDeep from 'lodash/cloneDeep';
 import forEach from 'lodash/forEach';
 import isEqual from 'lodash/isEqual';
 import get from 'lodash/get';
-import { CapRow, CapColumn, CapButton, CapCard, CapSpin, CapInput, CapHeading, CapDivider, CapIcon, CapLink, CapNotification } from '@capillarytech/cap-ui-library';
+import { CapRow, CapColumn, CapButton, CapCard, CapSpin, CapInput, CapHeading, CapDivider, CapIcon, CapLink, CapNotification, CapLabel } from '@capillarytech/cap-ui-library';
 import makeSelectCreate, {makeSelectTemplates, getAssetDetails, getContentAssetDetails} from './selectors';
 import * as actions from './actions';
 import richmediaschema from './richmediaschema';
@@ -727,7 +726,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
                   {totalContentBlocks === 1 &&
                   <div className="custom-card">
                     <CapHeading type="h4" className="overflow-wrap-fields">{formData['title-value'] || "Title"}</CapHeading>
-                    <CapHeading type="label7" className="overflow-wrap-fields">{formData['cover-abstract-value'] || "Cover abstract"}</CapHeading>
+                    <CapLabel type="label9" className="overflow-wrap-fields">{formData['cover-abstract-value'] || "Cover abstract"}</CapLabel>
                   </div>
                 }
                 </div>
@@ -746,7 +745,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
             >
               <div className="richmedia-card-container">
                 <CapColumn span={18} className="overflow-wrap-fields title" >
-                  <CapHeading type="label7">{formData['title-value'] || "Title"}</CapHeading>
+                  <CapLabel type="label9">{formData['title-value'] || "Title"}</CapLabel>
                 </CapColumn>
                 <CapColumn span={6} className="image">
                   <img alt="" width="40px" height="40px" src={imageUrl} />

package/containers/Cap/messsages.js

@@ -1,63 +0,0 @@
-import { defineMessages } from 'react-intl';
-export default defineMessages({
-  "sms": {
-    id: 'reon.components.Cap.sms',
-    defaultMessage: 'SMS',
-  },
-  "wechat": {
-    id: 'reon.components.Cap.wechat',
-    defaultMessage: 'WeChat',
-  },
-  "gallery": {
-    id: 'reon.components.Cap.gallery',
-    defaultMessage: 'Gallery',
-  },
-  "creativesDashboard": {
-    id: 'reon.components.Cap.creativesDashboard',
-    defaultMessage: 'Creatives',
-  },
-  "creatives": {
-    id: 'reon.components.Cap.creatives',
-    defaultMessage: 'Creatives',
-  },
-  "campaigns": {
-    id: 'reon.components.Cap.campaigns',
-    defaultMessage: 'Campaigns',
-  },
-  "loyalty": {
-    id: 'reon.components.Cap.loyalty',
-    defaultMessage: 'Loyalty',
-  },
-  "member care": {
-    id: 'reon.components.Cap.memberCare',
-    defaultMessage: 'Member Care',
-  },
-  "workbench": {
-    id: 'reon.components.Cap.Workbench',
-    defaultMessage: 'WorkBench',
-  },
-  "store care": {
-    id: 'reon.components.Cap.storeCare',
-    defaultMessage: 'Store Care',
-  },
-  "store performance": {
-    id: 'reon.components.Cap.storePerformance',
-    defaultMessage: 'Store Performance',
-  },
-  "email": {
-    id: 'reon.components.Cap.email',
-    defaultMessage: 'Email',
-  },
-  "ebill": {
-    id: 'reon.components.Cap.ebill',
-    defaultMessage: 'Ebill',
-  },
-  "campaignsDashboard": {
-    id: 'reon.components.campaignsDashboard',
-    defaultMessage: 'Campaigns',
-  },
-  "campaignsHome": {
-    id: 'reon.components.campaignsHome',
-    defaultMessage: "Campaigns Home",
-  },
-});

package/v2Components/Header/index.js

@@ -1,46 +0,0 @@
-/**
-*
-* Header
-*
-*/
-
-import PropTypes from 'prop-types';
-
-import React from 'react';
-// import styled from 'styled-components';
-import { FormattedMessage } from 'react-intl';
-
-import { CapRow, CapColumn, CapInput, CapButton } from '@capillarytech/cap-ui-library';
-import messages from './messages';
-
-
-function Header(props) {
-  return (
-    <div>
-      <CapRow className="template-form-header">
-        <CapColumn span={10}>
-          <CapInput id="template-name" placeholder="Enter template name*" defaultValue={props.templateName} type="input" onChange={props.templateNameHandler}/>
-        </CapColumn>
-        <CapColumn span={2} offset={8}>
-          <CapButton id="preview-button" type="cancel" onClick={props.previewHandler}> <FormattedMessage {...messages.preview} /> </CapButton>
-        </CapColumn>
-        <CapColumn span={2}>
-          <CapButton id="cancel-button" type="cancel" onClick={props.cancelHandler}> <FormattedMessage {...messages.cancel} /> </CapButton>
-        </CapColumn>
-        <CapColumn span={2}>
-          <CapButton id="save-button" type="primary" onClick={props.saveHandler}> <FormattedMessage {...messages.save} /> </CapButton>
-        </CapColumn>
-      </CapRow>
-    </div>
-  );
-}
-
-Header.propTypes = {
-  templateNameHandler: PropTypes.func,
-  previewHandler: PropTypes.func,
-  cancelHandler: PropTypes.func,
-  saveHandler: PropTypes.func,
-  templateName: PropTypes.string,
-};
-
-export default Header;

package/v2Components/Header/tests/index.test.js

@@ -1,10 +0,0 @@
-// import React from 'react';
-// import { shallow } from 'enzyme';
-
-// import Header from '../index';
-
-describe('<Header />', () => {
-  it('Expect to have unit tests specified', () => {
-    expect(true).toEqual(false);
-  });
-});