@capillarytech/creatives-library 7.11.10 → 7.11.12

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.11.10",
+  "version": "7.11.12",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",
@@ -12,7 +12,6 @@
   },
   "license": "LicenseRef-LICENSE",
   "dependencies": {
-    "@babel/polyfill": "7.4.3",
     "@bugsnag/js": "^7.2.1",
     "@bugsnag/plugin-react": "^7.2.1",
     "@capillarytech/cap-ui-utils": "1.4.2",

package/v2Components/CapImageUpload/messages.js

@@ -28,7 +28,7 @@ export default defineMessages({
   },
   imageDimenstionDescription: {
     id: `${scope}.imageDimenstionDescription`,
-    defaultMessage: 'Dimensions: {width}px x {height}px',
+    defaultMessage: 'Dimensions upto: {width}px x {height}px',
   },
   format: {
     id: `${scope}.format`,

package/v2Components/TemplatePreview/_templatePreview.scss

@@ -78,7 +78,7 @@
         width: 100%;
         font-family: 'open-sans';
         .rcs-image{
-          width: 164px;
+          width: 156px;
           height: 123px;
         }
         .message-pop-item{

package/v2Components/TemplatePreview/index.js

@@ -726,40 +726,38 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
             }
             {
               channel?.toUpperCase() === RCS && (
-                <>
-                  <div className='shell-v2 align-center'>
-                    <CapImage
-                      className='preview-image'
-                      src={smsMobileAndroid}
-                      alt={formatMessage(messages.previewGenerated)}
-                    />
-                    <div className='msg-container sms'>
-                      <div className='message-pop sms'>
-                        {rcsImageSrc && (
-                          <CapImage
-                            src={rcsImageSrc}
-                            className='rcs-image'
-                            alt={formatMessage(messages.previewGenerated)}
-                          />
-                        )}
-                        {rcsTitle && (
-                          <CapLabel
-                            type="label5"
-                            className='message-pop-item align-left rcs-content'
-                            fontWeight='bold'
-                          >
-                            {rcsTitle}
-                          </CapLabel>
-                        )}
-                        {rcsDesc && (
-                          <CapLabel type="label5" className='message-pop-item align-left rcs-content rcs-desc'>
-                            {rcsDesc}
-                          </CapLabel>
-                        )}
-                      </div>
+                <div className='shell-v2 align-center'>
+                  <CapImage
+                    className='preview-image'
+                    src={smsMobileAndroid}
+                    alt={formatMessage(messages.previewGenerated)}
+                  />
+                  <div className='msg-container sms'>
+                    <div className='message-pop sms'>
+                      {rcsImageSrc && (
+                        <CapImage
+                          src={rcsImageSrc}
+                          className='rcs-image'
+                          alt={formatMessage(messages.previewGenerated)}
+                        />
+                      )}
+                      {rcsTitle && (
+                        <CapLabel
+                          type="label5"
+                          className='message-pop-item align-left rcs-content'
+                          fontWeight='bold'
+                        >
+                          {rcsTitle}
+                        </CapLabel>
+                      )}
+                      {rcsDesc && (
+                        <CapLabel type="label5" className='message-pop-item align-left rcs-content rcs-desc'>
+                          {rcsDesc}
+                        </CapLabel>
+                      )}
                     </div>
                   </div>
-                </>
+                </div>
               )
             }
             {channel && channel.toLowerCase() === FACEBOOK && (

package/v2Components/TemplatePreview/tests/__snapshots__/index.test.js.snap

@@ -1,5 +1,37 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Test Templates container Should render correct preview component for rcs channel 1`] = `
+<CapRow>
+  <CapColumn
+    span={16}
+  />
+  <CapColumn
+    span={8}
+  >
+    <div
+      className="preview-container "
+    >
+      <div
+        className="shell-v2 align-center"
+      >
+        <CapImage
+          alt="Preview is being generated"
+          className="preview-image"
+          src="test-file-stub"
+        />
+        <div
+          className="msg-container sms"
+        >
+          <div
+            className="message-pop sms"
+          />
+        </div>
+      </div>
+    </div>
+  </CapColumn>
+</CapRow>
+`;
+
 exports[`Test Templates container Should render correct preview component for whatsapp channel 1`] = `
 <CapRow>
   <CapColumn
@@ -57,7 +89,7 @@ exports[`Test Templates container Should render correct preview component for wh
               Object {
                 "background-color": "#efefef",
                 "border-radius": "6px",
-                "left": "10%",
+                "left": 0,
                 "padding": "4px 0 0.571rem",
                 "width": "88%",
               }

package/v2Components/TemplatePreview/tests/index.test.js

@@ -2,23 +2,23 @@ import React from 'react';
 import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 
 import { TemplatePreview } from '../index';
-import mockdata from '../../mockdata';
 
 
 describe('Test Templates container', () => {
   let renderedComponent;
 
-  const renderFunction = () => {
+  const renderFunction = (channel) => {
     renderedComponent = shallowWithIntl(
-      <TemplatePreview
-        channel="whatsapp"
-        showCount
-      />
+      <TemplatePreview channel={channel} showCount />,
     );
   };
 
   it('Should render correct preview component for whatsapp channel', () => {
-    renderFunction();
+    renderFunction('whatsapp');
+    expect(renderedComponent).toMatchSnapshot();
+  });
+  it('Should render correct preview component for rcs channel', () => {
+    renderFunction('rcs');
     expect(renderedComponent).toMatchSnapshot();
   });
 });

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -339,7 +339,7 @@ export function SlideBoxContent(props) {
       }
       case constants.RCS: {
         const template = cloneDeep(templateDataObject);
-        const { description = "", media: {mediaUrl = ""}, title} = get(template, 'versions.base.content.RCS.cardContent[0]', {});
+        const { description = "", media: { mediaUrl = "" } = {}, title = "" } = get(template, 'versions.base.content.RCS.cardContent[0]', {});
         return {
           rcsPreviewContent: {
             rcsImageSrc: mediaUrl,
@@ -358,6 +358,7 @@ export function SlideBoxContent(props) {
     isDltEnabled,
     smsRegister,
     getDefaultTags: type,
+    onCreateComplete,
   };
 
   return (
@@ -740,7 +741,6 @@ export function SlideBoxContent(props) {
 
       {isCreateRcs && (<Rcs
         {...rcsCommonProps}
-        onCreateComplete={onCreateComplete}
         location={{
           pathname: `/rcs/create`,
           query,

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

@@ -4,7 +4,7 @@ import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 import { SlideBoxContent } from '../SlideBoxContent';
 import mockdata from '../../mockdata';
 
-const { editTemplateData, previewTemplateData } = mockdata;
+const { whatsappEditTemplateData, whatsappPreviewTemplateData, rcsEditTemplateData, rcsPreviewTemplateData } = mockdata;
 
 jest.mock("../../../v2Components/FormBuilder", () => ({
   __esModule: true,
@@ -31,14 +31,13 @@ describe('Test SlideBoxContent container', () => {
     expect(renderedComponent).toMatchSnapshot();
   });
 
-
   it('Should render correct component for whatsapp channel edit mode', () => {
-    renderFunction("WHATSAPP", "editTemplate", editTemplateData);
+    renderFunction("WHATSAPP", "editTemplate", whatsappEditTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for whatsapp channel preview mode', () => {
-    renderFunction("WHATSAPP", "preview", previewTemplateData);
+    renderFunction("WHATSAPP", "preview", whatsappPreviewTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
@@ -46,4 +45,25 @@ describe('Test SlideBoxContent container', () => {
     renderFunction("WHATSAPP", "templates");
     expect(renderedComponent).toMatchSnapshot();
   });
+
+  it('Should render correct component for rcs channel create mode', () => {
+    renderFunction("RCS", "createTemplate", { mode: "create" });
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel edit mode', () => {
+    renderFunction("RCs", "editTemplate", rcsEditTemplateData);
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel preview mode', () => {
+    renderFunction("RCS", "preview", rcsPreviewTemplateData);
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel templates mode', () => {
+    renderFunction("RCS", "templates");
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
 });

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

@@ -4,7 +4,7 @@ import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 import { SlideBoxHeader } from '../SlideBoxHeader';
 import mockdata from '../../mockdata';
 
-const { editTemplateData, previewTemplateData } = mockdata;
+const { whatsappEditTemplateData, rcsEditTemplateData, whatsappPreviewTemplateData, rcsPreviewTemplateData } = mockdata;
 
 jest.mock("../../../v2Components/FormBuilder", () => ({
   __esModule: true,
@@ -32,14 +32,13 @@ describe('Test SlideBoxHeader container', () => {
     expect(renderedComponent).toMatchSnapshot();
   });
 
-
   it('Should render correct component for whatsapp channel edit mode', () => {
-    renderFunction("WHATSAPP", "editTemplate", editTemplateData, true);
+    renderFunction("WHATSAPP", "editTemplate", whatsappEditTemplateData, true);
     expect(renderedComponent).toMatchSnapshot();
   });
 
   it('Should render correct component for whatsapp channel preview mode', () => {
-    renderFunction("WHATSAPP", "preview", previewTemplateData);
+    renderFunction("WHATSAPP", "preview", whatsappPreviewTemplateData);
     expect(renderedComponent).toMatchSnapshot();
   });
 
@@ -47,4 +46,24 @@ describe('Test SlideBoxHeader container', () => {
     renderFunction("WHATSAPP", "templates");
     expect(renderedComponent).toMatchSnapshot();
   });
+
+  it('Should render correct component for rcs channel create mode', () => {
+    renderFunction("RCS", "createTemplate", { mode: "create" });
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel edit mode', () => {
+    renderFunction("RCS", "editTemplate", rcsEditTemplateData, true);
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel preview mode', () => {
+    renderFunction("RCS", "preview", rcsPreviewTemplateData);
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it('Should render correct component for rcs channel templates mode', () => {
+    renderFunction("RCS", "templates");
+    expect(renderedComponent).toMatchSnapshot();
+  });
 });

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

@@ -1,5 +1,149 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Test SlideBoxContent container Should render correct component for rcs channel create mode 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))
+    getDefaultTags=""
+    location={
+      Object {
+        "pathname": "/rcs/create",
+        "query": Object {
+          "isEditFromCampaigns": undefined,
+          "module": "library",
+          "type": "embedded",
+        },
+        "search": "",
+      }
+    }
+    onCreateComplete={[MockFunction]}
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
+exports[`Test SlideBoxContent container Should render correct component for rcs channel edit mode 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))
+    getDefaultTags=""
+    location={
+      Object {
+        "pathname": "/rcs/edit",
+        "query": Object {
+          "isEditFromCampaigns": undefined,
+          "module": "library",
+          "type": "embedded",
+        },
+        "search": "",
+      }
+    }
+    onCreateComplete={[MockFunction]}
+    params={
+      Object {
+        "id": "620e213d39bd394c58aeaaca",
+      }
+    }
+    templateData={
+      Object {
+        "_id": "620e213d39bd394c58aeaaca",
+        "channel": "RCS",
+        "mode": "edit",
+        "modeType": "",
+        "type": "RCS",
+        "validity": true,
+      }
+    }
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
+exports[`Test SlideBoxContent container Should render correct component for rcs channel preview mode 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <InjectIntl(TemplatePreview)
+    channel="rcs"
+    charCounterEnabled={false}
+    content={
+      Object {
+        "rcsPreviewContent": Object {
+          "rcsDesc": "Desc",
+          "rcsImageSrc": "",
+          "rcsTitle": "title",
+        },
+      }
+    }
+    showCount={true}
+    templateData={
+      Object {
+        "_id": "620e213d39bd394c58aeaaca",
+        "createdAt": "2022-02-17T10:19:42.211Z",
+        "createdBy": "15000449",
+        "isActive": true,
+        "mode": "preview",
+        "name": "amit123456",
+        "orgId": 50371,
+        "totalCount": 12,
+        "type": "RCS",
+        "updatedAt": "2022-02-17T10:19:42.211Z",
+        "updatedBy": "15000449",
+        "updatedByName": "Ashish Karan fd",
+        "versions": Object {
+          "$init": true,
+          "base": Object {
+            "content": Object {
+              "RCS": Object {
+                "cardContent": Array [
+                  Object {
+                    "description": "Desc",
+                    "media": Object {
+                      "height": "MEDIUM",
+                      "mediaUrl": "",
+                    },
+                    "mediaType": "NONE",
+                    "title": "title",
+                  },
+                ],
+                "cardSettings": Object {
+                  "cardOrientation": "VERTICAL",
+                  "mediaAlignment": "RIGHT",
+                },
+                "cardType": "STANDALONE",
+                "contentType": "RICHCARD",
+                "smsFallBackContent": Object {
+                  "message": "123",
+                },
+              },
+            },
+          },
+          "history": Array [],
+        },
+      }
+    }
+    viberBrandName=""
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
+exports[`Test SlideBoxContent container Should render correct component for rcs channel templates mode 1`] = `
+<SlideBoxContent__CreativesWrapper>
+  <Connect(UserIsAuthenticated(Connect(InjectIntl(withStyles__StyledComponent))))
+    FTPMode="create"
+    channel="rcs"
+    location={
+      Object {
+        "pathname": "/sms/edit",
+        "query": Object {
+          "isEditFromCampaigns": undefined,
+          "module": "library",
+          "type": "embedded",
+        },
+        "search": "",
+      }
+    }
+    messageDetails={Object {}}
+    onCreateComplete={[MockFunction]}
+    slidBoxContent="templates"
+  />
+</SlideBoxContent__CreativesWrapper>
+`;
+
 exports[`Test SlideBoxContent container Should render correct component for whatsapp channel create mode 1`] = `
 <SlideBoxContent__CreativesWrapper>
   <Connect(UserIsAuthenticated(Connect(InjectIntl(CreativesCommon))))
@@ -51,17 +195,18 @@ exports[`Test SlideBoxContent container Should render correct component for what
     charCounterEnabled={false}
     content={
       Object {
+        "charCount": 46,
         "templateMsg": <React.Fragment>
           <CapLabel
             type="label5"
           >
             1234567890
+
           </CapLabel>
           <CapLabel
             type="label11"
           >
-            
-Click {{unsubscribe}} to unsubscribe
+            Click {{unsubscribe}} to unsubscribe
           </CapLabel>
         </React.Fragment>,
       }

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

@@ -1,5 +1,103 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Test SlideBoxHeader container Should render correct component for rcs channel create mode 1`] = `
+<div
+  key="creatives-container-slidebox-header-content"
+/>
+`;
+
+exports[`Test SlideBoxHeader container Should render correct component for rcs channel edit mode 1`] = `
+<div
+  key="creatives-container-slidebox-header-content"
+>
+  <CapHeader
+    description={false}
+    descriptionClass=""
+    inline={false}
+    prefix={false}
+    size="large"
+    title={
+      <FormattedMessage
+        defaultMessage="Edit {channel}"
+        id="creatives.containersV2.Creatives.editMessageContent"
+        values={
+          Object {
+            "channel": <FormattedMessage
+              defaultMessage="RCS creative"
+              id="creatives.containersV2.Creatives.rcsCreative"
+              values={Object {}}
+            />,
+          }
+        }
+      />
+    }
+    titleClass=""
+  />
+</div>
+`;
+
+exports[`Test SlideBoxHeader container Should render correct component for rcs channel preview mode 1`] = `
+<div
+  key="creatives-container-slidebox-header-content"
+>
+  <CapHeader
+    description={
+      <CapLabel
+        type="label3"
+      >
+        <FormattedMessage
+          defaultMessage="Last updated: {date} by {user}"
+          id="creatives.containersV2.Creatives.lastUpdated"
+          values={
+            Object {
+              "date": "17 Feb 2022",
+              "user": "Ashish Karan fd",
+            }
+          }
+        />
+      </CapLabel>
+    }
+    descriptionClass=""
+    inline={false}
+    prefix={
+      <SlideBoxHeader__PrefixWrapper>
+        <SvgBack />
+      </SlideBoxHeader__PrefixWrapper>
+    }
+    size="large"
+    title="amit123456"
+    titleClass=""
+  />
+</div>
+`;
+
+exports[`Test SlideBoxHeader container Should render correct component for rcs channel templates mode 1`] = `
+<div
+  key="creatives-container-slidebox-header-content"
+>
+  <CapHeader
+    description={
+      <FormattedMessage
+        defaultMessage="Select only one creative"
+        id="creatives.containersV2.Creatives.creativeTemplatesDesc"
+        values={Object {}}
+      />
+    }
+    descriptionClass=""
+    inline={false}
+    size="large"
+    title={
+      <FormattedMessage
+        defaultMessage="Creative templates"
+        id="creatives.containersV2.Creatives.creativeTemplates"
+        values={Object {}}
+      />
+    }
+    titleClass=""
+  />
+</div>
+`;
+
 exports[`Test SlideBoxHeader container Should render correct component for whatsapp channel create mode 1`] = `
 <div
   key="creatives-container-slidebox-header-content"

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

@@ -1,5 +1,76 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Test SlideBoxContent container Should render correct component for rcs channel create mode 1`] = `
+<CreativesContainer__SlideBoxWrapper
+  className="add-creatives-section creatives-library-mode "
+>
+  <CapSlideBox
+    closeIconSize="m"
+    content={
+      <SlideBoxContent
+        currentChannel="RCS"
+        getFormData={[Function]}
+        handleClose={[Function]}
+        onCallTaskSubmit={[Function]}
+        onChannelChange={[Function]}
+        onCreateComplete={[MockFunction]}
+        onCreateNew={[Function]}
+        onCreateNextStep={[Function]}
+        onEmailModeChange={[Function]}
+        onEnterTemplateName={[Function]}
+        onFTPSubmit={[MockFunction]}
+        onFacebookSubmit={[MockFunction]}
+        onMobilepushModeChange={[Function]}
+        onPreviewTemplate={[Function]}
+        onRemoveTemplateName={[Function]}
+        onResetStep={[Function]}
+        onSelectTemplate={[Function]}
+        onShowTemplates={[Function]}
+        onValidationFail={[Function]}
+        onWeChatMaptemplateStepChange={[Function]}
+        onWechatTemplateChange={[Function]}
+        saveMessage={[Function]}
+        setIsLoadingContent={[Function]}
+        showTemplateName={[Function]}
+        slidBoxContent="templates"
+        templateData={
+          Object {
+            "type": undefined,
+          }
+        }
+        templateStep="modeSelection"
+        weChatMaptemplateStep={0}
+        weChatTemplateType=""
+      />
+    }
+    footer={false}
+    handleClose={[Function]}
+    header={
+      <SlideBoxHeader
+        channel="RCS"
+        isLoadingContent={true}
+        onShowTemplates={[Function]}
+        onWeChatMaptemplateStepChange={[Function]}
+        showPrefix={true}
+        slidBoxContent="templates"
+        templateData={
+          Object {
+            "type": undefined,
+          }
+        }
+        templateNameRenderProp={[Function]}
+        templateStep="modeSelection"
+        weChatMaptemplateStep={0}
+        weChatTemplateType=""
+      />
+    }
+    position="right"
+    show={true}
+    size="size-xl"
+  />
+</CreativesContainer__SlideBoxWrapper>
+`;
+
 exports[`Test SlideBoxContent container Should render correct component for whatsapp channel create mode 1`] = `
 <CreativesContainer__SlideBoxWrapper
   className="add-creatives-section creatives-library-mode "