@capillarytech/creatives-library 8.0.138 → 8.0.139-alpha.0

package/package.json

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

package/v2Containers/Line/Container/_lineCreate.scss

@@ -57,7 +57,7 @@
   }
   img {
     object-fit: cover;
-    max-height: 150px;
+    max-height: 9.375rem;
     max-width: 18.75rem;
   }
 }

package/v2Containers/MobilePushNew/components/MediaUploaders.js

@@ -61,6 +61,22 @@ const CAROUSEL_INITIAL_DATA = {
 // Maximum number of carousel cards allowed
 const MAX_CAROUSEL_ALLOWED = 10;
 
+// Helper function to find selected deep link with fallback to base URL
+const findSelectedDeepLink = (links, value) => {
+  if (!links || !value) return undefined;
+  
+  // Try to find exact match first
+  let selectedDeepLink = links.find((link) => link?.value === value);
+  
+  // If no exact match and value contains query parameters, try base URL match
+  if (!selectedDeepLink && value?.includes('?')) {
+    const baseDeepLinkValue = value.split('?')[0];
+    selectedDeepLink = links.find((link) => link?.value === baseDeepLinkValue);
+  }
+  
+  return selectedDeepLink;
+};
+
 const MediaUploaders = ({
   mediaType,
   activeTab,
@@ -616,12 +632,7 @@ const MediaUploaders = ({
               </CapRow>
             )}
             {button?.linkType === DEEP_LINK && button?.deepLinkValue && button?.actionOnClick && (() => {
-              // Try to find exact match first, then try match without query parameters
-              let selectedDeepLink = deepLink?.find((link) => link?.value === button?.deepLinkValue);
-              if (!selectedDeepLink && button?.deepLinkValue && button?.deepLinkValue.includes('?')) {
-                const baseDeepLinkValue = button?.deepLinkValue.split('?')[0];
-                selectedDeepLink = deepLink?.find((link) => link?.value === baseDeepLinkValue);
-              }
+              const selectedDeepLink = findSelectedDeepLink(deepLink, button?.deepLinkValue);
               const deepLinkKeysFromSelection = selectedDeepLink?.keys;
               let deepLinkKeysFromSelectionArray = [];
               if (Array.isArray(deepLinkKeysFromSelection)) {
@@ -638,12 +649,7 @@ const MediaUploaders = ({
                   </CapHeading>
                   <CapLabel type="label2" className="deep-link-keys-value">
                     {(() => {
-                      // Try to find exact match first, then try match without query parameters
-                      let selectedDeepLink = deepLink?.find((link) => link?.value === button?.deepLinkValue);
-                      if (!selectedDeepLink && button?.deepLinkValue && button?.deepLinkValue.includes('?')) {
-                        const baseDeepLinkValue = button?.deepLinkValue.split('?')[0];
-                        selectedDeepLink = deepLink?.find((link) => link?.value === baseDeepLinkValue);
-                      }
+                      const selectedDeepLink = findSelectedDeepLink(deepLink, button?.deepLinkValue);
                       const deepLinkKeysFromSelection = selectedDeepLink?.keys;
                       let deepLinkKeysArray = [];
                       if (Array.isArray(button?.deepLinkKeys)) {
@@ -671,12 +677,7 @@ const MediaUploaders = ({
                     onChange={(e) => handleCarouselDeepLinkKeysChange(cardIndex, e.target.value)}
                     placeholder={formatMessage(messages.deepLinkKeysPlaceholder, {
                       key: (() => {
-                        // Try to find exact match first, then try match without query parameters
-                        let selectedDeepLink = deepLink?.find((link) => link?.value === button?.deepLinkValue);
-                        if (!selectedDeepLink && button?.deepLinkValue && button?.deepLinkValue.includes('?')) {
-                          const baseDeepLinkValue = button?.deepLinkValue.split('?')[0];
-                          selectedDeepLink = deepLink?.find((link) => link?.value === baseDeepLinkValue);
-                        }
+                        const selectedDeepLink = findSelectedDeepLink(deepLink, button?.deepLinkValue);
                         const deepLinkKeysFromSelection = selectedDeepLink?.keys;
                         let deepLinkKeysFromSelectionArray = [];
                         if (Array.isArray(deepLinkKeysFromSelection)) {

package/v2Containers/MobilePushNew/index.js

@@ -93,6 +93,27 @@ import messages from "./messages";
 import { EXTERNAL_URL } from "../CreativesContainer/constants";
 import createMobilePushPayloadWithIntl from "../../utils/createMobilePushPayload";
 
+// Helper function to extract deep link keys from URL where value equals key
+const extractDeepLinkKeys = (deepLinkValue) => {
+  try {
+    if (deepLinkValue && deepLinkValue.includes('?')) {
+      const queryString = deepLinkValue.split('?')[1];
+      const searchParams = new URLSearchParams(queryString);
+      const extractedKeys = [];
+      searchParams.forEach((value, key) => {
+        if (value === key) { // Only extract keys where value equals key
+          extractedKeys.push(key);
+        }
+      });
+      return extractedKeys.length > 0 ? extractedKeys : [];
+    }
+    return [];
+  } catch (error) {
+    console.error("[MobilePushNew] Error extracting deep link keys from CTA button:", error);
+    return [];
+  }
+};
+
 const MobilePushNew = ({
   isFullMode,
   intl,
@@ -636,24 +657,9 @@ const MobilePushNew = ({
             // Use deep link keys from the button if available, otherwise try to extract from URL
             let deepLinkKeys = button?.deepLinkKeys || [];
             if (!deepLinkKeys.length && button?.type === DEEP_LINK && button?.actionLink) {
-              try {
-                // Extract query parameters from deep link URL using the same approach as main content
-                const deepLinkValue = button?.actionLink;
-                if (deepLinkValue && deepLinkValue.includes('?')) {
-                  const queryString = deepLinkValue.split('?')[1];
-                  const searchParams = new URLSearchParams(queryString);
-                  const extractedKeys = [];
-                  searchParams.forEach((value, key) => {
-                    if (value === key) { // Only extract keys where value equals key
-                      extractedKeys.push(key);
-                    }
-                  });
-                  if (extractedKeys?.length > 0) {
-                    deepLinkKeys = extractedKeys;
-                  }
-                }
-              } catch (error) {
-                console.error("[MobilePushNew] Error extracting deep link keys from CTA button:", error);
+              const extractedKeys = extractDeepLinkKeys(button?.actionLink);
+              if (extractedKeys?.length > 0) {
+                deepLinkKeys = extractedKeys;
               }
             }
 
@@ -968,24 +974,9 @@ const MobilePushNew = ({
             // Use deep link keys from the button if available, otherwise try to extract from URL
             let deepLinkKeys = button?.deepLinkKeys || [];
             if (!deepLinkKeys?.length && button?.type === DEEP_LINK && button?.actionLink) {
-              try {
-                // Extract query parameters from deep link URL using the same approach as main content
-                const deepLinkValue = button?.actionLink;
-                if (deepLinkValue && deepLinkValue.includes('?')) {
-                  const queryString = deepLinkValue.split('?')[1];
-                  const searchParams = new URLSearchParams(queryString);
-                  const extractedKeys = [];
-                  searchParams.forEach((value, key) => {
-                    if (value === key) { // Only extract keys where value equals key
-                      extractedKeys.push(key);
-                    }
-                  });
-                  if (extractedKeys?.length > 0) {
-                    deepLinkKeys = extractedKeys;
-                  }
-                }
-              } catch (error) {
-                console.error("[MobilePushNew] Error extracting deep link keys from CTA button:", error);
+              const extractedKeys = extractDeepLinkKeys(button?.actionLink);
+              if (extractedKeys?.length > 0) {
+                deepLinkKeys = extractedKeys;
               }
             }
 
@@ -1264,24 +1255,9 @@ const MobilePushNew = ({
           // Use deep link keys from the button if available, otherwise try to extract from URL
           let deepLinkKeys = button?.deepLinkKeys || [];
           if (!deepLinkKeys.length && button?.type === DEEP_LINK && button?.actionLink) {
-            try {
-              // Extract query parameters from deep link URL using the same approach as main content
-              const deepLinkValue = button?.actionLink;
-              if (deepLinkValue && deepLinkValue.includes('?')) {
-                const queryString = deepLinkValue.split('?')[1];
-                const searchParams = new URLSearchParams(queryString);
-                const extractedKeys = [];
-                searchParams.forEach((value, key) => {
-                  if (value === key) { // Only extract keys where value equals key
-                    extractedKeys.push(key);
-                  }
-                });
-                if (extractedKeys?.length > 0) {
-                  deepLinkKeys = extractedKeys;
-                }
-              }
-            } catch (error) {
-              console.error("[MobilePushNew] Error extracting deep link keys from CTA button:", error);
+            const extractedKeys = extractDeepLinkKeys(button?.actionLink);
+            if (extractedKeys?.length > 0) {
+              deepLinkKeys = extractedKeys;
             }
           }
 
@@ -1596,24 +1572,9 @@ const MobilePushNew = ({
           // Use deep link keys from the button if available, otherwise try to extract from URL
           let deepLinkKeys = button?.deepLinkKeys || [];
           if (!deepLinkKeys?.length && button?.type === DEEP_LINK && button?.actionLink) {
-            try {
-              // Extract query parameters from deep link URL using the same approach as main content
-              const deepLinkValue = button?.actionLink;
-              if (deepLinkValue && deepLinkValue.includes('?')) {
-                const queryString = deepLinkValue.split('?')[1];
-                const searchParams = new URLSearchParams(queryString);
-                const extractedKeys = [];
-                searchParams.forEach((value, key) => {
-                  if (value === key) { // Only extract keys where value equals key
-                    extractedKeys.push(key);
-                  }
-                });
-                if (extractedKeys?.length > 0) {
-                  deepLinkKeys = extractedKeys;
-                }
-              }
-            } catch (error) {
-              console.error("[MobilePushNew] Error extracting deep link keys from CTA button:", error);
+            const extractedKeys = extractDeepLinkKeys(button?.actionLink);
+            if (extractedKeys?.length > 0) {
+              deepLinkKeys = extractedKeys;
             }
           }
 

package/v2Containers/Templates/index.js

@@ -1300,7 +1300,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
                 )}
                 {style === VIDEO && (
                   <div className="video-preview">
-                    <video>
+                    <video aria-label="Template video preview" controls={false} tabIndex="0">
                       <source src={url} type="video/mp4" />
                     </video>
                     <div className="icon-position">