@capillarytech/creatives-library 2.0.78 → 2.0.80

package/components/CardGrid/index.js

@@ -71,6 +71,7 @@ CardGrid.defaultProps = {
   gutterSize: 16,
   colNumber: 4,
   className: '',
+  isLoading: false,
 };
 
 export default CardGrid;

package/components/FormBuilder/index.js

@@ -432,7 +432,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     if (this.props.schema.channel === 'SMS') {
         
       for (let count = 0; count < this.state.tabCount; count += 1) {
-        if (_.isEmpty(errorData[count]) && this.props.isNewVersionFlow) {
+        if (_.isEmpty(errorData[count])) {
           return;
         }
         const index = count + 1;
@@ -2079,7 +2079,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       const fileParams = {
         width: this.width,
         height: this.height,
-        error: file.size / (1e+6) > 5,
+        error: file.size / (1e+6) > 3,
       };
       this.callChildEvent({file, type: 'image', fileParams}, val, val.submitAction);
     };

package/containers/Line/Create/index.js

@@ -679,7 +679,7 @@ export class Line extends Component {
     console.log("schema line", schema);
     if (this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
       schema.standalone.sections.splice(0, 1);
-    } else if (this.props.location.query.type === 'embedded' && typeof this.props.location.query.mode !== 'undefined') {
+    } else if (this.props.location.query.type === 'embedded' && typeof this.props.location.query.module !== 'undefined') {
       delete schema.standalone;
     } else {
       schema.standalone.sections.splice(1, 1);

package/containers/MobilePush/Create/selectors.js

@@ -3,7 +3,7 @@ import { createSelector } from 'reselect';
 /**
  * Direct selector to the create state domain
  */
-const selectPushMessageCreateDomain = () => (state) => state.get('create');
+const selectPushMessageCreateDomain = () => (state) => state.get('mobileCreate');
 
 /**
  * Other specific selectors

package/containers/MobilePush/Edit/selectors.js

@@ -3,7 +3,7 @@ import { createSelector } from 'reselect';
 /**
  * Direct selector to the create state domain
  */
-const selectMobilePushEditDomain = () => (state) => state.get('edit');
+const selectMobilePushEditDomain = () => (state) => state.get('mobileEdit');
 
 /**
  * Other specific selectors

package/containers/Templates/index.js

@@ -1240,6 +1240,21 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     }
   }
 
+  isLoading = () => {
+    const lineLoader = (this.props.Templates.getAllTemplatesInProgress && this.state.channel.toLowerCase() === 'line');
+    const smsLoader = (this.props.Templates.getAllTemplatesInProgress && this.state.channel.toLowerCase() === 'sms');
+    const wechatLoader = (((this.state.selectedAccount !== '' && this.props.Templates.getAllTemplatesInProgress) || (this.props.Templates.fetchingWeCrmAccounts)) && this.state.channel.toLowerCase() === 'wechat');
+    const mobilePushLoader = (((this.props.Templates.getAllTemplatesInProgress) || (this.props.Templates.fetchingWeCrmAccounts)) && this.state.channel.toLowerCase() === 'mobilepush');
+    const emailLoader = ((this.props.Templates.getAllTemplatesInProgress || this.props.Templates.sendingFile) && this.state.channel.toLowerCase() === 'email');
+    const ebillLoader = ((this.props.Templates.getAllTemplatesInProgress || this.props.Templates.sendingFile) && this.state.channel.toLowerCase() === 'ebill');
+    const isLoading = ((wechatLoader !== undefined) ? wechatLoader : false) ||
+      (smsLoader !== undefined ? smsLoader : false) ||
+      (emailLoader !== undefined ? emailLoader : false) ||
+      (ebillLoader !== undefined ? ebillLoader : false) ||
+      (mobilePushLoader !== undefined ? mobilePushLoader : false) ||
+      (lineLoader !== undefined ? lineLoader : false);
+    return isLoading;
+  }
   renderDeleteConfirmationModal = () => {
     const modal =
     (<Modal
@@ -1259,6 +1274,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     return modal;
   };
 
+
   renderEmailPreviewModal() {
     const slideboxContent = (
       <div style={{height: "75vh", width: '55vw'}}>
@@ -1276,7 +1292,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       />
     );
   }
-
   render() {
     let pageHeaderText = '';
     const moduleName = this.props.location.query.module;
@@ -1492,18 +1507,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       }
     }
 
-    const lineLoader = (this.props.Templates.getAllTemplatesInProgress && this.state.channel.toLowerCase() === 'line');
-    const smsLoader = (this.props.Templates.getAllTemplatesInProgress && this.state.channel.toLowerCase() === 'sms');
-    const wechatLoader = (((this.state.selectedAccount !== '' && this.props.Templates.getAllTemplatesInProgress) || (this.props.Templates.fetchingWeCrmAccounts)) && this.state.channel.toLowerCase() === 'wechat');
-    const mobilePushLoader = (((this.props.Templates.getAllTemplatesInProgress) || (this.props.Templates.fetchingWeCrmAccounts)) && this.state.channel.toLowerCase() === 'mobilepush');
-    const emailLoader = ((this.props.Templates.getAllTemplatesInProgress || this.props.Templates.sendingFile) && this.state.channel.toLowerCase() === 'email');
-    const ebillLoader = ((this.props.Templates.getAllTemplatesInProgress || this.props.Templates.sendingFile) && this.state.channel.toLowerCase() === 'ebill');
-    const isLoading = ((wechatLoader !== undefined) ? wechatLoader : false) ||
-      (smsLoader !== undefined ? smsLoader : false) ||
-      (emailLoader !== undefined ? emailLoader : false) ||
-      (ebillLoader !== undefined ? ebillLoader : false) ||
-      (mobilePushLoader !== undefined ? mobilePushLoader : false) ||
-      (lineLoader !== undefined ? lineLoader : false);
+
     let previewHeader = this.props.intl.formatMessage(messages.preview);
     // const previewHeader = (this.state.channel.toLowerCase() === 'email' ? <h3>{this.props.intl.formatMessage(messages.emailPreview)}</h3> : <h3>{this.props.intl.formatMessage(messages.ebillPreview)}</h3>);
     if (this.state.channel.toLowerCase() === 'email' || this.state.channel.toLowerCase() === 'ebill') {
@@ -1538,7 +1542,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       <div>
         <Spin
           tip={(this.props.Templates.sendingFile && (this.state.channel.toLowerCase() === 'email' || this.state.channel.toLowerCase() === 'ebill')) ? this.props.intl.formatMessage(messages.uploadingFile) : this.props.intl.formatMessage(messages.gettingAllTemplates)}
-          spinning={isLoading}
+          spinning={this.isLoading()}
         >
           <input type="file" id="filename" style={{ display: 'none'}} accept=".zip, .html, .htm" onChange={(event) => this.handleFileUpload(event, {files: event.target.files})} />
           <Row>

package/containers/WeChat/actions.js

@@ -44,9 +44,3 @@ export function getTemplateDetails(id) {
     type: types.GET_TEMPLATE_DETAILS_REQUEST, id,
   };
 }
-export function setTemplateDetails(templateDetails) {
-  return {
-    type: types.GET_TEMPLATE_DETAILS_SUCCESS,
-    data: templateDetails,
-  };
-}

package/containers/WeChat/index.js

@@ -4,14 +4,13 @@
  *
  */
 
-import PropTypes from 'prop-types';
-
-import React from 'react';
+import React, { PropTypes } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import Helmet from 'react-helmet';
 import { injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
+// import { CapButton, CapSelect } from '@capillarytech/cap-react-ui-library';
 import { Row, Col, Spin } from 'antd';
 import _ from 'lodash';
 import { makeSelectTemplates } from '../Templates/selectors';
@@ -22,12 +21,10 @@ import * as actions from './actions';
 import FormBuilder from '../../components/FormBuilder';
 import { UserIsAuthenticated } from '../../utils/authWrapper';
 import * as globalActions from '../../containers/Cap/actions';
-import * as templateActions from '../../containers/Templates/actions';
 import {getMessageObject} from '../../utils/messageUtils';
 // import SlideBox from '../../components/SlideBox';
 // import PageHeader from '../../components/PageHeader';
 import './_wechat.scss';
-import callNativeEvent from '../../utils/callNativeEvent';
 
 // const Option = Select.Option;
 
@@ -404,7 +401,6 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
           sortBy: 'Most Recent',
           wecrmId: this.props.Templates.selectedWeChatAccount.configs.wecrm_app_id,
           wecrmToken: this.props.Templates.selectedWeChatAccount.configs.wecrm_token,
-          originalId: this.props.Templates.selectedWeChatAccount.sourceAccountIdentifier,
         };
         this.props.actions.getDefaultWeChatTemplates('wechat', params);
       } else {
@@ -437,7 +433,7 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
   }
 
   componentWillReceiveProps(nextProps) {
-    if (nextProps.isGetFormData) {
+    if (nextProps.location.query.module === 'library' && nextProps.isGetFormData) {
       this.getFormData();
     }
     console.log('MetaEntity nextprops ', nextProps.metaEntities);
@@ -485,7 +481,7 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
         this.setState({isEdit: true});
       }
       if (this.state.isEdit && _.isEmpty(this.state.editTemplateData) && !_.isEmpty(nextProps.WeChat.weChatTemplates)) {
-        const templateIndex = _.findIndex(nextProps.WeChat.weChatTemplates, {_id: nextProps.params.id});
+        const templateIndex = _.findIndex(nextProps.WeChat.weChatTemplates, {"_id": nextProps.params.id});
         this.setState({editTemplateData: nextProps.WeChat.weChatTemplates[templateIndex]}, () => {
           if (_.isEmpty(this.state.baseSchema)) {
             this.setState({ baseSchema: _.cloneDeep(this.state.schema)}, () => {
@@ -545,7 +541,6 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
           sortBy: 'Most Recent',
           wecrmId: nextProps.WeChat.selectedWeChatAccount.configs.wecrm_app_id,
           wecrmToken: nextProps.WeChat.selectedWeChatAccount.configs.wecrm_token,
-          originalId: nextProps.WeChat.selectedWeChatAccount.sourceAccountIdentifier,
         };
         this.props.actions.getDefaultWeChatTemplates('wechat', params);
       }
@@ -602,11 +597,11 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
   componentWillUnmount() {
     console.log('removed listener create');
     window.removeEventListener("message", this.handleFrameTasks);
-    this.props.templateActions.resetTemplate();
     this.resetState();
   }
 
   onFormDataChange(formData) {
+    console.log('Form Data Change ', formData);
     let selectedWechatTemplateIndex = -1;
     let selectedTemplate = {};
     let selectedTemplateData = {};
@@ -645,7 +640,6 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
       selectedWechatTemplateIndex = _.findIndex(this.props.WeChat.weChatDefaultTemplate, {template_id: formData['wechat-template']});
       selectedTemplate = this.props.WeChat.weChatDefaultTemplate[selectedWechatTemplateIndex];
     }
-
     if (!_.isEqual(formData['wechat-template'], this.state.formData['wechat-template'])) {
       this.updateSchema = true;
     }
@@ -698,8 +692,8 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
     console.log('posting final result', this.state.formData, this.state.editTemplateData);
     const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.WeChat.selectedWeChatAccount);
     const data = {
-      template_id: this.state.editTemplateData.versions.base.template_id,
-      Title: this.state.editTemplateData.versions.base.Title,
+      "template_id": this.state.editTemplateData.versions.base.template_id,
+      "Title": this.state.editTemplateData.versions.base.Title,
       Tag: [],
       url: this.state.formData['is-internal-url'] ? this.maskTemplateUrl(this.state.formData['template-link']) : this.state.formData['template-link'],
       TopColor: "#000000",
@@ -710,7 +704,6 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
       content: this.state.editTemplateData.versions.base.content,
       isInternalUrl: this.state.formData['is-internal-url'],
       creative_template_id: this.state.editTemplateData._id,
-      touser: "{{wechat_open_id}}",
     };
     _.forEach(this.state.selectedTemplateTags, (templateTag) => {
       const tagName = templateTag.substr(0, templateTag.indexOf('.'));
@@ -1153,15 +1146,10 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
 
   setTemplateOptions(weChatData) {
     console.log('Set Templates ', weChatData);
-    //const {schema, baseSchema} = this.state;
-    const schema = _.cloneDeep(this.state.schema);
-    const baseSchema = _.cloneDeep(this.state.baseSchema);
+    const {schema, baseSchema} = this.state;
+    // const schema = _.cloneDeep(this.state.schema);
+    // const baseSchema = _.cloneDeep(this.state.baseSchema);
     const baseSchemaTemplateOptionEmpty = (!_.isEmpty(baseSchema) && _.isEmpty(baseSchema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options));
-    schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options = [];
-    if (!_.isEmpty(baseSchema)) {
-      baseSchema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options = [];
-    
-    } 
     _.forEach(weChatData, (template) => {
       schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].options.push({
         key: (template.versions) ? template.versions.base.template_id : template.template_id,
@@ -1296,7 +1284,7 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
       myField.value += myValue;
     }
     const event = new Event('input', { bubbles: true });
-    callNativeEvent({field, value: myField.value, event});
+    myField.dispatchEvent(event);
   }
 
   internalUrlChecked() {
@@ -1558,10 +1546,6 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
     //     value: 'Test3',
     //   },
     // ];
-    let tags = this.props.metaEntities && this.props.metaEntities.tags ? this.props.metaEntities.tags.standard : [];
-    if (this.props.supportedTags) {
-      tags = this.props.supportedTags;
-    }
     return (
       <Spin
         tip={this.props.intl.formatMessage(messages.gettingTemplateData)}
@@ -1570,6 +1554,7 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
         <Helmet
           title="WeChat"
         />
+        {/* <CapSelect options={options} /> */}
         <Row className="wechat-container">
           <Col>
             <FormBuilder
@@ -1583,7 +1568,7 @@ export class WeChat extends React.Component { // eslint-disable-line react/prefe
               formData={_.cloneDeep(this.state.formData)}
               onFormValidityChange={this.setFormValidity}
               location= {this.props.location}
-              tags={tags}
+              tags={this.props.metaEntities && this.props.metaEntities.tags ? this.props.metaEntities.tags.standard : []}
               tagModule={this.props.getDefaultTags}
               injectedTags={this.state.injectedTags ? this.state.injectedTags : {}}
               isEdit={this.state.isEdit}
@@ -1614,8 +1599,6 @@ WeChat.propTypes = {
   isGetFormData: PropTypes.bool,
   getLibraryFormData: PropTypes.func,
   getDefaultTags: PropTypes.string,
-  templateData: PropTypes.object,
-  templateActions: PropTypes.object,
 };
 
 const mapStateToProps = createStructuredSelector({
@@ -1628,7 +1611,6 @@ function mapDispatchToProps(dispatch) {
   return {
     actions: bindActionCreators(actions, dispatch),
     globalActions: bindActionCreators(globalActions, dispatch),
-    templateActions: bindActionCreators(templateActions, dispatch),
   };
 }
 

package/index.js

@@ -23,9 +23,9 @@ import CallTask from './v2Containers/CallTask/index';
 import callTaskReducer from './v2Containers/CallTask/reducer';
 import callTaskSaga from './v2Containers/CallTask/sagas';
 
-import WeChat from './containers/WeChat/MapTemplates';
-import wechatReduce from './containers/WeChat/MapTemplates/reducer';
-import wechatSaga from './containers/WeChat/MapTemplates/sagas';
+import WeChat from './v2Containers/WeChat/MapTemplates';
+import wechatReduce from './v2Containers/WeChat/MapTemplates/reducer';
+import wechatSaga from './v2Containers/WeChat/MapTemplates/sagas';
 
 import MobilepushCreate from './v2Containers/MobilePush/Create';
 import mobilepushCreateReducer from './v2Containers/MobilePush/Create/reducer';
@@ -96,4 +96,5 @@ export { CapContainer,
   MobilePushEditContainer,
   TemplatesV2Container,
   CreativesContainer,
+  WeChat,
 };

package/package.json

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

package/routes.js

@@ -612,10 +612,10 @@ export default function createRoutes(store) {
           import('v2Containers/Email/sagas'),
           import('v2Containers/CallTask/reducer'),
           import('v2Containers/CallTask/sagas'),
-          import('v2Containers/Mobilepush/Create/sagas'),
-          import('v2Containers/Mobilepush/Create/reducer'),
-          import('v2Containers/Mobilepush/Edit/sagas'),
-          import('v2Containers/Mobilepush/Edit/reducer'),
+          import('v2Containers/MobilePush/Create/sagas'),
+          import('v2Containers/MobilePush/Create/reducer'),
+          import('v2Containers/MobilePush/Edit/sagas'),
+          import('v2Containers/MobilePush/Edit/reducer'),
           import('v2Containers/Assets/Gallery/reducer'),
           import('v2Containers/Assets/Gallery/sagas'),
         ]);

package/v2Containers/MobilePush/Create/_mobilePushCreate.scss

@@ -35,7 +35,16 @@
       }  
     }
   }
-  
+  .tag-container{
+    .ant-col{
+      button{
+        float: right;
+        top: 8px;
+        z-index: 100;
+        padding: unset !important;;
+      }
+    }
+  }
   
   
 }

package/v2Containers/MobilePush/Create/index.js

@@ -14,7 +14,7 @@ import {get, set, filter, isEmpty, map, forEach, uniqueId, cloneDeep, isEqual, f
 import { createStructuredSelector } from 'reselect';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import styled from 'styled-components';
-import { CapSlideBox, CapHeader, CapTable, CapLink, CapRow, CapColumn, CapIcons, CapSpin} from '@capillarytech/cap-ui-library';
+import { CapSlideBox, CapHeader, CapTable, CapLink, CapRow, CapColumn, CapIcons, CapSpin, CapNotification } from '@capillarytech/cap-ui-library';
 import { makeSelectCreate, makeSelectCreateResponse, makeSelectIosCta } from './selectors';
 import { makeSelectMetaEntities, setInjectedTags } from '../../Cap/selectors';
 import * as globalActions from '../../../containers/Cap/actions';
@@ -1260,8 +1260,11 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
   };
   uploadImage = (data) => {
     if (data.fileParams.error) {
-      const message = getMessageObject('error', this.props.intl.formatMessage(messages["File size cannot be more than 5mb"]), true);
-      this.props.globalActions.addMessageToQueue(message);
+      CapNotification.error({
+        message: this.props.intl.formatMessage(messages.uploadImageSizeErrorTitle),
+        description: this.props.intl.formatMessage(messages.uploadImageSizeErrorDescription),
+        duration: 2,
+      });
     } else {
       const name = data.file.name.split('.');
       const blob = data.file.slice(0, -1, 'image');
@@ -1351,7 +1354,6 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
   };
   saveFormData = (formData) => {
     const obj = this.getTransformedData(formData);
-
     this.props.actions.createTemplate(obj);
   };
   deleteSecondaryCtaIos = (callback) => {

package/v2Containers/MobilePush/Create/messages.js

@@ -238,4 +238,12 @@ export default defineMessages({
     id: 'app.containers.MobilePush.Create.mobilePush',
     defaultMessage: 'Select action buttons',
   },
+  "uploadImageSizeErrorTitle": {
+    id: 'app.containers.MobilePush.Create.uploadImageSizeErrorTitle',
+    defaultMessage: 'File size error',
+  },
+  "uploadImageSizeErrorDescription": {
+    id: 'app.containers.MobilePush.Create.uploadImageSizeErrorDescription',
+    defaultMessage: 'File size cannot be more than 3mb',
+  },
 });

package/v2Containers/MobilePush/Create/selectors.js

@@ -1,9 +1,10 @@
 import { createSelector } from 'reselect';
+import { fromJS } from 'immutable';
 
 /**
  * Direct selector to the create state domain
  */
-const selectPushMessageCreateDomain = () => (state) => state.get('mobileCreate');
+const selectPushMessageCreateDomain = () => (state) => state.get('mobileCreate') || fromJS({});
 /**
  * Other specific selectors
  */

package/v2Containers/MobilePush/Edit/_mobilePushCreate.scss

@@ -34,5 +34,15 @@
       }  
     }
   }
+  .tag-container{
+    .ant-col{
+      button{
+        float: right;
+        top: 8px;
+        z-index: 100;
+        padding: unset !important;;
+      }
+    }
+  }
   
 }

package/v2Containers/MobilePush/Edit/selectors.js

@@ -1,9 +1,10 @@
 import { createSelector } from 'reselect';
+import { fromJS } from 'immutable';
 
 /**
  * Direct selector to the create state domain
  */
-const selectMobilePushEditDomain = () => (state) => state.get('mobileEdit'); // reducer injected as mobileEdit in library mode.
+const selectMobilePushEditDomain = () => (state) => state.get('mobileEdit') || fromJS({}); // reducer injected as mobileEdit in library mode.
 
 
 /**