@capillarytech/creatives-library 8.0.163 → 8.0.164

package/v2Components/CapTagList/index.js

@@ -30,15 +30,8 @@ import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import messages from './messages';
 import { makeSelectLoyaltyPromotionDisplay } from '../../v2Containers/Cap/selectors';
-import { CARD_RELATED_TAGS, HOSPITALITY_RELATED_TAGS, CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
+import { CARD_RELATED_TAGS, HOSPITALITY_RELATED_TAGS, CUSTOMER_BARCODE_TAG, GET_TRANSLATION_MAPPED ,JAPANESE_HELP_TEXT, TAG_TRANSLATION_DOC} from '../../constants/unified';
 import { hasCardBasedScope, hasCustomerBarcodeFeatureEnabled, hasHospitalityBasedScope } from '../../utils/common';
-
-import {
-  GET_TRANSLATION_MAPPED,
-  JAPANESE_HELP_TEXT,
-  TAG_TRANSLATION_DOC,
-  STRING,
-} from "../../containers/TagList/constants";
 import { EMAIL, JP_LOCALE_HIDE_FEATURE, LOYALTY } from '../../v2Containers/App/constants';
 import { hidingDateTagsForJpLocale } from '../../v2Containers/TagList/utils';
 
@@ -132,9 +125,10 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
   getSearchedExpandedKeys(tags, value = '') {
     let list = [];
     _.forEach(tags, (val = {}, key) => {
-      const tagName = typeof val?.name === STRING
-        ? _.toLower(_.get(val, "name", ""))
-        : _.toLower(_.get(val, "name.props.defaultMessage", ""));
+      const tagName =
+        typeof val?.name === 'string'
+          ? _.toLower(_.get(val, "name", ""))
+          : _.toLower(_.get(val, "name.props.defaultMessage", ""));
       const tagNameWithoutUnderscore = tagName.replace(/_/g, " ");
       const searchStringLower = _.toLower(value);
       if (_.has(val, "subtags")) {
@@ -267,9 +261,10 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
         supportedTagsString += `${supportedTag} ,`;
       });
       supportedTagsString = supportedTagsString.replace(/,\s*$/, "");
-      const tagName = typeof val?.name === STRING
-        ? _.toLower(_.get(val, "name", ""))
-        : _.toLower(_.get(val, "name.props.defaultMessage", ""));
+      const tagName =
+        typeof val?.name === 'string'
+          ? _.toLower(_.get(val, "name", ""))
+          : _.toLower(_.get(val, "name.props.defaultMessage", ""));
       const tagNameWithoutUnderscore = tagName.replace(/_/g, " ");
       const searchStringLower = _.toLower(searchString);
       const tagContainsSearchedString = searchStringLower

package/v2Components/Carousel/style.scss

@@ -26,7 +26,7 @@
     text-align: center;
     width: 120px !important;
     border-radius: 12px;
-    background-color: $CAP_G09,
+    background-color: $CAP_G09;
   }
   
   .ant-carousel .slick-slide {

package/v2Components/EmailMobilePreview/index.js

@@ -19,8 +19,8 @@ import messages from '../EmailPreviewV2/messages';
 import './index.scss';
 import mobileBody from '../../assets/DeviceForEmail.png';
 import { iframePreviewAdjustWidth, removeLinksFromHtmlContent } from './../../utils/common';
-import {selectTemplateContent} from '../../containers/Templates/selectors';
-import * as templateActions from '../../containers/Templates/actions';
+import {selectTemplateContent} from '../../v2Containers/Templates/selectors';
+import * as templateActions from '../../v2Containers/Templates/actions';
 
 const deviceAspectRatio = {
   mobile: {

package/v2Components/FormBuilder/index.js

@@ -54,9 +54,9 @@ import { SMS, MOBILE_PUSH, LINE, ENABLE_AI_SUGGESTIONS,AI_CONTENT_BOT_DISABLED,
 import globalMessages from '../../v2Containers/Cap/messages';
 import { convert } from 'html-to-text';
 import { OUTBOUND } from './constants';
-import { GET_TRANSLATION_MAPPED } from '../../containers/TagList/constants';
+import { GET_TRANSLATION_MAPPED } from '../../constants/unified';
 import moment from 'moment';
-import { CUSTOMER_BARCODE_TAG , COPY_OF, ENTRY_TRIGGER_TAG_REGEX} from '../../containers/App/constants';
+import { CUSTOMER_BARCODE_TAG , COPY_OF, ENTRY_TRIGGER_TAG_REGEX} from '../../constants/unified';
 import { REQUEST } from '../../v2Containers/Cap/constants'
 import { hasLiquidSupportFeature, isEmailUnsubscribeTagMandatory } from '../../utils/common';
 import { isUrl } from '../../v2Containers/Line/Container/Wrapper/utils';

package/v2Components/TemplatePreview/index.js

@@ -32,10 +32,11 @@ import {
   RCS,
   ZALO,
   INAPP,
+  VIBER, 
+  FACEBOOK,
   MOBILE_PUSH
 } from '../../v2Containers/CreativesContainer/constants';
 import Carousel from '../Carousel';
-import { VIBER, FACEBOOK } from '../../v2Containers/App/constants';
 import whatsappMobileAndroid from './assets/images/whatsapp_mobile_android.svg';
 import inAppMobileAndroidModal from './assets/images/inapp_mobile_android_modal.svg';
 import inAppMobileAndroidTop from './assets/images/inapp_mobile_android_top.svg';

package/v2Components/TestAndPreviewSlidebox/index.js

@@ -179,7 +179,7 @@ const TestAndPreviewSlidebox = (props) => {
               resolvedTitle: formData['template-subject'] || ''
             });
 
-            // Always extract tags when content changes
+            // Extract tags with latest content
             const payloadContent = convert(htmlFile, GLOBAL_CONVERT_OPTIONS);
             actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
           }
@@ -202,7 +202,7 @@ const TestAndPreviewSlidebox = (props) => {
             resolvedTitle: formData['template-subject'] || ''
           });
 
-          // Always extract tags when showing
+          // Extract tags with initial content
           const payloadContent = convert(templateContent, GLOBAL_CONVERT_OPTIONS);
           actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
         } else {
@@ -211,7 +211,6 @@ const TestAndPreviewSlidebox = (props) => {
             getCurrentContent,
             GLOBAL_CONVERT_OPTIONS
           );
-          // Always extract tags when showing
           actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
         }
       }
@@ -229,30 +228,31 @@ const TestAndPreviewSlidebox = (props) => {
     const templateContent = currentTabData?.[activeTab]?.['template-content'];
     
     if (templateContent && templateContent.trim() !== '') {
-      // Common function to handle content update
-      const handleContentUpdate = (content) => {
-        setPreviewDataHtml({
-          resolvedBody: content,
-          resolvedTitle: formData['template-subject'] || ''
-        });
-
-        // Extract tags from content
-        const payloadContent = convert(content, GLOBAL_CONVERT_OPTIONS);
-        actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
-      };
-
       if (isDragDrop) {
-        // For Bee editor, update preview
+        // For Bee editor, update both preview and extract tags
         if (templateContent !== previousBeeContentRef.current) {
+
           previousBeeContentRef.current = templateContent;
           setBeeContent(templateContent);
-          handleContentUpdate(templateContent);
+          setPreviewDataHtml({
+            resolvedBody: templateContent,
+            resolvedTitle: formData['template-subject'] || ''
+          });
+
+          // Extract tags with latest content
+          const payloadContent = convert(templateContent, GLOBAL_CONVERT_OPTIONS);
+          actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
         }
       } else {
-        // For CKEditor, only update if content changed
-        if (templateContent !== previewDataHtml?.resolvedBody) {
-          handleContentUpdate(templateContent);
-        }
+        // For CKEditor, always update preview and extract tags with latest content
+        setPreviewDataHtml({
+          resolvedBody: templateContent,
+          resolvedTitle: formData['template-subject'] || ''
+        });
+
+        // Extract tags with latest content
+        const payloadContent = convert(templateContent, GLOBAL_CONVERT_OPTIONS);
+        actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
       }
     }
   }, [formData, currentTab]);
@@ -260,19 +260,9 @@ const TestAndPreviewSlidebox = (props) => {
   // Cleanup effect to reset ref when slidebox closes
   useEffect(() => {
     if (!show) {
-      // Reset all state
       previousBeeContentRef.current = '';
       setBeeContent('');
       setPreviewDataHtml('');
-      setSelectedCustomer(null);
-      setRequiredTags([]);
-      setOptionalTags([]);
-      setCustomValues({});
-      setShowJSON(false);
-      setTagsExtracted(false);
-      setPreviewDevice('desktop');
-      setSelectedTestEntities([]);
-      actions.clearPrefilledValues();
     }
   }, [show]);
 
@@ -284,22 +274,14 @@ const TestAndPreviewSlidebox = (props) => {
 
   // Listen for extract tags API result
   useEffect(() => {
-    // Categorize tags into required and optional
-    const required = [];
-    const optional = [];
-    let hasPersonalizationTags = false;
-
     if (extractedTags?.length > 0) {
+      // Categorize tags into required and optional
+      const required = [];
+      const optional = [];
+
       const processTag = (tag, parentPath = '') => {
         const currentPath = parentPath ? `${parentPath}.${tag.name}` : tag.name;
 
-        // Skip unsubscribe tag for input fields
-        if (tag.name === 'unsubscribe') {
-          return;
-        }
-
-        hasPersonalizationTags = true;
-
         if (tag?.metaData?.userDriven === false) {
           required.push({
             ...tag,
@@ -319,75 +301,43 @@ const TestAndPreviewSlidebox = (props) => {
 
       extractedTags.forEach((tag) => processTag(tag));
 
-      if (hasPersonalizationTags) {
-        setRequiredTags(required);
-        setOptionalTags(optional);
+      setRequiredTags(required);
+      setOptionalTags(optional);
 
-        // Initialize custom values for required tags
-        const initialValues = {};
-        required.forEach((tag) => {
-          initialValues[tag.fullPath] = '';
-        });
-        optional.forEach((tag) => {
-          initialValues[tag.fullPath] = '';
-        });
-        setCustomValues(initialValues);
-      } else {
-        // Reset all tag-related state if no personalization tags
-        setRequiredTags([]);
-        setOptionalTags([]);
-        setCustomValues({});
-        setTagsExtracted(false);
-      }
-    } else {
-      // Reset all tag-related state if no tags
-      setRequiredTags([]);
-      setOptionalTags([]);
-      setCustomValues({});
-      setTagsExtracted(false);
+      // Initialize custom values for required tags
+      const initialValues = {};
+      required.forEach((tag) => {
+        initialValues[tag.fullPath] = '';
+      });
+      optional.forEach((tag) => {
+        initialValues[tag.fullPath] = '';
+      });
+      setCustomValues(initialValues);
     }
   }, [extractedTags]);
 
   useEffect(() => {
-    if (selectedCustomer) {
-      setTagsExtracted(true); // Auto-open custom values editor
-      
-      // Get all available tags
-      const allTags = [...requiredTags, ...optionalTags];
-      
-      if (allTags.length > 0) {
+    if (tagsExtracted && selectedCustomer) {
+      const userDrivenTags = optionalTags?.map((tag) => tag.name);
+      if (userDrivenTags?.length > 0) {
         const payload = {
           channel: EMAIL,
           messageTitle: formData['template-subject'],
-          messageBody: getCurrentContent,
-          resolvedTags: {},
+          messageBody: content,
+          resolvedTags: customValues,
           userId: selectedCustomer?.customerId,
         };
         actions.getPrefilledValuesRequested(payload);
       }
     }
-  }, [selectedCustomer]);
+  }, [selectedCustomer, tagsExtracted]);
 
   useEffect(() => {
-    if (prefilledValues) {
-      // Always replace all values with prefilled values
-      const updatedValues = {};
-      [...requiredTags, ...optionalTags].forEach((tag) => {
-        updatedValues[tag.fullPath] = prefilledValues[tag.fullPath] || '';
-      });
-
-      
-      setCustomValues(updatedValues);
-
-      // Update preview with prefilled values
-      const payload = {
-        channel: EMAIL,
-        messageTitle: formData['template-subject'],
-        messageBody: getCurrentContent,
-        resolvedTags: updatedValues,
-        userId: selectedCustomer?.customerId,
-      };
-      actions.updatePreviewRequested(payload);
+    if (prefilledValues && !isEmpty(prefilledValues)) {
+      setCustomValues((prev) => ({
+        ...prev,
+        ...prefilledValues,
+      }));
     }
   }, [JSON.stringify(prefilledValues)]);
 
@@ -421,13 +371,7 @@ const TestAndPreviewSlidebox = (props) => {
     setPreviewDevice('desktop');
     setPreviewDataHtml('');
     setSelectedTestEntities([]);
-    setBeeContent('');
-    previousBeeContentRef.current = '';
-    
-    // Clear any pending actions
     actions.clearPrefilledValues();
-    
-    // Call parent's onClose if provided
     if (onClose) {
       onClose();
     }
@@ -440,35 +384,24 @@ const TestAndPreviewSlidebox = (props) => {
   // Handle customer selection from CustomerSearchSection
   const handleCustomerSelect = (customer) => {
     setSelectedCustomer(customer);
-    setTagsExtracted(true); // Auto-open custom values editor
-    
-    // Clear any existing values while waiting for prefilled values
-    const emptyValues = {};
-    [...requiredTags, ...optionalTags].forEach((tag) => {
-      emptyValues[tag.fullPath] = '';
+    setCustomValues((prev) => {
+      const newValues = { ...prev };
+      optionalTags.forEach((tag) => {
+        delete newValues[tag.fullPath];
+      });
+      return newValues;
     });
-    setCustomValues(emptyValues);
   };
 
   const handleClearSelection = () => {
     setSelectedCustomer(null);
-    
-    // Initialize empty values for all tags
-    const emptyValues = {};
-    [...requiredTags, ...optionalTags].forEach((tag) => {
-      emptyValues[tag.fullPath] = '';
+    setCustomValues((prev) => {
+      const newValues = { ...prev };
+      optionalTags.forEach((tag) => {
+        delete newValues[tag.fullPath];
+      });
+      return newValues;
     });
-    setCustomValues(emptyValues);
-
-    // Update preview with empty values
-    const payload = {
-      channel: EMAIL,
-      messageTitle: formData['template-subject'],
-      messageBody: getCurrentContent,
-      resolvedTags: emptyValues,
-      userId: null,
-    };
-    actions.updatePreviewRequested(payload);
   };
 
   // Handle custom value changes
@@ -493,38 +426,63 @@ const TestAndPreviewSlidebox = (props) => {
 
   // Handle discard custom values
   const handleDiscardCustomValues = () => {
-    // Initialize empty values for all tags
-    const emptyValues = {};
-    [...requiredTags, ...optionalTags].forEach((tag) => {
-      emptyValues[tag.fullPath] = '';
+    const resetValues = {};
+    requiredTags.forEach((tag) => {
+      resetValues[tag?.fullPath] = '';
     });
-    setCustomValues(emptyValues);
-
-    // Update preview with empty values
-    const payload = {
-      channel: EMAIL,
-      messageTitle: formData['template-subject'],
-      messageBody: getCurrentContent,
-      resolvedTags: emptyValues,
-      userId: selectedCustomer?.customerId,
-    };
-    actions.updatePreviewRequested(payload);
+    optionalTags.forEach((tag) => {
+      resetValues[tag?.fullPath] = '';
+    });
+    setCustomValues(resetValues);
   };
 
   // Handle update preview
   const handleUpdatePreview = async () => {
     try {
-      // Include unsubscribe tag if content contains it
-      const resolvedTags = { ...customValues };
+      // Store current values to prevent loss during update
+      const currentCustomValues = { ...customValues };
+      
+      const currentTabData = formData[currentTab - 1];
+      const activeTab = currentTabData?.activeTab;
+      const isDragDrop = currentTabData?.[activeTab]?.is_drag_drop;
 
-      const payload = {
-        channel: EMAIL,
-        messageTitle: formData['template-subject'],
-        messageBody: getCurrentContent,
-        resolvedTags,
-        userId: selectedCustomer?.customerId,
-      };
-      await actions.updatePreviewRequested(payload);
+      // For BEE editor, ensure content is saved first
+      if (isDragDrop && beeInstance) {
+        // Trigger save to ensure latest content
+        beeInstance.save();
+
+        // Wait a bit for save to complete and formData to update
+        await new Promise((resolve) => setTimeout(resolve, 500));
+
+        // Get latest content from formData
+        const updatedContent = formData[currentTab - 1]?.[activeTab]?.['template-content'];
+        const payload = {
+          channel: EMAIL,
+          messageTitle: formData['template-subject'],
+          messageBody: updatedContent || getCurrentContent,
+          resolvedTags: currentCustomValues, // Use stored values
+          userId: selectedCustomer?.customerId,
+        };
+
+        await actions.updatePreviewRequested(payload);
+        return;
+      }
+
+      // For CKEditor, get latest content directly from formData
+      const templateContent = currentTabData?.[activeTab]?.['template-content'];
+      if (templateContent) {
+        // Create payload for CKEditor preview update
+        const payload = {
+          channel: EMAIL,
+          messageTitle: formData['template-subject'],
+          messageBody: templateContent,
+          resolvedTags: currentCustomValues,
+          userId: selectedCustomer?.customerId,
+        };
+
+        // Use the same update preview action for both editors
+        await actions.updatePreviewRequested(payload);
+      }
     } catch (error) {
       console.error('Error updating preview:', error);
       CapNotification.error({
@@ -535,34 +493,7 @@ const TestAndPreviewSlidebox = (props) => {
 
   // Handle extract tags button click
   const handleExtractTags = () => {
-    // Extract tags from current content
-    const currentTabData = formData[currentTab - 1];
-    const activeTab = currentTabData?.activeTab;
-    const templateContent = currentTabData?.[activeTab]?.['template-content'];
-    
-    // Check for personalization tags (excluding unsubscribe)
-    const content = templateContent || getCurrentContent;
-    const tags = content.match(/{{[^}]+}}/g) || [];
-    const hasPersonalizationTags = tags.some(tag => !tag.includes('unsubscribe'));
-    
-    if (!hasPersonalizationTags && tags.length === 1 && tags[0].includes('unsubscribe')) {
-      // If only unsubscribe tag is present, show noTagsExtracted message
-      setTagsExtracted(false);
-      setRequiredTags([]);
-      setOptionalTags([]);
-      setCustomValues({});
-      return;
-    }
-    
-    // Extract tags
     setTagsExtracted(true);
-    if (templateContent) {
-      const payloadContent = convert(templateContent, GLOBAL_CONVERT_OPTIONS);
-      actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
-    } else {
-      const payloadContent = convert(getCurrentContent, GLOBAL_CONVERT_OPTIONS);
-      actions.extractTagsRequested(formData['template-subject'] || '', payloadContent);
-    }
   };
 
   const handleTestEntitiesChange = (value) => {

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

@@ -36,7 +36,7 @@ import {
   CREATE_CENTRAL_COMMS_META_ID_REQUEST,
 } from '../constants';
 import { callback, error, error2, videoConfigData } from '../../mockdata';
-import { LOGOUT_FAILURE, LOGOUT_REQUEST, LOGOUT_SUCCESS } from '../../../containers/Cap/constants';
+import { LOGOUT_FAILURE, LOGOUT_SUCCESS } from '../../../constants/unified';
 
 
 

package/v2Containers/CreativesContainer/index.js

@@ -543,6 +543,7 @@ export class Creatives extends React.Component {
               whatsappMedia = {},
               isPreviewUrl = false,
               cards = [],
+              id = '',
             } = {},
           } = templateData;
           const mediaParams = {};
@@ -582,6 +583,7 @@ export class Creatives extends React.Component {
           }
           const unsubscribeRegex = /Click {{unsubscribe}} to unsubscribe/g;
           creativesTemplateData = {
+            _id: id,
             type: constants.WHATSAPP,
             edit: true,
             name,

package/v2Containers/Email/index.js

@@ -37,9 +37,9 @@ import { FONT_COLOR_05 } from '@capillarytech/cap-ui-library/styled/variables';
 import { gtmPush } from '../../utils/gtmTrackers';
 const {CapCustomCardList} = CapCustomCard;
 import {storeS3FileSizeDetails, CREATIVES_S3_ASSET_FILESIZES} from '../../utils/cdnTransformation';
+import { CUSTOMER_BARCODE_TAG } from '../../constants/unified';
 
 import { containsBase64Images } from '../../utils/content';
-import { CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
 import injectReducer from '../../utils/injectReducer';
 import v2EmailReducer from './reducer';
 import { v2EmailSagas } from './sagas';

package/v2Containers/FTP/index.js

@@ -29,7 +29,7 @@ import { makeSelectLoyaltyPromotionDisplay, setInjectedTags } from '../Cap/selec
 import withCreatives from '../../hoc/withCreatives';
 import messages from './messages';
 import './_FTP.scss';
-import * as globalActions from '../../containers/Cap/actions';
+import * as globalActions from '../Cap/actions';
 import { TagList } from '../TagList';
 import { NO_COMMUNICATION, CREATE, EDIT, PREVIEW } from '../App/constants';
 import { getTreeStructuredTags } from '../../utils/common';

package/v2Containers/Line/Container/Text/index.js

@@ -17,7 +17,7 @@ import withStyles from '../../../../hoc/withStyles';
 import globalMessages from '../../../Cap/messages';
 import { validateTags } from '../../../../utils/tagValidations';
 import moment from 'moment';
-import { GET_TRANSLATION_MAPPED } from '../../../../containers/TagList/constants';
+import { GET_TRANSLATION_MAPPED } from '../../../../constants/unified';
 
 const { TextArea } = CapInput;
 const {CapCustomCardList} = CapCustomCard;

package/v2Containers/Sms/Create/index.js

@@ -24,7 +24,7 @@ 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

@@ -105,7 +105,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/v2Containers/Whatsapp/constants.js

@@ -80,7 +80,7 @@ export const mediaTypeOptions = ({host, templateCategory}) => {
           tagColor: CAP_GREEN02,
           tagTextColor: CAP_GREEN01,
         },
-        ...(templateCategory === WHATSAPP_CATEGORIES.marketing && host === HOST_GUPSHUP
+        ...(templateCategory === WHATSAPP_CATEGORIES.marketing && (host === HOST_GUPSHUP || host === HOST_KARIX)
           ? [
             {
               key: 'CAROUSEL',

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

@@ -577,7 +577,7 @@ describe('mediaTypeOptions', () => {
         ? opt.some((o) => o.key === 'CAROUSEL')
         : opt.key === 'CAROUSEL'
     ) || options.flat().some((o) => o.key === 'CAROUSEL');
-    expect(hasCarousel).toBe(false);
+    expect(hasCarousel).toBe(true);
   });
 
   it('should NOT include CAROUSEL when category is NOT MARKETING and host is HOST_GUPSHUP', () => {