@capillarytech/creatives-library 3.0.4 → 3.0.6

package/components/FormBuilder/index.js

@@ -247,7 +247,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
   }
 
-  onEdit(data, e) {
+  onEdit() {
 
   }
 
@@ -307,7 +307,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     });
   }
 
-  handleCloseModal = (data, e) => {
+  handleCloseModal = () => {
     const event = this.state.currentEvent;
     if (!_.isEmpty(this.state.currentEvent)) {
       switch (event) {
@@ -467,15 +467,15 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         const tagValidationResponse = this.validateTags(content, tags, injectedTags);
         
         if (tagValidationResponse.valid) {
-          errorData['0']['message-editor'] = false;
+          _.set(errorData, `['0']['message-editor']`, false);
         } else {
           
-          errorData['0']['message-editor'] = true;
+          _.set(errorData, `['0']['message-editor']`, true);
           isValid = false;
         }
         if (content.trim() === '') {
           
-          errorData['0']['message-editor'] = true;
+          _.set(errorData, `['0']['message-editor']`, true);
           isValid = false;
         }
       }
@@ -485,19 +485,19 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         const imgContentLengthPreview = this.state.formData['0'].imagePreview.length;
         if ( (imgContentLength < 1) && (imgContentLengthPreview < 1) ) {
           
-          errorData['0'].image = true;
-          errorData['0'].imagePreview = true;
+          _.set(errorData, `['0'].image`, true);
+          _.set(errorData, `['0'].imagePreview`, true);
           isValid = false;
         }else{
-          errorData['0'].image = false;
-          errorData['0'].imagePreview = false;
+          _.set(errorData, `['0'].image`, false);
+          _.set(errorData, `['0'].imagePreview`, false);
         }
       }
       if(type !== 'embedded' && (!this.state.formData['template-name'] || this.state.formData['template-name'] === '')) {
-        errorData['template-name'] = true;
+        _.set(errorData, `['template-name']`, true);
         isValid = false;
       } else {
-        errorData['template-name'] = false;
+        _.set(errorData, `['template-name']`, false);
       }
     }
 
@@ -1068,7 +1068,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     this.setState({errorData});
   }
 
-  initializeMultiColSection(section, formDataObj, isContainer, index, ifError, paneIndex) {
+  initializeMultiColSection(section, formDataObj, isContainer, index, ifError) {
     const formData = _.cloneDeep(formDataObj);
     const newFormData = {};
     newFormData[index] = {};
@@ -1298,7 +1298,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     this.setState({formData, errorData}, () => {
       this.validateForm();
       if (this.props.isSchemaChanged || resetTabKeys) {
-        this.resetTabKeys(formData, this.props.tabCount, true);
+        this.resetTabKeys(this.state.formData, this.props.tabCount, true);
       }
     });
   }
@@ -1802,7 +1802,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
     return true;
   };
-  callChildEvent(data, val, event, e) {
+  callChildEvent(data, val, event) {
     if (!event) {
       return;
     }
@@ -2834,7 +2834,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 key={`icon-${val.id}`}
                 id={val.id}
                 offset={val.offset}
-                width={val.width ? val.width : 1}
+                span={val.width ? val.width : 1}
                 onClick={(data) => this.callChildEvent(data, val, val.submitAction)}
                 className={val.className ? val.className : ''}
                 style={val.colStyle ? val.colStyle : {}}

package/containers/Dashboard/index.js

@@ -12,6 +12,11 @@ import * as actions from './actions';
 import PageHeader from '../../components/PageHeader';
 import BreadCrumbs from '../../components/BreadCrumbs/index';
 export class Dashboard extends React.Component { // eslint-disable-line react/prefer-stateless-function
+  componentWillMount() {
+    this.props.router.push({
+      pathname: `/sms`,
+    });
+  }
   render() {
     const breadCrumbLocations = [
       {

package/containers/Email/index.js

@@ -1758,9 +1758,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         "base": {},
       };
       const baseData = {};
-      const baseLanguage = props.Global.currentOrgDetails.basic_details.base_language;
+      const baseLanguage = props.Global.currentOrgDetails.basic_details.base_language || 'en';
       this.supportedLanguages = props.Global.currentOrgDetails.basic_details.supported_languages;
-      const languageObject = this.supportedLanguages[_.findIndex(this.supportedLanguages, {iso_code: baseLanguage})];
+      const languageObject = this.supportedLanguages[_.findIndex(this.supportedLanguages, {iso_code: baseLanguage})] || {iso_code: baseLanguage || 'en', lang_id: -1, language: baseLanguage || "English"};
       baseData.activeTab = baseLanguage;
       baseData[languageObject.iso_code] = {};
       baseData[languageObject.iso_code].is_drag_drop = false;
@@ -2000,6 +2000,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     });
     console.log('HandleHideMarkAsFinal ', JSON.stringify(schema));
     this.setState({schema, isSchemaChanged: true});
+    return schema;
   }
 
   showSubject = () => {
@@ -2493,14 +2494,14 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
             const baseLanguage = this.props.Global.currentOrgDetails && this.props.Global.currentOrgDetails.basic_details && this.props.Global.currentOrgDetails.basic_details.base_language && this.props.Global.currentOrgDetails.basic_details.base_language !== "" ? this.props.Global.currentOrgDetails.basic_details.base_language : 'en';
             const supportedLanguages = this.props.Global.currentOrgDetails.basic_details.supported_languages;
             if (!supportedLanguages) {
-              tempEl.value = 'English';
+              tempEl.value = baseLanguage || 'English';
               return;
             }
             const langObject = supportedLanguages.find( (lang) => lang.iso_code === baseLanguage);
             if (langObject) {
               tempEl.value = langObject.language;
             } else {
-              tempEl.value = 'English';
+              tempEl.value = baseLanguage || 'English';
             }
           }
         });

package/containers/Line/Create/index.js

@@ -62,7 +62,7 @@ export class Line extends Component {
     this.state = {
       schema: {},
       isSchemaChanged: false,
-      formData: {},
+      formData: {0: {}},
       tabCount: 1,
       currentTab: 1,
       loading: false,
@@ -757,7 +757,7 @@ export class Line extends Component {
         </Row>
         <Row>
           <Col>
-            <FormBuilder
+            {!_.isEmpty(this.state.schema) && <FormBuilder
               key={"form builder"}
               schema={this.state.schema}
               onSubmit={this.saveFormData}
@@ -781,7 +781,7 @@ export class Line extends Component {
               router={this.props.router}
               onContextChange={this.handleOnTagsContextChange}
               setModalContent={this.setModalContent}
-            />
+            /> }
           </Col>
         </Row>
       </Spin>

package/containers/MobilePush/Edit/index.js

@@ -1967,7 +1967,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
   addPrimaryCta = (ev, field, inputSchema) => {
     const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
-    const id = field ? field.id : ev.target.id;
+    const id = ev ? ev.target.id : field.id;
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;
     const deepLinkOptions = selectedWeChatAccount ? _.map(JSON.parse(ck ? selectedWeChatAccount.configs.deeplink : '[]'), (link) => ({label: link.name, value: link.link, title: link.link }) ) : [];
@@ -2099,7 +2099,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   };
 
   addSecondoryCta = (ev, field, inputSchema) => {
-    const id = field ? field.id : ev.target.id;
+    const id = ev ? ev.target.id : field.id;
     const schema = inputSchema ? _.cloneDeep(inputSchema) : _.cloneDeep(this.state.schema);
     const selectedWeChatAccount = (!_.isEmpty(this.props.Templates.selectedWeChatAccount) ? this.props.Templates.selectedWeChatAccount : this.props.Edit.selectedWeChatAccount);
     const ck = selectedWeChatAccount.configs ? !!selectedWeChatAccount.configs.deeplink : false;

package/containers/WeChat/MapTemplates/index.js

@@ -114,6 +114,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
     this.injectMultiColSection = this.injectMultiColSection.bind(this);
     this.getMappedEvent = this.getMappedEvent.bind(this);
     this.showNext = this.showNext.bind(this);
+    this.getFormData = this.getFormData.bind(this);
     this.updateSchema = false;
     this.fetchedWeCrmAccount = false;
     this.isAccountChange = false;
@@ -329,6 +330,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
     let selectedTemplate = {};
     let selectedTemplateData = {};
     if (this.props.location.query.type === 'embedded' && (this.props.location.query.module === 'loyalty')) {
+      selectedTemplateData = this.state.editTemplateData;
       if (this.props.params.id && _.isEmpty(this.props.WeChat.weChatTemplates) && _.isEqual(formData['wechat-template'], this.state.formData['wechat-template'])) {
         console.log('In If', formData['wechat-template']);
         selectedTemplate = {
@@ -338,9 +340,9 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
         };
         selectedTemplateData = this.props.WeChat.templateDetails;
       } else {
-        console.log('In Else', formData['wechat-template']);
+        const editTemplateData = this.state.editTemplateData;
         _.forEach(this.props.WeChat.weChatTemplates, (template) => {
-          if (template.versions.base.template_id === formData['wechat-template']) {
+          if (template.versions.base.template_id === formData['wechat-template'] && formData['wechat-template'] !== _.get(editTemplateData, 'versions.base.template_id') ) { // not changing if already selected templates comes
             selectedTemplate = {
               template_id: template.versions.base.template_id,
               title: template.versions.base.Title,
@@ -370,57 +372,63 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
     if (this.isAccountChange) {
       selectedTemplateData = {};
     }
-    this.setState({formData, editTemplateData: selectedTemplateData}, () => {
-      if (!_.isEmpty(this.state.editTemplateData) && this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
-        this.setEditData();
-      }
-      if (this.props.WeChat.selectedWeChatAccount && !_.isEqual(this.props.WeChat.selectedWeChatAccount.name, formData['wechat-accounts']) && this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
-        let selectedAccount = {};
-        _.forEach(this.props.WeChat.weCrmAccounts, (account) => {
-          if (account.configs && account.configs.is_wecrm_enabled) {
-            if (account.name === formData['wechat-accounts']) {
-              selectedAccount = account;
+    const newState = {formData};
+    if (!_.isEqual(this.state.editTemplateData, selectedTemplateData)) {
+      newState.editTemplateData = selectedTemplateData;
+    }
+    if (!_.isEqual(this.state.formData, formData)) {
+      this.setState(newState, () => {
+        if (!_.isEmpty(this.state.editTemplateData) && this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
+          this.setEditData();
+        }
+        if (this.props.WeChat.selectedWeChatAccount && !_.isEqual(this.props.WeChat.selectedWeChatAccount.name, formData['wechat-accounts']) && this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
+          let selectedAccount = {};
+          _.forEach(this.props.WeChat.weCrmAccounts, (account) => {
+            if (account.configs && account.configs.is_wecrm_enabled) {
+              if (account.name === formData['wechat-accounts']) {
+                selectedAccount = account;
+              }
             }
-          }
-        });
-        this.props.actions.setWeChatAccount(selectedAccount);
-        this.setSelectedTemplateData({});
-      }
-      if ((selectedWechatTemplateIndex !== -1 || this.state.isEdit) && !_.isEmpty(selectedTemplate)) {
-        let templateData = {};
-        if (this.state.isEdit && !_.isEmpty(this.state.editTemplateData)) {
-          templateData = {
-            template_id: this.state.editTemplateData.versions.base.template_id,
-            title: this.state.editTemplateData.versions.base.Title,
-            content: this.state.editTemplateData.versions.base.content,
-          };
-          if (this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
-            if (_.isEqual(this.props.WeChat.selectedWeChatAccount.name, formData['wechat-accounts'])) {
-              this.setSelectedTemplateData(selectedTemplate);
+          });
+          this.props.actions.setWeChatAccount(selectedAccount);
+          this.setSelectedTemplateData({});
+        }
+        if ((selectedWechatTemplateIndex !== -1 || this.state.isEdit) && !_.isEmpty(selectedTemplate)) {
+          let templateData = {};
+          if (this.state.isEdit && !_.isEmpty(this.state.editTemplateData)) {
+            templateData = {
+              template_id: this.state.editTemplateData.versions.base.template_id,
+              title: this.state.editTemplateData.versions.base.Title,
+              content: this.state.editTemplateData.versions.base.content,
+            };
+            if (this.props.location.query.type === 'embedded' && this.props.location.query.module === 'loyalty') {
+              if (_.isEqual(this.props.WeChat.selectedWeChatAccount.name, formData['wechat-accounts'])) {
+                this.setSelectedTemplateData(selectedTemplate);
+              }
+            } else {
+              const templateTags = this.getTagsFromContent(templateData.content);
+              this.prepareWeChatPreviewData(templateData, templateTags);
             }
+          } else if (!this.updateSchema) {
+            const templateTags = this.getTagsFromContent(selectedTemplate.content);
+            this.prepareWeChatPreviewData(selectedTemplate, templateTags);
           } else {
-            const templateTags = this.getTagsFromContent(templateData.content);
-            this.prepareWeChatPreviewData(templateData, templateTags);
+            this.updateSchema = false;
+            this.setSelectedTemplateData(selectedTemplate);
           }
-        } else if (!this.updateSchema) {
-          const templateTags = this.getTagsFromContent(selectedTemplate.content);
-          this.prepareWeChatPreviewData(selectedTemplate, templateTags);
         } else {
-          this.updateSchema = false;
-          this.setSelectedTemplateData(selectedTemplate);
-        }
-      } else {
-        let selectedAccount = {};
-        _.forEach(this.props.WeChat.weCrmAccounts, (account) => {
-          if (account.configs && account.configs.is_wecrm_enabled) {
-            if (account.name === formData['wechat-accounts']) {
-              selectedAccount = account;
+          let selectedAccount = {};
+          _.forEach(this.props.WeChat.weCrmAccounts, (account) => {
+            if (account.configs && account.configs.is_wecrm_enabled) {
+              if (account.name === formData['wechat-accounts']) {
+                selectedAccount = account;
+              }
             }
-          }
-        });
-        this.props.actions.setWeChatAccount(selectedAccount);
-      }
-    });
+          });
+          this.props.actions.setWeChatAccount(selectedAccount);
+        }
+      });
+    }
   }
 
   onTagSelect(data, currentTab, value) {
@@ -1037,10 +1045,8 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
       myField.value += myValue;
     }
     const formData = _.cloneDeep(this.state.formData);
-    if (currentTab) {
-      formData[currentTab - 1][field.id] = myField.value;
-    }
-    this.setState({formData});
+    formData[field.id] = myField.value;
+    this.onFormDataChange(formData);
   }
 
   internalUrlChecked() {
@@ -1155,15 +1161,15 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
   }
 
   hideSchemaElementsByModule(schema) {
-    schema.standalone.sections[0].childSections[0].inputFields[0].cols[0].colStyle.display = (this.props.location.query.type === 'embedded' ? 'none' : 'block');
-    schema.standalone.sections[0].childSections[0].inputFields[0].cols[1].colStyle.display = (this.props.location.query.type === 'embedded' ? 'none' : 'block');
-    schema.standalone.sections[0].childSections[0].inputFields[0].cols[2].colStyle.display = (this.props.location.query.type === 'embedded' ? 'none' : 'block');
-    schema.standalone.sections[0].childSections[0].inputFields[0].cols[3].colStyle.display = (this.props.location.query.type === 'embedded' ? 'none' : 'block');
+    _.set(schema, 'standalone.sections[0].childSections[0].inputFields[0].cols[0].colStyle.display',  this.props.location.query.type === 'embedded' ? 'none' : 'block');
+    _.set(schema, 'standalone.sections[0].childSections[0].inputFields[0].cols[1].colStyle.display', this.props.location.query.type === 'embedded' ? 'none' : 'block');
+    _.set(schema, 'standalone.sections[0].childSections[0].inputFields[0].cols[2].colStyle.display', this.props.location.query.type === 'embedded' ? 'none' : 'block');
+    _.set(schema, 'standalone.sections[0].childSections[0].inputFields[0].cols[3].colStyle.display', this.props.location.query.type === 'embedded' ? 'none' : 'block');
 
-    schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[0].labelStyle.display = (this.props.location.query.module === 'loyalty' ? 'block' : 'none');
-    schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[0].style.display = (this.props.location.query.module === 'loyalty' ? 'block' : 'none');
+    _.set(schema, 'standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[0].labelStyle.display', this.props.location.query.module === 'loyalty' ? 'block' : 'none');
+    _.set(schema, 'standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[0].style.display', this.props.location.query.module === 'loyalty' ? 'block' : 'none');
 
-    schema.standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].disabled = (this.props.params.id && this.props.location.query.module !== 'loyalty');
+    _.set(schema, 'standalone.sections[0].childSections[1].childSections[0].childSections[0].inputFields[1].disabled', this.props.params.id && this.props.location.query.module !== 'loyalty');
     return schema;
   }
 

package/containers/WeChat/RichmediaTemplates/Create/index.js

@@ -14,7 +14,7 @@ import { createStructuredSelector } from 'reselect';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import _ from 'lodash';
 import { Menu, Dropdown } from 'antd';
-import { CapRow, CapColumn, CapButton, CapCard, CapSpin } from '@capillarytech/cap-react-ui-library';
+import { CapRow, CapColumn, CapButton, CapCard, CapSpinner } from '@capillarytech/cap-react-ui-library';
 import makeSelectCreate, {makeSelectTemplates, getAssetDetails, getContentAssetDetails} from './selectors';
 import * as actions from './actions';
 import richmediaschema from './richmediaschema';
@@ -970,7 +970,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
     }
     return (
       <div className="richmedia-container">
-        <CapSpin spinning={this.state.loading}>
+        <CapSpinner spinning={this.state.loading}>
           {this.state.showPreview && <WechatRichmediaTemplatePreview
             show={this.state.showPreview}
             closeSlideBox={this.closeSlideBox}
@@ -1012,7 +1012,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
               </CapRow>
             </div>
           </div>
-        </CapSpin>
+        </CapSpinner>
       </div>
     );
   }

package/index.html

@@ -7,6 +7,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <!-- Allow installing the app to the homescreen -->
     <meta name="mobile-web-app-capable" content="yes">
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
+    <meta http-equiv="Pragma" content="no-cache" />
+    <meta http-equiv="Expires" content="0" />
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
     <script src="https://use.typekit.net/ifw1ntv.js"></script>
     <!-- Roboto Font -->

package/package.json

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

package/routes.js

@@ -604,7 +604,6 @@ export default function createRoutes(store) {
           import('v2Containers/TemplatesV2'),
           import('v2Containers/Cap/reducer'),
           import('v2Containers/Cap/sagas'),
-          import('v2Containers/Email/sagas'),
           import('v2Containers/CreativesContainer/reducer'),
           import('v2Containers/Sms/Create/reducer'),
           import('v2Containers/Sms/Create/sagas'),
@@ -627,7 +626,7 @@ export default function createRoutes(store) {
         importModules.then(([reducer,
           sagas, component,
           capReducer, capSagas,
-          emailContainerSagas, creativesContainerReducer,
+           creativesContainerReducer,
           smsCreateReducer, smsCreateSaga, smsEditReducer, smsEditSaga,
           emailReducer, emailSaga,
           callTaskReducer, callTaskSagas,
@@ -648,7 +647,6 @@ export default function createRoutes(store) {
           injectSagas(gallerySagas.default);
           injectSagas(sagas.default);
           injectSagas(capSagas.default);
-          injectSagas(emailContainerSagas.default);
           injectSagas(smsCreateSaga.default);
           injectSagas(smsEditSaga.default);
           injectSagas(emailSaga.default);

package/v2Components/FormBuilder/index.js

@@ -109,7 +109,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
     if (nextProps.startValidation && nextProps.startValidation !== false && this.props.startValidation !== nextProps.startValidation) {
       this.setState({checkValidation: true});
-      this.validateForm(null, null, null, true, () => {
+      this.validateForm(null, null, true, true, () => {
         //triggering the saveFormData or onSubmit when validation sets isFormValid to TRUE
         if (this.state.isFormValid) {
           this.saveForm(true);
@@ -789,7 +789,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             androidData[data] = this.state.formData[0][data];
           }
         }
-        if(_.isEmpty(androidData) && this.state.currentTab === 2){
+        if(_.isEmpty(androidData) && this.state.currentTab == 2){
           this.setState({androidValid, iosValid}, () => {
             this.props.setModalContent('ios');
           });
@@ -804,7 +804,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             iosData[data] = this.state.formData[1][data];
           }
         }
-        if(_.isEmpty(iosData) && this.state.currentTab === 1){
+        if(_.isEmpty(iosData) && this.state.currentTab == 1){
           this.setState({androidValid, iosValid}, () => {
             this.props.setModalContent('android');
           });
@@ -1879,17 +1879,20 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       const that = this;
       this.setState({tabKey: `${data}`});
       setTimeout(() => {
-        if (this.props.isNewVersionFlow) {
-          const formData = _.cloneDeep(this.state.formData);
-          let activeTabIndex = '1';
-          const elems = document.getElementsByClassName("ant-tabs-tab");
+        let activeTabIndex = '1';
+        let selector = ".ant-tabs-tab";
+        if (this.props.schema.channel.toUpperCase() === "MOBILEPUSH") {
+            selector = `.mobilepush-wrapper ${selector}`;
+          }
+        const elems = document.querySelectorAll(selector);
 
-          for (let i = 0; i < elems.length; i += 1) {
+        for (let i = 0; i < elems.length; i += 1) {
             if (elems.item(i).classList.contains("ant-tabs-tab-active")) {
               activeTabIndex = i + 1;
             }
           }
-
+        if (this.props.isNewVersionFlow) {
+          const formData = _.cloneDeep(this.state.formData);
           formData[(this.state.currentTab - 1)].activeTab = formData[(this.state.currentTab - 1)].selectedLanguages[activeTabIndex - 1];
           formData[(this.state.currentTab - 1)].tabKey = `${data}`;
           if (formData[(this.state.currentTab - 1)].base) {
@@ -1901,15 +1904,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             val.injectedEvents[event].call(that.props.parent, this.state.currentTab, formData);
           });
         } else {
-          let activeTabIndex = '1';
-          const elems = document.getElementsByClassName("ant-tabs-tab");
-
-          for (let i = 0; i < elems.length; i += 1) {
-            if (elems.item(i).classList.contains("ant-tabs-tab-active")) {
-              activeTabIndex = i + 1;
-            }
-          }
-
           that.setState({currentTab: activeTabIndex});
           val.injectedEvents[event].call(that.props.parent, activeTabIndex);
         }

package/v2Components/NavigationBar/index.js

@@ -120,6 +120,10 @@ class NavigationBar extends React.Component {
     return productsList;
   };
 
+  setDefaultSelectedProduct = () => {
+    const { intl, campaignOrgV2Status } = this.props;
+    return campaignOrgV2Status ? intl.formatMessage(messages.selectedProductDefaultEngage) : intl.formatMessage(messages.selectedProductDefaultCampaigns);
+  }
   getTopbarIcons = () => [
     {
       iconType: 'help',
@@ -176,7 +180,6 @@ class NavigationBar extends React.Component {
     const {
       topbarMenuData,
       loggedIn,
-      intl,
       type,
     } = this.props;
     const productsList = this.getProductsList();
@@ -192,9 +195,8 @@ class NavigationBar extends React.Component {
           <TopBar
             productsList={productsList}
             selectedProduct={
-            selectedProduct ||
-            intl.formatMessage(messages.selectedProductDefault)
-          }
+              selectedProduct || this.setDefaultSelectedProduct()
+            }
             handleProductChange={this.handleProductChange}
             proxyOrgList={proxyOrgList}
             selectedOrg={selectedOrg}
@@ -230,6 +232,7 @@ NavigationBar.propTypes = {
   intl: intlShape.isRequired,
   location: PropTypes.object,
   type: PropTypes.string,
+  campaignOrgV2Status: PropTypes.bool,
 };
 
 export default injectIntl(NavigationBar);

package/v2Components/NavigationBar/messages.js

@@ -13,8 +13,12 @@ export default defineMessages({
     id: `${scope}.header`,
     defaultMessage: 'This is the NavigationBar component!',
   },
-  selectedProductDefault: {
-    id: `${scope}.selectedProductDefault`,
+  selectedProductDefaultEngage: {
+    id: `${scope}.selectedProductDefaultEngage`,
+    defaultMessage: 'Engage+',
+  },
+  selectedProductDefaultCampaigns: {
+    id: `${scope}.selectedProductDefaultCampaigns`,
     defaultMessage: 'Campaigns',
   },
 });

package/v2Containers/Cap/index.js

@@ -157,7 +157,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
 
   render() {
     const { Global, location } = this.props;
-    const { topbarMenuData, isLoggedIn } = Global;
+    const { topbarMenuData, isLoggedIn, currentOrgDetails } = Global;
     const topbarMenuDataOptions = topbarMenuData && topbarMenuData.data ? topbarMenuData.data : [];
     const type = this.props.location.query.type;
     const toastMessages = this.props.Global.messages;
@@ -183,6 +183,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
               loggedIn={isLoggedIn}
               topbarMenuData={topbarMenuDataOptions}
               location={location}
+              campaignOrgV2Status={currentOrgDetails.org_campaign_v2_status}
             /> : ''}
           <div className="main" style={{minHeight: 'calc(100vh - 74px', position: 'relative', top: '74px'}}>
 

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
+import get from 'lodash/get';
 import TemplatesV2 from '../TemplatesV2';
 import TemplatePreview from '../../v2Components/TemplatePreview';
 import SmsCreate from '../Sms/Create';
@@ -98,7 +99,8 @@ function SlideBoxContent(props) {
         )}
       {isPreview && (
       <TemplatePreview
-        content={templateData.versions.base['sms-editor']}
+        content={get(templateData, `versions.base['sms-editor']`)}
+        unicodeEnabled={get(templateData, `versions.base['unicode-validity']`)}
         channel={templateData.type.toLowerCase()}
         charCounterEnabled
         templateData={templateData}
@@ -211,6 +213,7 @@ function SlideBoxContent(props) {
           templateData={templateData}
           showTemplateName={showTemplateName}
           getDefaultTags={type}
+          onValidationFail={onValidationFail}
         />
         }
       {isCreateMPush &&
@@ -232,7 +235,8 @@ function SlideBoxContent(props) {
         cap={cap}
         onResetStep={onResetStep}
         showTemplateName={showTemplateName}
-        query={query}/>
+        query={query}
+        onValidationFail={onValidationFail}/>
         }
     </CreativesWrapper>
   );