@capillarytech/creatives-library 8.0.266 → 8.0.267

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

@@ -1,131 +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}
-      stateDropdownDisabled={false}
-      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"
-              buttons={Array []}
-              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"
-              showSeparateIOSCTAs={true}
-              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,112 +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=""
-    ctaButtons={Array []}
-    displayUrl="example.com"
-    enableCtas={true}
-    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"
-    ctaButtons={Array []}
-    displayUrl="example.com"
-    enableBrandIconPreview={true}
-    enableCtas={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 []}
-    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,129 +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"
-      buttons={Array []}
-      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"
-        buttons={Array []}
-        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/payloadBuilder.js

@@ -1,96 +0,0 @@
-import {
-  WEBPUSH,
-  WEBPUSH_MEDIA_TYPES,
-  IMAGE_UPLOAD_METHODS,
-  BRAND_ICON_OPTIONS,
-  ON_CLICK_BEHAVIOUR_OPTIONS,
-  ACTION_TYPES,
-} from '../../constants';
-
-/**
- * Creates the payload structure for Web Push template creation/editing
- * @param {Object} params - All parameters needed to build the payload
- * @returns {Object} The formatted Web Push payload
- */
-export const createWebPushPayload = ({
-  templateName,
-  notificationTitle,
-  message,
-  mediaType,
-  accountId,
-  isFullMode,
-  imageSrc,
-  imageUrl,
-  imageUploadMethod,
-  brandIconOption,
-  brandIconSrc,
-  brandIconUrl,
-  buttons,
-  onClickBehaviour,
-  redirectUrl,
-  websiteLink
-}) => {
-  const trimmedTemplateName = (templateName || '').trim();
-  const trimmedTitle = (notificationTitle || '').trim();
-  const trimmedMessage = (message || '').trim();
-
-  const webpushContent = {
-    title: trimmedTitle,
-    message: trimmedMessage,
-    ...(mediaType && mediaType !== WEBPUSH_MEDIA_TYPES.NONE ? { mediaType } : {}),
-  };
-
-  // Add image data if media type is IMAGE
-  if (mediaType === WEBPUSH_MEDIA_TYPES.IMAGE) {
-    if (imageUploadMethod === IMAGE_UPLOAD_METHODS.UPLOAD_IMAGE && imageSrc) {
-      webpushContent.image = imageSrc;
-    } else if (imageUploadMethod === IMAGE_UPLOAD_METHODS.ADD_IMAGE_URL && imageSrc) {
-      // Use imageSrc (uploaded secure_file_path) instead of imageUrl
-      // NOTE: To move upload to save event, check imageUrl exists but imageSrc is empty, upload, then use secure_file_path
-      webpushContent.image = imageSrc;
-    }
-  }
-
-  // Add brand icon data if option is not DONT_SHOW
-  if (brandIconOption !== BRAND_ICON_OPTIONS.DONT_SHOW && brandIconSrc) {
-    webpushContent.brandIcon = brandIconSrc;
-  }
-
-  // Add on-click behaviour for the notification body
-  if (onClickBehaviour === ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL && redirectUrl) {
-    webpushContent.onClickAction = {
-      type: ACTION_TYPES.URL,
-      url: redirectUrl.trim(),
-    };
-  } else if (onClickBehaviour === ON_CLICK_BEHAVIOUR_OPTIONS.SITE_URL) {
-    webpushContent.onClickAction = {
-      type: ACTION_TYPES.SITE_URL,
-      url: websiteLink,
-    };
-  }
-
-  // Add CTA buttons if any exist
-  if (buttons?.length > 0) {
-    webpushContent.ctas = buttons.map((button) => ({
-      actionText: button.text,
-      type: ACTION_TYPES.URL,
-      actionLink: button.url,
-    }));
-  }
-
-  return {
-    name: (isFullMode ? trimmedTemplateName : trimmedTitle) || trimmedTitle,
-    type: WEBPUSH,
-    definition: {
-      accountId,
-    },
-    versions: {
-      base: {
-        content: {
-          webpush: webpushContent,
-        },
-      },
-    },
-  };
-};
-