@capillarytech/creatives-library 8.0.136 → 8.0.137-alpha.0

package/v2Containers/MobilePushNew/components/tests/MediaUploaders.test.js

@@ -3177,4 +3177,275 @@ describe('MediaUploaders', () => {
       );
     });
   });
+
+  // Test cases for uncovered lines
+  describe('Deep link null/undefined handling', () => {
+    it('should handle null deepLink in carousel options', () => {
+      const onCarouselDataChange = jest.fn();
+      renderComponent({
+        mediaType: 'CAROUSEL',
+        carouselData: [
+          {
+            mediaType: 'image',
+            imageUrl: 'test.jpg',
+            buttons: [{
+              actionOnClick: true,
+              linkType: 'DEEP_LINK',
+              deepLinkValue: '',
+              externalLinkValue: '',
+            }],
+          }
+        ],
+        onCarouselDataChange,
+        linkProps: {
+          deepLink: null, // This should trigger the fallback to empty array
+        },
+        carouselActiveTabIndex: 0,
+      });
+
+      // Should render without crashing when deepLink is null
+      expect(screen.getByTestId('cap-image-upload')).toBeInTheDocument();
+    });
+
+    it('should handle undefined deepLink in carousel options', () => {
+      const onCarouselDataChange = jest.fn();
+      renderComponent({
+        mediaType: 'CAROUSEL',
+        carouselData: [
+          {
+            mediaType: 'image',
+            imageUrl: 'test.jpg',
+            buttons: [{
+              actionOnClick: true,
+              linkType: 'DEEP_LINK',
+              deepLinkValue: '',
+              externalLinkValue: '',
+            }],
+          }
+        ],
+        onCarouselDataChange,
+        linkProps: {
+          deepLink: undefined, // This should trigger the fallback to empty array
+        },
+        carouselActiveTabIndex: 0,
+      });
+
+      // Should render without crashing when deepLink is undefined
+      expect(screen.getByTestId('cap-image-upload')).toBeInTheDocument();
+    });
+  });
+
+  describe('Deep link query parameter handling', () => {
+    it('should match deep link with query parameters in carousel action render', () => {
+      const mockDeepLink = [
+        { value: 'myapp://page', keys: ['param1'] }
+      ];
+      const mockCarouselData = [{
+        mediaType: 'image',
+        imageUrl: 'test-image.jpg',
+        buttons: [{
+          actionOnClick: true,
+          linkType: 'DEEP_LINK',
+          deepLinkValue: 'myapp://page?param1=value1', // Has query parameters
+          deepLinkKeys: ['param1'],
+          externalLinkValue: '',
+        }]
+      }];
+
+      const { getByText } = render(
+        <Provider store={mockStore}>
+          <IntlProvider messages={messages} locale="en">
+            <MediaUploaders
+              mediaType="CAROUSEL"
+              activeTab="ANDROID"
+              imageSrc={{ androidImageSrc: '', iosImageSrc: '' }}
+              uploadMpushAsset={jest.fn()}
+              isFullMode={false}
+              setUpdateMpushImageSrc={jest.fn()}
+              updateOnMpushImageReUpload={jest.fn()}
+              imageData={{}}
+              videoAssetList={{}}
+              gifAssetList={{}}
+              setUpdateMpushVideoSrc={jest.fn()}
+              videoDataForVideo={{}}
+              videoDataForGif={{}}
+              videoSrc={''}
+              formatMessage={mockFormatMessage}
+              linkProps={{ deepLink: mockDeepLink }}
+              clearImageDataByMediaType={jest.fn()}
+              carouselData={mockCarouselData}
+              onCarouselDataChange={jest.fn()}
+              mobilePushActions={{ clearAsset: jest.fn() }}
+              carouselActiveTabIndex={0}
+              setCarouselActiveTabIndex={jest.fn()}
+              carouselLinkErrors={{}}
+              updateCarouselLinkError={jest.fn()}
+            />
+          </IntlProvider>
+        </Provider>
+      );
+
+      // Should find the base deep link and display keys
+      expect(getByText('param1')).toBeInTheDocument();
+    });
+
+    it('should match deep link with query parameters in carousel keys display', () => {
+      const mockDeepLink = [
+        { value: 'myapp://home', keys: ['userId', 'sessionId'] }
+      ];
+      const mockCarouselData = [{
+        mediaType: 'image',
+        imageUrl: 'test-image.jpg',
+        buttons: [{
+          actionOnClick: true,
+          linkType: 'DEEP_LINK',
+          deepLinkValue: 'myapp://home?userId=123&sessionId=abc', // Has query parameters
+          deepLinkKeys: ['userId', 'sessionId'],
+          externalLinkValue: '',
+        }]
+      }];
+
+      const { getByText } = render(
+        <Provider store={mockStore}>
+          <IntlProvider messages={messages} locale="en">
+            <MediaUploaders
+              mediaType="CAROUSEL"
+              activeTab="ANDROID"
+              imageSrc={{ androidImageSrc: '', iosImageSrc: '' }}
+              uploadMpushAsset={jest.fn()}
+              isFullMode={false}
+              setUpdateMpushImageSrc={jest.fn()}
+              updateOnMpushImageReUpload={jest.fn()}
+              imageData={{}}
+              videoAssetList={{}}
+              gifAssetList={{}}
+              setUpdateMpushVideoSrc={jest.fn()}
+              videoDataForVideo={{}}
+              videoDataForGif={{}}
+              videoSrc={''}
+              formatMessage={mockFormatMessage}
+              linkProps={{ deepLink: mockDeepLink }}
+              clearImageDataByMediaType={jest.fn()}
+              carouselData={mockCarouselData}
+              onCarouselDataChange={jest.fn()}
+              mobilePushActions={{ clearAsset: jest.fn() }}
+              carouselActiveTabIndex={0}
+              setCarouselActiveTabIndex={jest.fn()}
+              carouselLinkErrors={{}}
+              updateCarouselLinkError={jest.fn()}
+            />
+          </IntlProvider>
+        </Provider>
+      );
+
+      // Should find the base deep link and display keys
+      expect(getByText('userId, sessionId')).toBeInTheDocument();
+    });
+
+    it('should match deep link with query parameters in carousel placeholder', () => {
+      const mockDeepLink = [
+        { value: 'testapp://screen', keys: ['itemId'] }
+      ];
+      const mockCarouselData = [{
+        mediaType: 'image',
+        imageUrl: 'test-image.jpg',
+        buttons: [{
+          actionOnClick: true,
+          linkType: 'DEEP_LINK',
+          deepLinkValue: 'testapp://screen?itemId=456', // Has query parameters
+          deepLinkKeys: [],
+          externalLinkValue: '',
+        }]
+      }];
+
+      render(
+        <Provider store={mockStore}>
+          <IntlProvider messages={messages} locale="en">
+            <MediaUploaders
+              mediaType="CAROUSEL"
+              activeTab="ANDROID"
+              imageSrc={{ androidImageSrc: '', iosImageSrc: '' }}
+              uploadMpushAsset={jest.fn()}
+              isFullMode={false}
+              setUpdateMpushImageSrc={jest.fn()}
+              updateOnMpushImageReUpload={jest.fn()}
+              imageData={{}}
+              videoAssetList={{}}
+              gifAssetList={{}}
+              setUpdateMpushVideoSrc={jest.fn()}
+              videoDataForVideo={{}}
+              videoDataForGif={{}}
+              videoSrc={''}
+              formatMessage={mockFormatMessage}
+              linkProps={{ deepLink: mockDeepLink }}
+              clearImageDataByMediaType={jest.fn()}
+              carouselData={mockCarouselData}
+              onCarouselDataChange={jest.fn()}
+              mobilePushActions={{ clearAsset: jest.fn() }}
+              carouselActiveTabIndex={0}
+              setCarouselActiveTabIndex={jest.fn()}
+              carouselLinkErrors={{}}
+              updateCarouselLinkError={jest.fn()}
+            />
+          </IntlProvider>
+        </Provider>
+      );
+
+      // The component should render successfully and find the deep link by base value
+      expect(screen.getByTestId('cap-image-upload')).toBeInTheDocument();
+    });
+
+    it('should not match deep link when no base match exists with query parameters', () => {
+      const mockDeepLink = [
+        { value: 'myapp://different', keys: ['param1'] }
+      ];
+      const mockCarouselData = [{
+        mediaType: 'image',
+        imageUrl: 'test-image.jpg',
+        buttons: [{
+          actionOnClick: true,
+          linkType: 'DEEP_LINK',
+          deepLinkValue: 'myapp://nomatch?param1=value1', // Base doesn't match any deepLink
+          deepLinkKeys: [],
+          externalLinkValue: '',
+        }]
+      }];
+
+      render(
+        <Provider store={mockStore}>
+          <IntlProvider messages={messages} locale="en">
+            <MediaUploaders
+              mediaType="CAROUSEL"
+              activeTab="ANDROID"
+              imageSrc={{ androidImageSrc: '', iosImageSrc: '' }}
+              uploadMpushAsset={jest.fn()}
+              isFullMode={false}
+              setUpdateMpushImageSrc={jest.fn()}
+              updateOnMpushImageReUpload={jest.fn()}
+              imageData={{}}
+              videoAssetList={{}}
+              gifAssetList={{}}
+              setUpdateMpushVideoSrc={jest.fn()}
+              videoDataForVideo={{}}
+              videoDataForGif={{}}
+              videoSrc={''}
+              formatMessage={mockFormatMessage}
+              linkProps={{ deepLink: mockDeepLink }}
+              clearImageDataByMediaType={jest.fn()}
+              carouselData={mockCarouselData}
+              onCarouselDataChange={jest.fn()}
+              mobilePushActions={{ clearAsset: jest.fn() }}
+              carouselActiveTabIndex={0}
+              setCarouselActiveTabIndex={jest.fn()}
+              carouselLinkErrors={{}}
+              updateCarouselLinkError={jest.fn()}
+            />
+          </IntlProvider>
+        </Provider>
+      );
+
+      // Should render without crashing even when no match is found
+      expect(screen.getByTestId('cap-image-upload')).toBeInTheDocument();
+    });
+  });
 });

package/v2Containers/MobilePushNew/components/tests/PlatformContentFields.test.js

@@ -651,4 +651,193 @@ describe("PlatformContentFields", () => {
     // Check that error message is displayed
     expect(getByText('Deep link keys error message')).toBeInTheDocument();
   });
+
+  // Test cases for uncovered lines
+  describe('Deep link null/undefined handling', () => {
+    it('should handle null deepLink in options', () => {
+      const { container } = renderComponent({
+        content: { ...defaultProps.content, actionOnClick: true, linkType: DEEP_LINK },
+        linkProps: {
+          deepLink: null, // This should trigger the fallback to empty array
+          deepLinkValue: '',
+          externalLinkValue: '',
+        },
+      });
+
+      // Should render without crashing when deepLink is null
+      expect(container).toBeInTheDocument();
+    });
+
+    it('should handle undefined deepLink in options', () => {
+      const { container } = renderComponent({
+        content: { ...defaultProps.content, actionOnClick: true, linkType: DEEP_LINK },
+        linkProps: {
+          deepLink: undefined, // This should trigger the fallback to empty array
+          deepLinkValue: '',
+          externalLinkValue: '',
+        },
+      });
+
+      // Should render without crashing when deepLink is undefined
+      expect(container).toBeInTheDocument();
+    });
+  });
+
+  describe('Deep link query parameter handling', () => {
+    it('should match deep link with query parameters', () => {
+      const mockDeepLink = [
+        { value: 'myapp://profile', keys: ['userId'] }
+      ];
+      const mockLinkProps = {
+        deepLink: mockDeepLink,
+        deepLinkValue: 'myapp://profile?userId=123', // Has query parameters
+        deepLinkKeysValue: ['userId'],
+        externalLinkValue: '',
+      };
+      const mockContent = {
+        title: 'Test Title',
+        message: 'Test Message',
+        mediaType: 'IMAGE',
+        actionOnClick: true,
+        linkType: 'DEEP_LINK',
+      };
+
+      const { getByText } = render(
+        <IntlProvider locale="en">
+          <PlatformContentFields
+            deviceType="ANDROID"
+            content={mockContent}
+            errors={{}}
+            handlers={defaultProps.handlers}
+            tagListProps={defaultProps.tagListProps}
+            mediaUploaderProps={defaultProps.mediaUploaderProps}
+            ctaButtonProps={defaultProps.ctaButtonProps}
+            linkProps={mockLinkProps}
+            sameContent={false}
+            formatMessage={defaultProps.formatMessage}
+          />
+        </IntlProvider>
+      );
+
+      // Should find the base deep link and display keys
+      expect(getByText('userId')).toBeInTheDocument();
+    });
+
+    it('should not match deep link when no base match exists with query parameters', () => {
+      const mockDeepLink = [
+        { value: 'myapp://settings', keys: ['theme'] }
+      ];
+      const mockLinkProps = {
+        deepLink: mockDeepLink,
+        deepLinkValue: 'myapp://nomatch?theme=dark', // Base doesn't match any deepLink
+        deepLinkKeysValue: [],
+        externalLinkValue: '',
+      };
+      const mockContent = {
+        title: 'Test Title',
+        message: 'Test Message',
+        mediaType: 'IMAGE',
+        actionOnClick: true,
+        linkType: 'DEEP_LINK',
+      };
+
+      const { container } = render(
+        <IntlProvider locale="en">
+          <PlatformContentFields
+            deviceType="ANDROID"
+            content={mockContent}
+            errors={{}}
+            handlers={defaultProps.handlers}
+            tagListProps={defaultProps.tagListProps}
+            mediaUploaderProps={defaultProps.mediaUploaderProps}
+            ctaButtonProps={defaultProps.ctaButtonProps}
+            linkProps={mockLinkProps}
+            sameContent={false}
+            formatMessage={defaultProps.formatMessage}
+          />
+        </IntlProvider>
+      );
+
+      // Should render without crashing even when no match is found
+      expect(container).toBeInTheDocument();
+    });
+
+    it('should handle multiple query parameters in deep link value', () => {
+      const mockDeepLink = [
+        { value: 'testapp://dashboard', keys: ['category', 'filter'] }
+      ];
+      const mockLinkProps = {
+        deepLink: mockDeepLink,
+        deepLinkValue: 'testapp://dashboard?category=news&filter=recent', // Multiple query parameters
+        deepLinkKeysValue: ['category', 'filter'],
+        externalLinkValue: '',
+      };
+      const mockContent = {
+        title: 'Test Title',
+        message: 'Test Message',
+        mediaType: 'IMAGE',
+        actionOnClick: true,
+        linkType: 'DEEP_LINK',
+      };
+
+      const { getByText } = render(
+        <IntlProvider locale="en">
+          <PlatformContentFields
+            deviceType="ANDROID"
+            content={mockContent}
+            errors={{}}
+            handlers={defaultProps.handlers}
+            tagListProps={defaultProps.tagListProps}
+            mediaUploaderProps={defaultProps.mediaUploaderProps}
+            ctaButtonProps={defaultProps.ctaButtonProps}
+            linkProps={mockLinkProps}
+            sameContent={false}
+            formatMessage={defaultProps.formatMessage}
+          />
+        </IntlProvider>
+      );
+
+      // Should find the base deep link and display keys
+      expect(getByText('category, filter')).toBeInTheDocument();
+    });
+
+    it('should handle empty query parameters in deep link value', () => {
+      const mockDeepLink = [
+        { value: 'myapp://search', keys: ['query'] }
+      ];
+      const mockLinkProps = {
+        deepLink: mockDeepLink,
+        deepLinkValue: 'myapp://search?', // Empty query parameters
+        deepLinkKeysValue: ['query'],
+        externalLinkValue: '',
+      };
+      const mockContent = {
+        title: 'Test Title',
+        message: 'Test Message',
+        mediaType: 'IMAGE',
+        actionOnClick: true,
+        linkType: 'DEEP_LINK',
+      };
+
+      const { getByText } = render(        
+        <IntlProvider locale="en">
+          <PlatformContentFields
+            deviceType="ANDROID"
+            content={mockContent}
+            errors={{}}
+            handlers={defaultProps.handlers}
+            tagListProps={defaultProps.tagListProps}
+            mediaUploaderProps={defaultProps.mediaUploaderProps}
+            ctaButtonProps={defaultProps.ctaButtonProps}
+            linkProps={mockLinkProps}
+            sameContent={false}
+            formatMessage={defaultProps.formatMessage}
+          />
+        </IntlProvider>
+      );
+
+      // Should find the base deep link and display keys
+      expect(getByText('query')).toBeInTheDocument();
+    });
+  });
 });

package/v2Containers/MobilePushNew/index.scss

@@ -34,9 +34,6 @@
 }
 
 .platform-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
   margin-bottom: $CAP_SPACE_24;
 }
 
@@ -44,10 +41,6 @@
   flex: 1;
 }
 
-// .platform-header {
-//   margin-left: 24px;
-// }
-
 .tab-label {
   display: flex;
   align-items: center;

package/v2Containers/Sms/Create/index.js

@@ -18,13 +18,13 @@ import './_smsCreate.scss';
 import FormBuilder from '../../../v2Components/FormBuilder';
 import * as actions from './actions';
 import messages from './messages';
-import * as charCount from '../../../utils/smsCharCount';
+import * as charCount from '../../../legacy/smsCharCount';
 import {checkUnicode, updateCharCount} from '../../../utils/smsCharCountV2';
 import {getMessageObject} from '../../../utils/messageUtils';
 import { gtmPush } from '../../../utils/gtmTrackers';
 import * as creativesContainerActions from '../../CreativesContainer/actions';
 import {SMS} from '../../CreativesContainer/constants';
-// import callNativeEvent from '../../../utils/callNativeEvent';
+// import callNativeEvent from '../../../legacy/callNativeEvent';
 import {showError} from '../commonMethods';
 import withCreatives from '../../../hoc/withCreatives';
 import { GA } from '@capillarytech/cap-ui-utils';

package/v2Containers/Sms/Edit/index.js

@@ -24,7 +24,7 @@ import messages from './messages';
 import {getMessageObject} from '../../../utils/messageUtils';
 import { gtmPush } from '../../../utils/gtmTrackers';
 import * as creativesContainerActions from '../../CreativesContainer/actions';
-// import callNativeEvent from '../../../utils/callNativeEvent';
+// import callNativeEvent from '../../../legacy/callNativeEvent';
 import {showError} from '../commonMethods';
 import withCreatives from '../../../hoc/withCreatives';
 import { EDIT, TRACK_EDIT_SMS } from '../../App/constants';

package/v2Containers/TagList/index.js

@@ -28,7 +28,7 @@ import {
 } from '../../utils/common';
 import {
   GIFT_VOUCHER_RELATED_TAGS, PROMO_ENGINE_RELATED_TAGS, BADGES_RELATED_TAGS, BADGES_ENROLL, BADGES_ISSUE,
-} from '../../containers/App/constants';
+} from '../../constants/unified';
 
 const {TreeNode} = Tree;
 

package/v2Containers/TagList/utils.js

@@ -1,4 +1,4 @@
-import { JAPANESE_HIDE_DATE_TAGS } from "../../containers/TagList/constants";
+import { JAPANESE_HIDE_DATE_TAGS } from "../../constants/unified";
 
 
 export const hidingDateTagsForJpLocale = (hideDateTagsForJpLocale, val, list, value) => {

package/v2Containers/Templates/index.js

@@ -104,7 +104,7 @@ import {
   CREATE,
 } from '../App/constants';
 import {MAX_WHATSAPP_TEMPLATES, WARNING_WHATSAPP_TEMPLATES , ACCOUNT_MAPPING_ON_CHANNEL} from './constants';
-import { COPY_OF } from '../../containers/App/constants';
+import { COPY_OF } from '../../constants/unified';
 import {
   STATUS_OPTIONS,
   CATEGORY,

package/v2Containers/Templates/sagas.js

@@ -6,7 +6,7 @@ import get from 'lodash/get';
 import * as Api from '../../services/api';
 import * as types from './constants';
 import { saveCdnConfigs, removeAllCdnLocalStorageItems } from '../../utils/cdnTransformation';
-import { COPY_OF } from '../../containers/App/constants';
+import { COPY_OF } from '../../constants/unified';
 import { ZALO_TEMPLATE_INFO_REQUEST } from '../Zalo/constants';
 import { getTemplateInfoById } from '../Zalo/saga';
 import { watchCreateTemplate } from '../MobilePushNew/sagas';

package/components/BreadCrumbs/index.js

@@ -1,65 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-// import styled from 'styled-components';
-import { Link } from 'react-router';
-import _ from 'lodash';
-
-class BreadCrumbs extends React.Component { // eslint-disable-line react/prefer-stateless-function
-  constructor(props) {
-    super(props);
-    this.prepareBreadcrumbElement = this.prepareBreadcrumbElement.bind(this);
-    this.disabledBreadcrumb = this.disabledBreadcrumb.bind(this);
-  }
-
-  disabledBreadcrumb(e, location) {
-    if (location.disabled) {
-      e.preventDefault();
-    }
-  }
-
-  prepareBreadcrumbElement() {
-    const breadcrumbs = [];
-    _.forEach(this.props.locations, (location) => {
-      const titleText = (typeof location.text === 'string') ? location.text : location.text.props.defaultMessage;
-      const element = (
-        <Link
-          to={location.url}
-          key={titleText}
-          title={titleText}
-          onClick={(e) => this.disabledBreadcrumb(e, location)}
-        >
-          <span
-            className={location.disabled ? 'disabled-breadcrumb' : 'active-breadcrumb'}
-            disabled={location.disabled}
-          > {location.text}
-          </span>
-        </Link>
-      );
-      if (breadcrumbs.length !== 0) {
-        breadcrumbs.push(
-          <span
-            key={`${titleText}separator`}
-          > {this.props.separator ? this.props.separator : ' / '}
-          </span>
-        );
-      }
-      breadcrumbs.push(element);
-    });
-    return breadcrumbs;
-  }
-
-  render() {
-    return (
-      <div className="breadcrumbs-wrapper">
-        {this.prepareBreadcrumbElement()}
-      </div>
-    );
-  }
-}
-
-BreadCrumbs.propTypes = {
-  locations: PropTypes.array.isRequired,
-  separator: PropTypes.string,
-};
-
-export default BreadCrumbs;

package/components/BreadCrumbs/messages.js

@@ -1,13 +0,0 @@
-/*
- * BreadCrumbs Messages
- *
- * This contains all the text for the BreadCrumbs component.
- */
-import { defineMessages } from 'react-intl';
-
-export default defineMessages({
-  header: {
-    id: 'creatives.components.BreadCrumbs.header',
-    defaultMessage: 'This is the BreadCrumbs component !',
-  },
-});