@capillarytech/creatives-library 9.0.28 → 9.0.29-alpha.1

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

@@ -3,6 +3,7 @@ import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 
 import { SlideBoxHeader } from '../SlideBoxHeader';
 import mockdata from '../../mockdata';
+import { MAP_TEMPLATE } from '../../WeChat/Wrapper/constants';
 
 const { whatsappEditTemplateData, rcsEditTemplateData, whatsappPreviewTemplateData, rcsPreviewTemplateData,zaloEditTemplateData } = mockdata;
 
@@ -11,6 +12,12 @@ jest.mock("../../../v2Components/FormBuilder", () => ({
   default: (props) => <div className="FormBuilder-mock" {...props}>FormBuilder</div>,
 }));
 
+jest.mock('../../../utils/common', () => ({
+  ...jest.requireActual('../../../utils/common'),
+  isTraiDLTEnable: jest.fn(),
+}));
+const { isTraiDLTEnable } = require('../../../utils/common');
+
 describe('Test SlideBoxHeader container', () => {
   const onCreateComplete = jest.fn();
   let renderedComponent;
@@ -73,48 +80,219 @@ describe('Test SlideBoxHeader container', () => {
     expect(renderedComponent).toMatchSnapshot();
   });
 
-  it('Should render correct component for inapp channel edit mode (non-fullmode)', () => {
+  it('renders templateNameRenderProp when isFullMode and shouldShowTemplateName are both true', () => {
+    const templateNameRenderProp = jest.fn().mockReturnValue(null);
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="editTemplate"
+        channel="SMS"
+        templateData={{ name: 'My Template' }}
+        onCreateComplete={onCreateComplete}
+        isFullMode
+        shouldShowTemplateName
+        templateNameRenderProp={templateNameRenderProp}
+        moduleType="journey"
+      />
+    );
+    expect(templateNameRenderProp).toHaveBeenCalled();
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('does not call templateNameRenderProp when isFullMode is false (showTemplateNameHeader=false)', () => {
+    const templateNameRenderProp = jest.fn().mockReturnValue(null);
     renderedComponent = shallowWithIntl(
       <SlideBoxHeader
         slidBoxContent="editTemplate"
-        channel="INAPP"
-        templateData={{ name: 'InApp Template' }}
+        channel="SMS"
+        templateData={{ name: 'My Template' }}
         onCreateComplete={onCreateComplete}
         isFullMode={false}
+        shouldShowTemplateName
+        templateNameRenderProp={templateNameRenderProp}
         moduleType="journey"
       />
     );
+    expect(templateNameRenderProp).not.toHaveBeenCalled();
     expect(renderedComponent).toMatchSnapshot();
   });
 
-  it('Should render correct component for inapp channel create mode', () => {
+  it('does not call templateNameRenderProp when shouldShowTemplateName is false (showTemplateNameHeader=false)', () => {
+    const templateNameRenderProp = jest.fn().mockReturnValue(null);
     renderedComponent = shallowWithIntl(
       <SlideBoxHeader
-        slidBoxContent="createTemplate"
-        channel="INAPP"
-        templateData={{}}
+        slidBoxContent="editTemplate"
+        channel="SMS"
+        templateData={{ name: 'My Template' }}
+        onCreateComplete={onCreateComplete}
+        isFullMode
+        shouldShowTemplateName={false}
+        templateNameRenderProp={templateNameRenderProp}
+        moduleType="journey"
+      />
+    );
+    expect(templateNameRenderProp).not.toHaveBeenCalled();
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('shows edit header for InApp edit without fullMode (shouldShowInAppEditHeader=true)', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="editTemplate"
+        channel="inapp"
+        templateData={{ name: 'InApp Tpl' }}
         onCreateComplete={onCreateComplete}
         isFullMode={false}
         moduleType="journey"
-        templateStep="modeSelection"
       />
     );
     expect(renderedComponent).toMatchSnapshot();
   });
 
-  it('Should render wechat map template create steps (mapTemplateCreate path)', () => {
+  it('hides edit header for InApp edit with fullMode (shouldShowInAppEditHeader=false, isInAppCreate guard)', () => {
     renderedComponent = shallowWithIntl(
       <SlideBoxHeader
-        slidBoxContent="createTemplate"
-        channel="WECHAT"
-        templateData={{}}
+        slidBoxContent="editTemplate"
+        channel="inapp"
+        templateData={{ name: 'InApp Tpl' }}
+        onCreateComplete={onCreateComplete}
+        isFullMode
+        moduleType="journey"
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('renders whatsappOverview=true header when WHATSAPP edit in fullMode', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="editTemplate"
+        channel="WHATSAPP"
+        templateData={whatsappEditTemplateData}
+        onCreateComplete={onCreateComplete}
+        isFullMode
+        moduleType="journey"
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('renders whatsappOverview=false header when WHATSAPP edit without fullMode', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="editTemplate"
+        channel="WHATSAPP"
+        templateData={whatsappEditTemplateData}
         onCreateComplete={onCreateComplete}
         isFullMode={false}
         moduleType="journey"
-        weChatTemplateType="mapTemplate"
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('opens the WhatsApp help doc in a new tab when the learn-tips link is clicked', () => {
+    const openSpy = jest.spyOn(window, 'open').mockImplementation(() => {});
+    const { WHATSAPP_HELP_DOC_LINK } = require('../constants');
+
+    renderFunction("WHATSAPP", "createTemplate", { mode: "create" });
+    renderedComponent.find('CapLink').prop('onClick')();
+
+    expect(openSpy).toHaveBeenCalledWith(WHATSAPP_HELP_DOC_LINK, '_blank');
+    openSpy.mockRestore();
+  });
+
+  it('shows the RCS creative name label when RCS edit is not in fullMode and a templateName is present', () => {
+    renderFunction("RCS", "editTemplate", { name: "RCS Creative Name" }, false);
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('shows the back-icon prefix in the editTemplate header when not fullMode and showPrefix is true', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="editTemplate"
+        channel="SMS"
+        templateData={{ name: 'SMS Template' }}
+        isFullMode={false}
+        showPrefix
+        moduleType="journey"
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('evaluates useLocalTemplates for the back button when moduleType is not JOURNEY', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="templates"
+        channel="SMS"
+        isFullMode={false}
+        useLocalTemplates
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  describe('createTemplate header (modeSelection step)', () => {
+    afterEach(() => {
+      isTraiDLTEnable.mockReset();
+    });
+
+    it('uses the TRAI SMS upload title when isTraiDLTEnable is true for an SMS channel', () => {
+      isTraiDLTEnable.mockReturnValue(true);
+      renderedComponent = shallowWithIntl(
+        <SlideBoxHeader
+          slidBoxContent="createTemplate"
+          channel="SMS"
+          templateStep="modeSelection"
+          isFullMode={false}
+          showPrefix
+          templateData={{ mode: 'create' }}
+        />
+      );
+      expect(renderedComponent).toMatchSnapshot();
+    });
+
+    it('uses the regular createMessageContent title when isTraiDLTEnable is false', () => {
+      isTraiDLTEnable.mockReturnValue(false);
+      renderedComponent = shallowWithIntl(
+        <SlideBoxHeader
+          slidBoxContent="createTemplate"
+          channel="WHATSAPP"
+          templateStep="modeSelection"
+          isFullMode={false}
+          templateData={{ mode: 'create' }}
+        />
+      );
+      expect(renderedComponent).toMatchSnapshot();
+    });
+  });
+
+  it('renders the createTemplate header via the createTemplateContent step when weChatTemplateType is not MAP_TEMPLATE', () => {
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="createTemplate"
+        channel="RCS"
         templateStep="createTemplateContent"
-        onWeChatMaptemplateStepChange={jest.fn()}
-        weChatMaptemplateStep={0}
+        weChatTemplateType={undefined}
+        isFullMode={false}
+        templateData={{ mode: 'create' }}
+      />
+    );
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('renders the WeChat map-template creation stepper when weChatTemplateType is MAP_TEMPLATE and templateStep is not modeSelection', () => {
+    const onWeChatMaptemplateStepChange = jest.fn();
+    renderedComponent = shallowWithIntl(
+      <SlideBoxHeader
+        slidBoxContent="createTemplate"
+        channel="WECHAT"
+        templateStep="addContent"
+        weChatTemplateType={MAP_TEMPLATE}
+        weChatMaptemplateStep={1}
+        onWeChatMaptemplateStepChange={onWeChatMaptemplateStepChange}
+        isFullMode={false}
+        templateData={{ mode: 'create' }}
       />
     );
     expect(renderedComponent).toMatchSnapshot();

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

@@ -204,6 +204,61 @@ exports[`Test SlideBoxContent container Email component isTestAndPreviewMode IIF
 </SlideBoxContent__CreativesWrapper>
 `;
 
+exports[`Test SlideBoxContent container Email component isTestAndPreviewMode IIFE renders the direct Email component for a BEE (drag-drop) template regardless of hasSupportCKEditor 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <ForwardRef
+    cap={Object {}}
+    editor="default"
+    eventContextTags={Object {}}
+    getDefaultTags=""
+    handleCloseTestAndPreview={[MockFunction]}
+    handleTestAndPreview={[MockFunction]}
+    isLoyaltyModule={false}
+    isTestAndPreviewMode={false}
+    key="cretives-container-email-edit"
+    location={
+      Object {
+        "pathname": "/email/edit",
+        "query": Object {
+          "module": "library",
+          "type": "embedded",
+        },
+      }
+    }
+    moduleType="email"
+    onValidationFail={[MockFunction]}
+    params={
+      Object {
+        "id": "123",
+      }
+    }
+    route={
+      Object {
+        "name": "email",
+      }
+    }
+    showLiquidErrorInFooter={false}
+    showTemplateName={[MockFunction]}
+    showTestAndPreviewSlidebox={false}
+    templateData={
+      Object {
+        "_id": "123",
+        "base": Object {
+          "is_drag_drop": true,
+        },
+        "type": "EMAIL",
+        "versions": Object {
+          "base": Object {
+            "content": Object {},
+          },
+        },
+      }
+    }
+    waitEventContextTags={Object {}}
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
 exports[`Test SlideBoxContent container InApp vs InAppWrapper rendering conditions renders InApp when isFullMode=false and loyalty module enabled 1`] = `
 <SlideBoxContent__CreativesWrapper>
   <Component
@@ -870,6 +925,11 @@ exports[`Test SlideBoxContent container Should render correct component for rcs
       }
     }
     onCreateComplete={[MockFunction]}
+    templateData={
+      Object {
+        "mode": "create",
+      }
+    }
     waitEventContextTags={Object {}}
   />
 </SlideBoxContent__CreativesWrapper>
@@ -981,6 +1041,7 @@ exports[`Test SlideBoxContent container Should render correct component for rcs
   <Connect(UserIsAuthenticated(Component))
     FTPMode="create"
     channel="rcs"
+    localTemplatesConfig={Object {}}
     loyaltyMetaData={Object {}}
     messageDetails={Object {}}
     onCreateComplete={[MockFunction]}
@@ -1393,6 +1454,7 @@ exports[`Test SlideBoxContent container Should render correct component for what
   <Connect(UserIsAuthenticated(Component))
     FTPMode="create"
     channel="whatsapp"
+    localTemplatesConfig={Object {}}
     loyaltyMetaData={Object {}}
     messageDetails={Object {}}
     onCreateComplete={[MockFunction]}
@@ -3195,6 +3257,29 @@ exports[`Test SlideBoxContent container getChannelPreviewContent utility functio
 </SlideBoxContent__CreativesWrapper>
 `;
 
+exports[`Test SlideBoxContent container getLineType utility function Should derive isCreate/isEdit from slidBoxContent in non-full mode when templateData is absent 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <Connect(Connect(UserIsAuthenticated(InjectIntl(CreativesCommon))))
+    createNew={true}
+    isFullMode={false}
+    location={
+      Object {
+        "pathname": "/sms/edit",
+        "query": Object {
+          "isEditFromCampaigns": undefined,
+          "module": "library",
+          "type": "embedded",
+        },
+        "search": "",
+      }
+    }
+    onCreateComplete={[MockFunction]}
+    templateData={null}
+    waitEventContextTags={Object {}}
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
 exports[`Test SlideBoxContent container getLineType utility function Should handle LINE channel in create mode with full mode 1`] = `
 <SlideBoxContent__CreativesWrapper>
   <Connect(Connect(UserIsAuthenticated(InjectIntl(CreativesCommon))))
@@ -3331,6 +3416,8 @@ exports[`Test SlideBoxContent container getLineType utility function Should hand
 </SlideBoxContent__CreativesWrapper>
 `;
 
+exports[`Test SlideBoxContent container getLineType utility function Should handle LINE channel in non-full mode with template data that is neither an edit nor a default 1`] = `<SlideBoxContent__CreativesWrapper />`;
+
 exports[`Test SlideBoxContent container getViber utility function Should handle VIBER channel in create mode 1`] = `
 <SlideBoxContent__CreativesWrapper>
   <ForwardRef
@@ -3409,6 +3496,7 @@ exports[`Test SlideBoxContent container getViber utility function Should handle
         "name": "sms",
       }
     }
+    templateData={null}
     waitEventContextTags={Object {}}
   />
 </SlideBoxContent__CreativesWrapper>