@capillarytech/creatives-library 3.0.13 → 3.0.14

package/containers/Cap/actions.js

@@ -51,6 +51,12 @@ export function fetchSchemaForEntity(queryParams) {
   };
 }
 
+export function removeEntitySchema() {
+  return {
+    type: types.ROMOVE_ENTITY_SCHEMA,
+  };
+}
+
 export function setInjectedTags(injectedTags) {
   return {
     type: types.SET_INJECTED_TAGS, injectedTags,

package/containers/Cap/constants.js

@@ -18,6 +18,7 @@ export const GET_USER_DATA_FAILURE = 'cap/GET_USER_DATA_FAILURE';
 export const GET_SCHEMA_FOR_ENTITY_FAILURE = 'cap/GET_SCHEMA_FOR_ENTITY_FAILURE';
 export const GET_SCHEMA_FOR_ENTITY_REQUEST = 'cap/GET_SCHEMA_FOR_ENTITY_REQUEST';
 export const GET_SCHEMA_FOR_ENTITY_SUCCESS = 'cap/GET_SCHEMA_FOR_ENTITY_SUCCESS';
+export const ROMOVE_ENTITY_SCHEMA = 'cap/ROMOVE_ENTITY_SCHEMA';
 export const CLEAR_META_ENTITIES = 'cap/CLEAR_META_ENTITIES';
 export const HIDE_TAGS = 'cap/HIDE_TAGS';
 

package/containers/Cap/reducer.js

@@ -90,6 +90,8 @@ function capReducer(state = fromJS(initialState), action) {
           tags: action.data && action.entityType === 'TAG' ? action.data.metaEntities : stateMeta.tags,
         });
     }
+    case types.ROMOVE_ENTITY_SCHEMA:
+      return state.set('metaEntities', {});
     case types.CLEAR_META_ENTITIES:
       return state.set('metaEntities', {
         layouts: [],

package/containers/Email/index.js

@@ -2537,13 +2537,15 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         });
       }
     });
-    _.forEach(temp.standalone.sections[1].inputFields[0].cols, (inputField) => {
-      if (inputField.id === "template-version") {
-        const iF = inputField;
-        iF.colStyle = {};
-        iF.colStyle.display = "none";
-      }
-    });
+    if (temp.standalone.sections && temp.standalone.sections.length > 0) {
+      _.forEach(temp.standalone.sections[1].inputFields[0].cols, (inputField) => {
+        if (inputField.id === "template-version") {
+          const iF = inputField;
+          iF.colStyle = {};
+          iF.colStyle.display = "none";
+        }
+      });
+    }
     //}
     temp = type === 'embedded' ? this.removeStandAlone(temp) : temp;
     this.setState({schema: temp, isSchemaChanged: true, loadingStatus: this.state.loadingStatus + 1}, () => {

package/containers/MobilePush/Create/index.js

@@ -179,6 +179,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
         query: type === 'embedded' ? {type: 'embedded', module} : {module},
       });
     }
+    this.props.globalActions.removeEntitySchema();
   };
 
   componentDidMount = () => {

package/containers/MobilePush/Edit/index.js

@@ -803,7 +803,6 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   getCurrentWindow = (e) => {
-    console.log('in sms create', e);
     const response = {
       action: e.action,
       value: 'edit',

package/containers/Templates/index.js

@@ -1128,7 +1128,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             {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> : ''}
           </div>);
-      } else if (this.state.channel.toLowerCase() === 'line') {
+      } else if (this.state.channel.toLowerCase() === 'line' && template.type.toLowerCase() === 'line') {
         //content = template.versions.base.messages[0].Text;
         content = {
           bodyText: template.versions.base.content.messages[0].text ? template.versions.base.content.messages[0].text : '',

package/package.json

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

package/v2Components/EmailMobilePreview/index.js

@@ -30,6 +30,14 @@ const deviceAspectRatio = {
 };
 
 class EmailMobilePreview extends React.Component {
+  static getDerivedStateFromProps(props) {
+    if (props.showAllDevices) {
+      return {
+        showAllDevices: true,
+      };
+    }
+    return null;
+  }
   constructor() {
     super();
     this.state = {
@@ -115,6 +123,7 @@ EmailMobilePreview.propTypes = {
 
 EmailMobilePreview.defaultProps = {
   showDeviceSelection: true,
+  showAllDevices: false,
 };
 
 const mapStateToProps = (state, props) => createStructuredSelector({

package/v2Containers/Assets/Gallery/index.js

@@ -13,7 +13,7 @@ import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import moment from "moment";
 import _ from "lodash";
-import { CapHeader, CapInput, CapButton, CapSpin, CapIcon, CapDropdown, CapMenu, CapCustomCard, CapSlideBox, CapLabel } from '@capillarytech/cap-ui-library';
+import { CapHeader, CapInput, CapButton, CapSpin, CapIcon, CapDropdown, CapMenu, CapCustomCard, CapSlideBox, CapLabel, CapIllustration} from '@capillarytech/cap-ui-library';
 import { Popover } from 'antd';
 import makeSelectGallery from './selectors';
 import messages from './messages';
@@ -23,7 +23,7 @@ import * as globalActions from '../../Cap/actions';
 import {getMessageObject} from '../../../utils/messageUtils';
 import * as commonUtil from '../../../utils/common';
 import Pagination from '../../../v2Components/Pagination';
-
+import imageGalleryIllustration from '../images/imageGalleryIllustration.svg';
 import './_gallery.scss';
 const {CapCustomCardList} = CapCustomCard;
 export class Gallery extends React.Component { // eslint-disable-line react/prefer-stateless-function
@@ -240,6 +240,12 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
       };
     }
   }
+  getIllustrationProps={
+    buttonLabel: <FormattedMessage {...messages.upload} />,
+    onClick: (e) => this.openFileDialog(e),
+    illustrationImage: imageGalleryIllustration,
+    title: <FormattedMessage {...messages.addImages} />,
+  }
 
   prepareData() {
     const data = [];
@@ -326,10 +332,12 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
     }) : [];
     return (<div>
       {filterContent}
-      <CapSpin spinning={isLoading} tip={loadingTip}>
-        {!_.isEmpty(templates) && <div className="pagination-container">
-          <CapCustomCardList key={`${currentChannel}-card-list`} cardList={cardDataList} type={'Email'} />
-        </div>}
+      <CapSpin spinning={isLoading} tip={loadingTip} style={{width: "100%"}}>
+        {!isLoading && <div>
+          {!_.isEmpty(templates) ? <div className="pagination-container">
+            <CapCustomCardList key={`${currentChannel}-card-list`} cardList={cardDataList} type={'Email'} />
+          </div> : <CapIllustration {...this.getIllustrationProps} />}</div>
+        }
       </CapSpin>
 
     </div>);
@@ -383,7 +391,8 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
     );
   }
   render() {
-    const filterContent = (
+    const assetList = this.props.Gallery.assetList;
+    const filterContent = !_.isEmpty(assetList) ? (
       <div className="action-container" style={{ display: 'inline-flex', width: '100%'}}>
         <div style={{ marginTop: '8px', width: '50%'}}>
           <CapInput.Search
@@ -404,10 +413,10 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
           </form>
         </div>
       </div>
-    );
+    ) : <input style={{ display: 'none'}} id="fileName" type="file" onChange={(e) => this.uploadImages(e, {files: e.target.files})} accept="image/*" multiple/>;
     const isLoading = this.props.Gallery.assetUploading || this.props.Gallery.fetchingAllAssets;
     const loadingTip = "Loading gallery... ";
-    const assetList = this.props.Gallery.assetList;
+
     return (
       <div>
         {this.state.showEmbeddedPreview ?

package/v2Containers/Assets/Gallery/messages.js

@@ -22,6 +22,10 @@ export default defineMessages({
     id: 'app.containers.Assets.Gallery.upload',
     defaultMessage: 'Upload image',
   },
+  addImages: {
+    id: `app.containers.Assets.Gallery.addImages`,
+    defaultMessage: 'Add images',
+  },
   imagePreview: {
     id: 'app.containers.Assets.Gallery.imagePreview',
     defaultMessage: 'Image preview',

package/v2Containers/CallTask/index.js

@@ -9,10 +9,10 @@ import { bindActionCreators } from "redux";
 import { connect } from 'react-redux';
 import {
   //CapSlideBox,
-  CapButton,
   //CapIcon,
   //CapHeader,
   CapLabel,
+  CapIllustration,
 } from '@capillarytech/cap-ui-library';
 import { injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
@@ -23,7 +23,7 @@ import makeSelectCallTask from './selectors';
 import NewCallTask from '../../v2Components/NewCallTask';
 import messages from './messages';
 import './_callTask.scss';
-
+import calltaskIllustration from '../Assets/images/calltaskIllustration.svg';
 export class CallTask extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
     super(props);
@@ -57,8 +57,18 @@ export class CallTask extends React.Component { // eslint-disable-line react/pre
     });
   }
 
+  getIllustrationProps=() => {
+    const { intl, showContentInSlidebox, onCreateNew } = this.props;
+    const { formatMessage } = intl;
+    return {
+      buttonLabel: formatMessage(messages.newCallTaskTemplate),
+      onClick: showContentInSlidebox ? this.showNewCallTask : onCreateNew,
+      illustrationImage: calltaskIllustration,
+      title: formatMessage(messages.callTaskTitleIllustartion),
+    };
+  }
   render() {
-    const { intl, onCallTaskSubmit, templateData, loadingMetaEntities, metaEntities, showContentInSlidebox, onCreateNew } = this.props;
+    const { intl, onCallTaskSubmit, templateData, loadingMetaEntities, metaEntities } = this.props;
     const { formatMessage } = intl;
     const { mode } = this.state;
     return (
@@ -77,9 +87,7 @@ export class CallTask extends React.Component { // eslint-disable-line react/pre
                 {formatMessage(messages.callTaskInfo)}
               </CapLabel>
               <div className="call-task-action-button">
-                <CapButton onClick={showContentInSlidebox ? this.showNewCallTask : onCreateNew}>
-                  {formatMessage(messages.addNewCallTask)}
-                </CapButton>
+                <CapIllustration {...this.getIllustrationProps()} />
               </div>
               {/* {
               showCallTaskSlidebox && showContentInSlidebox &&

package/v2Containers/CallTask/messages.js

@@ -18,4 +18,12 @@ export default defineMessages({
     id: 'app.containers.CallTask.callTaskInfo',
     defaultMessage: 'Call Tasks are message sent to store staff. The messages are displayed on the Point of Sale (POS) machines for store staff to take action.',
   },
+  callTaskTitleIllustartion: {
+    id: `app.containers.CallTask.callTaskTitleIllustartion`,
+    defaultMessage: 'Create a Call Task template',
+  },
+  newCallTaskTemplate: {
+    id: `app.containers.CallTask.newCallTaskTemplate`,
+    defaultMessage: 'New Call Task template',
+  },
 });

package/v2Containers/Templates/index.js

@@ -15,7 +15,7 @@ import moment from "moment";
 import _ from 'lodash';
 import { bindActionCreators } from 'redux';
 import { Modal} from 'antd';
-import {CapMenu, CapDropdown, CapButton, CapInput, CapIcon, CapSelect, CapPopover, CapSpin, CapCustomCard, CapRow, CapSlideBox, CapLink, CapHeading, CapNotification} from '@capillarytech/cap-ui-library';
+import {CapMenu, CapDropdown, CapButton, CapInput, CapIcon, CapSelect, CapPopover, CapSpin, CapCustomCard, CapRow, CapSlideBox, CapLink, CapHeading, CapNotification, CapIllustration} from '@capillarytech/cap-ui-library';
 import { makeSelectTemplates, makeSelectTemplatesResponse } from './selectors';
 import { makeSelectCreate as makeSelectCreateSms} from '../Sms/Create/selectors';
 import { makeSelectCreate as makeSelectCreateMobilePush } from '../MobilePush/Create/selectors';
@@ -44,6 +44,11 @@ import EmailPreview from '../../v2Components/EmailPreview';
 import CreativesContainer from '../CreativesContainer';
 import WechatRichmediaTemplatePreview from '../../v2Components/TemplatePreview/WechatRichmediaTemplatePreview';
 import { MOBILE_PUSH, WECHAT, SMS, EMAIL, EBILL, LINE } from '../CreativesContainer/constants';
+import emailIllustration from '../Assets/images/emailIllustration.svg';
+import smsIllustration from '../Assets/images/smsIllustration.svg';
+import pushIllustration from '../Assets/images/pushIllustration.svg';
+
+
 const {CapCustomCardList} = CapCustomCard;
 const InlineDiv = styled.div`
   display: inline;
@@ -79,6 +84,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       modeType: null,
       routeParams: null,
     };
+
     this.handleOnHoverItem = this.handleOnHoverItem.bind(this);
     this.handleOnItemClick = this.handleOnItemClick.bind(this);
     this.handleEditClick = this.handleEditClick.bind(this);
@@ -255,7 +261,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       }
     }
     if (this.state.channel.toLowerCase() === "mobilepush" && nextProps.CreateMobilePush && nextProps.CreateMobilePush.response && nextProps.CreateMobilePush.response.templateId && nextProps.CreateMobilePush.response.templateId !== '') {
-      
+
     }
 
     if (this.state.channel.toLowerCase() === "ebill" && nextProps.CreateEbill && nextProps.CreateEbill.createResponse && nextProps.CreateEbill.createResponse.templateId && nextProps.CreateEbill.createResponse.templateId !== '') {
@@ -377,6 +383,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           this.setState({selectedAccountError: true});
           this.props.actions.resetTemplate();
           return;
+        } else {
+          this.setState({selectedAccountError: false});
         }
       }
 
@@ -532,24 +540,32 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     const accounts = _.get(this.props, 'Templates.weCrmAccounts');
     return (<div>
       {filterContent}
-      <CapSpin spinning={isLoading} tip={loadingTip}>
-        {!_.isEmpty(templates) && <div className="pagination-container">
-          <CapCustomCardList key={`${currentChannel}-card-list`} cardList={cardDataList} type={currentChannel} />
-        </div>}
-        {(this.state.selectedAccount === '' && _.isEmpty(this.props.Templates.selectedWeChatAccount)) && (this.state.channel.toLowerCase() === 'wechat' || this.state.channel.toLowerCase() === "mobilepush") &&
-        <div style={{ height: '65vh', textAlign: 'center', lineHeight: '65vh'}}>
-          <CapHeading type="h6">{accounts ? this.props.intl.formatMessage(messages.noAccountMessage) : this.props.intl.formatMessage(messages.noAccountsPresent)}</CapHeading>
-        </div>}
-        { !_.isEmpty(this.props.Templates.selectedWeChatAccount) && this.state.channel.toLowerCase() === "mobilepush" && this.state.selectedAccountError &&
+      <CapSpin spinning={isLoading} tip={loadingTip} style={{width: '100%'}}>
+        {!isLoading && <div>
+          {!_.isEmpty(templates) ? <div className="pagination-container">
+            <CapCustomCardList key={`${currentChannel}-card-list`} cardList={cardDataList} type={currentChannel} />
+          </div> : ['sms', "email"].includes(this.state.channel.toLowerCase()) && <CapIllustration {...this.getChannelTypeIllustrationInfo(currentChannel)} />
+          }
+
+          {(this.state.selectedAccount === '' && _.isEmpty(this.props.Templates.selectedWeChatAccount)) && (this.state.channel.toLowerCase() === 'wechat' || this.state.channel.toLowerCase() === "mobilepush") &&
           <div style={{ height: '65vh', textAlign: 'center', lineHeight: '65vh'}}>
-            <CapHeading type="h6" >
-              {this.props.intl.formatMessage(messages.accountConfigError)}
-              <InlineDiv>
-                <CapLink title="here" style={{display: 'inline'}} onClick={() => { window.open(config.production.accountConfig`${accountId}`); }}/>
-              </InlineDiv>
-            </CapHeading>
+            <CapHeading type="h6">{accounts ? this.props.intl.formatMessage(messages.noAccountMessage) : this.props.intl.formatMessage(messages.noAccountsPresent)}</CapHeading>
           </div>
+          }
+
+          { !_.isEmpty(this.props.Templates.selectedWeChatAccount) && this.state.channel.toLowerCase() === "mobilepush" && this.state.selectedAccountError ?
+            <div style={{ height: '65vh', textAlign: 'center', lineHeight: '65vh'}}>
+              <CapHeading type="h6" >
+                {this.props.intl.formatMessage(messages.accountConfigError)}
+                <InlineDiv>
+                  <CapLink title="here" style={{display: 'inline'}} onClick={() => { window.open(config.production.accountConfig`${accountId}`); }}/>
+                </InlineDiv>
+              </CapHeading>
+            </div> : ["mobilepush"].includes(this.state.channel.toLowerCase()) && _.isEmpty(templates) && <CapIllustration {...this.getChannelTypeIllustrationInfo(currentChannel)} />
+          }
+        </div>
         }
+
       </CapSpin>
 
     </div>);
@@ -1355,6 +1371,33 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       (lineLoader !== undefined ? lineLoader : false);
     return isLoading;
   }
+  getChannelTypeIllustrationInfo = (type) => {
+    switch (type) {
+      case 'SMS':
+        return {
+          buttonLabel: <FormattedMessage {...messages.newSMSTemplate} />,
+          onClick: this.createTemplate,
+          illustrationImage: smsIllustration,
+          title: <FormattedMessage {...messages.smsTitleIllustartion} />,
+        };
+      case 'EMAIL':
+        return {
+          buttonLabel: <FormattedMessage {...messages.newEmailTemplate} />,
+          onClick: this.createTemplate,
+          illustrationImage: emailIllustration,
+          title: <FormattedMessage {...messages.emailTitleIllustartion} />,
+        };
+      case 'MOBILEPUSH':
+        return {
+          buttonLabel: <FormattedMessage {...messages.newNotificationTemplate} />,
+          onClick: this.createTemplate,
+          illustrationImage: pushIllustration,
+          title: <FormattedMessage {...messages.pushTitleIllustartion} />,
+        };
+      default:
+        return {};
+    }
+  }
   checkSearchDisabled = () => (this.props.route.name === "mobilepush" && !(this.props.Templates.selectedWeChatAccount && this.props.Templates.selectedWeChatAccount.sourceAccountIdentifier && this.props.Templates.selectedWeChatAccount.configs && (this.props.Templates.selectedWeChatAccount.configs.ios === '1' || this.props.Templates.selectedWeChatAccount.configs.android === '1')))
   renderEmailPreviewModal() {
     const slideboxContent = (
@@ -1391,6 +1434,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     </Modal>);
     return modal;
   };
+
   render() {
     const accountOptions = [];
     const isFullMode = this.isFullMode();
@@ -1565,30 +1609,28 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       >
       </CardGrid>
     );
-    const filterContent = (
-      <div className="action-container">
-        <CapInput.Search
-          className="search-text"
-          style={{width: '210px'}}
-          placeholder={this.props.intl.formatMessage(messages.searchText)}
-          value={this.state.searchText}
-          onChange={(e) => this.searchTemplate(e.target.value)}
-          disabled={this.checkSearchDisabled()}
-          onClear={() => this.searchTemplate('')}
-        />
-        <div style={{display: "flex", justifyContent: "space-between", alignItems: 'center'}}>
-          {(this.props.location.query.type === 'embedded' ) ? pageHeaderDvs : pageHeader}
-          <CapButton
-            type={"primary"}
-            disabled={this.isCreateDisabled()}
-            style={{marginLeft: '8px'}}
-            onClick={this.createTemplate} >
-            { this.props.intl.formatMessage(messages.createNewActionButton) }
-          </CapButton>
-        </div>
-
+    const filterContent = ((!_.isEmpty(this.props.TemplatesList) || this.state.channel.toLowerCase() === 'mobilepush' ) && <div className="action-container">
+      {!_.isEmpty(this.props.TemplatesList) && <CapInput.Search
+        className="search-text"
+        style={{width: '210px'}}
+        placeholder={this.props.intl.formatMessage(messages.searchText)}
+        value={this.state.searchText}
+        onChange={(e) => this.searchTemplate(e.target.value)}
+        disabled={this.checkSearchDisabled()}
+        onClear={() => this.searchTemplate('')}
+        />}
+      <div style={{display: "flex", justifyContent: "space-between", alignItems: 'center'}}>
+        {(this.props.location.query.type === 'embedded' ) ? pageHeaderDvs : pageHeader}
+        {!_.isEmpty(this.props.TemplatesList) && <CapButton
+          type={"primary"}
+          disabled={this.isCreateDisabled()}
+          style={{marginLeft: '8px'}}
+          onClick={this.createTemplate} >
+          { this.props.intl.formatMessage(messages.createNewActionButton) }
+        </CapButton>}
       </div>
-    );
+
+    </div>);
     let htmlPreviewContent = "";
     if (this.state.channel.toLowerCase() === 'ebill') {
       htmlPreviewContent = this.state.previewTemplate && this.state.previewTemplate.versions && this.state.previewTemplate.versions.base && this.state.previewTemplate.versions.base['ebill-editor'];
@@ -1623,10 +1665,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
               >
               </CardGrid>
             </Pagination>} */}
-          {(((this.state.selectedAccount !== '' && !_.isEmpty(this.props.Templates.selectedWeChatAccount) && this.state.channel.toLowerCase() === 'wechat') || this.state.channel.toLowerCase() !== 'wechat') && _.isEmpty(this.props.TemplatesList)) && !this.props.Templates.getAllTemplatesInProgress &&
-            <div style={{ height: '65vh', textAlign: 'center', lineHeight: '65vh'}}>
-              <CapHeading type="h6">{this.props.intl.formatMessage(messages.noTemplatesMessage)}</CapHeading>
-            </div>}
         </CapRow>
         <CapRow>
           {!_.isEmpty(creativesParams.mode) && isFullMode && //creatives container for fullmode
@@ -1684,6 +1722,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       </div>
     );
   }
+
 }
 
 Templates.propTypes = {

package/v2Containers/Templates/messages.js

@@ -278,5 +278,29 @@ export default defineMessages({
     id: `${scope}.accountConfigError`,
     defaultMessage: 'This account is not configured properly. You can configure it ',
   },
+  "newSMSTemplate": {
+    id: `${scope}.newSMSTemplate`,
+    defaultMessage: 'New SMS template',
+  },
+  "newEmailTemplate": {
+    id: `${scope}.newEmailTemplate`,
+    defaultMessage: 'New email template',
+  },
+  "newNotificationTemplate": {
+    id: `${scope}.newNotificationTemplate`,
+    defaultMessage: 'New notification template',
+  },
+  "pushTitleIllustartion": {
+    id: `${scope}.pushTitleIllustartion`,
+    defaultMessage: 'Create a mobile push notification template',
+  },
+  "emailTitleIllustartion": {
+    id: `${scope}.emailTitleIllustartion`,
+    defaultMessage: 'Create an email template',
+  },
+  "smsTitleIllustartion": {
+    id: `${scope}.smsTitleIllustartion`,
+    defaultMessage: 'Create an SMS template',
+  },
 
 });