@capillarytech/creatives-library 8.0.80-alpha.0 → 8.0.82-alpha.0

package/containers/Email/index.js

@@ -1205,7 +1205,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       if (!isNaN(index)) {
         _.forEach(val.selectedLanguages, (language) => {
           if (val[language].is_drag_drop) {
-            console.log('***getValidationData -1210', val[language].drag_drop_id, language);
             that.props.actions.getCmsData('edm', val[language].drag_drop_id, language);
           }
         });
@@ -1932,12 +1931,12 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           if (this.state.saveEdmDataMode === 'validation') {
             this.getValidationData();
           } else if (this.state.saveEdmDataMode === 'save') {
+            console.log('***handleEdmSave -1935', this.state.saveObj);
             this.props.actions.createTemplate(this.state.saveObj);
           }
         }
       });
     } else if (this.state.mode === 'preview' || this.state.mode === 'switchEditor') {
-      console.log('***HandleEdmSave -1940', this.state.formData[`${this.state.currentTab - 1}`][this.state.formData[`${this.state.currentTab - 1}`].activeTab].drag_drop_id);
       this.props.actions.getCmsData('edm', this.state.formData[`${this.state.currentTab - 1}`][this.state.formData[`${this.state.currentTab - 1}`].activeTab].drag_drop_id);
       if (this.state.mode === 'switchEditor') {
         let schema = _.cloneDeep(this.state.schema);
@@ -3005,7 +3004,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     });
     
     // if (saveCount === 0) {
-    
     this.props.actions.createTemplate(obj);
     // } else {
     //   this.setState({saveObj: obj, targetSaveCount: saveCount, mode: "save", saveEdmDataMode: 'save'}, () => {

package/containers/Email/sagas.js

@@ -8,7 +8,6 @@ import * as types from './constants';
 export function* createTemplate(template) {
   let errorMsg;
   try {
-    
     const result = yield call(Api.createEmailTemplate, template);
     if (result.message || result.status.code === 500) {
       errorMsg = result.message;
@@ -82,44 +81,30 @@ export function* uploadAsset(file, assetType, fileParams) {
 
 function* watchCreateTemplate() {
   yield takeLatest(types.CREATE_TEMPLATE_REQUEST, createTemplate);
-  
-  
 }
 
 function* watchGetTemplateDetails() {
   yield takeLatest(types.GET_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
-  
-  
 }
 
 function* watchGetAllAssets() {
   yield takeLatest(types.GET_ALL_ASSETS_REQUEST, getAllAssets);
-  
-  
 }
 
 function* watchGetCmsSetting() {
   yield takeEvery(types.GET_CMS_EDITOR_DETAILS_REQUEST, getCmsSetting);
-  
-  
 }
 
 function* watchGetCmsData() {
   yield takeEvery(types.GET_CMS_EDITOR_DATA_REQUEST, getCmsData);
-  
-  
 }
 
 function* watchUploadAsset() {
   yield takeLatest(types.UPLOAD_ASSET_REQUEST, uploadAsset);
-  
-  
 }
 
 function* watchDuplicateTemplate() {
   yield takeLatest(types.DUPLICATE_TEMPLATE_REQUEST, duplicateTemplate);
-  
-  
 }
 
 // All sagas to be loaded
@@ -143,4 +128,4 @@ export function* emailSaga() {
     watchUploadAsset(),
     watchDuplicateTemplate(),
   ]);
-}
+}

package/package.json

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

package/v2Components/FormBuilder/index.js

@@ -998,7 +998,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 if (tagValidationResponse?.isContentEmpty) {
                   errorString += this.props.intl.formatMessage(messages.emailBodyEmptyError);
                   // Adds a bypass for cases where content is initially empty in the creation flow.
-                  if(this.liquidFlow && !this.props.isEdit){
+                  if(this.liquidFlow){
                     errorString = "";
                     isLiquidValid = true;
                   }
@@ -1102,13 +1102,16 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         const handleResult = (result) => {
           const {formatMessage} = this.props.intl;
           // Checks for errors in the result and displays them if any are found.
-          if (result?.errors?.length > 0) {
+          const validString = /\S/.test(content);
+          // If the content is empty or there are errors in the result, display the necessary validation messages.
+          if (result?.errors?.length > 0 || !validString) {
             this.setState((prevState) => ({
               liquidErrorMessage: {
                 ...prevState.liquidErrorMessage,
+                STANDARD_ERROR_MSG: !validString ? [...(prevState.liquidErrorMessage?.STANDARD_ERROR_MSG || []), formatMessage(messages.emailBodyEmptyError)] : prevState.liquidErrorMessage?.STANDARD_ERROR_MSG,
                 LIQUID_ERROR_MSG: result?.errors?.map(error => error?.message) ?? [formatMessage(messages.somethingWentWrong)],
-              },
-            }) , () => {
+              }
+            }), () => {
               this.props.showLiquidErrorInFooter(this.state.liquidErrorMessage);
             });
             this.props.stopValidation();

package/v2Containers/Email/index.js

@@ -376,7 +376,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           const beeJson = `BEEeditor${currentTab > 1 ? currentTab : ''}json`;
           const beeToken = `BEEeditor${currentTab > 1 ? currentTab : ''}token`;
           let beeJsonValue = _.get(nextProps, 'Templates.BEETemplate.versions.base.json-content', '');
-          const selectedId = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate._id', '');
+          const selectedId = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate.versions.base.drag_drop_id', '');
           if (this.state.isEdit) {
             if (this.props.location.query.module === "library") {
               beeJsonValue = _.get(this.state, `formData[${currentTab - 1}][${langId}].json-content`, '');
@@ -497,7 +497,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         const isDragDrop = this.state.formData[`${this.state.currentTab - 1}`][this.state.formData[`${this.state.currentTab - 1}`].activeTab].is_drag_drop;
         const isBEESupport = (this.props.location.query.isBEESupport !== "false") || false;
         if (isDragDrop && isBEESupport && this.checkBeeEditorAllowedForLibrary()) {
-          console.log('***Handle EDM -500', this.edmEvent, JSON.parse(this.edmEvent.data));
           const evtData = JSON.parse(this.edmEvent.data);
           if (evtData.action === 'editBackground') {
             this.edmEvent.source.postMessage(JSON.stringify({
@@ -512,7 +511,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
               },
             }), "*");
           } else if (evtData.action === 'edit') {
-            console.log('***Handle EDM -515', this.edmEvent, JSON.parse(this.edmEvent.data));
             this.edmEvent.source.postMessage(JSON.stringify({
               _dynId: JSON.parse(this.edmEvent.data)._dynId,
               action: "setProps",
@@ -750,7 +748,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
   }
   getValidationData = () => {
     const that = this;
-    console.log('***getValidationData -753', this.props);
     let id = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate.versions.base.drag_drop_id', '');
     const formData = _.cloneDeep(this.state.formData);
     if (!id) {
@@ -762,7 +759,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         if (!isNaN(index)) {
           _.forEach(val.selectedLanguages, (language) => {
             if (val[language].is_drag_drop && this.checkBeeEditorAllowedForLibrary()) {
-              console.log('***getValidationData -764', val[language].drag_drop_id, language, id);
               that.props.actions.getCmsData(BEE_PLUGIN, id, language);
             }
           });
@@ -932,7 +928,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         //   formData.base.activeTab = language;
         // }
         if (language && editData.versions.base[language].is_drag_drop && isBEEAppEnable) {
-          console.log('***getCmsSetting -934', editData, language);
           this.props.actions.getCmsSetting(BEE_PLUGIN, editData._id, 'open', language, isBEESupport, isBEEAppEnable);
         }
       });
@@ -1410,8 +1405,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         }
       });
     } else if (this.state.mode === 'preview' || this.state.mode === 'switchEditor') {
-      let id = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate.versions.base.drag_drop_id', '');
-      console.log('***Handle EDM -864', id);
+      let id = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate.versions.base.drag_drop_id', '');   
       const formData = _.cloneDeep(this.state.formData);
       if (!id) {
         id = _.get(formData, `base[${formData.base.activeTab}].id`, '');
@@ -1526,7 +1520,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         storeS3FileSizeDetails(data?.metaInfo?.secure_file_path, data?.metaInfo?.file_size);
 
         if (isDragDrop && isEdmSupport && this.checkBeeEditorAllowedForLibrary()) {
-          console.log('***Handle EDM -1524', this.edmEvent, JSON.parse(this.edmEvent.data));
           const evtData = JSON.parse(this.edmEvent.data);
           if (evtData.action === 'editBackground') {
             this.edmEvent.source.postMessage(JSON.stringify({
@@ -1541,7 +1534,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
               },
             }), "*");
           } else if (evtData.action === 'edit') {
-            console.log('***Handle EDM -1539', this.edmEvent, JSON.parse(this.edmEvent.data));
             this.edmEvent.source.postMessage(JSON.stringify({
               _dynId: JSON.parse(this.edmEvent.data)._dynId,
               action: "setProps",
@@ -2405,7 +2397,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
 
     _.forEach(formData, (data, index) => {
       const newdata = data;
-
       if (!isNaN(index) && newdata) {
         // as baseLanguage & created template language are not same than it will pick from  template language
         const baseLangTabKey = newdata[baseLanguage]?.tabKey || newdata.tabKey;
@@ -2439,7 +2430,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     });
 
     // if (saveCount === 0) {
-
     this.props.actions.transformEmailTemplate(obj, (newEmail) => {
       this.props.actions.createTemplate(newEmail, this.onUpdateTemplateComplete);
     });
@@ -2510,9 +2500,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
   };
   handleEdmDefaultTemplateSelection = (isSelected, id) => {
     if (isSelected) {
-      console.log('***handleEdmDefaultTemplateSelection -2512', this.props.Templates.cmsTemplates);
       const data = _.find(this.props.Templates.cmsTemplates, {_id: id});
-      console.log('***handleEdmDefaultTemplateSelection -2513', data);
       // const type = this.props.location.query.type;
       // const module = this.props.location.query.module ? this.props.location.query.module : 'default';
       // const isLanguageSupport = (this.props.location.query.isLanguageSupport) ? this.props.location.query.isLanguageSupport : true;

package/v2Containers/Line/Container/Sticker/tests/mockData.js

@@ -0,0 +1,103 @@
+export const emptyInputs = {
+  emptyObject: {},
+  nullInput: null,
+  undefinedInput: undefined,
+  expectedOutput: {}
+};
+
+export const noValidPackageIdsInput = {
+  input: {
+    standard: [
+      { _id: '1', definition: { stickerUrl: 'url1' } },
+      { _id: '2', definition: {} }
+    ],
+    custom: [
+      { _id: '3', definition: null },
+      { _id: '4' }
+    ]
+  },
+  expectedOutput: {}
+};
+
+export const singleCategoryInput = {
+  input: {
+    standard: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '2', definition: { packageId: 'pkg1', stickerUrl: 'url2' } },
+      { _id: '3', definition: { packageId: 'pkg2', stickerUrl: 'url3' } }
+    ]
+  },
+  expectedOutput: {
+    pkg1: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '2', definition: { packageId: 'pkg1', stickerUrl: 'url2' } }
+    ],
+    pkg2: [
+      { _id: '3', definition: { packageId: 'pkg2', stickerUrl: 'url3' } }
+    ]
+  }
+};
+
+export const multipleCategoriesInput = {
+  input: {
+    standard: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '2', definition: { packageId: 'pkg2', stickerUrl: 'url2' } }
+    ],
+    custom: [
+      { _id: '3', definition: { packageId: 'pkg1', stickerUrl: 'url3' } },
+      { _id: '4', definition: { packageId: 'pkg3', stickerUrl: 'url4' } }
+    ],
+    extended: [
+      { _id: '5', definition: { packageId: 'pkg2', stickerUrl: 'url5' } }
+    ]
+  },
+  expectedOutput: {
+    pkg1: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '3', definition: { packageId: 'pkg1', stickerUrl: 'url3' } }
+    ],
+    pkg2: [
+      { _id: '2', definition: { packageId: 'pkg2', stickerUrl: 'url2' } },
+      { _id: '5', definition: { packageId: 'pkg2', stickerUrl: 'url5' } }
+    ],
+    pkg3: [
+      { _id: '4', definition: { packageId: 'pkg3', stickerUrl: 'url4' } }
+    ]
+  }
+};
+
+export const nonArrayCategoriesInput = {
+  input: {
+    standard: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } }
+    ],
+    custom: 'not an array',
+    extended: null
+  },
+  expectedOutput: {
+    pkg1: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } }
+    ]
+  }
+};
+
+export const mixedStickerDataInput = {
+  input: {
+    standard: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '2', definition: { stickerUrl: 'url2' } },
+      { _id: '3' }
+    ],
+    custom: [
+      { _id: '4', definition: { packageId: 'pkg1', stickerUrl: 'url4' } },
+      { _id: '5', definition: { packageId: null, stickerUrl: 'url5' } }
+    ]
+  },
+  expectedOutput: {
+    pkg1: [
+      { _id: '1', definition: { packageId: 'pkg1', stickerUrl: 'url1' } },
+      { _id: '4', definition: { packageId: 'pkg1', stickerUrl: 'url4' } }
+    ]
+  }
+}; 

package/v2Containers/Line/Container/Sticker/tests/utils.test.js

@@ -0,0 +1,37 @@
+import { groupLineStickers } from '../utils';
+import {
+  emptyInputs,
+  noValidPackageIdsInput,
+  singleCategoryInput,
+  multipleCategoriesInput,
+  nonArrayCategoriesInput,
+  mixedStickerDataInput
+} from './mockData';
+
+describe('groupLineStickers', () => {
+  it('should return empty object when input is empty', () => {
+    expect(groupLineStickers(emptyInputs.emptyObject)).toEqual(emptyInputs.expectedOutput);
+    expect(groupLineStickers(emptyInputs.nullInput)).toEqual(emptyInputs.expectedOutput);
+    expect(groupLineStickers(emptyInputs.undefinedInput)).toEqual(emptyInputs.expectedOutput);
+  });
+
+  it('should handle input with no valid packageIds', () => {
+    expect(groupLineStickers(noValidPackageIdsInput.input)).toEqual(noValidPackageIdsInput.expectedOutput);
+  });
+
+  it('should group stickers by packageId within single category', () => {
+    expect(groupLineStickers(singleCategoryInput.input)).toEqual(singleCategoryInput.expectedOutput);
+  });
+
+  it('should group stickers by packageId across multiple categories', () => {
+    expect(groupLineStickers(multipleCategoriesInput.input)).toEqual(multipleCategoriesInput.expectedOutput);
+  });
+
+  it('should skip non-array categories', () => {
+    expect(groupLineStickers(nonArrayCategoriesInput.input)).toEqual(nonArrayCategoriesInput.expectedOutput);
+  });
+
+  it('should handle mixed valid and invalid sticker data', () => {
+    expect(groupLineStickers(mixedStickerDataInput.input)).toEqual(mixedStickerDataInput.expectedOutput);
+  });
+}); 

package/v2Containers/Line/Container/Sticker/utils.js

@@ -6,15 +6,26 @@ import CapColumn from '@capillarytech/cap-ui-library/CapColumn';
 
 export const groupLineStickers = (lineStickers) => {
   const stickerGroup = {};
-  lineStickers.forEach((lineSticker) => {
-    const packageId = get(lineSticker, 'definition.packageId');
-    if (packageId) {
-      const stickerGroupPackageId = stickerGroup[packageId];
-      if (stickerGroupPackageId && Array.isArray(stickerGroupPackageId)) {
-        stickerGroup[packageId].push(lineSticker);
-      } else {
-        stickerGroup[packageId] = [];
-      }
+  // Return early if lineStickers is null or undefined
+  if (!lineStickers) return stickerGroup;
+
+  // Now we can safely iterate as lineStickers is defined
+  Object?.keys(lineStickers)?.forEach((key) => {
+    const category = lineStickers[key];
+    if (Array.isArray(category)) {
+      //iterating over each category [standard, custom, extended]
+      category?.forEach((lineSticker) => {
+        const packageId = get(lineSticker, 'definition.packageId');
+        if (packageId) {
+          const stickerGroupPackageId = stickerGroup[packageId];
+          if (stickerGroupPackageId && Array.isArray(stickerGroupPackageId)) {
+            stickerGroup[packageId].push(lineSticker);
+          } else {
+            //initialising with first sticker for each package ID
+            stickerGroup[packageId] = [lineSticker];
+          }
+        }
+      });
     }
   });
   return stickerGroup;
@@ -35,7 +46,7 @@ export const getContent = ({ lineStickers, onStickerSelect }) => (
             >
               <CapImage
                 src={definition.stickerUrl}
-                rest={{ height: 70 }}
+                rest = {{ height: 70 }}
                 rest={{
                   height: 70,
                   onMouseOut: e => (e.currentTarget.src = definition.stickerUrl),