@capillarytech/creatives-library 2.0.54 → 2.0.57

package/containers/CallTask/tests/index.test.js

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

package/containers/CallTask/tests/reducer.test.js

@@ -0,0 +1,9 @@
+
+import { fromJS } from 'immutable';
+import callTaskReducer from '../reducer';
+
+describe('callTaskReducer', () => {
+  it('returns the initial state', () => {
+    expect(callTaskReducer(undefined, {})).toEqual(fromJS({}));
+  });
+});

package/containers/CallTask/tests/sagas.test.js

@@ -0,0 +1,15 @@
+/**
+ * Test  sagas
+ */
+
+/* eslint-disable redux-saga/yield-effects */
+// import { take, call, put, select } from 'redux-saga/effects';
+// import { defaultSaga } from '../sagas';
+
+// const generator = defaultSaga();
+
+describe('defaultSaga Saga', () => {
+  it('Expect to have unit tests specified', () => {
+    expect(false).toEqual(false);
+  });
+});

package/containers/CallTask/tests/selectors.test.js

@@ -0,0 +1,10 @@
+// import { fromJS } from 'immutable';
+// import { makeSelectCallTaskDomain } from '../selectors';
+
+// const selector = makeSelectCallTaskDomain();
+
+describe('makeSelectCallTaskDomain', () => {
+  it('Expect to have unit tests specified', () => {
+    expect(false).toEqual(false);
+  });
+});

package/containers/CreativesContainer/SlideBoxContent.js

@@ -7,7 +7,10 @@ import SmsCreate from '../Sms/Create';
 import SmsEdit from '../Sms/Edit';
 import Email from '../Email';
 import EmailWrapper from '../EmailWrapper';
+import MobilepusWrapper from '../MobilepushWrapper';
 import EmailPreviewV2 from '../../components/EmailPreviewV2';
+import CallTask from '../CallTask';
+import MobliPushEdit from '../MobilePush/Edit';
 import * as constants from './constants';
 const CreativesWrapper = styled.div`
   .ant-popover,
@@ -31,11 +34,14 @@ function SlideBoxContent(props) {
       onChannelChange,
       onEmailModeChange,
       emailCreateMode,
+      onMobilepushModeChange,
+      mobilePushCreateMode,
       templateStep,
-      onEmailNextStep,
+      onCreateNextStep,
       cap,
       onResetStep,
       isFullMode,
+      onCallTaskSubmit,
       setIsLoadingContent,
     } = props;
   const type = messageDetails.type.toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
@@ -47,15 +53,21 @@ function SlideBoxContent(props) {
   };
   let channel = currentChannel;//for create mode
   const isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
+  const isCreateMPush = slidBoxContent === 'createTemplate' && channel === constants.MOBILE_PUSH;
+  const isCreateCallTask = slidBoxContent === 'createTemplate' && channel === 'CALLTASK';
   let isEditSms = false;
   let isEditEmailWithId = false;
   let isEmailEditWithContent = false;
   let isPreview = false;
   let isEmailPreview = false;
+  let isEditCallTask = false;
+  let isEditMPush = false;
   const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
   if (templateData && channel) {
     channel = templateData.type;// for edit mode with template data
     isEditSms = slidBoxContent === 'editTemplate' && channel === constants.SMS;
+    isEditCallTask = slidBoxContent === 'editTemplate' && channel === constants.CALL_TASK;
+    isEditMPush = slidBoxContent === 'editTemplate' && channel === constants.MOBILE_PUSH;
     isEditEmailWithId = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && templateData._id;
     isEmailEditWithContent = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && !templateData._id;
     isPreview = slidBoxContent === 'preview' && channel !== constants.EMAIL;
@@ -73,6 +85,7 @@ function SlideBoxContent(props) {
         createNew={onCreateNew}
         channel={channel.toLowerCase()}
         onChannelChange={onChannelChange}
+        onCallTaskSubmit={onCallTaskSubmit}
         cap={cap}
         />
         )}
@@ -103,6 +116,21 @@ function SlideBoxContent(props) {
         subscriptionTemplateDetails={templateData} // used only in library mode
           />
         )}
+      {
+        isEditCallTask &&
+          <CallTask
+            mode={'edit'}
+            templateData={templateData}
+            onCallTaskSubmit={onCallTaskSubmit}
+        />
+      }
+      {
+         isCreateCallTask &&
+         <CallTask
+           mode={'create'}
+           onCallTaskSubmit={onCallTaskSubmit}
+        />
+       }
       {isCreateSms && (
       <SmsCreate
         setIsLoadingContent={setIsLoadingContent}
@@ -127,7 +155,7 @@ function SlideBoxContent(props) {
         templateData={templateData}
         type={type}
         step={templateStep}
-        showNextStep={onEmailNextStep}
+        showNextStep={onCreateNextStep}
         isFullMode={isFullMode}
         cap={cap}
         onResetStep={onResetStep}
@@ -151,6 +179,38 @@ function SlideBoxContent(props) {
         cap={cap}
           />
         )}
+      {isEditMPush &&
+        <MobliPushEdit
+          getFormLibraryData={getFormData}
+          setIsLoadingContent={setIsLoadingContent}
+          location={{
+            pathname: `/mobilepush/edit/`,
+            query,
+          }}
+          isFullMode={false}
+          isGetFormData={isGetFormData}
+          route={{ name: 'mobilepush' }}
+          templateData={templateData}
+        />
+        }
+      {isCreateMPush &&
+      <MobilepusWrapper
+        key="creatives-mobilepush-wrapper"
+        date={new Date().getMilliseconds()}
+        setIsLoadingContent={setIsLoadingContent}
+        onMobilepushModeChange={onMobilepushModeChange}
+        mobilePushCreateMode={mobilePushCreateMode}
+        isGetFormData={isGetFormData}
+        getFormData={getFormData}
+        templateData={templateData}
+        type={type}
+        step={templateStep}
+        showNextStep={onCreateNextStep}
+        isFullMode={isFullMode}
+        cap={cap}
+        onResetStep={onResetStep}
+        query={query}/>
+        }
     </CreativesWrapper>
   );
 }
@@ -169,10 +229,13 @@ SlideBoxContent.propTypes = {
   onEmailModeChange: PropTypes.func,
   emailCreateMode: PropTypes.string,
   templateStep: PropTypes.string,
-  onEmailNextStep: PropTypes.func,
+  onCreateNextStep: PropTypes.func,
   cap: PropTypes.object,
   onResetStep: PropTypes.func,
+  onCallTaskSubmit: PropTypes.func,
   isFullMode: PropTypes.bool,
   setIsLoadingContent: PropTypes.func,
+  onMobilepushModeChange: PropTypes.func,
+  mobilePushCreateMode: PropTypes.string,
 };
 export default SlideBoxContent;

package/containers/CreativesContainer/SlideBoxFooter.js

@@ -3,7 +3,7 @@ import { FormattedMessage } from 'react-intl';
 import { CapButton } from '@capillarytech/cap-ui-library';
 import PropTypes from 'prop-types';
 function SlideBoxFooter(props) {
-  const { slidBoxContent, onSave, messages, onEditTemplate, onEmailNextStep} = props;
+  const { slidBoxContent, onSave, messages, onEditTemplate, onCreateNextStep} = props;
   return (
     <div>
       <div>
@@ -13,7 +13,7 @@ function SlideBoxFooter(props) {
         </CapButton>
           )}
         {props.shouldShowContinueFooter() &&
-          <CapButton onClick={onEmailNextStep}>
+          <CapButton onClick={onCreateNextStep}>
             <FormattedMessage {...messages.continue} />
           </CapButton>
           }
@@ -31,7 +31,7 @@ SlideBoxFooter.propTypes = {
   onSave: PropTypes.func,
   messages: PropTypes.object,
   onEditTemplate: PropTypes.func,
-  onEmailNextStep: PropTypes.func,
+  onCreateNextStep: PropTypes.func,
   shouldShowContinueFooter: PropTypes.func,
   shouldShowDoneFooter: PropTypes.func,
 };

package/containers/CreativesContainer/constants.js

@@ -7,5 +7,7 @@
 export const DEFAULT_ACTION = 'app/CreativesContainer/DEFAULT_ACTION';
 export const EMAIL = "EMAIL";
 export const SMS = "SMS";
+export const CALL_TASK = "CALL_TASK";
+export const MOBILE_PUSH = "MOBILEPUSH";
 export const SHOW_CONTANER_LOADER = "app/CreativesContainer/SHOW_CONTANER_LOADER";
 export const HIDE_CONTAINER_LOADER = "app/CreativesContainer/HIDE_CONTAINER_LOADER";

package/containers/CreativesContainer/index.js

@@ -5,7 +5,7 @@ import {
 } from '@capillarytech/cap-ui-library';
 import { injectIntl } from 'react-intl';
 import classnames from 'classnames';
-import {isEmpty} from 'lodash';
+import {isEmpty, get} from 'lodash';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
 import { bindActionCreators } from 'redux';
@@ -66,20 +66,39 @@ class Creatives extends React.Component {
   };
 
   onShowTemplates = () => {
-    this.setState({ slidBoxContent: 'templates', showSlideBox: true });
+    this.setState({ slidBoxContent: 'templates', showSlideBox: true, isGetFormData: false });
   };
   onChannelChange = (channel) => {
     this.setState({currentChannel: channel});
   }
-  onEmailNextStep = () => {
-    this.setState((prevState) => ({
-      templateStep: prevState.templateStep + 1,
-    }));
+  onCreateNextStep = () => {
+    this.setState((prevState) => {
+      let templateStep = prevState.templateStep + 1;
+      const {emailCreateMode, currentChannel} = prevState;
+      if ((currentChannel.toUpperCase() === constants.EMAIL && emailCreateMode === "upload") || currentChannel.toUpperCase() === constants.MOBILE_PUSH) {
+        templateStep = prevState.templateStep + 2;
+      }
+
+      return {
+        templateStep,
+      };
+    });
   }
 
   onEmailModeChange = (mode) => {
     this.setState({ emailCreateMode: mode});
   }
+  onMobilepushModeChange = (mode) => {
+    this.setState({ mobilePushCreateMode: mode});
+  }
+
+  onCallTaskSubmit = (data) => {
+    this.props.getCreativesData({
+      channel: 'CALL_TASK',
+      ...data,
+    });
+  }
+
   getTemplateData = (templateData) => { //from consumers to creatives
     const {isFullMode} = this.props;
     if (!isFullMode && templateData) { // for component mode
@@ -111,6 +130,27 @@ class Creatives extends React.Component {
           edit: true,
           type: channel,
         };
+      } else if (channel === constants.CALL_TASK) {
+        creativesTeplateData = {
+          subject: templateData.subject,
+          messageBody: templateData.messageBody,
+          description: templateData.description,
+          edit: true,
+          type: channel,
+        };
+      } else if (channel === constants.MOBILE_PUSH) {
+        const mode = get(templateData, 'androidContent.type') || get(templateData, 'iosContent.type');
+        creativesTeplateData = {
+          type: channel,
+          name: templateData.messageSubject,
+          versions: {
+            base: {
+              ANDROID: templateData.androidContent,
+              IOS: templateData.iosContent,
+            },
+          },
+          definition: {accountId: templateData.accountId, mode: mode.toLowerCase()},
+        };
       }
       return creativesTeplateData;
     }
@@ -124,6 +164,28 @@ class Creatives extends React.Component {
     } else if (channel === constants.EMAIL && template.value.base) {
       templateData.emailBody = template.value.base.html_content;
       templateData.emailSubject = template.value.base.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;
+        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;
+        templateData.iosContent = iosContent;
+        templateData.iosContent.type = get(mobilpushTemplate, 'definition.mode').toUpperCase();
+        templateData.iosContent.deviceType = 'IOS';
+      }
+      templateData.messageSubject = mobilpushTemplate.name;
     }
     return templateData;
   };
@@ -138,6 +200,7 @@ class Creatives extends React.Component {
     }
     return creativesMode;
   }
+
   getFormData = (template) => {
     if (template.validity) {
       this.setState(
@@ -180,15 +243,20 @@ class Creatives extends React.Component {
     this.setState({ isGetFormData: true });
   };
   shouldShowFooter = () => {
-    const {isFullMode} = this.props;
-    const {slidBoxContent, currentChannel, emailCreateMode, templateStep} = this.state;
+    const {isFullMode } = this.props;
+    const {slidBoxContent, currentChannel, emailCreateMode, templateStep, mobilePushCreateMode} = this.state;
     const channel = currentChannel.toUpperCase();
     const currentStep = this.creativesTemplateSteps[templateStep];
     let showFooter = false;
+    const isMobilepush = channel === constants.MOBILE_PUSH;
     if (!isFullMode ) {
       const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL && currentStep !== 'createTemplateContent';
       const isCreate = (slidBoxContent === 'editTemplate' || slidBoxContent === 'createTemplate') && !isEmailCreate;
-      showFooter = (isCreate || (isEmailCreate && emailCreateMode) || slidBoxContent === 'preview');
+      const isCallTask = channel === 'CALLTASK';
+      showFooter = (isCreate || (isEmailCreate && emailCreateMode) || slidBoxContent === 'preview') && !isCallTask;
+      if (isMobilepush) {
+        showFooter = currentStep === "modeSelection" || (currentStep === 'createTemplateContent' && !isEmpty(mobilePushCreateMode));
+      }
     } else if (channel === constants.EMAIL && isFullMode) {
       const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL && currentStep !== 'createTemplateContent';
       showFooter = isEmailCreate && emailCreateMode;
@@ -208,23 +276,36 @@ class Creatives extends React.Component {
   shouldShowDoneFooter = () => {
     const {slidBoxContent, templateStep, currentChannel} = this.state;
     const currentStep = this.creativesTemplateSteps[templateStep];
-    const isEmailCreate = slidBoxContent === 'createTemplate' && currentChannel.toUpperCase() === constants.EMAIL && currentStep !== 'createTemplateContent';
-    const isCreate = (slidBoxContent === 'editTemplate' || slidBoxContent === 'createTemplate') && !isEmailCreate;
-    return isCreate;
+    let showDone = false;
+    const channel = currentChannel.toUpperCase();
+    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) {
+      showDone = currentStep === "createTemplateContent" || slidBoxContent === "editTemplate";
+    }
+
+    return showDone;
   }
   shouldShowContinueFooter = () => { // only for email for now, has to be modified according to channel
-    const {slidBoxContent, templateStep, currentChannel, emailCreateMode} = this.state;
+    const {slidBoxContent, templateStep, currentChannel, emailCreateMode, mobilePushCreateMode} = this.state;
     let isShowContinueFooter = false;
-    if ((emailCreateMode === "upload" && !isEmpty(this.props.EmailLayout)) || emailCreateMode === "editor") {
-      const currentStep = this.creativesTemplateSteps[templateStep];
-      let isEmailCreate = slidBoxContent === 'createTemplate';
-      isEmailCreate = currentChannel.toUpperCase() === constants.EMAIL && ((emailCreateMode === "upload" && currentStep !== 'createTemplateContent') || ( emailCreateMode === "editor" && currentStep !== 'createTemplateContent' && currentStep !== "templateSelection"));
-      isShowContinueFooter = isEmailCreate && emailCreateMode;
+    const currentStep = this.creativesTemplateSteps[templateStep];
+    const channel = currentChannel.toUpperCase();
+    if (channel === constants.EMAIL || channel === constants.SMS) {
+      if ((emailCreateMode === "upload" && !isEmpty(this.props.EmailLayout)) || emailCreateMode === "editor") {
+        let isEmailCreate = slidBoxContent === 'createTemplate';
+        isEmailCreate = currentChannel.toUpperCase() === constants.EMAIL && ((emailCreateMode === "upload" && currentStep !== 'createTemplateContent') || ( emailCreateMode === "editor" && currentStep !== 'createTemplateContent' && currentStep !== "templateSelection"));
+        isShowContinueFooter = isEmailCreate && emailCreateMode;
+      }
+    } else if (currentChannel.toUpperCase() === constants.MOBILE_PUSH) {
+      isShowContinueFooter = !isEmpty(mobilePushCreateMode) && currentStep === "modeSelection";
     }
+
     return isShowContinueFooter;
   }
   render() {
-    const {slidBoxContent, isGetFormData, showSlideBox, templateData, currentChannel, emailCreateMode, templateStep, isLoadingContent} = this.state;
+    const {slidBoxContent, isGetFormData, showSlideBox, templateData, currentChannel, emailCreateMode, templateStep, isLoadingContent, mobilePushCreateMode} = this.state;
     const {isFullMode, creativesMode, cap, isUploading} = this.props;
     return (
       <div className={classnames(`${classPrefix} ${isFullMode ? 'creatives-full-mode' : 'creatives-library-mode'}`)}>
@@ -250,6 +331,7 @@ class Creatives extends React.Component {
               location={this.props.location}
               messageDetails={this.props.messageDetails}
               getFormData={this.getFormData}
+              onCallTaskSubmit={this.onCallTaskSubmit}
               onCreateNew={this.onCreateNew}
               isGetFormData={isGetFormData}
               isFullMode={isFullMode}
@@ -258,10 +340,12 @@ class Creatives extends React.Component {
               onEmailModeChange={this.onEmailModeChange}//used when create is clicked in email
               emailCreateMode={emailCreateMode}// upload zip || use editor are values
               templateStep={this.creativesTemplateSteps[templateStep]}
-              onEmailNextStep={this.onEmailNextStep}
+              onCreateNextStep={this.onCreateNextStep}
               onResetStep={this.resetStep}
               cap={cap}
               setIsLoadingContent={this.setIsLoadingContent}
+              onMobilepushModeChange={this.onMobilepushModeChange}
+              mobilePushCreateMode={mobilePushCreateMode}
             />
           }
           footer={this.shouldShowFooter() &&
@@ -270,7 +354,7 @@ class Creatives extends React.Component {
               onSave={this.saveMessage}
               onEditTemplate={this.onEditTemplate}
               slidBoxContent={slidBoxContent}
-              onEmailNextStep={this.onEmailNextStep}
+              onCreateNextStep={this.onCreateNextStep}
               currentChannel={currentChannel.toUpperCase()}
               templateStep={this.creativesTemplateSteps[templateStep]}
               emailCreateMode={emailCreateMode}

package/containers/Email/_email.scss

@@ -77,7 +77,6 @@
   .ant-tabs-extra-content{
     flex: 1;
     align-self: flex-end;
-    padding: 4px;
     height: 42px;
   }
 

package/containers/Email/index.js

@@ -2540,6 +2540,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
             onItemClick={this.handleOnItemClick}
             colNumber={2}
             enablePagination
+            isLoading={this.props.Email.fetchingAllAssets}
           />
         </Pagination>
       </div>
@@ -2672,3 +2673,4 @@ function mapDispatchToProps(dispatch) {
 }
 
 export default UserIsAuthenticated(connect(mapStateToProps, mapDispatchToProps)(injectIntl(Email)));
+

package/containers/Line/Edit/_lineEdit.scss

@@ -19,7 +19,3 @@
   padding: 16px 16px 16px 0;
   border: solid 1px #D6D6D6;
 }
-.ant-radio-wrapper{
-  font-size: 14px;
-  font-family: 'open-sans';
-}

package/containers/MobilePush/Create/_mobilePushCreate.scss

@@ -19,7 +19,3 @@
   padding: 16px 16px 16px 0;
   border: solid 1px #D6D6D6;
 }
-.ant-radio-wrapper{
-  font-size: 14px;
-  font-family: 'open-sans';
-}

package/containers/MobilePush/Create/index.js

@@ -504,10 +504,12 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
   };
   getFormData = (e) => {
     console.log('posting final result', this.state.formData);
+    const templateData = this.getTransformedData(this.state.formData);
     const response = {
       action: "getFormData",
-      value: this.getTransformedData(this.state.formData),
+      value: templateData,
       validity: this.state.isFormValid,
+      type: templateData.type,
     };
     this.setState({checkValidation: true});
     if (e) {
@@ -2216,7 +2218,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
                 injectedTags={this.state.injectedTags ? this.state.injectedTags : {}}
                 onFormValidityChange={this.setFormValidity}
                 usingTabContainer
-                checkValidation={false}
+                checkValidation={this.state.checkValidation}
                 iosCtasData={this.state.iosCtasData}
                 tabKey={this.state.tabKey}
                 tabCount={2}

package/containers/MobilePush/Edit/_mobilePushCreate.scss

@@ -19,7 +19,3 @@
   padding: 16px 16px 16px 0;
   border: solid 1px #D6D6D6;
 }
-.ant-radio-wrapper{
-  font-size: 14px;
-  font-family: 'open-sans';
-}

package/containers/MobilePush/Edit/index.js

@@ -13,7 +13,7 @@ import { connect } from 'react-redux';
 import { Row, Col, Spin, Breadcrumb, notification } from 'antd';
 import { createStructuredSelector } from 'reselect';
 import { injectIntl, intlShape } from 'react-intl';
-import _ from 'lodash';
+import _, {get} from 'lodash';
 import {makeSelectEdit, makeSelectEditResponse, makeSelectTemplateDetailsResponse} from "../../MobilePush/Edit/selectors";
 import {makeSelectMetaEntities} from "../../Cap/selectors";
 import {getMessageObject} from "../../../utils/messageUtils";
@@ -186,9 +186,10 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     if (!_.isEmpty(this.state.schema)) {
       this.injectEvents(this.state.schema);
     }
-    if (this.props.location.query && typeof this.props.location.query.module === 'undefined') { // when this containers is imported from creatives library
-      if (this.props.params.id) {
-        this.props.actions.getTemplateDetails(this.props.params.id);
+    if (this.props.location.query && (typeof this.props.location.query.module === 'undefined' || this.props.isFullMode === false)) { // when this containers is imported from creatives library
+      const templateId = get(this, "props.params.id");
+      if (templateId) {
+        this.props.actions.getTemplateDetails(templateId);
       } else {
         this.props.actions.setTemplateDetails(this.props.templateData);
       }
@@ -213,11 +214,12 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     }
     if (nextProps.metaEntities && nextProps.metaEntities.layouts && nextProps.metaEntities.layouts.length > 0 && _.isEmpty(this.state.fullSchema)) {
       this.setState({fullSchema: nextProps.metaEntities.layouts[0].definition, schema: (nextProps.location.query.module === 'loyalty') ? nextProps.metaEntities.layouts[0].definition.textSchema : {}}, () => {
-        if (nextProps.location.query.module !== 'loyalty' && this.props.params.id !== 'temp') {
-          this.props.actions.getTemplateDetails(this.props.params.id);
+        const templateId = get(this, "props.params.id");
+        if (nextProps.location.query.module !== 'loyalty' && templateId && templateId !== 'temp') {
+          this.props.actions.getTemplateDetails(templateId);
         }
         const type = this.props.location.query.type;
-        if (type === 'embedded' && this.props.params.id === 'temp' && _.isEmpty(this.state.formData)) { // when his.props.params.id is temp that means mobile push template content will be passed from post message from parent with startTemplateCreation action
+        if (type === 'embedded' && templateId === 'temp' && _.isEmpty(this.state.formData)) { // when his.props.params.id is temp that means mobile push template content will be passed from post message from parent with startTemplateCreation action
           const response = {
             action: 'startTemplateCreation',
           };
@@ -595,7 +597,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       licenseCode: selectedWeChatAccount.sourceAccountIdentifier,
     };
     if (this.props.location.query && this.props.location.query.module !== 'dvs') {
-      obj.definition.mode = this.props.Edit.templateDetails.mode;
+      obj.definition.mode = this.props.Edit.templateDetails.mode || get(this, 'props.Edit.templateDetails.definition.mode');
     }
     const android = {};
     Object.keys(formData[0]).forEach((data) => {
@@ -2549,6 +2551,7 @@ Edit.propTypes = {
   supportedTags: PropTypes.array,
   getDefaultTags: PropTypes.string,
   templateData: PropTypes.object,
+  isFullMode: PropTypes.bool,
 };
 
 const mapStateToProps = createStructuredSelector({

package/containers/MobilePush/Edit/selectors.js

@@ -3,7 +3,8 @@ import { createSelector } from 'reselect';
 /**
  * Direct selector to the create state domain
  */
-const selectMobilePushEditDomain = () => (state) => state.get('edit');
+const selectMobilePushEditDomain = () => (state, props) => props.isFullMode === false ? state.get('mobileEdit') : state.get('edit'); // reducer injected as mobileEdit in library mode.
+
 
 /**
  * Other specific selectors