@capillarytech/creatives-library 7.13.17 → 7.13.19

package/package.json

@@ -1,15 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "sideEffects": [
-    "*.css",
-    "*.scss",
-    "*/styles/",
-    "*global-styles*",
-    "*font*",
-    "*moment/locale*"
-  ],
-  "version": "7.13.17",
+  "version": "7.13.19",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/v2Containers/CreativesContainer/constants.js

@@ -22,4 +22,4 @@ export const RCS = "RCS";
 export const SHOW_CONTANER_LOADER = "app/CreativesContainer/SHOW_CONTANER_LOADER";
 export const HIDE_CONTAINER_LOADER = "app/CreativesContainer/HIDE_CONTAINER_LOADER";
 
-export const WHATSAPP_HELP_DOC_LINK = "https://support.capillarytech.com/en/support/solutions/articles/4000180620-create-whatsapp-template";
+export const WHATSAPP_HELP_DOC_LINK = "https://docs.capillarytech.com/docs/create-whatsapp-template";

package/v2Containers/Email/index.js

@@ -324,7 +324,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       if (this.state.isEdit && nextProps.location.query.module === "library" && !_.isEmpty(nextProps.templateData) && !this.props.params.id && !nextProps.isGetFormData && _.isEmpty(_.get(this, `state.formData['template-subject']`))) {
         this.startTemplateCreation(nextProps.templateData);
       }
-      if (nextProps.location.query.module === 'library' && nextProps.isGetFormData && (this.props.isGetFormData!==nextProps.isGetFormData)) {
+      if (nextProps.location.query.module === 'library' && nextProps.isGetFormData && (this.props.isGetFormData !== nextProps.isGetFormData)) {
         const formData = this.state.formData;
         let isBeeEditor = false;
         const isBEEEnable = this.checkBeeEditorAllowedForLibrary();
@@ -681,9 +681,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         channel: EMAIL,
         timeTaken,
         content: base?.[activeTab]?.['template-content'],
-        mode: isEdit ? EDIT : CREATE
+        mode: isEdit ? EDIT : CREATE,
       });
-      
+
       // this.resetSchema();
       let message;
       if (isEdit) {
@@ -872,46 +872,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           } else {
             schema.containers[index].isActive = false;
           }
-          // const isLanguageSupport = this.props.location.query.isLanguageSupport;
-
-          _.forEach(data.selectedLanguages, (lang, langIndex) => {
-            if ((type !== 'embedded' || (type === 'embedded' && isLanguageSupport === 'true')) && lang !== this.props.currentOrgDetails.basic_details.base_language) {
-              const tabContent = _.cloneDeep(containers[0].tabContent.sections[0]);
-              const tabContentSection = tabContent.inputFields[0].cols[0];
-              const panes = containers[0].panes.slice();
-              const firstPane = _.cloneDeep(panes[0]);
-              const sections = [];
-              _.forEach(firstPane.sections, (section) => {
-                let sect = _.cloneDeep(section);
-
-                if (sect.type === 'col-label') {
-                  sect = this.cloneColLabel(sect, (langIndex + 1));
-                } else if (sect.type === 'multicols') {
-                  sect = this.cloneMultiCol(sect, (langIndex + 1));
-                } else if (sect.type === 'parent') {
-                  sect = this.cloneParent(sect, (langIndex + 1));
-                }
-
-                sections.push(sect);
-                return true;
-              });
-              //
-
-              this.map[`template-content${data.selectedLanguages.indexOf(lang) + 1}`] = this.map['template-content'];
-              tabContentSection.id = `${tabContentSection.id}${index + 1}`;
-              tabContentSection.value = `${data[lang].language}`;
-
-              firstPane.sections = sections;
-              firstPane.sectionsHeaders = [tabContent];
-
-              // panes.push(firstPane);
-
-              schema.containers[index].panes.push(firstPane);
-            } else if (lang !== this.props.currentOrgDetails.basic_details.base_language) {
-              delete data[lang];
-              data.selectedLanguages.splice(langIndex, 1);
-            }
-          });
         }
         if (data.base) {
           formData.base = data;
@@ -2373,7 +2333,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       const response = {
         action: "getFormData",
         postAction: this.state.getFormDataValue || 'next',
-        id : _.get(this.props, 'Email.templateDetails._id', ''),
+        id: _.get(this.props, 'Email.templateDetails._id', ''),
         value: this.transformFormData(passedData),
         validity: this.state.isFormValid,
         type: 'EMAIL',
@@ -2407,9 +2367,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       const newdata = data;
 
       if (!isNaN(index) && newdata) {
-        const baseLangTabKey = newdata[baseLanguage].tabKey;
+        // as baseLanguage & created template language are not same than it will pick from  template language
+        const baseLangTabKey = newdata[baseLanguage]?.tabKey || newdata.tabKey;
         newdata.tabKey = baseLangTabKey;
-        newdata.activeTab = baseLanguage;
         if (newdata.base) {
           baseKey = baseLangTabKey;
         }
@@ -2431,7 +2391,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     obj.versions.base = formData.base;
     obj.versions.base.tabKey = baseKey;
     obj.versions.base.subject = formData['template-subject'];
-    obj.versions.base.activeTab = baseLanguage;
+    obj.versions.base.activeTab = formData?.base?.activeTab || baseLanguage;
     _.forEach(obj.versions.base.selectedLanguages, (language) => {
       if (obj.versions.base[language].is_drag_drop) {
         delete obj.versions.base[language].edmeditorsrc;
@@ -2730,7 +2690,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
                   isEdit={this.state.isEdit}
                   iframeParent={parent}
                   router={this.props.router}
-                  baseLanguage={this.props.currentOrgDetails.basic_details.base_language}
+                  baseLanguage={this.state.formData[0]?.activeTab || this.props.currentOrgDetails.basic_details.base_language} // // as baseLanguage & created template language are not same than it will pick from  template language (activeTab has template language)
                   supportedLanguages={this.getSupportedLanguages(this.props)}
                   isSchemaChanged={this.state.isSchemaChanged}
                   cmsTemplates={this.props.Templates.cmsTemplates}

package/v2Containers/Email/mockdata/mockdata.js

@@ -0,0 +1,54 @@
+export const EMAILPreviewMockData = {
+  loadingStatus: 0,
+  formData: {},
+  tabCount: 1,
+  currentTab: 1,
+  events: {
+    blur: (() => {}),
+    afterPaste: (() => {}),
+    change: (() => {}),
+  },
+  isEdit: false,
+  schema: {},
+  loading: false,
+  isFormValid: true,
+  injectedTags: {},
+  checkValidation: false,
+  saveEdmDataMode: 'save',
+  tabKey: '',
+  showEmailPreview: false,
+  device: "desktop",
+  editorInstanse: undefined,
+  showImageSelectionBox: false,
+  isDragDrop: false,
+  showConfirmationModal: false,
+  modalContent: {title: "", body: "", type: 'confirm', id: 'email-language-delete-modal'},
+  showModal: false,
+  page: 1,
+  perPageLimit: 25,
+  totalCount: 0,
+  searchText: '',
+  saveCount: 0,
+  cmsDataCount: 0,
+  targetSaveCount: 0,
+  saveObj: {},
+  showEdmEmailTemplates: false,
+  editDataSet: false,
+  languageDataSet: false,
+  addLanguageType: '',
+  startValidation: false,
+  saveForm: false,
+
+  params: {},
+  location: {
+    pathname: '/creatives/ui/v2',
+    search: '',
+    hash: '',
+    key: 'm54f44',
+    query: {module: "library"},
+  },
+  Templates: {},
+  Email: {},
+  isGetFormData: true,
+  currentOrgDetails: {basic_details: {}},
+};

package/v2Containers/Email/tests/index.test.js

@@ -0,0 +1,35 @@
+import React from "react";
+import { injectIntl } from 'react-intl';
+import '@testing-library/jest-dom';
+import {
+  render,
+} from '../../../utils/test-utils';
+import { EMAILPreviewMockData } from '../mockdata/mockdata';
+import { Email } from "../index";
+
+const initializeComponent = () => {
+  const Component = injectIntl(Email);
+  const resetUploadData = jest.fn();
+  const clearStoreValues = jest.fn();
+  const clearCRUDResponse = jest.fn();
+  const fetchSchemaForEntity = jest.fn();
+
+  return render( <Component
+    {...EMAILPreviewMockData}
+    templatesActions={{resetUploadData}}
+    actions={{
+      clearStoreValues,
+      clearCRUDResponse,
+    }}
+    globalActions={{
+      fetchSchemaForEntity,
+    }}
+    />);
+};
+
+describe('renders a message', () => {
+  it("Test if Email component renders", () => {
+    initializeComponent();
+  });
+});
+

package/v2Containers/Templates/index.js

@@ -887,8 +887,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
     const cardDataList = filteredTemplates && filteredTemplates.length ? map(filteredTemplates, (template) => {
       const templateData =
         {
-          key: `${currentChannel}-card-${template.name}`,
-          title: <span title={template.name} >{template.name}</span>,
+          key: `${currentChannel}-card-${template?.name}`,
+          title: <span title={template?.name} >{template?.name}</span>,
           extra: [
             <CapIcon
               className={`view-${channelLowerCase}`}
@@ -1070,7 +1070,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           const { whatsappImageSrc = '', templateMsg} = getWhatsappContent(template);
           templateData.title = (
             <CapRow>
-              <CapLabel className="whatsapp-rcs-template-name">{template.name}</CapLabel>
+              <CapLabel className="whatsapp-rcs-template-name">{template?.name}</CapLabel>
               <WhatsappStatusContainer template={template} />
             </CapRow>
           );
@@ -1094,7 +1094,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           break;
         }
         case RCS: {
-          templateData.title = <CapLabel className="whatsapp-rcs-template-name">{template.name}</CapLabel>;
+          templateData.title = <CapLabel className="whatsapp-rcs-template-name">{template?.name}</CapLabel>;
           templateData.content = getRCSContent(template);
           break;
         }
@@ -1610,7 +1610,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
 
   duplicateTemplate(template) {
     const duplicateObj = cloneDeep(template);
-    duplicateObj.name = `Copy of ${template.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
+    duplicateObj.name = `Copy of ${template?.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
     delete duplicateObj._id;
 
     if (this.state.channel.toLowerCase() === "mobilepush") {
@@ -1953,7 +1953,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             <div className="card-title">
               <span className="template-name" style={{ fontWeight: `${this.state.channel.toLowerCase() === 'wechat' ? '400' : '600'}` }}>
                 { template && template.versions && template.versions.history && template.versions.history.length > 1 && this.state.channel.toLowerCase() !== 'mobilepush' && <i style={{fontSize: '16px', margin: '0 8px 0 0', verticalAlign: 'middle'}} className="material-icons">filter_none</i>}
-                {template.name}
+                {template?.name}
               </span>
               {this.props.location.query.type !== 'embedded' && <CapPopover
                 trigger="click"