@capillarytech/creatives-library 3.0.35 → 3.1.0

package/v2Containers/Cap/messsages.js

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

package/v2Containers/Cap/sagas.js

@@ -6,7 +6,6 @@ import * as LocalStorage from '../../services/localStorageApi';
 import * as types from './constants';
 import config from '../../config/app';
 import pathConfig from '../../config/path';
-import { getTopbarMenuDataValue } from '../../v2Containers/App/constants';
 // import {makeSelectOrgId} from './selectors';
 
 function* authorize(user) {
@@ -158,3 +157,11 @@ export default [
   watchGetTopbarMenuData,
 ];
 
+function getTopbarMenuDataValue() {
+  return [
+    { label: 'Campaigns', link: '/campaigns/ui/list', key: 'campaigns' },
+    { label: 'Audience', link: '/audience-manager/list', key: 'audience' },
+    { label: 'Incentive', link: '/coupons/ui/', key: 'incentive' },
+    { label: 'Creatives', link: '/creatives/ui/v2', key: 'creatives' },
+  ];
+}

package/v2Containers/ChannelTemplates/messages.js

@@ -7,7 +7,7 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'creatives.containersV2.ChannelTemplates.header',
+    id: 'app.containers.ChannelTemplates.header',
     defaultMessage: 'This is ChannelTemplates container !',
   },
 });

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -11,6 +11,8 @@ import EmailWrapper from '../EmailWrapper';
 import MobilepushWrapper from '../MobilepushWrapper';
 import EmailPreviewV2 from '../../v2Components/EmailPreviewV2';
 import MobilePushPreview from '../../v2Components/MobilePushPreviewV2';
+import WechatWrapper from '../WeChat/Wrapper';
+import { RICH_MEDIA, MAP_TEMPLATE, CREATE } from '../WeChat/Wrapper/constants';
 import CallTask from '../CallTask';
 import MobliPushEdit from '../MobilePush/Edit';
 import * as constants from './constants';
@@ -21,6 +23,13 @@ const CreativesWrapper = styled.div`
     z-index: 10003;
   }
 `;
+
+function getWechatTemplateType(mode, templateData, weChatTemplateType = '') {
+  if (mode !== CREATE) {
+    return get(templateData, 'definition.msgcontent', '') === "RICH_MEDIA_WECHAT" ? RICH_MEDIA : MAP_TEMPLATE;
+  }
+  return weChatTemplateType;
+}
 function SlideBoxContent(props) {
   const {
       slidBoxContent,
@@ -51,9 +60,14 @@ function SlideBoxContent(props) {
       onValidationFail,
       channelsToHide,
       forwardedTags,
+      weChatTemplateType,
+      onWechatTemplateChange,
+      selectedWeChatAccount,
+      weChatMaptemplateStep,
+      onWeChatMaptemplateStepChange,
     } = props;
   const type = messageDetails.type.toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
-  const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'defualt' : 'library'};
+  const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library'};
   const creativesLocationProps = {
     pathname: `/sms/edit`,
     query,
@@ -126,6 +140,27 @@ function SlideBoxContent(props) {
           forwardedTags={forwardedTags}
         />
       )}
+      {isMpushPreview &&
+        <MobilePushPreview templateData={templateData} channel={channel}/>
+      }
+      {
+        (currentChannel === constants.WECHAT && !!slidBoxContent) && <WechatWrapper
+          mode={slidBoxContent}
+          templateData={templateData}
+          templateType={getWechatTemplateType(slidBoxContent, templateData, weChatTemplateType)}
+          onWechatTemplateChange={onWechatTemplateChange}
+          templateStep={templateStep}
+          query={query}
+          selectedWeChatAccount={selectedWeChatAccount}
+          isGetFormData={isGetFormData}
+          getFormData={getFormData}
+          isFullMode={isFullMode}
+          onValidationFail={onValidationFail}
+          onWeChatMaptemplateStepChange={onWeChatMaptemplateStepChange}
+          weChatMaptemplateStep={weChatMaptemplateStep}
+          forwardedTags={forwardedTags}
+        />
+      }
       {isEditSms && (
         <SmsEdit
           setIsLoadingContent={setIsLoadingContent}
@@ -287,5 +322,8 @@ SlideBoxContent.propTypes = {
   onValidationFail: PropTypes.func,
   channelsToHide: PropTypes.array,
   forwardedTags: PropTypes.object,
+  weChatTemplateType: PropTypes.string,
+  onWechatTemplateChange: PropTypes.func,
+  selectedWeChatAccount: PropTypes.object,
 };
 export default SlideBoxContent;

package/v2Containers/CreativesContainer/SlideBoxFooter.js

@@ -3,6 +3,12 @@ import { FormattedMessage } from 'react-intl';
 import { CapButton } from '@capillarytech/cap-ui-library';
 import PropTypes from 'prop-types';
 import messages from './messages';
+function getFullModeSaveBtn(slidBoxContent) {
+  return slidBoxContent === "editTemplate" ?
+    <FormattedMessage {...messages.creativesTemplatesUpdate}/>
+    :
+    <FormattedMessage {...messages.creativesTemplatesSaveFullMode}/>;
+}
 function SlideBoxFooter(props) {
   const { slidBoxContent, onSave, onEditTemplate, onCreateNextStep, isFullMode} = props;
   return (
@@ -12,7 +18,7 @@ function SlideBoxFooter(props) {
           <div>
             <CapButton onClick={onSave}>
               {isFullMode ?
-                <FormattedMessage {...messages.creativesTemplatesSaveFullMode}/>
+                getFullModeSaveBtn(slidBoxContent)
               :
                 <FormattedMessage {...messages.creativesTemplatesSave} />
               }

package/v2Containers/CreativesContainer/SlideBoxHeader.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import styled from 'styled-components';
 import { FormattedMessage } from 'react-intl';
-import { CapHeader, CapIcons, CapLabel } from '@capillarytech/cap-ui-library';
+import { CapHeader, CapIcons, CapLabel, CapSteps } from '@capillarytech/cap-ui-library';
 import moment from 'moment';
 import PropTypes from 'prop-types';
 import messages from './messages';
+import { MAP_TEMPLATE } from '../WeChat/Wrapper/constants';
 const PrefixWrapper = styled.div`
   margin-right: 16px;
 `;
@@ -13,11 +14,12 @@ function getChannelLabel(channel) {
     sms: 'SMS',
     email: 'Email',
     mobilepush: 'Push notification',
+    wechat: 'Wechat',
   };
   return labels[channel.toLowerCase()];
 }
 function SlideBoxHeader(props) {
-  const { slidBoxContent, templateData, onShowTemplates, creativesMode, isFullMode, showPrefix, shouldShowTemplateName, channel, templateNameRenderProp } = props;
+  const { slidBoxContent, templateData, onShowTemplates, creativesMode, isFullMode, showPrefix, shouldShowTemplateName, channel, templateNameRenderProp, weChatTemplateType, onWeChatMaptemplateStepChange, weChatMaptemplateStep, templateStep } = props;
   const showTemplateNameHeader = isFullMode && shouldShowTemplateName;
   return (
     <div key="creatives-container-slidebox-header-content">
@@ -53,7 +55,7 @@ function SlideBoxHeader(props) {
             }
           />
         )}
-      {!showTemplateNameHeader && slidBoxContent === 'createTemplate' && (
+      {!showTemplateNameHeader && slidBoxContent === 'createTemplate' && ( templateStep === 'modeSelection' || templateStep === "createTemplateContent" ) && (
       <CapHeader
         title={<FormattedMessage {...messages.createMessageContent} values={{channel: getChannelLabel(channel)}}/>}
         prefix={!isFullMode && showPrefix &&
@@ -63,6 +65,22 @@ function SlideBoxHeader(props) {
             }
           />
         )}
+      {!showTemplateNameHeader && slidBoxContent === 'createTemplate' && weChatTemplateType === MAP_TEMPLATE && templateStep !== 'modeSelection' && (
+        <CapSteps
+          onChange={onWeChatMaptemplateStepChange}
+          current={weChatMaptemplateStep}
+          size="small"
+          className="wechat-steps"
+        >
+          <CapSteps.CapStep
+            title={<CapLabel type="label8">Select template</CapLabel>}
+          />
+          <CapSteps.CapStep
+            title={<CapLabel type="label8">Add content</CapLabel>}
+            disabled
+          />
+        </CapSteps>
+        )}
     </div>
   );
 }

package/v2Containers/CreativesContainer/index.js

@@ -43,10 +43,12 @@ class Creatives extends React.Component {
       isLoadingContent: true,
       templateStep: 1, //modeSelection: for template name and (for email selecting upload or editor), and createTemplate to create template create based on modeSelection
       showSlideBox: true,
-      slidBoxContent: this.getSlideBocContent({mode: props.creativesMode, templateData: props.templateData, isFullMode: props.isFullMode}),
+      slidBoxContent: this.getSlideBoxContent({mode: props.creativesMode, templateData: props.templateData, isFullMode: props.isFullMode}),
       templateData: this.getTemplateData(props.templateData),
       templateNameExists: props.creativesMode === 'edit', // if edit mode templateNameExists will be true, and false in create flow.
       currentChannel: this.props.channel || 'sms',
+      weChatTemplateType: '',
+      weChatMaptemplateStep: 0,
     };
     this.creativesTemplateSteps = {
       1: 'modeSelection',
@@ -55,10 +57,10 @@ class Creatives extends React.Component {
     };
   }
   componentWillUnmount() {
-    if (!this.props.isFullMode) {
+    if (get(this.props, 'location.query.type', '') === "embedded") {
       this.props.templateActions.resetTemplateStoreData();
-      this.props.globalActions.clearMetaEntities();
     }
+    this.props.globalActions.clearMetaEntities();
   }
 
   onEnterTemplateName = () => {
@@ -97,7 +99,7 @@ class Creatives extends React.Component {
     this.setState((prevState) => {
       let templateStep = prevState.templateStep + 1;
       const {emailCreateMode, currentChannel} = prevState;
-      if ((currentChannel.toUpperCase() === constants.EMAIL && emailCreateMode === "upload") || currentChannel.toUpperCase() === constants.MOBILE_PUSH) {
+      if ((currentChannel.toUpperCase() === constants.EMAIL && emailCreateMode === "upload") || currentChannel.toUpperCase() === constants.MOBILE_PUSH || currentChannel.toUpperCase() === constants.WECHAT) {
         templateStep = prevState.templateStep + 2;
       }
 
@@ -113,6 +115,13 @@ class Creatives extends React.Component {
   onMobilepushModeChange = (mode) => {
     this.setState({ mobilePushCreateMode: mode});
   }
+  onWechatTemplateChange = (templateType) => {
+    this.setState( { weChatTemplateType: templateType});
+  }
+
+  onWeChatMaptemplateStepChange = (step) => {
+    this.setState({weChatMaptemplateStep: step});
+  }
 
   onCallTaskSubmit = (data) => {
     this.props.getCreativesData({
@@ -185,50 +194,67 @@ class Creatives extends React.Component {
 
   getCreativesData = (channel, template) => { //from creatives to consumers
     let templateData = {channel };
-    if (channel === constants.SMS && template.value.base) {
-      templateData.messageBody = template.value.base['sms-editor'];
-    } else if (channel === constants.EMAIL && template.value.base) {
-      const emailBase = template.value.base;
-      templateData = {...templateData, ...emailBase, emailBody: emailBase.html_content, emailSubject: emailBase.subject};
-      delete templateData.html_content;
-      delete templateData.subject;
-    } else if (channel === constants.MOBILE_PUSH && get(template, "value.versions.base")) {
-      const mobilpushTemplate = template.value;
-      templateData.accountId = get(mobilpushTemplate, 'definition.accountId');
-      const androidContent = get(mobilpushTemplate, 'versions.base.ANDROID');
-      if (!isEmpty(androidContent)) {
-        delete androidContent.cuid;
-        delete androidContent.luid;
-        delete androidContent.communicationId;
-        const custom = {};
-        forEach(androidContent.custom, (customKeyValue) => {
-          custom[customKeyValue.key] = customKeyValue.value;
-        } );
-        androidContent.custom = custom;
-        templateData.androidContent = androidContent;
-        templateData.androidContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
-        templateData.androidContent.deviceType = 'ANDROID';
-      }
-      const iosContent = get(mobilpushTemplate, 'versions.base.IOS');
-      if (!isEmpty(iosContent)) {
-        delete iosContent.cuid;
-        delete iosContent.luid;
-        delete iosContent.communicationId;
-        const custom = {};
-        forEach(iosContent.custom, (customKeyValue) => {
-          custom[customKeyValue.key] = customKeyValue.value;
-        } );
-        iosContent.custom = custom;
-        templateData.iosContent = iosContent;
-        templateData.iosContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
-        templateData.iosContent.deviceType = 'IOS';
-      }
-      templateData.messageSubject = mobilpushTemplate.name ? mobilpushTemplate.name : "messageSubject";
+    switch (channel) {
+      case constants.SMS:
+        if (template.value.base) {
+          templateData.messageBody = template.value.base['sms-editor'];
+        }
+        break;
+      case constants.EMAIL:
+        if (template.value.base) {
+          const emailBase = template.value.base;
+          templateData = {...templateData, ...emailBase, emailBody: emailBase.html_content, emailSubject: emailBase.subject};
+          delete templateData.html_content;
+          delete templateData.subject;
+        }
+        break;
+      case constants.MOBILE_PUSH:
+        if (get(template, "value.versions.base")) {
+          const mobilpushTemplate = template.value;
+          templateData.accountId = get(mobilpushTemplate, 'definition.accountId');
+          const androidContent = get(mobilpushTemplate, 'versions.base.ANDROID');
+          if (!isEmpty(androidContent)) {
+            delete androidContent.cuid;
+            delete androidContent.luid;
+            delete androidContent.communicationId;
+            const custom = {};
+            forEach(androidContent.custom, (customKeyValue) => {
+              custom[customKeyValue.key] = customKeyValue.value;
+            } );
+            androidContent.custom = custom;
+            templateData.androidContent = androidContent;
+            templateData.androidContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
+            templateData.androidContent.deviceType = 'ANDROID';
+          }
+          const iosContent = get(mobilpushTemplate, 'versions.base.IOS');
+          if (!isEmpty(iosContent)) {
+            delete iosContent.cuid;
+            delete iosContent.luid;
+            delete iosContent.communicationId;
+            const custom = {};
+            forEach(iosContent.custom, (customKeyValue) => {
+              custom[customKeyValue.key] = customKeyValue.value;
+            } );
+            iosContent.custom = custom;
+            templateData.iosContent = iosContent;
+            templateData.iosContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
+            templateData.iosContent.deviceType = 'IOS';
+          }
+          templateData.messageSubject = mobilpushTemplate.name ? mobilpushTemplate.name : "messageSubject";
+        }
+        break;
+      case constants.WECHAT:
+        if (template.value) {
+          const { accountId, previewContent, ...messageBody } = template.value;
+          templateData = { channel, accountId, messageBody: JSON.stringify(messageBody), previewContent};
+        }
+        break;
+      default:
+        break;
     }
     return templateData;
   };
-
-  getSlideBocContent({mode, templateData, isFullMode}) {
+  getSlideBoxContent({mode, templateData, isFullMode}) {
     let creativesMode = isFullMode ? 'createTemplate' : 'templates';// for library mode templates page is initial mode and for full mode createTemplates
     if (mode === 'create' && isFullMode) {
       creativesMode = 'createTemplate';
@@ -243,6 +269,7 @@ class Creatives extends React.Component {
   }
 
   getFormData = (template) => {
+    console.log("Inside getFormData", template);
     if (template.validity) {
       this.setState(
         {
@@ -288,7 +315,7 @@ class Creatives extends React.Component {
   }
   shouldShowFooter = () => {
     const {isFullMode } = this.props;
-    const {slidBoxContent, currentChannel, emailCreateMode, templateNameExists, templateStep, mobilePushCreateMode} = this.state;
+    const {slidBoxContent, currentChannel, emailCreateMode, templateNameExists, templateStep, mobilePushCreateMode, weChatTemplateType} = this.state;
     const channel = currentChannel.toUpperCase();
     const currentStep = this.creativesTemplateSteps[templateStep];
     let showFooter = false;
@@ -322,6 +349,12 @@ class Creatives extends React.Component {
       showFooter = true;
     }
 
+    if (channel === constants.WECHAT &&
+      ((slidBoxContent === 'createTemplate' && !isEmpty(weChatTemplateType))
+      || (slidBoxContent === 'editTemplate' && currentStep === 'modeSelection'))) {
+      showFooter = true;
+    }
+
 
     if (showFooter) {
       if (slidBoxContent === "createTemplate" && ((channel === constants.EMAIL && currentStep === 'createTemplateContent') || (channel === constants.SMS && currentStep === 'modeSelection'))) {
@@ -340,7 +373,7 @@ class Creatives extends React.Component {
     if (channel === constants.EMAIL || channel === constants.SMS) {
       const isEmailCreate = slidBoxContent === 'createTemplate' && currentChannel.toUpperCase() === constants.EMAIL && currentStep !== 'createTemplateContent';
       showDone = (slidBoxContent === 'editTemplate' || slidBoxContent === 'createTemplate') && !isEmailCreate;
-    } else if (channel === constants.MOBILE_PUSH) {
+    } else if (channel === constants.MOBILE_PUSH || channel === constants.WECHAT) {
       showDone = currentStep === "createTemplateContent" || slidBoxContent === "editTemplate";
     }
 
@@ -379,7 +412,7 @@ class Creatives extends React.Component {
     }
   }
   shouldShowContinueFooter = () => { // only for email for now, has to be modified according to channel
-    const {slidBoxContent, templateStep, currentChannel, emailCreateMode, mobilePushCreateMode} = this.state;
+    const {slidBoxContent, templateStep, currentChannel, emailCreateMode, mobilePushCreateMode, weChatTemplateType} = this.state;
     let isShowContinueFooter = false;
     const currentStep = this.creativesTemplateSteps[templateStep];
     const channel = currentChannel.toUpperCase();
@@ -391,6 +424,8 @@ class Creatives extends React.Component {
       }
     } else if (currentChannel.toUpperCase() === constants.MOBILE_PUSH) {
       isShowContinueFooter = !isEmpty(mobilePushCreateMode) && currentStep === "modeSelection";
+    } else if (currentChannel.toUpperCase() === constants.WECHAT) {
+      isShowContinueFooter = !isEmpty(weChatTemplateType) && currentStep === "modeSelection";
     }
 
     return isShowContinueFooter;
@@ -407,8 +442,8 @@ class Creatives extends React.Component {
     return false;
   }
   render() {
-    const {slidBoxContent, isGetFormData, showSlideBox, templateData, currentChannel, emailCreateMode, templateStep, isLoadingContent, mobilePushCreateMode, isDiscardMessage} = this.state;
-    const {isFullMode, creativesMode, cap, isUploading, channelsToHide, forwardedTags} = this.props;
+    const {slidBoxContent, isGetFormData, showSlideBox, templateData, currentChannel, emailCreateMode, templateStep, isLoadingContent, mobilePushCreateMode, isDiscardMessage, weChatTemplateType, weChatMaptemplateStep, forwardedTags} = this.state;
+    const {isFullMode, creativesMode, cap, isUploading, channelsToHide, selectedWeChatAccount} = this.props;
     return (
       <SlideBoxWrapper className={classnames(`${classPrefix} ${isFullMode ? 'creatives-full-mode' : 'creatives-library-mode'}`)}>
         <CapSlideBox
@@ -425,7 +460,11 @@ class Creatives extends React.Component {
               isLoadingContent={isLoadingContent}
               shouldShowTemplateName={this.templateContainerDetails}
               templateNameRenderProp={this.templateNameRenderProp}
+              weChatMaptemplateStep={weChatMaptemplateStep}
+              onWeChatMaptemplateStepChange={this.onWeChatMaptemplateStepChange}
+              weChatTemplateType={weChatTemplateType}
               showPrefix={!isUploading} // not show back button when email template is being uploaded
+              templateStep={this.creativesTemplateSteps[templateStep]}
             />
           }
           content={
@@ -460,6 +499,11 @@ class Creatives extends React.Component {
               onValidationFail={this.onValidationFail}
               channelsToHide={channelsToHide}
               forwardedTags={forwardedTags}
+              weChatTemplateType={weChatTemplateType}
+              onWechatTemplateChange={this.onWechatTemplateChange}
+              weChatMaptemplateStep={weChatMaptemplateStep}
+              selectedWeChatAccount={selectedWeChatAccount}
+              onWeChatMaptemplateStepChange={this.onWeChatMaptemplateStepChange}
             />
           }
           footer={this.shouldShowFooter() &&
@@ -506,6 +550,7 @@ Creatives.propTypes = {
   EmailLayout: PropTypes.string,
   channelsToHide: PropTypes.array,
   forwardedTags: PropTypes.object,
+  selectedWeChatAccount: PropTypes.object,
 };
 const mapStatesToProps = () => createStructuredSelector({
   isLoading: isLoadingSelector(),

package/v2Containers/CreativesContainer/index.scss

@@ -24,4 +24,19 @@ $classPrefix: add-creatives-section;
             width: 100%;
         }
     }
+    .slidebox-header div:first-child {
+        width: 100%;
+    }
+    .wechat-steps {
+        width: 40% !important;
+        left: 20%;
+        position: relative;
+        .ant-steps-item-title::after {
+            top: 8px;
+        }
+        .ant-steps-item-content {
+            vertical-align: middle;
+            padding-top: 4px;
+        }
+    }
 }

package/v2Containers/CreativesContainer/messages.js

@@ -4,22 +4,22 @@
  * This contains all the text for the EmailWrapper component.
  */
 import { defineMessages } from 'react-intl';
-const scope = 'creatives.containersV2.Creatives';
+const scope = 'app.containers.Creatives';
 export default defineMessages({
   "header": {
-    id: 'creatives.containersV2.Creatives.header',
+    id: 'app.containers.Creatives.header',
     defaultMessage: 'This is EmailWrapper container !',
   },
   "continue": {
-    id: 'creatives.containersV2.Creatives.continue',
+    id: 'app.containers.Creatives.continue',
     defaultMessage: 'Continue',
   },
   "lastUpdated": {
-    id: 'creatives.containersV2.Creatives.lastUpdated',
+    id: 'app.containers.Creatives.lastUpdated',
     defaultMessage: 'Last updated: {date} by {user}',
   },
   "by": {
-    id: 'creatives.containersV2.Creatives.by',
+    id: 'app.containers.Creatives.by',
     defaultMessage: 'by',
   },
   "uploadedAt": {
@@ -259,7 +259,7 @@ export default defineMessages({
     defaultMessage: `Edit message content`,
   },
   "createMessageContent": {
-    id: `${scope}.createMessageContent`,
+    id: `${scope}.editMessageContent`,
     defaultMessage: `New {channel} message`,
   },
   "creativeTemplatesDesc": {
@@ -274,28 +274,24 @@ export default defineMessages({
     id: `${scope}.creativesTemplatesSaveFullMode`,
     defaultMessage: `Create`,
   },
+  "creativesTemplatesUpdate": {
+    id: `${scope}.creativesTemplatesUpdate`,
+    defaultMessage: `Update`,
+  },
   "creativesTemplatesDiscard": {
     id: `${scope}.creativesTemplatesDiscard`,
     defaultMessage: `Discard`,
   },
   "creativesTemplatesEdit": {
-    id: `${scope}.creativesTemplatesEdit`,
+    id: `${scope}.creativesTemplatesSave`,
     defaultMessage: `Edit`,
   },
   "creativesTemplatesEditName": {
-    id: `${scope}.creativesTemplatesEditName`,
+    id: `${scope}.creativesTemplatesSave`,
     defaultMessage: `Edit name`,
   },
   "wechatAccountNotConfigured": {
     id: `${scope}.wechatAccountNotConfigured`,
     defaultMessage: 'Selected wechat account is not configured to create wechat templates',
   },
-  "selectTemplate": {
-    id: `${scope}.selectTemplate`,
-    defaultMessage: 'Select template',
-  },
-  "addContent": {
-    id: `${scope}.addContent`,
-    defaultMessage: 'Add content',
-  },
 });

package/v2Containers/Dashboard/index.js

@@ -7,7 +7,6 @@ import { FormattedMessage } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import makeSelectDashboard from './selectors';
 import messages from './messages';
-// eslint-disable-next-line
 import { UserIsAuthenticated } from '../../../utils/authWrapper';
 import * as actions from './actions';
 import BreadCrumbs from '../../v2Components/BreadCrumbs/index';
@@ -25,7 +24,7 @@ export class Dashboard extends React.Component { // eslint-disable-line react/pr
         <FormattedMessage {...messages.header}>{(message) => (<Helmet
           title={message}
           meta={[
-            { name: 'description', content: <FormattedMessage {...messages.header}/> },
+            { name: 'description', content: 'Dashboard' },
           ]}
         />)}
         </FormattedMessage>

package/v2Containers/Dashboard/messages.js

@@ -7,7 +7,7 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'creatives.containersV2.Dashboard.header',
+    id: 'app.containers.Dashboard.header',
     defaultMessage: 'Dashboard',
   },
 });

package/v2Containers/Ebill/index.js

@@ -814,7 +814,7 @@ export class Ebill extends React.Component { // eslint-disable-line react/prefer
       console.log('isValid');
       return true;
     }
-    const message = getMessageObject('error', this.props.intl.formatMessage(messages.templateDataNotValid), true);
+    const message = getMessageObject('error', 'Template data is not valid', true);
     this.props.globalActions.addMessageToQueue(message);
     console.log('not valid');
     return false;