@capillarytech/creatives-library 3.1.3 → 3.1.5

package/components/SmsTest/index.js

@@ -9,6 +9,8 @@ import React from 'react';
 
 // import { FormattedMessage } from 'react-intl';
 // import messages from './messages';
+import { injectIntl, intlShape } from 'react-intl';
+import messages from './messages';
 import FormBuilder from '../FormBuilder';
 
 class SmsTest extends React.Component { // eslint-disable-line react/prefer-stateless-function
@@ -46,7 +48,7 @@ class SmsTest extends React.Component { // eslint-disable-line react/prefer-stat
           metaType: "text",
           datatype: "string",
           required: true,
-          placeholder: "Please input template name.",
+          placeholder: this.props.intl.formatMessage(messages.inputTemplateName),
           fluid: true,
           styling: "semantic",
           order: 1,
@@ -62,7 +64,7 @@ class SmsTest extends React.Component { // eslint-disable-line react/prefer-stat
           metaType: "text",
           datatype: "string",
           required: true,
-          placeholder: "Please input sms template content.",
+          placeholder: this.props.intl.formatMessage(messages.inputSmsTemplate),
           fluid: false,
           styling: "custom",
           order: 2,
@@ -109,7 +111,7 @@ class SmsTest extends React.Component { // eslint-disable-line react/prefer-stat
 }
 
 SmsTest.propTypes = {
-
+  intl: intlShape.isRequired,
 };
 
-export default SmsTest;
+export default injectIntl(SmsTest);

package/components/SmsTest/messages.js

@@ -7,7 +7,15 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'app.components.SmsTest.header',
+    id: 'creatives.components.SmsTest.header',
     defaultMessage: 'This is the SmsTest component !',
   },
+  inputTemplateName: {
+    id: 'creatives.components.SmsTest.inputTemplateName',
+    defaultMessage: 'Please input template name.',
+  },
+  inputSmsTemplate: {
+    id: 'creatives.components.SmsTest.inputSmsTemplate',
+    defaultMessage: 'Please input sms template content.',
+  },
 });

package/components/TemplatePreview/WechatRichmediaTemplatePreview/messages.js

@@ -7,15 +7,15 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'app.components.WechatRichmediaTemplatePreview.header',
+    id: 'creatives.components.WechatRichmediaTemplatePreview.header',
     defaultMessage: 'This is the WechatRichmediaTemplatePreview component !',
   },
   select: {
-    id: 'app.components.WechatRichmediaTemplatePreview.select',
+    id: 'creatives.components.WechatRichmediaTemplatePreview.select',
     defaultMessage: 'Select',
   },
   edit: {
-    id: 'app.components.WechatRichmediaTemplatePreview.edit',
+    id: 'creatives.components.WechatRichmediaTemplatePreview.edit',
     defaultMessage: 'Edit',
   },
 });

package/components/TemplatePreview/index.js

@@ -55,9 +55,9 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
       <div className={`preview-container ${type === 'embedded' ? 'embedded-preview' : ''}`}>
         { channel && channel.toLowerCase() === 'sms' &&
           <div className="shell align-center" id="sms-preview">
-            <img className="preview-image sms" src={smsBody} alt="Preview is being generated"/>
+            <img className="preview-image sms" src={smsBody} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
             <div className="msgContainer sms">
-              <img className="sms-icon" src={smsIcon} alt="Sms icon" />
+              <img className="sms-icon" src={smsIcon} alt={this.props.intl.formatMessage(messages.smsIcon)} />
               <div className={"message-pop sms"}>
                 {content && content.length && content.map((msg) =>
                   <CapColumn className="message-pop-item align-left" style={{ background: '#3F51B5', color: '#ffffff'}}>
@@ -70,9 +70,9 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
         }
         {channel && channel.toLowerCase() === 'wechat' ?
           ( <div className="shell align-center" id="sms-preview">
-            <img className="preview-image" src={channel.toLowerCase() === 'wechat' ? wechatBody : smsBody} alt="Preview is being generated"/>
+            <img className="preview-image" src={channel.toLowerCase() === 'wechat' ? wechatBody : smsBody} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
             <div className="msgContainer">
-              {this.props.channel.toLowerCase() === 'wechat' ? <div className="sms-icon" style={{ width: '25px', height: '25px', background: '#2E89DF' }}></div> : <img className="sms-icon" src={smsIcon} alt="Sms icon" />}
+              {this.props.channel.toLowerCase() === 'wechat' ? <div className="sms-icon" style={{ width: '25px', height: '25px', background: '#2E89DF' }}></div> : <img className="sms-icon" src={smsIcon} alt={this.props.intl.formatMessage(messages.smsIcon)} />}
               <div className="message-pop align-left" style={{ background: `${this.props.channel.toLowerCase() === 'wechat' ? '#ffffff' : '#3F51B5'}`, color: `${this.props.channel.toLowerCase() === 'wechat' ? '#333333' : '#ffffff'}`}}>{content}
               </div>
             </div>
@@ -81,7 +81,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
         }
         { channel && (channel.toLowerCase() === 'mobilepush') &&
           (<div className="shell align-center" id="mobilepush-preview">
-            <img className="preview-image" src={this.props.device === "android" ? androidPushMessagePhone : iPhonePushMessagePhone} alt="Preview is being generated"/>
+            <img className="preview-image" src={this.props.device === "android" ? androidPushMessagePhone : iPhonePushMessagePhone} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
               {(!!content.header || !!content.bodyText || !!content.bodyImage) &&
                 <div className={`${this.props.device}-push-message-Container`}>
                   {this.props.device === "android" ?
@@ -109,7 +109,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
                     :
                     <div className="message-pop align-left">
                       <div className="app-name">
-                        <span className="app-icon"></span>{content.appName ? content.appName : "App name"} <i className="material-icons">close</i>
+                        <span className="app-icon"></span>{content.appName ? content.appName : "App name"} <i className="material-icons">{this.props.intl.formatMessage(messages.close)}</i>
                       </div>
                       {content.bodyImage && <div className="body-image">
                         <img src={content.bodyImage} alt=""/>
@@ -131,7 +131,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
         {
           channel && channel.toLowerCase() === 'line' ? (
             <div className="shell align-center" id="sms-preview">
-              <img className="preview-image" src={wechatBody} alt="Preview is being generated"/>
+              <img className="preview-image" src={wechatBody} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
               <div className="msgContainer">
                 <div className="sms-icon" style={{ width: '25px', height: '25px', background: '#2E89DF' }}></div>
                 <div className="message-pop align-left" style={{ background: '#ffffff', color: '#333333' }}>

package/components/TemplatePreview/messages.js

@@ -7,23 +7,35 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   previewGenerationMessage: {
-    id: 'app.components.TemplatePreview.previewGenerationMessage',
+    id: 'creatives.components.TemplatePreview.previewGenerationMessage',
     defaultMessage: "Preview is being generated",
   },
   sms: {
-    id: 'app.components.TemplatePreview.sms',
+    id: 'creatives.components.TemplatePreview.sms',
     defaultMessage: "SMS",
   },
   charactersPerSms: {
-    id: 'app.components.TemplatePreview.charactersPerSms',
+    id: 'creatives.components.TemplatePreview.charactersPerSms',
     defaultMessage: "SMS chars",
   },
   charactersTotal: {
-    id: 'app.components.TemplatePreview.charactersTotal',
+    id: 'creatives.components.TemplatePreview.charactersTotal',
     defaultMessage: "SMS char total",
   },
   smsFormatType: {
-    id: 'app.components.TemplatePreview.smsFormatType',
+    id: 'creatives.components.TemplatePreview.smsFormatType',
     defaultMessage: 'Message has unicode characters',
   },
+  previewGenerated: {
+    id: 'creatives.components.TemplatePreview.previewGenerated',
+    defaultMessage: 'Preview is being generated',
+  },
+  close: {
+    id: 'creatives.components.TemplatePreview.close',
+    defaultMessage: 'close',
+  },
+  smsIcon: {
+    id: 'creatives.components.TemplatePreview.smsIcon',
+    defaultMessage: 'Sms Icon',
+  },
 });

package/components/Toastr/messages.js

@@ -7,7 +7,7 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'app.components.Toastr.header',
+    id: 'creatives.components.Toastr.header',
     defaultMessage: 'This is the Toastr component !',
   },
 });

package/components/ToastrMessage/index.js

@@ -9,8 +9,11 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Progress } from 'semantic-ui-react';
 import styled from 'styled-components';
+import { FormattedMessage } from 'react-intl';
 import { messageTypeConfig } from '../../config/toastr';
 
+import messages from './messages';
+
 const StyledMessageWrapper = styled.div`
   background: #f9f9fa;
   transition: all .2s fade-out;
@@ -85,7 +88,7 @@ class ToastrMessage extends React.Component { // eslint-disable-line react/prefe
         <div style={{ padding: `${16}px` }}>
           <MessageHeader>
             { this.props.title ? <span style={{ fontSize: `${20}px` }}>{this.props.title}</span> : '' }
-            <StyleIcon className="material-icons" onClick={() => this.closeMessagePopup(this.props.messageId)}>close</StyleIcon>
+            <StyleIcon className="material-icons" onClick={() => this.closeMessagePopup(this.props.messageId)}><FormattedMessage {...messages.close} /></StyleIcon>
           </MessageHeader>
           <MessageContent>
             {this.props.text}

package/components/ToastrMessage/messages.js

@@ -7,7 +7,11 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   header: {
-    id: 'app.components.ToastrMessage.header',
+    id: 'creatives.components.ToastrMessage.header',
     defaultMessage: 'This is the ToastrMessage component !',
   },
+  close: {
+    id: 'creatives.components.ToastrMessage.close',
+    defaultMessage: 'close',
+  },
 });

package/components/TopBar/messages.js

@@ -23,7 +23,7 @@ export default defineMessages({
     defaultMessage: 'Select brand',
   },
   hi: {
-    id: 'app.components.TopBar.brand.dropdown',
+    id: 'creatives.components.TopBar.brand.dropdown',
     defaultMessage: 'Hi',
   },
 });

package/containers/Assets/Gallery/messages.js

@@ -7,83 +7,83 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   uploadedAt: {
-    id: 'app.containers.Assets.Gallery.uploadedAt',
+    id: 'creatives.containers.Assets.Gallery.uploadedAt',
     defaultMessage: 'Uploaded at ',
   },
   uploadedOn: {
-    id: 'app.containers.Assets.Gallery.uploadedOn',
+    id: 'creatives.containers.Assets.Gallery.uploadedOn',
     defaultMessage: 'Uploaded on ',
   },
   uploadedBy: {
-    id: 'app.containers.Assets.Gallery.uploadedBy',
+    id: 'creatives.containers.Assets.Gallery.uploadedBy',
     defaultMessage: 'Uploaded by ',
   },
   upload: {
-    id: 'app.containers.Assets.Gallery.upload',
+    id: 'creatives.containers.Assets.Gallery.upload',
     defaultMessage: 'Upload image',
   },
   imagePreview: {
-    id: 'app.containers.Assets.Gallery.imagePreview',
+    id: 'creatives.containers.Assets.Gallery.imagePreview',
     defaultMessage: 'Image preview',
   },
   size: {
-    id: 'app.containers.Assets.Gallery.size',
+    id: 'creatives.containers.Assets.Gallery.size',
     defaultMessage: 'Size',
   },
   dimensions: {
-    id: 'app.containers.Assets.Gallery.dimensions',
+    id: 'creatives.containers.Assets.Gallery.dimensions',
     defaultMessage: 'Dimensions',
   },
   gallery: {
-    id: 'app.containers.Assets.Gallery.gallery',
+    id: 'creatives.containers.Assets.Gallery.gallery',
     defaultMessage: 'Gallery',
   },
   backToGallery: {
-    id: 'app.containers.Assets.Gallery.backToGallery',
+    id: 'creatives.containers.Assets.Gallery.backToGallery',
     defaultMessage: 'Back to image gallery',
   },
   mostRecent: {
-    id: 'app.containers.Assets.Gallery.mostRecent',
+    id: 'creatives.containers.Assets.Gallery.mostRecent',
     defaultMessage: 'Most recent',
   },
   alphabetically: {
-    id: 'app.containers.Assets.Gallery.alphabetically',
+    id: 'creatives.containers.Assets.Gallery.alphabetically',
     defaultMessage: 'Alphabetically',
   },
   sortby: {
-    id: 'app.containers.Assets.Gallery.sortby',
+    id: 'creatives.containers.Assets.Gallery.sortby',
     defaultMessage: 'Sort by',
   },
   delete: {
-    id: 'app.containers.Assets.Gallery.delete',
+    id: 'creatives.containers.Assets.Gallery.delete',
     defaultMessage: 'Delete',
   },
   search: {
-    id: 'app.containers.Assets.Gallery.search',
+    id: 'creatives.containers.Assets.Gallery.search',
     defaultMessage: 'Search',
   },
   select: {
-    id: 'app.containers.Assets.Gallery.select',
+    id: 'creatives.containers.Assets.Gallery.select',
     defaultMessage: 'Select',
   },
   preview: {
-    id: 'app.containers.Assets.Gallery.preview',
+    id: 'creatives.containers.Assets.Gallery.preview',
     defaultMessage: 'Preview',
   },
   assetUploadSuccess: {
-    id: 'app.containers.Assets.Gallery.assetUploadSuccess',
+    id: 'creatives.containers.Assets.Gallery.assetUploadSuccess',
     defaultMessage: 'Image uploaded successfully',
   },
   assetUploadFailed: {
-    id: 'app.containers.Assets.Gallery.assetUploadFailed',
+    id: 'creatives.containers.Assets.Gallery.assetUploadFailed',
     defaultMessage: 'Image uploaded failed',
   },
   assetDeleteSuccess: {
-    id: 'app.containers.Assets.Gallery.assetDeleteSuccess',
+    id: 'creatives.containers.Assets.Gallery.assetDeleteSuccess',
     defaultMessage: 'Image deleted successfully.',
   },
   assetDeleteFailed: {
-    id: 'app.containers.Assets.Gallery.assetDeleteFailed',
+    id: 'creatives.containers.Assets.Gallery.assetDeleteFailed',
     defaultMessage: 'Image deletion failed.',
   },
 });

package/containers/Cap/index.js

@@ -20,7 +20,7 @@ import * as locationActions from '../LanguageProvider/actions';
 import * as appActions from '../App/actions';
 import config from '../../config/app';
 import Toastr from '../../components/Toastr';
-import messages from './messsages';
+import messages from './messages';
 const gtm = window.dataLayer || [];
 
 const CapWrapper = styled.div`
@@ -236,7 +236,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
           },
           {
             link: '/mobilepush',
-            text: 'Mobile Push',
+            text: this.props.intl.formatMessage(messages.mobilepush),
             value: 'MOBILEPUSH',
           },
           {
@@ -256,7 +256,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
           },
           {
             link: '/line',
-            text: 'Line',
+            text: this.props.intl.formatMessage(messages.line),
             value: 'LINE',
           },
         ],
@@ -277,9 +277,9 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
       <CapWrapper>
         <Helmet
           titleTemplate="Capillary - %s"
-          defaultTitle="App Name"
+          defaultTitle={this.props.intl.formatMessage(messages.appName)}
           meta={[
-            { name: 'description', content: 'App Name' },
+            { name: 'description', content: this.props.intl.formatMessage(messages.appName) },
           ]}
         />
         <div className="wrapper">

package/containers/Cap/messages.js

@@ -0,0 +1,75 @@
+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",
+  },
+  "line": {
+    id: 'reon.components.Cap.line',
+    defaultMessage: 'Line',
+  },
+  "mobilepush": {
+    id: 'reon.components.Cap.mobilepush',
+    defaultMessage: 'Mobile Push',
+  },
+  "appName": {
+    id: 'reon.components.Cap.appName',
+    defaultMessage: 'App Name',
+  },
+});

package/containers/Dashboard/index.js

@@ -30,7 +30,7 @@ export class Dashboard extends React.Component { // eslint-disable-line react/pr
         <FormattedMessage {...messages.header}>{(message) => (<Helmet
           title={message}
           meta={[
-            { name: 'description', content: 'Dashboard' },
+            { name: 'description', content: <FormattedMessage {...messages.header} /> },
           ]}
         />)}
         </FormattedMessage>
@@ -42,7 +42,7 @@ export class Dashboard extends React.Component { // eslint-disable-line react/pr
 }
 
 Dashboard.propTypes = {
-  actions: PropTypes.object,
+  router: PropTypes.object,
 };
 
 const mapStateToProps = createStructuredSelector({

package/containers/Dashboard/messages.js

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

package/containers/Ebill/index.js

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

package/containers/Ebill/messages.js

@@ -7,67 +7,71 @@ import { defineMessages } from 'react-intl';
 
 export default defineMessages({
   "campaigns": {
-    id: 'app.containers.Ebill.campaigns',
+    id: 'creatives.containers.Ebill.campaigns',
     defaultMessage: 'Campaigns',
   },
   "creatives": {
-    id: 'app.containers.Ebill.creatives',
+    id: 'creatives.containers.Ebill.creatives',
     defaultMessage: 'Creatives',
   },
   "ebill": {
-    id: 'app.containers.Ebill.ebill',
+    id: 'creatives.containers.Ebill.ebill',
     defaultMessage: 'Ebill',
   },
   "ebillPreview": {
-    id: 'app.containers.Ebill.ebillPreview',
+    id: 'creatives.containers.Ebill.ebillPreview',
     defaultMessage: 'Ebill Preview',
   },
   "loading": {
-    id: 'app.containers.Ebill.loading',
+    id: 'creatives.containers.Ebill.loading',
     defaultMessage: 'Loading..',
   },
   "ebillEditSuccess": {
-    id: 'app.containers.Ebill.ebillEditSuccess',
+    id: 'creatives.containers.Ebill.ebillEditSuccess',
     defaultMessage: "Ebill template edited successfully",
   },
   "ebillCreateSuccess": {
-    id: 'app.containers.Ebill.ebillCreateSuccess',
+    id: 'creatives.containers.Ebill.ebillCreateSuccess',
     defaultMessage: "Ebill template created successfully",
   },
   "somethingWentWrong": {
-    id: 'app.containers.Ebill.somethingWentWrong',
+    id: 'creatives.containers.Ebill.somethingWentWrong',
     defaultMessage: "Something went wrong!!",
   },
   "Enter template name": {
-    id: 'app.containers.Ebill.enterTemplateName',
+    id: 'creatives.containers.Ebill.enterTemplateName',
     defaultMessage: "Enter template name",
   },
   "Template name cannot be empty.": {
-    id: 'app.containers.Ebill.emptyTemplateErrorMessage',
+    id: 'creatives.containers.Ebill.emptyTemplateErrorMessage',
     defaultMessage: "Please provide a template name ",
   },
   "Preview": {
-    id: 'app.containers.Ebill.Preview',
+    id: 'creatives.containers.Ebill.Preview',
     defaultMessage: "Preview",
   },
   "Cancel": {
-    id: 'app.containers.Ebill.Cancel',
+    id: 'creatives.containers.Ebill.Cancel',
     defaultMessage: "Cancel",
   },
   "Save": {
-    id: 'app.containers.Ebill.Save',
+    id: 'creatives.containers.Ebill.Save',
     defaultMessage: "Save",
   },
   "Template content has unsupported/missing tags!": {
-    id: 'app.containers.Ebill.tagsErrorMessage',
+    id: 'creatives.containers.Ebill.tagsErrorMessage',
     defaultMessage: "Please check the message content for unsupported/missing tags",
   },
   "Tags": {
-    id: 'app.containers.Ebill.tagsLabel',
+    id: 'creatives.containers.Ebill.tagsLabel',
     defaultMessage: "Tags",
   },
   "New Version": {
-    id: 'app.containers.Ebill.newVersionLabel',
+    id: 'creatives.containers.Ebill.newVersionLabel',
     defaultMessage: "New version",
   },
+  "templateNotValid": {
+    id: 'creatives.containers.Ebill.templateNotValid',
+    defaultMessage: "Template data is not valid",
+  },
 });