@capillarytech/creatives-library 7.12.44 → 7.12.46

package/config/app.js

@@ -17,7 +17,6 @@ const config = {
   },
   development: {
     api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/arya/api/v1/creatives',
-    //api_endpoint: 'http://localhost:2022/arya/api/v1/creatives',
     campaigns_api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/campaigns',
     campaigns_api_org_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/org/campaign',
     auth_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/arya/api/v1/auth',

package/package.json

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

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

@@ -3,9 +3,9 @@ import { injectIntl } from 'react-intl';
 
 import * as actions from '../actions';
 import {Cap} from '../index';
-import mockdata from '../../mockdata';
+import mockData from '../../mockdata';
 import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
-const { match, location, capGlobal, language } = mockdata;
+const { match, location, capGlobal, language } = mockData;
 
 jest.mock('@capillarytech/cap-ui-utils', () => ({
   GA: {

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -6,7 +6,6 @@ import cloneDeep from 'lodash/cloneDeep';
 import TemplatesV2 from '../TemplatesV2';
 import TemplatePreview from '../../v2Components/TemplatePreview';
 import SmsWrapper from '../SmsWrapper';
-import isEmpty from 'lodash/isEmpty';
 // import SmsEdit from '../Sms/Edit';
 import Email from '../Email';
 import EmailWrapper from '../EmailWrapper';
@@ -240,9 +239,10 @@ export function SlideBoxContent(props) {
           baseUrl,
           video,
           template,
-          contents,
+          contents = {},
+          type = '',
         }) => {
-          const isNewLineFormat = isEmpty(template) && !isEmpty(contents);
+          const isNewLineFormat = type === 'flex';
           const {
             originalContentUrl,
             externalLink: {
@@ -262,10 +262,11 @@ export function SlideBoxContent(props) {
           previewContent.video = originalContentUrl;
           previewContent.actionUrl = linkUri;
           if (isNewLineFormat) {
-            previewContent.imageCarousel = get(contents, 'contents', [{}]).map(({
-              hero: { url = ''} = {},
-              footer: { contents: [{ action: { label = '' } = {} }] = [{}] } = {},
-            }) => ({ imageUrl: url, actionLabel: label }));
+            const { contents: flexContent = [] } = contents;
+            previewContent.imageCarousel = flexContent.map((data) => ({
+              imageUrl: get(data, "hero.url", ""),
+              actionLabel: get(data, "footer.contents[0].action.label", ""),
+            }));
           } else {
             previewContent.imageCarousel = get(template, 'columns', [{}]).map(({ imageUrl, action: { label: actionLabel } = {} }) => ({ imageUrl, actionLabel }) );
           }

package/v2Containers/CreativesContainer/tests/SlideBoxContent.test.js

@@ -4,11 +4,22 @@ import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 import { SlideBoxContent } from '../SlideBoxContent';
 import mockdata from '../../mockdata';
 
-const { whatsappEditTemplateData, whatsappPreviewTemplateData, rcsEditTemplateData, rcsPreviewTemplateData, lineEditTemplateData, linePreviewTemplateData } = mockdata;
-
-jest.mock("../../../v2Components/FormBuilder", () => ({
+const {
+  whatsappEditTemplateData,
+  whatsappPreviewTemplateData,
+  rcsEditTemplateData,
+  rcsPreviewTemplateData,
+  linePreviewTemplateData1,
+  linePreviewTemplateData2,
+} = mockdata;
+
+jest.mock('../../../v2Components/FormBuilder', () => ({
   __esModule: true,
-  default: (props) => <div className="FormBuilder-mock" {...props}>FormBuilder</div>,
+  default: (props) => (
+    <div className="FormBuilder-mock" {...props}>
+      FormBuilder
+    </div>
+  ),
 }));
 
 describe('Test SlideBoxContent container', () => {
@@ -22,58 +33,57 @@ describe('Test SlideBoxContent container', () => {
         currentChannel={channel}
         templateData={templateData}
         onCreateComplete={onCreateComplete}
-      />
+      />,
     );
   };
 
   it('Should render correct component for whatsapp channel create mode', () => {
-    renderFunction("WHATSAPP", "createTemplate", { mode: "create" });
+    renderFunction('WHATSAPP', 'createTemplate', { mode: 'create' });
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for whatsapp channel edit mode', () => {
-    renderFunction("WHATSAPP", "editTemplate", whatsappEditTemplateData);
+    renderFunction('WHATSAPP', 'editTemplate', whatsappEditTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for whatsapp channel preview mode', () => {
-    renderFunction("WHATSAPP", "preview", whatsappPreviewTemplateData);
+    renderFunction('WHATSAPP', 'preview', whatsappPreviewTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for whatsapp channel templates mode', () => {
-    renderFunction("WHATSAPP", "templates");
+    renderFunction('WHATSAPP', 'templates');
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for rcs channel create mode', () => {
-    renderFunction("RCS", "createTemplate", { mode: "create" });
+    renderFunction('RCS', 'createTemplate', { mode: 'create' });
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for rcs channel edit mode', () => {
-    renderFunction("RCs", "editTemplate", rcsEditTemplateData);
+    renderFunction('RCs', 'editTemplate', rcsEditTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for rcs channel preview mode', () => {
-    renderFunction("RCS", "preview", rcsPreviewTemplateData);
+    renderFunction('RCS', 'preview', rcsPreviewTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for rcs channel templates mode', () => {
-    renderFunction("RCS", "templates");
-    expect(renderedComponent).toMatchSnapshot();
-  });
-
-  it('Should render correct component for line channel edit mode', () => {
-    renderFunction("LINE", "editTemplate", lineEditTemplateData);
+    renderFunction('RCS', 'templates');
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for line channel preview mode', () => {
-    renderFunction("LINE", "preview", linePreviewTemplateData);
+    renderFunction('LINE', 'preview', linePreviewTemplateData1);
+    expect(renderedComponent).toMatchSnapshot();
+    renderFunction('LINE', 'preview', linePreviewTemplateData2);
+    expect(renderedComponent).toMatchSnapshot();
+    delete linePreviewTemplateData2.versions.base.content.messages[0].contents;
+    renderFunction('LINE', 'preview', linePreviewTemplateData2);
     expect(renderedComponent).toMatchSnapshot();
   });
-
 });

package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap

@@ -1,7 +1,90 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Test SlideBoxContent container Should render correct component for line channel edit mode 1`] = `
+exports[`Test SlideBoxContent container Should render correct component for line channel preview mode 1`] = `
 <SlideBoxContent__CreativesWrapper>
+  <InjectIntl(TemplatePreview)
+    channel="line"
+    charCounterEnabled={false}
+    content={
+      Array [
+        Object {
+          "actionUrl": undefined,
+          "baseUrl": undefined,
+          "imageCarousel": Array [
+            Object {
+              "actionLabel": "Demo Old 2",
+              "imageUrl": "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/f374edfe-1fd4-4b15-a6f7-74d5d86.jpeg",
+            },
+            Object {
+              "actionLabel": undefined,
+              "imageUrl": "",
+            },
+          ],
+          "messageContent": undefined,
+          "previewImageUrl": undefined,
+          "selectedSticker": Object {
+            "animatedStickerUrl": undefined,
+            "packageId": undefined,
+            "stickerId": undefined,
+            "stickerUrl": undefined,
+          },
+          "type": "image_carousel",
+          "video": undefined,
+        },
+      ]
+    }
+    showCount={true}
+    templateData={
+      Object {
+        "_id": "62a810e4d4715c768d6ee9cf",
+        "createdAt": "2022-06-14T04:39:00.665Z",
+        "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
+        "isActive": true,
+        "mode": "preview",
+        "name": "Demo Old Template 2(Multiple images)",
+        "orgId": 1604,
+        "totalCount": 1,
+        "type": "LINE",
+        "updatedAt": "2022-06-14T04:39:00.665Z",
+        "updatedBy": "15000449",
+        "updatedByName": "Ashish Karan fd",
+        "versions": Object {
+          "$init": true,
+          "base": Object {
+            "content": Object {
+              "messages": Array [
+                Object {
+                  "altText": "Demo Old Template 2(Multiple images)",
+                  "template": Object {
+                    "columns": Array [
+                      Object {
+                        "action": Object {
+                          "label": "Demo Old 2",
+                          "type": "uri",
+                          "uri": "https://www.demo.com",
+                        },
+                        "imageUrl": "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/f374edfe-1fd4-4b15-a6f7-74d5d86.jpeg",
+                      },
+                      Object {
+                        "imageUrl": "",
+                      },
+                    ],
+                    "type": "image_carousel",
+                  },
+                },
+              ],
+              "to": "{{line_id}}",
+            },
+          },
+          "history": Array [],
+        },
+      }
+    }
+    viberBrandName=""
+  />
   <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))
     location={
       Object {
@@ -17,8 +100,8 @@ exports[`Test SlideBoxContent container Should render correct component for line
     onCreateComplete={[MockFunction]}
     params={
       Object {
-        "id": "629f7ecf134738019b2e332e",
-        "mode": undefined,
+        "id": "62a810e4d4715c768d6ee9cf",
+        "mode": "template",
       }
     }
     route={
@@ -28,19 +111,58 @@ exports[`Test SlideBoxContent container Should render correct component for line
     }
     templateData={
       Object {
-        "_id": "629f7ecf134738019b2e332e",
-        "channel": "LINE",
-        "mode": "edit",
-        "modeType": "",
+        "_id": "62a810e4d4715c768d6ee9cf",
+        "createdAt": "2022-06-14T04:39:00.665Z",
+        "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
+        "isActive": true,
+        "mode": "preview",
+        "name": "Demo Old Template 2(Multiple images)",
+        "orgId": 1604,
+        "totalCount": 1,
         "type": "LINE",
-        "validity": true,
+        "updatedAt": "2022-06-14T04:39:00.665Z",
+        "updatedBy": "15000449",
+        "updatedByName": "Ashish Karan fd",
+        "versions": Object {
+          "$init": true,
+          "base": Object {
+            "content": Object {
+              "messages": Array [
+                Object {
+                  "altText": "Demo Old Template 2(Multiple images)",
+                  "template": Object {
+                    "columns": Array [
+                      Object {
+                        "action": Object {
+                          "label": "Demo Old 2",
+                          "type": "uri",
+                          "uri": "https://www.demo.com",
+                        },
+                        "imageUrl": "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/f374edfe-1fd4-4b15-a6f7-74d5d86.jpeg",
+                      },
+                      Object {
+                        "imageUrl": "",
+                      },
+                    ],
+                    "type": "image_carousel",
+                  },
+                },
+              ],
+              "to": "{{line_id}}",
+            },
+          },
+          "history": Array [],
+        },
       }
     }
   />
 </SlideBoxContent__CreativesWrapper>
 `;
 
-exports[`Test SlideBoxContent container Should render correct component for line channel preview mode 1`] = `
+exports[`Test SlideBoxContent container Should render correct component for line channel preview mode 2`] = `
 <SlideBoxContent__CreativesWrapper>
   <InjectIntl(TemplatePreview)
     channel="line"
@@ -55,6 +177,14 @@ exports[`Test SlideBoxContent container Should render correct component for line
               "actionLabel": "ggg",
               "imageUrl": "https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/b9f2aa7a-3f1a-4a20-a737-8d50841.jpeg",
             },
+            Object {
+              "actionLabel": "",
+              "imageUrl": "",
+            },
+            Object {
+              "actionLabel": "",
+              "imageUrl": "",
+            },
           ],
           "messageContent": undefined,
           "previewImageUrl": undefined,
@@ -75,16 +205,20 @@ exports[`Test SlideBoxContent container Should render correct component for line
         "_id": "629f7ecf134738019b2e332e",
         "createdAt": "2022-06-07T16:37:35.447Z",
         "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
         "isActive": true,
         "mode": "preview",
         "name": "ggg1",
         "orgId": 1604,
-        "totalCount": 31,
+        "totalCount": 1,
         "type": "LINE",
         "updatedAt": "2022-06-07T16:42:02.243Z",
         "updatedBy": "15000449",
         "updatedByName": "Ashish Karan fd",
         "versions": Object {
+          "$init": true,
           "base": Object {
             "content": Object {
               "messages": Array [
@@ -119,6 +253,21 @@ exports[`Test SlideBoxContent container Should render correct component for line
                         },
                         "type": "bubble",
                       },
+                      Object {
+                        "footer": Object {
+                          "contents": Array [
+                            Object {},
+                          ],
+                          "layout": "vertical",
+                          "spacing": "xs",
+                          "type": "box",
+                        },
+                        "hero": Object {},
+                        "type": "bubble",
+                      },
+                      Object {
+                        "type": "bubble",
+                      },
                     ],
                     "type": "carousel",
                   },
@@ -150,7 +299,7 @@ exports[`Test SlideBoxContent container Should render correct component for line
     params={
       Object {
         "id": "629f7ecf134738019b2e332e",
-        "mode": undefined,
+        "mode": "template",
       }
     }
     route={
@@ -163,16 +312,20 @@ exports[`Test SlideBoxContent container Should render correct component for line
         "_id": "629f7ecf134738019b2e332e",
         "createdAt": "2022-06-07T16:37:35.447Z",
         "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
         "isActive": true,
         "mode": "preview",
         "name": "ggg1",
         "orgId": 1604,
-        "totalCount": 31,
+        "totalCount": 1,
         "type": "LINE",
         "updatedAt": "2022-06-07T16:42:02.243Z",
         "updatedBy": "15000449",
         "updatedByName": "Ashish Karan fd",
         "versions": Object {
+          "$init": true,
           "base": Object {
             "content": Object {
               "messages": Array [
@@ -207,6 +360,21 @@ exports[`Test SlideBoxContent container Should render correct component for line
                         },
                         "type": "bubble",
                       },
+                      Object {
+                        "footer": Object {
+                          "contents": Array [
+                            Object {},
+                          ],
+                          "layout": "vertical",
+                          "spacing": "xs",
+                          "type": "box",
+                        },
+                        "hero": Object {},
+                        "type": "bubble",
+                      },
+                      Object {
+                        "type": "bubble",
+                      },
                     ],
                     "type": "carousel",
                   },
@@ -224,6 +392,129 @@ exports[`Test SlideBoxContent container Should render correct component for line
 </SlideBoxContent__CreativesWrapper>
 `;
 
+exports[`Test SlideBoxContent container Should render correct component for line channel preview mode 3`] = `
+<SlideBoxContent__CreativesWrapper>
+  <InjectIntl(TemplatePreview)
+    channel="line"
+    charCounterEnabled={false}
+    content={
+      Array [
+        Object {
+          "actionUrl": undefined,
+          "baseUrl": undefined,
+          "imageCarousel": Array [],
+          "messageContent": undefined,
+          "previewImageUrl": undefined,
+          "selectedSticker": Object {
+            "animatedStickerUrl": undefined,
+            "packageId": undefined,
+            "stickerId": undefined,
+            "stickerUrl": undefined,
+          },
+          "type": "image_carousel",
+          "video": undefined,
+        },
+      ]
+    }
+    showCount={true}
+    templateData={
+      Object {
+        "_id": "629f7ecf134738019b2e332e",
+        "createdAt": "2022-06-07T16:37:35.447Z",
+        "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
+        "isActive": true,
+        "mode": "preview",
+        "name": "ggg1",
+        "orgId": 1604,
+        "totalCount": 1,
+        "type": "LINE",
+        "updatedAt": "2022-06-07T16:42:02.243Z",
+        "updatedBy": "15000449",
+        "updatedByName": "Ashish Karan fd",
+        "versions": Object {
+          "$init": true,
+          "base": Object {
+            "content": Object {
+              "messages": Array [
+                Object {
+                  "altText": "ggg",
+                  "type": "flex",
+                },
+              ],
+              "to": "{{line_id}}",
+            },
+          },
+          "history": Array [],
+        },
+      }
+    }
+    viberBrandName=""
+  />
+  <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))
+    location={
+      Object {
+        "pathname": "/sms/edit",
+        "query": Object {
+          "isEditFromCampaigns": undefined,
+          "module": "library",
+          "type": "embedded",
+        },
+        "search": "",
+      }
+    }
+    onCreateComplete={[MockFunction]}
+    params={
+      Object {
+        "id": "629f7ecf134738019b2e332e",
+        "mode": "template",
+      }
+    }
+    route={
+      Object {
+        "name": "edit_text",
+      }
+    }
+    templateData={
+      Object {
+        "_id": "629f7ecf134738019b2e332e",
+        "createdAt": "2022-06-07T16:37:35.447Z",
+        "createdBy": "15000449",
+        "definition": Object {
+          "mode": "template",
+        },
+        "isActive": true,
+        "mode": "preview",
+        "name": "ggg1",
+        "orgId": 1604,
+        "totalCount": 1,
+        "type": "LINE",
+        "updatedAt": "2022-06-07T16:42:02.243Z",
+        "updatedBy": "15000449",
+        "updatedByName": "Ashish Karan fd",
+        "versions": Object {
+          "$init": true,
+          "base": Object {
+            "content": Object {
+              "messages": Array [
+                Object {
+                  "altText": "ggg",
+                  "type": "flex",
+                },
+              ],
+              "to": "{{line_id}}",
+            },
+          },
+          "history": Array [],
+        },
+      }
+    }
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
 exports[`Test SlideBoxContent container Should render correct component for rcs channel create mode 1`] = `
 <SlideBoxContent__CreativesWrapper>
   <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))