@capillarytech/creatives-library 8.0.242-alpha.0 → 8.0.242-alpha.2

package/v2Containers/WebPush/Create/preview/tests/__snapshots__/DevicePreviewContent.test.js.snap

@@ -1,128 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`DevicePreviewContent Basic Rendering should render correctly with default props 1`] = `
-<CapRow>
-  <CapColumn
-    span={24}
-  >
-    <MockPreviewControls
-      browserOptions={
-        Array [
-          Object {
-            "label": "Chrome",
-            "value": "Chrome",
-          },
-          Object {
-            "label": "Firefox",
-            "value": "Firefox",
-          },
-          Object {
-            "label": "Edge",
-            "value": "Edge",
-          },
-          Object {
-            "label": "Safari",
-            "value": "Safari",
-          },
-          Object {
-            "label": "Opera",
-            "value": "Opera",
-          },
-        ]
-      }
-      layoutMode="compact"
-      onBrowserChange={[Function]}
-      onOSChange={[Function]}
-      onStateChange={[Function]}
-      osOptions={
-        Array [
-          Object {
-            "label": "macOS",
-            "value": "macOS",
-          },
-          Object {
-            "label": "iOS",
-            "value": "iOS",
-          },
-          Object {
-            "label": "iPadOS",
-            "value": "iPadOS",
-          },
-          Object {
-            "label": "Windows",
-            "value": "Windows",
-          },
-          Object {
-            "label": "Android (Mobile)",
-            "value": "Android (Mobile)",
-          },
-          Object {
-            "label": "Android (Tablet)",
-            "value": "Android (Tablet)",
-          },
-        ]
-      }
-      selectedBrowser="Chrome"
-      selectedOS="macOS"
-      selectedState="Collapsed"
-      showStateDropdown={true}
-      stateOptions={
-        Array [
-          Object {
-            "label": "Collapsed",
-            "value": "Collapsed",
-          },
-          Object {
-            "label": "Expanded",
-            "value": "Expanded",
-          },
-        ]
-      }
-    />
-    <div
-      className="device-preview-container"
-    >
-      <div
-        className="device-frame-wrapper"
-      >
-        <div
-          className="device-frame-asset"
-        >
-          <img
-            alt="macOS device frame"
-            className="device-frame"
-            src="test-file-stub"
-          />
-          <div
-            className="device-notification-wrapper"
-            style={
-              Object {
-                "left": "580px",
-                "position": "absolute",
-                "top": "57px",
-                "zIndex": 10,
-              }
-            }
-          >
-            <MockNotificationContainer
-              brandIconSrc="https://example.com/icon.png"
-              className="macos-chrome"
-              enableCtas={false}
-              enableMedia={false}
-              icon="test-file-stub"
-              imageSrc="https://example.com/image.jpg"
-              notificationBody="Test notification body text"
-              notificationState="Collapsed"
-              notificationTitle="Test Notification Title"
-              selectedBrowser="Chrome"
-              selectedOS="macOS"
-              supportsExpanded={false}
-              url="https://www.example.com"
-            />
-          </div>
-        </div>
-      </div>
-    </div>
-  </CapColumn>
-</CapRow>
-`;

package/v2Containers/WebPush/Create/preview/tests/__snapshots__/NotificationContainer.test.js.snap

@@ -1,121 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`NotificationContainer Basic Rendering should render correctly with default props 1`] = `
-<div
-  className="notification-container macos-chrome collapsed"
->
-  <NotificationHeader
-    brandIcon=""
-    displayUrl="example.com"
-    icon="test-file-stub"
-    isExpanded={false}
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-    selectedBrowser="Chrome"
-    shouldShowBrandIcon={false}
-  />
-</div>
-`;
-
-exports[`NotificationContainer Snapshot Tests should match snapshot for Android Mobile Chrome expanded 1`] = `
-<div
-  className="notification-container android-mobile-chrome expanded"
->
-  <AndroidMobileExpanded
-    brandIcon=""
-    displayUrl="example.com"
-    icon="test-file-stub"
-    mediaImageUrl=""
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-    selectedBrowser="Chrome"
-    shouldShowBrandIcon={false}
-    shouldShowBrandIconExpanded={false}
-  />
-</div>
-`;
-
-exports[`NotificationContainer Snapshot Tests should match snapshot for Windows Chrome expanded 1`] = `
-<div
-  className="notification-container windows-chrome expanded windows-chrome-expanded"
->
-  <WindowsChromeExpanded
-    brandIcon=""
-    browserName="Google Chrome"
-    displayUrl="example.com"
-    enableBrandIconPreview={true}
-    icon="test-file-stub"
-    mediaImageUrl=""
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-  />
-</div>
-`;
-
-exports[`NotificationContainer Snapshot Tests should match snapshot for iOS Safari collapsed 1`] = `
-<div
-  className="notification-container ios-safari collapsed"
->
-  <IOSHeader
-    icon="test-file-stub"
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-    selectedBrowser="Safari"
-  />
-</div>
-`;
-
-exports[`NotificationContainer Snapshot Tests should match snapshot for macOS Chrome collapsed 1`] = `
-<div
-  className="notification-container macos-chrome collapsed"
->
-  <NotificationHeader
-    brandIcon=""
-    displayUrl="example.com"
-    icon="test-file-stub"
-    isExpanded={false}
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-    selectedBrowser="Chrome"
-    shouldShowBrandIcon={false}
-  />
-</div>
-`;
-
-exports[`NotificationContainer Snapshot Tests should match snapshot for macOS Chrome expanded 1`] = `
-<div
-  className="notification-container macos-chrome expanded"
->
-  <NotificationHeader
-    brandIcon=""
-    displayUrl="example.com"
-    icon="test-file-stub"
-    isExpanded={true}
-    notificationBody="Test notification body text"
-    notificationTitle="Test Notification Title"
-    selectedBrowser="Chrome"
-    shouldShowBrandIcon={false}
-  />
-  <NotificationExpandedContent
-    brandIcon=""
-    ctaButtons={
-      Array [
-        Object {
-          "icon": "⚡",
-          "id": "1",
-          "label": "Features",
-        },
-        Object {
-          "icon": "📋",
-          "id": "2",
-          "label": "Signup for Free",
-        },
-      ]
-    }
-    enableCtas={true}
-    mediaImageUrl=""
-    shouldRenderExpandedMedia={false}
-    shouldShowBrandIconInExpandedMac={false}
-  />
-</div>
-`;

package/v2Containers/WebPush/Create/preview/tests/__snapshots__/PreviewControls.test.js.snap

@@ -1,144 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`PreviewControls Basic Rendering should render correctly with default props 1`] = `
-<Fragment>
-  <CapRow
-    className="preview-controls"
-  >
-    <CapColumn
-      className="preview-control-os"
-      span={12}
-    >
-      <CapLabel
-        className="preview-control-label"
-        fontWeight="bold"
-        type="label1"
-      >
-        <FormattedMessage
-          defaultMessage="Operating system"
-          id="creatives.containersV2.WebPush.operatingSystem"
-          values={Object {}}
-        />
-      </CapLabel>
-      <_Class
-        labelPosition="top"
-        onChange={[Function]}
-        options={
-          Array [
-            Object {
-              "label": "macOS",
-              "value": "macOS",
-            },
-            Object {
-              "label": "iOS",
-              "value": "iOS",
-            },
-            Object {
-              "label": "iPadOS",
-              "value": "iPadOS",
-            },
-            Object {
-              "label": "Windows",
-              "value": "Windows",
-            },
-            Object {
-              "label": "Android (Mobile)",
-              "value": "Android (Mobile)",
-            },
-            Object {
-              "label": "Android (Tablet)",
-              "value": "Android (Tablet)",
-            },
-          ]
-        }
-        value="macOS"
-        width="100%"
-      />
-    </CapColumn>
-    <CapColumn
-      className="preview-control-browser"
-      span={12}
-    >
-      <CapLabel
-        className="preview-control-label"
-        fontWeight="bold"
-        type="label1"
-      >
-        <FormattedMessage
-          defaultMessage="Browser"
-          id="creatives.containersV2.WebPush.browser"
-          values={Object {}}
-        />
-      </CapLabel>
-      <_Class
-        labelPosition="top"
-        onChange={[Function]}
-        options={
-          Array [
-            Object {
-              "label": "Chrome",
-              "value": "Chrome",
-            },
-            Object {
-              "label": "Firefox",
-              "value": "Firefox",
-            },
-            Object {
-              "label": "Edge",
-              "value": "Edge",
-            },
-            Object {
-              "label": "Safari",
-              "value": "Safari",
-            },
-            Object {
-              "label": "Opera",
-              "value": "Opera",
-            },
-          ]
-        }
-        value="Chrome"
-        width="100%"
-      />
-    </CapColumn>
-  </CapRow>
-  <CapRow
-    className="preview-controls-state"
-  >
-    <CapColumn
-      className="preview-control-state"
-      span={12}
-    >
-      <CapLabel
-        className="preview-control-label"
-        fontWeight="bold"
-        type="label1"
-      >
-        <FormattedMessage
-          defaultMessage="State"
-          id="creatives.containersV2.WebPush.state"
-          values={Object {}}
-        />
-      </CapLabel>
-      <_Class
-        labelPosition="top"
-        onChange={[MockFunction]}
-        options={
-          Array [
-            Object {
-              "label": "Collapsed",
-              "value": "Collapsed",
-            },
-            Object {
-              "label": "Expanded",
-              "value": "Expanded",
-            },
-          ]
-        }
-        value="Collapsed"
-        width="100%"
-      />
-    </CapColumn>
-  </CapRow>
-</Fragment>
-`;

package/v2Containers/WebPush/Create/preview/tests/__snapshots__/WebPushPreview.test.js.snap

@@ -1,127 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`WebPushPreview Basic Rendering should render correctly with default props 1`] = `
-<CapRow
-  className="webpush-preview-container"
->
-  <CapColumn
-    span={24}
-  >
-    <PreviewControls
-      browserOptions={
-        Array [
-          Object {
-            "label": "Chrome",
-            "value": "Chrome",
-          },
-          Object {
-            "label": "Firefox",
-            "value": "Firefox",
-          },
-          Object {
-            "label": "Edge",
-            "value": "Edge",
-          },
-          Object {
-            "label": "Safari",
-            "value": "Safari",
-          },
-          Object {
-            "label": "Opera",
-            "value": "Opera",
-          },
-        ]
-      }
-      layoutMode="newRow"
-      onBrowserChange={[Function]}
-      onOSChange={[Function]}
-      osOptions={
-        Array [
-          Object {
-            "label": "macOS",
-            "value": "macOS",
-          },
-          Object {
-            "label": "iOS",
-            "value": "iOS",
-          },
-          Object {
-            "label": "iPadOS",
-            "value": "iPadOS",
-          },
-          Object {
-            "label": "Windows",
-            "value": "Windows",
-          },
-          Object {
-            "label": "Android (Mobile)",
-            "value": "Android (Mobile)",
-          },
-          Object {
-            "label": "Android (Tablet)",
-            "value": "Android (Tablet)",
-          },
-        ]
-      }
-      selectedBrowser="Chrome"
-      selectedOS="macOS"
-      showStateDropdown={false}
-    />
-    <PreviewContent
-      brandIconSrc="https://example.com/icon.png"
-      imageSrc="https://example.com/image.jpg"
-      notificationBody="Test notification body text"
-      notificationState="Collapsed"
-      notificationTitle="Test Notification Title"
-      selectedBrowser="Chrome"
-      selectedOS="macOS"
-      url="https://www.example.com"
-    />
-    <PreviewDisclaimer />
-    <CapRow
-      className="preview-all-devices-button"
-    >
-      <CapColumn
-        span={24}
-      >
-        <CapButton
-          className="preview-all-devices-trigger"
-          data-test-id="webpush-preview-toggle"
-          isAddBtn={false}
-          onClick={[Function]}
-          type="flat"
-        >
-          <FormattedMessage
-            defaultMessage="Preview in all devices"
-            id="creatives.containersV2.WebPush.previewInAllDevices"
-            values={Object {}}
-          />
-        </CapButton>
-      </CapColumn>
-    </CapRow>
-  </CapColumn>
-  <MockCapSlideBox
-    className="webpush-preview-slidebox"
-    content={
-      <DevicePreviewContent
-        brandIconSrc="https://example.com/icon.png"
-        imageSrc="https://example.com/image.jpg"
-        layoutMode="compact"
-        notificationBody="Test notification body text"
-        notificationTitle="Test Notification Title"
-        url="https://www.example.com"
-      />
-    }
-    handleClose={[Function]}
-    header={
-      <FormattedMessage
-        defaultMessage="Web push notification preview"
-        id="creatives.containersV2.WebPush.webPushNotificationPreview"
-        values={Object {}}
-      />
-    }
-    show={false}
-    size="size-xl"
-  />
-</CapRow>
-`;

package/v2Containers/WebPush/Create/utils/urlValidation.js

@@ -1,116 +0,0 @@
-/**
- * URL Validation Utilities
- * 
- * Provides robust URL validation that works across different environments
- * (browser, Node.js, Jest) with multiple fallback strategies.
- */
-
-const SUPPORTED_PROTOCOLS = new Set(['http:', 'https:']);
-const HTTP_URL_PATTERN = /^https?:\/\/.+/i;
-// Pattern to ensure URL has a TLD (Top Level Domain): protocol://domain.tld
-// Requires at least one dot in the domain part, followed by 2+ word characters
-// before path separator (/), query (?), hash (#), port (:), or end of string
-const TLD_PATTERN = /^https?:\/\/[^/?#:]+\.\w{2,}(?:\/|$|\?|#|:)/i;
-
-/**
- * Resolves the URL constructor available in the current environment
- * @returns {Function|null} URL constructor function or null if not available
- */
-const resolveUrlConstructor = () => {
-  if (typeof window !== 'undefined' && typeof window.URL === 'function') {
-    return window.URL;
-  }
-
-  if (typeof URL === 'function') {
-    return URL;
-  }
-
-  return null;
-};
-
-/**
- * Checks if document API is available for DOM-based validation
- * @returns {boolean} True if document.createElement is available
- */
-const canUseDocument = () => typeof document !== 'undefined' && typeof document.createElement === 'function';
-
-/**
- * Validates if a value is a valid HTTP/HTTPS URL
- * Uses multiple validation strategies for maximum compatibility:
- * 1. Regex pattern check for http:// or https:// prefix
- * 2. URL constructor validation (if available)
- * 3. DOM-based validation using anchor element (if available)
- * 
- * @param {string} value - The URL string to validate
- * @returns {boolean} True if the value is a valid HTTP/HTTPS URL
- */
-export const isValidHttpUrl = (value) => {
-  if (!value) {
-    return false;
-  }
-
-  const trimmedValue = value.trim();
-  if (!trimmedValue) {
-    return false;
-  }
-
-  // First check: regex pattern for http:// or https:// prefix
-  if (!HTTP_URL_PATTERN.test(trimmedValue)) {
-    return false;
-  }
-
-  // Second check: ensure URL has a valid TLD (Top Level Domain)
-  // URLs like https://google are invalid, but https://google.com is valid
-  if (!TLD_PATTERN.test(trimmedValue)) {
-    return false;
-  }
-
-  // Third check: try URL constructor if available
-  const UrlConstructor = resolveUrlConstructor();
-  if (UrlConstructor) {
-    try {
-      const parsedUrl = new UrlConstructor(trimmedValue);
-      if (SUPPORTED_PROTOCOLS.has(parsedUrl.protocol)) {
-        return true;
-      }
-    } catch (error) {
-      // URL constructor failed, fall back to DOM-based validation
-    }
-  }
-
-  // Fourth check: DOM-based validation using anchor element
-  if (canUseDocument()) {
-    const parser = document.createElement('a');
-    parser.href = trimmedValue;
-    if (SUPPORTED_PROTOCOLS.has(parser.protocol)) {
-      return true;
-    }
-  }
-
-  // If all validation methods failed, return false
-  return false;
-};
-
-/**
- * Validates a URL value and returns an error message if invalid
- * This is a higher-level validation function that can be used with form validation
- * 
- * @param {string} value - The URL string to validate
- * @param {Function} formatMessage - Function to format error messages (e.g., react-intl formatMessage)
- * @param {Object} messages - Object containing error message keys:
- *   - urlRequired: Message for empty URL
- *   - urlInvalid: Message for invalid URL format
- * @returns {string} Empty string if valid, error message if invalid
- */
-export const validateUrl = (value, formatMessage, messages) => {
-  if (!value || value.trim() === '') {
-    return formatMessage(messages.urlRequired);
-  }
-
-  if (!isValidHttpUrl(value)) {
-    return formatMessage(messages.urlInvalid);
-  }
-
-  return '';
-};
-