@capillarytech/creatives-library 8.0.216 → 8.0.218

package/v2Containers/Whatsapp/index.js

@@ -106,7 +106,8 @@ import {
   REQUEST,
   HOST_KARIX
 } from './constants';
-import { transformAssetData, transformToVendorFormat, VENDOR_TYPES } from '../../utils/vendorDataTransformers';
+import { transformAssetData, transformToVendorFormat, VENDOR_TYPES, resolveCarouselVideoUpdateFields } from '../../utils/vendorDataTransformers';
+import { validateCarouselCards } from '../../utils/commonUtils';
 import { DATE_DISPLAY_FORMAT, TIME_DISPLAY_FORMAT } from '../App/constants';
 import messages from './messages';
 import globalMessages from '../Cap/messages';
@@ -455,7 +456,9 @@ export const Whatsapp = (props) => {
             videoSrc: carousel?.videoUrl,
             videoPreviewImg: carousel?.videoPreviewImg,
           }),
-          karixFileHandle: carousel?.karixFileHandle || '',
+        // Preserve both vendor-specific file handles from edit data
+        karixFileHandle: carousel?.karixFileHandle || '',
+        hapticFileHandle: carousel?.hapticFileHandle || '',
           buttons: carousel?.buttons?.map((button) => ({
             ...button,
             buttonType: button?.type,
@@ -463,7 +466,7 @@ export const Whatsapp = (props) => {
           assetList: {
             previewUrl: carousel?.videoPreviewImg,
             videoSrc: carousel?.videoUrl,
-            fileHandle: carousel?.karixFileHandle,
+          fileHandle: carousel?.hapticFileHandle || carousel?.karixFileHandle,
           }
         };
       })
@@ -1127,7 +1130,14 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
   const setUpdateWhatsappImageSrc = useCallback(
     (filePath, fileHandle) => {
 			if (isMediaTypeCarousel) {
-				handleCarouselValueChange(parseInt(activeIndex, 10), [{fieldName: "imageSrc", value: filePath}, {fieldName: "karixFileHandle", value: fileHandle}]);
+				handleCarouselValueChange(
+					parseInt(activeIndex, 10),
+					[
+						{ fieldName: "imageSrc", value: filePath },
+						{ fieldName: "hapticFileHandle", value: host === HOST_HAPTIC ? fileHandle : '' },
+						{ fieldName: "karixFileHandle", value: (host === HOST_KARIX || host === HOST_GUPSHUP) ? fileHandle : '' },
+					]
+				);
 			} else {
 				setWhatsappImageSrc(filePath);
 				if (isHaptic) {
@@ -1143,7 +1153,14 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
 
   const updateOnWhatsappImageReUpload = useCallback(() => {
 		if (isMediaTypeCarousel) {
-			handleCarouselValueChange(parseInt(activeIndex, 10), [{fieldName: "imageSrc", value: ''}, {fieldName: "karixFileHandle", value: ''}]);
+			handleCarouselValueChange(
+				parseInt(activeIndex, 10),
+				[
+					{ fieldName: "imageSrc", value: '' },
+					{ fieldName: "hapticFileHandle", value: '' },
+					{ fieldName: "karixFileHandle", value: '' },
+				]
+			);
 		} else {
 			setWhatsappImageSrc('');
 			if (isHaptic) {
@@ -1165,12 +1182,12 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
 
   // Handle vendor-specific updates
   const handleVideoUploadUpdate = (index, data) => {
-    if (host === HOST_HAPTIC) {
-      // Transform back to HAPTIC format
+    if (host === HOST_HAPTIC && !isMediaTypeCarousel) {
+      // Non-carousel HAPTIC needs vendor meta for non-carousel state mapping
       const hapticData = transformToVendorFormat(data, VENDOR_TYPES.HAPTIC);
       setUpdateWhatsappVideoSrc(index, hapticData);
     } else {
-      // Use existing logic for other vendors
+      // Carousel and other vendors use standard data so card.videoSrc is set
       setUpdateWhatsappVideoSrc(index, data);
     }
   };
@@ -1179,7 +1196,18 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
     (index, data) => {
       const { videoSrc = '', previewUrl = '', fileHandle = '' } = data;
 			if (isMediaTypeCarousel) {
-				handleCarouselValueChange(parseInt(activeIndex, 10), [{fieldName: "videoSrc", value: videoSrc}, {fieldName: "videoPreviewImg", value: previewUrl}, {fieldName: "assetList", value: data}, {fieldName: "karixFileHandle", value: fileHandle}]);
+				const { updateFields } = resolveCarouselVideoUpdateFields({
+					host,
+					data,
+					videoSrc,
+					previewUrl,
+					fileHandle,
+				});
+
+				handleCarouselValueChange(
+					parseInt(activeIndex, 10),
+					updateFields
+				);
 			} else {
 				setWhatsappVideoSrcAndPreview({
 					whatsappVideoSrc: host === HOST_HAPTIC ? data?.metaInfo?.secure_file_path : videoSrc,
@@ -1547,7 +1575,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
 
 	const getCarouselPayload = () => {
 		return carouselData.map((carousel) => {
-			const { bodyText = '', imageSrc = '', videoSrc = '', videoPreviewImg = '', karixFileHandle = '', buttons = [], varMap: carouselVarMap = {}, updatedBodyText = [], tempBodyData = [] } = carousel || {};
+			const { bodyText = '', imageSrc = '', videoSrc = '', videoPreviewImg = '', karixFileHandle = '', hapticFileHandle: cardHapticFileHandle = '', buttons = [], varMap: carouselVarMap = {}, updatedBodyText = [], tempBodyData = [] } = carousel || {};
 			const carouselButtons = buttons.map((button) => {
 				const { text = '', buttonType: type = '', url = '', phone_number = '', urlType = '' } = button;
 				return {
@@ -1571,7 +1599,7 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
 					videoUrl: videoSrc,
 					videoPreviewImg,
 				}),
-				karixFileHandle,
+				...(isHaptic ? { hapticFileHandle: cardHapticFileHandle } : { karixFileHandle }),
 				buttons: carouselButtons,
         mediaType: carouselMediaType,
         ...(!isFullMode && {
@@ -1721,6 +1749,8 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
   const isMediatypeValid =()=> ((isMediaTypeImage && whatsappImageSrc === "") || (isMediaTypeVideo && whatsappVideoSrcAndPreview?.whatsappVideoSrc === "") || (isMediaTypeDoc && whatsappDocSource === ""));
 
   const isDisableDone = () => {
+    // Snapshot removed
+
     //if template name is not entered
     if (templateName.trim() === '' || templateNameError) {
       return true;
@@ -1761,8 +1791,13 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
       //if button type is cta and there are no buttons saved
       return true;
     }
-    //karix expiry minutes validation
-    if(host === HOST_KARIX && (expiryMinutes <=0 || expiryMinutes > 90)){
+    //karix expiry minutes validation - only for authentication template
+    if (
+      host === HOST_KARIX &&
+      isAuthenticationTemplate &&
+      securityWarningReqd &&
+      (expiryMinutes <= 0 || expiryMinutes > 90)
+    ) {
       return true;
     }
 
@@ -1771,21 +1806,20 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
     }
     if (isBtnTypeQuickReply) {
       // Disable button if there are no quick reply buttons or if any button is not saved
-      return !quickReplyData?.length || !quickReplyData.every(qr => qr?.isSaved);
+      const ok = !!quickReplyData?.length && quickReplyData.every(qr => qr?.isSaved);
+      if (!ok) {
+        return true;
+      }
     }
 		if (isMediaTypeCarousel) {
-			const carouselDisableCheck = carouselData.some((data) => {
-				return (
-					data?.bodyError ||
-					data?.bodyText === "" ||
-					(carouselMediaType === IMAGE.toLowerCase() && !data?.imageSrc) ||
-					(carouselMediaType === VIDEO.toLowerCase() && !data?.videoSrc) ||
-					!data?.buttons.every((button) => button?.isSaved === true)
-				);
+			const { isValid } = validateCarouselCards(carouselData, carouselMediaType, {
+				imageConstant: IMAGE,
+				videoConstant: VIDEO,
 			});
-			return carouselDisableCheck;
+			if (!isValid) {
+				return true;
+			}
 		}
-
     return false;
   };