@streamscloud/streams-analytics-collector 2.0.10 → 4.0.0

package/dist/viewport-visibility-tracker.js

@@ -0,0 +1,104 @@
+const VISIBILITY_THRESHOLD = 0.5;
+class ViewportVisibilityTracker {
+    trackedIds = new Set();
+    targetToElements = new Map();
+    elementToTargetId = new Map();
+    callbacks = new Map();
+    observer;
+    registerElement(el, targetId, callback) {
+        if (this.trackedIds.has(targetId)) {
+            return;
+        }
+        const set = this.targetToElements.get(targetId) ?? new Set();
+        set.add(el);
+        this.targetToElements.set(targetId, set);
+        this.elementToTargetId.set(el, targetId);
+        this.callbacks.set(targetId, callback);
+        const observer = this.getObserver();
+        observer.observe(el);
+    }
+    unregisterElement(el) {
+        const targetId = this.elementToTargetId.get(el);
+        if (!targetId) {
+            return;
+        }
+        this.getObserver().unobserve(el);
+        this.elementToTargetId.delete(el);
+        const set = this.targetToElements.get(targetId);
+        if (set) {
+            set.delete(el);
+            if (set.size === 0) {
+                this.targetToElements.delete(targetId);
+                this.callbacks.delete(targetId);
+            }
+        }
+    }
+    unregisterAllElements(targetId) {
+        const set = this.targetToElements.get(targetId);
+        if (set) {
+            for (const el of set) {
+                this.getObserver().unobserve(el);
+                this.elementToTargetId.delete(el);
+            }
+        }
+        this.targetToElements.delete(targetId);
+        this.callbacks.delete(targetId);
+    }
+    reset() {
+        for (const set of this.targetToElements.values()) {
+            for (const el of set) {
+                this.getObserver().unobserve(el);
+            }
+        }
+        this.trackedIds.clear();
+        this.targetToElements.clear();
+        this.elementToTargetId.clear();
+        this.callbacks.clear();
+        if (this.observer) {
+            this.observer.disconnect();
+            this.observer = undefined;
+        }
+    }
+    getObserver() {
+        if (!this.observer) {
+            this.observer = new IntersectionObserver(this.handleIntersections.bind(this), {
+                threshold: VISIBILITY_THRESHOLD,
+            });
+        }
+        return this.observer;
+    }
+    handleIntersections(entries) {
+        for (const entry of entries) {
+            const el = entry.target;
+            const targetId = this.elementToTargetId.get(el);
+            if (!targetId) {
+                continue;
+            }
+            if (entry.isIntersecting && entry.intersectionRatio >= VISIBILITY_THRESHOLD) {
+                if (!this.trackedIds.has(targetId)) {
+                    this.trackedIds.add(targetId);
+                    const cb = this.callbacks.get(targetId);
+                    if (cb) {
+                        try {
+                            cb(targetId);
+                        }
+                        catch (err) {
+                            console.error('ViewportVisibilityTracker callback error:', err);
+                        }
+                    }
+                    const set = this.targetToElements.get(targetId);
+                    if (set) {
+                        for (const node of set) {
+                            this.getObserver().unobserve(node);
+                            this.elementToTargetId.delete(node);
+                        }
+                    }
+                    this.targetToElements.delete(targetId);
+                    this.callbacks.delete(targetId);
+                }
+            }
+        }
+    }
+}
+
+export { ViewportVisibilityTracker };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/streams-analytics-collector",
-  "version": "2.0.10",
+  "version": "4.0.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -8,12 +8,11 @@
   "exports": {
     ".": {
       "import": "./dist/index.js",
-      "types": "./dist/index.d.ts",
-      "svelte": "./dist/index.js"
+      "types": "./dist/index.d.ts"
     },
-    "./analytics": {
-      "import": "./dist/analytics/index.js",
-      "types": "./dist/analytics/index.d.ts"
+    "./reporting": {
+      "import": "./dist/reporting/index.js",
+      "types": "./dist/reporting/index.d.ts"
     }
   },
   "files": [

package/dist/adcampaignsquery.graphql.js

@@ -1,3 +0,0 @@
-var SiteActiveCampaignsQuery = "query SiteActiveCampaigns($filter: SiteActiveCampaignsFilterInput!, $pageQuery: PaginationOfAdCampaignsOrderByInput!) {\n  siteActiveCampaigns(filter: $filter, pagination: $pageQuery) {\n    total\n    items {\n      id\n      name\n      status\n      adGroupIds\n      adGroups {\n        name\n        ads {\n          ..._adForGridPayloadFragment\n        }\n        adPlacement {\n          name\n        }\n      }\n      status\n      updatedAt\n      editorProfile {\n        id\n        name\n        handle\n        image\n      }\n    }\n  }\n}\n\nfragment _adForGridPayloadFragment on Ad {\n  id\n  media {\n    type\n    url\n    thumbnailUrl\n  }\n  name\n  title\n  description\n  status\n  updatedAt\n}\n";
-
-export { SiteActiveCampaignsQuery as default };

package/dist/analytics/ViewportVisibilityTracker.d.ts

@@ -1,46 +0,0 @@
-/**
- * ViewportVisibilityTracker
- *
- * Utility for tracking when DOM elements (e.g., stream tiles) become visible in the viewport.
- * Fires impression events only once per unique element (by streamId) per session/visit.
- * Uses IntersectionObserver for efficient observation, with a fallback to manual visibility checks.
- *
- * Usage:
- *   ViewportVisibilityTracker.registerTile(element, streamId, callback?);
- *
- * - The element must have a unique streamId (e.g., from data-stream-id attribute).
- * - The impression event is fired only once per streamId per session.
- * - Handles rapid scrolling, re-renders, and element replacement.
- * - You can provide a custom callback to be called when the element becomes visible.
- */
-export declare class ViewportVisibilityTracker {
-    private static trackedStreamIds;
-    private static observedElements;
-    private static callbacks;
-    private static observer;
-    /**
-     * Register a tile element for visibility tracking.
-     * @param el The DOM element to observe
-     * @param streamId The unique stream ID for this tile
-     * @param callback Optional callback to call when the element becomes visible (defaults to AppEventsTracker.trackStreamTileImpression)
-     */
-    static registerTile(el: HTMLElement, streamId: string, callback?: (streamId: string) => void): void;
-    /**
-     * Internal: Get or create the IntersectionObserver instance
-     */
-    private static getObserver;
-    /**
-     * Internal: IntersectionObserver callback
-     */
-    private static handleIntersections;
-    /**
-     * Fallback: Check if an element is in the viewport (at least 50% visible)
-     * @param el The DOM element
-     * @returns true if at least 50% of the element is visible
-     */
-    static isElementInViewport(el: HTMLElement): boolean;
-    /**
-     * Reset tracked state (for testing or new session)
-     */
-    static reset(): void;
-}

package/dist/analytics/ViewportVisibilityTracker.js

@@ -1,117 +0,0 @@
-import { AppEventsTracker } from './app-events-tracker.js';
-
-/**
- * ViewportVisibilityTracker
- *
- * Utility for tracking when DOM elements (e.g., stream tiles) become visible in the viewport.
- * Fires impression events only once per unique element (by streamId) per session/visit.
- * Uses IntersectionObserver for efficient observation, with a fallback to manual visibility checks.
- *
- * Usage:
- *   ViewportVisibilityTracker.registerTile(element, streamId, callback?);
- *
- * - The element must have a unique streamId (e.g., from data-stream-id attribute).
- * - The impression event is fired only once per streamId per session.
- * - Handles rapid scrolling, re-renders, and element replacement.
- * - You can provide a custom callback to be called when the element becomes visible.
- */
-class ViewportVisibilityTracker {
-    // Set of streamIds that have already been tracked for impression
-    static trackedStreamIds = new Set();
-    // Map from streamId to the currently observed element
-    static observedElements = new Map();
-    // Map from streamId to the callback to call when visible
-    static callbacks = new Map();
-    // Singleton IntersectionObserver instance
-    static observer = null;
-    /**
-     * Register a tile element for visibility tracking.
-     * @param el The DOM element to observe
-     * @param streamId The unique stream ID for this tile
-     * @param callback Optional callback to call when the element becomes visible (defaults to AppEventsTracker.trackStreamTileImpression)
-     */
-    static registerTile(el, streamId, callback = AppEventsTracker.trackStreamTileImpression.bind(AppEventsTracker)) {
-        if (!el || !streamId)
-            return;
-        // If already tracked, do nothing
-        if (this.trackedStreamIds.has(streamId))
-            return;
-        // If an element for this streamId is already being observed, unobserve it (handles re-renders)
-        const prevEl = this.observedElements.get(streamId);
-        if (prevEl && prevEl !== el) {
-            this.getObserver().unobserve(prevEl);
-        }
-        this.observedElements.set(streamId, el);
-        this.callbacks.set(streamId, callback);
-        this.getObserver().observe(el);
-    }
-    /**
-     * Internal: Get or create the IntersectionObserver instance
-     */
-    static getObserver() {
-        if (!this.observer) {
-            this.observer = new window.IntersectionObserver(this.handleIntersections.bind(this), {
-                threshold: 0.5, // At least 50% of the element must be visible
-            });
-        }
-        return this.observer;
-    }
-    /**
-     * Internal: IntersectionObserver callback
-     */
-    static handleIntersections(entries) {
-        for (const entry of entries) {
-            const el = entry.target;
-            // Try to get streamId from map or from data attribute
-            let streamId = Array.from(this.observedElements.entries()).find(([, v]) => v === el)?.[0];
-            if (!streamId) {
-                streamId = el.getAttribute("data-stream-id") || undefined;
-            }
-            if (!streamId)
-                continue;
-            if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {
-                // Only fire once per streamId per session
-                if (!this.trackedStreamIds.has(streamId)) {
-                    this.trackedStreamIds.add(streamId);
-                    const callback = this.callbacks.get(streamId);
-                    if (callback) {
-                        callback(streamId);
-                    }
-                }
-                // Once tracked, stop observing this element
-                this.getObserver().unobserve(el);
-                this.observedElements.delete(streamId);
-                this.callbacks.delete(streamId);
-            }
-        }
-    }
-    /**
-     * Fallback: Check if an element is in the viewport (at least 50% visible)
-     * @param el The DOM element
-     * @returns true if at least 50% of the element is visible
-     */
-    static isElementInViewport(el) {
-        if (!el)
-            return false;
-        const rect = el.getBoundingClientRect();
-        const windowHeight = window.innerHeight || document.documentElement.clientHeight;
-        const windowWidth = window.innerWidth || document.documentElement.clientWidth;
-        const vertInView = rect.top <= windowHeight * 0.5 && rect.top + rect.height * 0.5 >= 0;
-        const horInView = rect.left <= windowWidth * 0.5 && rect.left + rect.width * 0.5 >= 0;
-        return vertInView && horInView;
-    }
-    /**
-     * Reset tracked state (for testing or new session)
-     */
-    static reset() {
-        this.trackedStreamIds.clear();
-        this.observedElements.clear();
-        this.callbacks.clear();
-        if (this.observer) {
-            this.observer.disconnect();
-            this.observer = null;
-        }
-    }
-}
-
-export { ViewportVisibilityTracker };

package/dist/analytics/app-events-tracker.d.ts

@@ -1,243 +0,0 @@
-import type { Client } from "@urql/core";
-/**
- * AppEventsTracker is a utility class for tracking various user events in StreamsCloud applications
- * such as post views, community message views, stream interactions, etc.
- */
-export declare class AppEventsTracker {
-    private static reported;
-    private static playedPercentsByPost;
-    private static videosByPage;
-    private static gqlEndpoint;
-    private static client;
-    private static organizationId;
-    private static profileId;
-    private static useClient;
-    /**
-     * Set the GraphQL client for making API calls (for authorized calls)
-     * @param client - The URQL client instance
-     */
-    static setClient(client: Client): void;
-    /**
-     * Set the GraphQL endpoint for making API calls (for non-authorized calls)
-     * @param endpoint - The GraphQL endpoint URL
-     */
-    static setEndpoint(endpoint: string): void;
-    /**
-     * Set organization ID for non-authorized calls
-     * @param organizationId - The organization ID
-     */
-    static setOrganizationId(organizationId: string): void;
-    /**
-     * Set profile ID for non-authorized calls
-     * @param profileId - The profile ID
-     */
-    static setProfileId(profileId: string): void;
-    /**
-     * Track the progress of a short video within a page
-     * @param pageId - The ID of the page containing the video
-     * @param videoId - The ID of the video
-     * @param playedPercents - The percentage of the video that has been played
-     * @param streamId - The ID of the stream containing the video (optional)
-     */
-    static trackShortVideoProgress(pageId: string, videoId: string, playedPercents: number, streamId?: string): void;
-    /**
-     * Report all video views for a page when it's deactivated
-     * @param pageId - The ID of the page that's being deactivated
-     * @param streamId - The ID of the stream containing the page (optional)
-     */
-    static reportPageVideoViews(pageId: string, streamId?: string): void;
-    /**
-     * Track when a post is opened
-     * @param postId - The ID of the post
-     * @param ownerId - The ID of the owner
-     */
-    static trackPostOpened(postId: string, ownerId: string): void;
-    /**
-     * Track when a post is being played
-     * @param postId - The ID of the post
-     * @param playedPercents - The percentage of the post that has been played
-     * @deprecated Consider using trackShortVideoProgress for better tracking of multiple videos
-     */
-    static reportVideoPostPlayingProgress(postId: string, playedPercents: number): void;
-    /**
-     * Track when a community message is opened
-     * @param messageId - The ID of the message
-     * @param status - The status of the message
-     */
-    static trackCommunityMessageOpened(messageId: string, status: string): void;
-    /**
-     * Track when a stream tile is shown to the user (basic, immediate call).
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamTileImpression(streamId: string): void;
-    /**
-     * Track when a stream tile is shown to the user, using viewport visibility tracking.
-     * The impression event will only be fired if the element becomes visible (at least 50% in viewport).
-     * The event is only fired once per streamId per session/visit.
-     *
-     * @param el - The DOM element to observe (e.g., the stream tile)
-     * @param streamId - The unique stream ID for this tile
-     */
-    static trackStreamTileImpressionWithVisibility(el: HTMLElement, streamId: string): void;
-    /**
-     * Track when a stream tile is clicked
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamTileClick(streamId: string): void;
-    /**
-     * Track when a stream is viewed
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamView(streamId: string): void;
-    /**
-     * Track the amount of time a user engages with a stream
-     * @param streamId - The ID of the stream
-     * @param engagementTimeSeconds - The engagement time in seconds
-     */
-    static trackStreamEngagementTime(streamId: string, engagementTimeSeconds: number): void;
-    /**
-     * Track how deep a user scrolls in a stream
-     * @param streamId - The ID of the stream
-     * @param scrollDepth - The scroll depth (typically a percentage)
-     */
-    static trackStreamScrollDepth(streamId: string, scrollDepth: number): void;
-    /**
-     * Track when a stream page is viewed
-     * @param pageId - The ID of the page
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamPageView(pageId: string, streamId: string): void;
-    /**
-     * Track when a product in a stream is clicked
-     * @param productId - The ID of the product
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamProductClicked(productId: string, streamId: string): void;
-    /**
-     * Track when a product in a stream is shown to the user (basic, immediate call)
-     * @param productId - The ID of the product
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamProductImpression(productId: string, streamId: string): void;
-    /**
-     * Track when a product in a stream is shown to the user, using viewport visibility tracking.
-     * The impression event will only be fired if the element becomes visible (at least 50% in viewport).
-     * The event is only fired once per productId per session/visit.
-     *
-     * @param el - The DOM element to observe (e.g., the product element)
-     * @param productId - The unique product ID for this element
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamProductImpressionWithVisibility(el: HTMLElement, productId: string, streamId: string): void;
-    /**
-     * Track when a product in a stream is added to cart
-     * @param productId - The ID of the product
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamProductAddToCart(productId: string, streamId: string): void;
-    /**
-     * Track when a product in a stream is checked out
-     * @param productId - The ID of the product
-     * @param streamId - The ID of the stream
-     */
-    static trackStreamProductCheckout(productId: string, streamId: string): void;
-    /**
-     * Track when a post is closed
-     * @param postId - The ID of the post
-     * @param streamId - The ID of the stream
-     * @deprecated Consider using trackShortVideoProgress and reportPageVideoViews for better tracking of multiple videos
-     */
-    static trackClosed(postId: string, streamId: string): void;
-    /**
-     * Track when an ad is shown to the user
-     * @param adId - The ID of the ad
-     */
-    static trackAdImpression(adId: string): void;
-    /**
-     * Track when an ad is clicked by the user
-     * @param adId - The ID of the ad
-     */
-    static trackAdClick(adId: string): void;
-    /**
-     * Track when an ad is shown to the user, using viewport visibility tracking.
-     * The impression event will only be fired if the element becomes visible (at least 50% in viewport).
-     * The event is only fired once per adId per session/visit.
-     *
-     * @param el - The DOM element to observe (e.g., the ad element)
-     * @param adId - The unique ad ID for this element
-     */
-    static trackAdImpressionWithVisibility(el: HTMLElement, adId: string): void;
-    /**
-     * Track when a short video is shown to the user (basic, immediate call)
-     * @param videoId - The ID of the short video
-     */
-    static trackShortVideoImpression(videoId: string): void;
-    /**
-     * Track when a short video is shown to the user, using viewport visibility tracking.
-     * The impression event will only be fired if the element becomes visible (at least 50% in viewport).
-     * The event is only fired once per videoId per session/visit.
-     *
-     * @param el - The DOM element to observe (e.g., the video element)
-     * @param videoId - The unique video ID for this element
-     */
-    static trackShortVideoImpressionWithVisibility(el: HTMLElement, videoId: string): void;
-    /**
-     * Track when a short video is viewed by the user
-     * @param videoId - The ID of the short video
-     * @param playedPercents - The percentage of the video that was played (optional)
-     */
-    static trackShortVideoView(videoId: string): void;
-    /**
-     * Track when a product in a short video is clicked
-     * @param productId - The ID of the product
-     * @param videoId - The ID of the short video containing the product
-     */
-    static trackShortVideoProductClick(productId: string, videoId: string): void;
-    /**
-     * Track when a product in a short video is shown to the user (basic, immediate call)
-     * @param productId - The ID of the product
-     * @param videoId - The ID of the short video containing the product
-     */
-    static trackShortVideoProductImpression(productId: string, videoId: string): void;
-    /**
-     * Track when a product in a short video is shown to the user, using viewport visibility tracking.
-     * The impression event will only be fired if the element becomes visible (at least 50% in viewport).
-     * The event is only fired once per productId per session/visit.
-     *
-     * @param el - The DOM element to observe (e.g., the product element)
-     * @param productId - The unique product ID for this element
-     * @param videoId - The ID of the short video containing the product
-     */
-    static trackShortVideoProductImpressionWithVisibility(el: HTMLElement, productId: string, videoId: string): void;
-    /**
-     * Track when a product in a short video is added to cart
-     * @param productId - The ID of the product
-     * @param videoId - The ID of the short video containing the product
-     */
-    static trackShortVideoProductAddToCart(productId: string, videoId: string): void;
-    /**
-     * Track when a product in a short video is checked out
-     * @param productId - The ID of the product
-     * @param videoId - The ID of the short video containing the product
-     */
-    static trackShortVideoProductCheckout(productId: string, videoId: string): void;
-    /**
-     * Report an app event to the API
-     * @private
-     * @param targetId - The ID of the target object
-     * @param eventType - The type of event
-     * @param ownerId - The ID of the owner (optional)
-     * @param value - Additional value for the event (optional)
-     */
-    private static reportAppEvent;
-    /**
-     * Save an app event to the API
-     * @private
-     * @param targetId - The ID of the target object
-     * @param eventType - The type of event
-     * @param ownerId - The ID of the owner (optional)
-     * @param value - Additional value for the event (optional)
-     */
-    private static saveAppEvent;
-    private static queryGql;
-}