@capillarytech/creatives-library 7.12.105 → 7.12.106

package/package.json

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

package/routes.js

@@ -13,6 +13,8 @@ import * as emailSagas from 'containers/Email/sagas';
 import * as templateSagas from 'containers/Templates/sagas';
 import * as lineSagas from 'containers/Line/Create/sagas';
 import * as languageSaga from './v2Containers/LanguageProvider/sagas';
+import * as templatesV2Saga from './v2Containers/TemplatesV2/sagas';
+
 import pathConfig from './config/path';
 
 import {updateCharCount} from './utils/smsCharCountV2';
@@ -37,6 +39,7 @@ export default function createRoutes(store) {
   const { injectReducer, injectSagas } = getAsyncInjectors(store); // eslint-disable-line no-unused-vars
   injectSagas(rootSaga.default);
   injectSagas(languageSaga.default);
+  injectSagas(templatesV2Saga.default);
   return [
     {
       path: '/',

package/utils/cdnTransformation.js

@@ -263,20 +263,54 @@ export function getLocalStorageItem(key, parse = false){
   return val;
 }
 
-export function saveCdnConfigs(configsResponse){
+export function removeLocalStorageItem(key) {
+  localStorage.removeItem(key);
+  return;
+}
+
+export function removeAllCdnLocalStorageItems() {
   try{
-    if(isEmpty(configsResponse)) return;
-    if(configsResponse?.hostname){
-      localStorage.setItem(CREATIVES_CDN_BASE_URL_KEY, configsResponse?.hostname);
+    removeLocalStorageItem(CREATIVES_CDN_BASE_URL_KEY);
+    removeLocalStorageItem(CREATIVES_CDN_QUALITY_CONFIG_KEY);
+    removeLocalStorageItem(CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY);
+  }catch(e){
+    console.log('some error occured while deleting all keys for cdn', e);
+  }
+}
+
+export function saveCdnConfigs(configsResponse) {
+  try {
+    //If no response from api, then remove localStorage items if they were set previously
+    if (isEmpty(configsResponse)) {
+      removeAllCdnLocalStorageItems();
+      return;
+    }
+
+    if (configsResponse?.hostname) {
+      localStorage.setItem(
+        CREATIVES_CDN_BASE_URL_KEY,
+        configsResponse?.hostname
+      );
+    } else {
+      removeLocalStorageItem(CREATIVES_CDN_BASE_URL_KEY);
     }
-    if(!isEmpty(configsResponse?.qualityCfg)){
+
+    if (!isEmpty(configsResponse?.qualityCfg)) {
       const qualityString = JSON.stringify(configsResponse?.qualityCfg);
       localStorage.setItem(CREATIVES_CDN_QUALITY_CONFIG_KEY, qualityString);
+    } else {
+      removeLocalStorageItem(CREATIVES_CDN_QUALITY_CONFIG_KEY);
     }
-    if(configsResponse?.transformationUrlSuffix){
-      localStorage.setItem(CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY, configsResponse?.transformationUrlSuffix);
+
+    if (configsResponse?.transformationUrlSuffix) {
+      localStorage.setItem(
+        CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY,
+        configsResponse?.transformationUrlSuffix
+      );
+    } else {
+      removeLocalStorageItem(CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY);
     }
-  }catch(e){
-    console.log('some error while setting localstorage cdn configs')
+  } catch (e) {
+    console.log("some error while setting localstorage cdn configs");
   }
 }

package/utils/tests/cdnTransformation.test.js

@@ -1,126 +1,245 @@
-import * as cdnUtils from '../cdnTransformation';
-import * as mockdata from './cdnTransformation.mockdata';
-
-beforeEach(()=>{
-    var localStorageMock = (function() {
-        var store = {
-            CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX: "cdn-cgi/image",
-            CREATIVES_CDN_BASE_URL: "https://storage.crm.n.content-cdn.io",
-            CREATIVES_CDN_QUALITY_CONFIG: '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}',
-        };
-        return {
-          getItem: function(key) {
-            return store[key];
-          },
-          setItem: function(key, value) {
-            store[key] = value.toString();
-          },
-          clear: function() {
-            store = {};
-          },
-          removeItem: function(key) {
-            delete store[key];
-          }
-        };
-      })();
-      Object.defineProperty(window, 'localStorage', { value: localStorageMock });
-})
-
-afterEach(()=>{
-    localStorage.setItem('CREATIVES_CDN_QUALITY_CONFIG', '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}')
-})
-
-describe('cdnTransformationTests',()=>{
-    describe('getCdnUrl()',()=>{
-
-        it('should return s3 url if bucket subfolder doesn\'t contain intouch_creative_assets',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/test/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL'});
-            expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
-        })
-        
-        it('should return s3 if channelName is not defined',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL});
-            expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
-        })
-        
-        it('should return s3 if specified channelSubType doesn\'t exist',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'LINE', channelSubType: 'ABC'});
-            expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
-        })
-        
-        it('Should replace s3 url with cdn url for email when h/w are not provided',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL'})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-        
-        it('Should replace s3 url with cdn url for email when h/w are provided',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL', height: 100, width: 200})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-        
-        it('should replace cdn url with new cdn url for email incase h/w etc changed', ()=>{
-            const TEST_S3_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL', height: 400, width: 500})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=500,height=400,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-        
-        it('should replace cdn url with new cdn url incase channelName is LINE and channelSubType is RICH_MESSAGE ',()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'LINE', channelSubType: 'RICH_MESSAGE'})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=1040,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8`
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-
-        it('should replace cdn url with new cdn url for channels which has predefined h/w for channel', ()=>{
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;       
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'RCS'})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=1440,height=720,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-
-        it('should return url directly if typeof CREATIVES_CDN_QUALITY_CONFIG is not object',()=>{
-            localStorage.setItem('CREATIVES_CDN_QUALITY_CONFIG', 'a')
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL'});
-            expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
-        })
-
-        it('should return cdn url with full quality if quality is not number',()=>{
-            localStorage.setItem('CREATIVES_CDN_QUALITY_CONFIG', '{"EMAIL":"a","RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}')
-
-            const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
-            const GENERATED_CDN_URL = cdnUtils.getCdnUrl({url: TEST_S3_URL, channelName: 'EMAIL', height: 100, width: 200})
-            const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=100,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`
-            
-            expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
-        })
-    })
-
-
-    describe('updateImagesInHtml()',()=>{
-        it('should update images in html',()=>{
-            const htmlContentsInput = mockdata.emailRawInput;
-            const htmlContentsOutput = cdnUtils.updateImagesInHtml(htmlContentsInput);
-            const expected = mockdata.emailRawTransformed;
-            expect(htmlContentsOutput).toEqual(expected);
-        })
-    })
-
-
-    describe('transformEmailTemplate()',()=>{
-        it('should transform email template',()=>{
-            const emailTemplateInput = mockdata.emailTemplateRaw;
-            const emailTemplateOutput = cdnUtils.transformEmailTemplates(emailTemplateInput);
-            expect(emailTemplateOutput).toMatchSnapshot();
-        })
-    })
-})
+import * as cdnUtils from "../cdnTransformation";
+import * as mockdata from "./cdnTransformation.mockdata";
 
+beforeEach(() => {
+  var localStorageMock = (function () {
+    var store = {
+      CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX: "cdn-cgi/image",
+      CREATIVES_CDN_BASE_URL: "https://storage.crm.n.content-cdn.io",
+      CREATIVES_CDN_QUALITY_CONFIG:
+        '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}',
+    };
+    return {
+      getItem: function (key) {
+        return store[key];
+      },
+      setItem: function (key, value) {
+        store[key] = value.toString();
+      },
+      clear: function () {
+        store = {};
+      },
+      removeItem: function (key) {
+        delete store[key];
+      },
+    };
+  })();
+  Object.defineProperty(window, "localStorage", { value: localStorageMock });
+});
+
+afterEach(() => {
+  localStorage.setItem(
+    "CREATIVES_CDN_QUALITY_CONFIG",
+    '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}'
+  );
+});
+
+describe("cdnTransformationTests", () => {
+  describe("getCdnUrl()", () => {
+    it("should return s3 url if bucket subfolder doesn't contain intouch_creative_assets", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/test/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+      });
+      expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
+    });
+
+    it("should return s3 if channelName is not defined", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({ url: TEST_S3_URL });
+      expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
+    });
+
+    it("should return s3 if specified channelSubType doesn't exist", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "LINE",
+        channelSubType: "ABC",
+      });
+      expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
+    });
+
+    it("Should replace s3 url with cdn url for email when h/w are not provided", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+
+    it("Should replace s3 url with cdn url for email when h/w are provided", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+        height: 100,
+        width: 200,
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+
+    it("should replace cdn url with new cdn url for email incase h/w etc changed", () => {
+      const TEST_S3_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+        height: 400,
+        width: 500,
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=500,height=400,format=auto,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+
+    it("should replace cdn url with new cdn url incase channelName is LINE and channelSubType is RICH_MESSAGE ", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "LINE",
+        channelSubType: "RICH_MESSAGE",
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=1040,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8`;
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+
+    it("should replace cdn url with new cdn url for channels which has predefined h/w for channel", () => {
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "RCS",
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=1440,height=720,quality=75,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+
+    it("should return url directly if typeof CREATIVES_CDN_QUALITY_CONFIG is not object", () => {
+      localStorage.setItem("CREATIVES_CDN_QUALITY_CONFIG", "a");
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+      });
+      expect(GENERATED_CDN_URL).toEqual(TEST_S3_URL);
+    });
+
+    it("should return cdn url with full quality if quality is not number", () => {
+      localStorage.setItem(
+        "CREATIVES_CDN_QUALITY_CONFIG",
+        '{"EMAIL":"a","RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}'
+      );
+
+      const TEST_S3_URL = `https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+      const GENERATED_CDN_URL = cdnUtils.getCdnUrl({
+        url: TEST_S3_URL,
+        channelName: "EMAIL",
+        height: 100,
+        width: 200,
+      });
+      const EXPECTED_CDN_URL = `https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=200,height=100,format=auto,quality=100,/intouch_creative_assets/2c9233ed-0959-4aff-b749-9171b5c8.jpg`;
+
+      expect(GENERATED_CDN_URL).toEqual(EXPECTED_CDN_URL);
+    });
+  });
+
+  describe("updateImagesInHtml()", () => {
+    it("should update images in html", () => {
+      const htmlContentsInput = mockdata.emailRawInput;
+      const htmlContentsOutput = cdnUtils.updateImagesInHtml(htmlContentsInput);
+      const expected = mockdata.emailRawTransformed;
+      expect(htmlContentsOutput).toEqual(expected);
+    });
+  });
+
+  describe("transformEmailTemplate()", () => {
+    it("should transform email template", () => {
+      const emailTemplateInput = mockdata.emailTemplateRaw;
+      const emailTemplateOutput =
+        cdnUtils.transformEmailTemplates(emailTemplateInput);
+      expect(emailTemplateOutput).toMatchSnapshot();
+    });
+  });
+
+  describe("saveCdnConfigs()", () => {
+    it("should set received input values in localStorage", () => {
+      const cdnConfigs = {
+        transformationUrlSuffix: "cdn-cgi/image",
+        hostname: "https://storage.crm.n.content-cdn.io",
+        qualityCfg: {
+          EMAIL: 75,
+          RCS: 75,
+          VIBER: 75,
+          WHATSAPP: 75,
+          MOBILE_PUSH: 75,
+          FACEBOOK: 75,
+          LINE: 75,
+          DEFAULT: 75,
+        },
+      };
+
+      const expected = {
+        CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX: "cdn-cgi/image",
+        CREATIVES_CDN_BASE_URL: "https://storage.crm.n.content-cdn.io",
+        CREATIVES_CDN_QUALITY_CONFIG:
+          '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}',
+      };
+      cdnUtils.saveCdnConfigs(cdnConfigs);
+
+      expect(
+        localStorage.getItem("CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX")
+      ).toBe(expected.CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX);
+      expect(localStorage.getItem("CREATIVES_CDN_BASE_URL")).toBe(
+        expected.CREATIVES_CDN_BASE_URL
+      );
+      expect(localStorage.getItem("CREATIVES_CDN_QUALITY_CONFIG")).toBe(
+        expected.CREATIVES_CDN_QUALITY_CONFIG
+      );
+    });
+
+    it("should clear items from localStorage if input does not contain hostname or transformationUrlSuffix", () => {
+      const cdnConfigs = {
+        qualityCfg: {
+          EMAIL: 75,
+          RCS: 75,
+          VIBER: 75,
+          WHATSAPP: 75,
+          MOBILE_PUSH: 75,
+          FACEBOOK: 75,
+          LINE: 75,
+          DEFAULT: 75,
+        },
+      };
+
+      const expected = {
+        CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX: "cdn-cgi/image",
+        CREATIVES_CDN_BASE_URL: "https://storage.crm.n.content-cdn.io",
+        CREATIVES_CDN_QUALITY_CONFIG:
+          '{"EMAIL":75,"RCS":75,"VIBER":75,"WHATSAPP":75,"MOBILE_PUSH":75,"FACEBOOK":75,"LINE":75,"DEFAULT":75}',
+      };
+      cdnUtils.saveCdnConfigs(cdnConfigs);
+
+      expect(
+        localStorage.getItem("CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX")
+      ).toBe(undefined);
+      expect(localStorage.getItem("CREATIVES_CDN_BASE_URL")).toBe(undefined);
+      expect(localStorage.getItem("CREATIVES_CDN_QUALITY_CONFIG")).toBe(
+        expected.CREATIVES_CDN_QUALITY_CONFIG
+      );
+    });
+
+    it("should clear items from localStorage if input is null or empty object", () => {
+      const cdnConfigs = {};
+
+      cdnUtils.saveCdnConfigs(cdnConfigs);
+
+      expect(
+        localStorage.getItem("CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX")
+      ).toBe(undefined);
+      expect(localStorage.getItem("CREATIVES_CDN_BASE_URL")).toBe(undefined);
+      expect(localStorage.getItem("CREATIVES_CDN_QUALITY_CONFIG")).toBe(undefined);
+    });
+  });
+});

package/v2Containers/Cap/actions.js

@@ -73,9 +73,3 @@ export function clearTopbarMenuData() {
     type: types.CLEAR_TOPBAR_MENU_DATA,
   };
 }
-
-export function getCdnTransformationConfig() {
-  return {
-    type: types.GET_CDN_TRANSFORMATION_CONFIG_REQUEST,
-  }
-}

package/v2Containers/Cap/constants.js

@@ -37,7 +37,3 @@ export const LOYALTY_HELP_URL = 'https://docs.capillarytech.com/docs/loyalty-ove
 
 export const ORG_REFRESH_SEC = 10;
 export const ORG_CHANGED = 'ORG_CHANGED';
-
-export const GET_CDN_TRANSFORMATION_CONFIG_REQUEST = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_REQUEST/V2';
-export const GET_CDN_TRANSFORMATION_CONFIG_SUCCESS = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_SUCCESS/V2';
-export const GET_CDN_TRANSFORMATION_CONFIG_FAILURE = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_FAILURE/V2';

package/v2Containers/Cap/index.js

@@ -119,7 +119,6 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
     );
     window.addEventListener('pageshow', this.tabOnloadEventHandler, false);
     window.addEventListener('pagehide', tabBeforeUnloadEventHandler, false);
-    this.props.actions.getCdnTransformationConfig();
   }
 
   componentWillReceiveProps(nextProps) {

package/v2Containers/Cap/sagas.js

@@ -13,7 +13,6 @@ import {
 } from '../../v2Containers/App/constants';
 // import {makeSelectOrgId} from './selectors';
 
-import { saveCdnConfigs } from '../../utils/cdnTransformation';
 
 function* authorize(user) {
   try {
@@ -43,18 +42,6 @@ function* switchOrg({orgID}) {
   }
 }
 
-function* getCdnTransformationConfig() {
-  try {
-    const res = yield call(Api.getCdnTransformationConfig);
-
-    if(res?.success && res?.status?.code === 200){
-      const cdnConfigs = res?.response;
-      saveCdnConfigs(cdnConfigs);
-    }
-  } catch (error) {
-    console.log('some error occured during getCdnTransformationConfig call')
-  }
-}
 
 function* loginFlow() {
   const condition = true;
@@ -191,10 +178,6 @@ function* watchGetTopbarMenuData() {
 }
 
 
-function* watchGetCdnTransformationConfig() {
-  yield takeLatest(types.GET_CDN_TRANSFORMATION_CONFIG_REQUEST, getCdnTransformationConfig);
-}
-
 export default [
   loginFlow,
   watchForOrgChange,
@@ -202,6 +185,5 @@ export default [
   watchForFetchUserInfo,
   watchFetchSchemaForEntity,
   watchGetTopbarMenuData,
-  watchGetCdnTransformationConfig,
 ];
 

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

@@ -41,7 +41,6 @@ exports[`<Cap /> should render correct component 1`] = `
       "clearMetaEntities": [Function],
       "clearTopbarMenuData": [Function],
       "fetchSchemaForEntity": [Function],
-      "getCdnTransformationConfig": [Function],
       "getTopbarMenuData": [Function],
       "getUserData": [Function],
       "logout": [Function],

package/v2Containers/TemplatesV2/actions.js

@@ -14,3 +14,9 @@ export function getTemplates({channel, query}) {
     query,
   };
 }
+
+export function getCdnTransformationConfig() {
+  return {
+    type: types.GET_CDN_TRANSFORMATION_CONFIG_REQUEST,
+  }
+}

package/v2Containers/TemplatesV2/constants.js

@@ -8,3 +8,7 @@ export const DEFAULT_ACTION = 'app/TemplatesV2/DEFAULT_ACTION';
 export const GET_TEMPLATES_REQUEST = 'app/TemplatesV2/GET_TEMPLATES_REQUEST';
 export const GET_TEMPLATES_SUCESS = 'app/TemplatesV2/GET_TEMPLATES_SUCESS';
 export const GET_TEMPLATES_FAILURE = 'app/TemplatesV2/GET_TEMPLATES_FAILURE';
+
+export const GET_CDN_TRANSFORMATION_CONFIG_REQUEST = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_REQUEST/V2';
+export const GET_CDN_TRANSFORMATION_CONFIG_SUCCESS = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_SUCCESS/V2';
+export const GET_CDN_TRANSFORMATION_CONFIG_FAILURE = 'creatives/GET_CDN_TRANSFORMATION_CONFIG_FAILURE/V2';

package/v2Containers/TemplatesV2/index.js

@@ -139,6 +139,7 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
     if (queryItems.channel === WHATSAPP) {
       this.channelChange(WHATSAPP);
     }
+    this.props.actions.getCdnTransformationConfig();
   }
 
   componentWillReceiveProps(nextProps) {

package/v2Containers/TemplatesV2/sagas.js

@@ -0,0 +1,27 @@
+import { call, takeLatest } from "redux-saga/effects";
+import * as Api from "../../services/api";
+import * as types from "./constants";
+import { saveCdnConfigs, removeAllCdnLocalStorageItems } from '../../utils/cdnTransformation';
+
+function* getCdnTransformationConfig() {
+  try {
+    const res = yield call(Api.getCdnTransformationConfig);
+
+    if (res?.success && res?.status?.code === 200) {
+      const cdnConfigs = res?.response;
+      saveCdnConfigs(cdnConfigs);
+    }
+  } catch (error) {
+    console.log("some error occured during getCdnTransformationConfig call");
+    removeAllCdnLocalStorageItems();
+  }
+}
+
+function* watchGetCdnTransformationConfig() {
+  yield takeLatest(
+    types.GET_CDN_TRANSFORMATION_CONFIG_REQUEST,
+    getCdnTransformationConfig
+  );
+}
+
+export default [watchGetCdnTransformationConfig];