@jaaq/jaaq-sdk-js 1.1.1 → 1.2.0-dev-ec79f7e-20260605

package/dist/ui/react/index.cjs

@@ -31,16 +31,22 @@ async function parseJson(res) {
         return undefined;
     return res.json();
 }
-function joinUrl(baseUrl, clientId, path) {
+function joinUrl(baseUrl, apiVersion, clientId, path) {
     // return path if it is an absolute URL
     if (/^https?:\/\//i.test(path))
         return path;
     const base = baseUrl.replace(/\/+$/, '');
     const relative = path.replace(/^\/+/, '');
-    return `${base}/b2b/v1/subscription/${encodeURIComponent(clientId)}${relative.startsWith('/') ? relative : `/${relative}`}`;
+    return `${base}/b2b/${apiVersion}/subscription/${encodeURIComponent(clientId)}${relative.startsWith('/') ? relative : `/${relative}`}`;
+}
+function convertToValidAPIVersion(version) {
+    const v = version.toLowerCase();
+    if (v === 'v1' || v === 'v2')
+        return v;
+    return 'v1'; // default to v1 if invalid version provided
 }
 function createHttpClient(config) {
-    const { baseUrl, apiKey, clientId, fetch: fetchImpl } = config;
+    const { baseUrl, apiKey, clientId, fetch: fetchImpl, apiVersion } = config;
     const f = fetchImpl ?? globalThis.fetch;
     if (!f) {
         throw new Error('No fetch implementation found. Provide one in SDKConfig.fetch for Node or custom environments.');
@@ -49,7 +55,7 @@ function createHttpClient(config) {
         'Content-Type': 'application/json',
         'x-api-key': apiKey,
     };
-    const fullUrl = (path) => joinUrl(baseUrl, clientId, path);
+    const fullUrl = (path) => joinUrl(baseUrl, convertToValidAPIVersion(apiVersion), clientId, path);
     const request = async (method, path, init, body) => {
         const reqInit = {
             method,
@@ -98,20 +104,51 @@ function createCollectionsResource(http) {
     };
 }
 
+function createVideosResourceV2(http) {
+    return {
+        async getById(id) {
+            const path = `/videos/${encodeURIComponent(id)}`;
+            const response = await http.get(path);
+            return response.video;
+        },
+    };
+}
+
+function createCollectionsResourceV2(http) {
+    return {
+        async list() {
+            const path = '/collections';
+            const response = await http.get(path);
+            return response.collections;
+        },
+        async getById(id) {
+            const path = `/collections/${encodeURIComponent(id)}`;
+            const response = await http.get(path);
+            return response.collection;
+        },
+    };
+}
+
 const BASE_URL = "https://api.jaaq.app";
 class JaaqClient {
     // Keep constructor private to enforce controlled instantiation.
-    constructor(http) {
-        this.videos = createVideosResource(http);
-        this.collections = createCollectionsResource(http);
+    constructor(http, apiVersion) {
+        if (apiVersion === 'v2') {
+            this.videos = createVideosResourceV2(http);
+            this.collections = createCollectionsResourceV2(http);
+        }
+        else {
+            this.videos = createVideosResource(http);
+            this.collections = createCollectionsResource(http);
+        }
     }
     /**
      * Public "friend" constructor that remains inside the class boundary.
      * This method is callable from the module-level build function
      * without exposing `new JaaqClient(...)` to consumers.
      */
-    static fromHttp(http) {
-        return new JaaqClient(http);
+    static fromHttp(http, apiVersion) {
+        return new JaaqClient(http, apiVersion);
     }
     /**
      * OO-friendly static initializer.
@@ -134,14 +171,15 @@ function createJaaqClient(config) {
  * The constructor stays private; instantiation is funneled via `JaaqClient.fromHttp`.
  */
 function buildClient(config) {
-    const { baseUrl = BASE_URL, apiKey, clientId, fetch: fetchImpl } = config;
+    const { baseUrl = BASE_URL, apiKey, clientId, fetch: fetchImpl, apiVersion = 'v1' } = config;
     const http = createHttpClient({
         baseUrl,
         apiKey,
         clientId,
         fetch: fetchImpl ?? globalThis.fetch,
+        apiVersion,
     });
-    return JaaqClient.fromHttp(http);
+    return JaaqClient.fromHttp(http, apiVersion);
 }
 
 /**
@@ -1012,6 +1050,7 @@ class JaaqVideoPlayerElement extends HTMLElement {
         const apiKey = this.getAttribute('api-key');
         const clientId = this.getAttribute('client-id');
         const baseUrl = this.getAttribute('base-url') || undefined;
+        const apiVersion = this.getAttribute('api-version') || undefined;
         const autoplay = this.hasAttribute('autoplay') && this.getAttribute('autoplay') !== 'false';
         const controls = !this.hasAttribute('controls') || this.getAttribute('controls') !== 'false';
         const showLogo = !this.hasAttribute('show-logo') || this.getAttribute('show-logo') !== 'false';
@@ -1031,6 +1070,7 @@ class JaaqVideoPlayerElement extends HTMLElement {
                 clientId: clientId ?? undefined,
                 client: this.clientInstance || undefined,
                 baseUrl,
+                apiVersion,
                 autoplay,
                 controls,
                 showLogo,
@@ -4408,6 +4448,21 @@ class JaaqCollectionPlayerElement extends HTMLElement {
             return defaultValue;
         return v !== 'false';
     }
+    getVideosFromCollection(collection) {
+        if (collection.videos && collection.videos.length > 0) {
+            return collection.videos;
+        }
+        if (collection.videoGroups && collection.videoGroups.length > 0) {
+            const videos = [];
+            collection.videoGroups.forEach((group) => {
+                if (group.videos && group.videos.length > 0) {
+                    videos.push(...group.videos);
+                }
+            });
+            return videos;
+        }
+        return [];
+    }
     render() {
         if (!this.shadowRoot)
             return;
@@ -4434,6 +4489,7 @@ class JaaqCollectionPlayerElement extends HTMLElement {
         const apiKey = this.getAttribute('api-key');
         const clientId = this.getAttribute('client-id');
         const baseUrl = this.getAttribute('base-url') || undefined;
+        const apiVersion = this.getAttribute('api-version') || undefined;
         if (!this.clientInstance && !apiKey && !clientId) {
             this.emitError(new Error('Either client property or api-key and client-id attributes are required'));
             return;
@@ -4445,9 +4501,11 @@ class JaaqCollectionPlayerElement extends HTMLElement {
                     apiKey: apiKey,
                     clientId: clientId,
                     baseUrl: baseUrl || BASE_URL,
+                    apiVersion: apiVersion,
                 });
             this.collectionData = await client.collections.getById(collectionId);
-            if (!this.collectionData.videos || this.collectionData.videos.length === 0) {
+            const videos = this.getVideosFromCollection(this.collectionData);
+            if (videos.length === 0) {
                 this.emitError(new Error('No videos found in collection'));
                 return;
             }
@@ -4495,7 +4553,8 @@ class JaaqCollectionPlayerElement extends HTMLElement {
                 console.warn('[CollectionPlayer] Failed to parse video-settings attribute', e);
             }
         }
-        this.collectionData.videos.forEach((video) => {
+        const videos = this.getVideosFromCollection(this.collectionData);
+        videos.forEach((video) => {
             const slide = document.createElement('li');
             slide.className = 'splide__slide';
             const player = document.createElement('jaaq-video-player');
@@ -4577,8 +4636,9 @@ class JaaqCollectionPlayerElement extends HTMLElement {
                 Components: this.splide?.Components,
             });
             this.handleSlideChange(newIndex);
+            const videos = this.collectionData ? this.getVideosFromCollection(this.collectionData) : [];
             this.dispatchEvent(new CustomEvent('jaaq:collection:slidechange', {
-                detail: { index: newIndex, video: this.collectionData?.videos[newIndex] },
+                detail: { index: newIndex, video: videos[newIndex] },
                 bubbles: true,
                 composed: true,
             }));
@@ -4754,7 +4814,7 @@ if (typeof window !== 'undefined' && typeof document !== 'undefined') {
 if (typeof window !== 'undefined') {
     registerJaaqComponents();
 }
-function VideoPlayerComponent({ videoId, apiKey, clientId, client, baseUrl, autoplay = false, controls = true, width = '100%', height = 'auto', className = '', showLogo = true, showTitle = true, showAuthor = true, showDescription = true, showCaptions = true, startMuted = false, onPlay, onPause, onError, onLoaded, onTimeUpdate, onVolumeChange, onEnded, onFullscreenChange, showInfo = false, }, ref) {
+function VideoPlayerComponent({ videoId, apiKey, clientId, client, baseUrl, apiVersion, autoplay = false, controls = true, width = '100%', height = 'auto', className = '', showLogo = true, showTitle = true, showAuthor = true, showDescription = true, showCaptions = true, startMuted = false, onPlay, onPause, onError, onLoaded, onTimeUpdate, onVolumeChange, onEnded, onFullscreenChange, showInfo = false, }, ref) {
     const playerRef = React.useRef(null);
     const videoDataRef = React.useRef(null);
     React.useImperativeHandle(ref, () => ({
@@ -4823,7 +4883,7 @@ function VideoPlayerComponent({ videoId, apiKey, clientId, client, baseUrl, auto
         player.setAttribute('start-muted', startMuted ? 'true' : 'false');
     }, [startMuted]);
     return (React__namespace.createElement("div", { style: { width, height }, className: className },
-        React__namespace.createElement("jaaq-video-player", { ref: playerRef, "video-id": videoId, "api-key": apiKey, "client-id": clientId, "base-url": baseUrl, autoplay: autoplay ? 'true' : 'false', controls: controls ? 'true' : 'false', "show-logo": showLogo ? 'true' : 'false', "show-title": showTitle ? 'true' : 'false', "show-author": showAuthor ? 'true' : 'false', "show-description": showDescription ? 'true' : 'false', "show-captions": showCaptions ? 'true' : 'false', "start-muted": startMuted ? 'true' : 'false', width: "100%", height: "auto" }),
+        React__namespace.createElement("jaaq-video-player", { ref: playerRef, "video-id": videoId, "api-key": apiKey, "client-id": clientId, "base-url": baseUrl, "api-version": apiVersion, autoplay: autoplay ? 'true' : 'false', controls: controls ? 'true' : 'false', "show-logo": showLogo ? 'true' : 'false', "show-title": showTitle ? 'true' : 'false', "show-author": showAuthor ? 'true' : 'false', "show-description": showDescription ? 'true' : 'false', "show-captions": showCaptions ? 'true' : 'false', "start-muted": startMuted ? 'true' : 'false', width: "100%", height: "auto" }),
         showInfo && videoDataRef.current && (React__namespace.createElement("div", { className: "jaaq-video-info", style: { marginTop: '16px', padding: '16px', background: '#f8f9fa', borderRadius: '8px' } },
             React__namespace.createElement("h3", { style: { margin: '0 0 12px 0', fontSize: '18px' } }, videoDataRef.current.question || videoDataRef.current.description || 'Untitled Video'),
             React__namespace.createElement("p", { style: { margin: '0 0 8px 0' } },
@@ -4842,7 +4902,7 @@ const VideoPlayer = React.forwardRef(VideoPlayerComponent);
 if (typeof window !== 'undefined') {
     registerJaaqComponents();
 }
-function CollectionPlayerComponent({ collectionId, apiKey, clientId, subscriptionId, client, baseUrl, autoplay = false, showArrows = true, showDots = true, className = '', videoSettings, onLoaded, onError, onSlideChange, }, ref) {
+function CollectionPlayerComponent({ collectionId, apiKey, clientId, subscriptionId, client, baseUrl, apiVersion, autoplay = false, showArrows = true, showDots = true, className = '', videoSettings, onLoaded, onError, onSlideChange, }, ref) {
     const playerRef = React.useRef(null);
     React.useImperativeHandle(ref, () => ({
         refresh: () => playerRef.current?.refresh(),
@@ -4887,7 +4947,7 @@ function CollectionPlayerComponent({ collectionId, apiKey, clientId, subscriptio
         };
     }, [client, videoSettings, onLoaded, onError, onSlideChange]);
     return (React__namespace.createElement("div", { className: className },
-        React__namespace.createElement("jaaq-collection-player", { ref: playerRef, "collection-id": collectionId, "api-key": apiKey, "client-id": clientId, "subscription-id": subscriptionId, "base-url": baseUrl, autoplay: autoplay ? 'true' : 'false', "show-arrows": showArrows ? 'true' : 'false', "show-dots": showDots ? 'true' : 'false' })));
+        React__namespace.createElement("jaaq-collection-player", { ref: playerRef, "collection-id": collectionId, "api-key": apiKey, "client-id": clientId, "subscription-id": subscriptionId, "base-url": baseUrl, "api-version": apiVersion, autoplay: autoplay ? 'true' : 'false', "show-arrows": showArrows ? 'true' : 'false', "show-dots": showDots ? 'true' : 'false' })));
 }
 CollectionPlayerComponent.displayName = 'CollectionPlayer';
 const CollectionPlayer = React.forwardRef(CollectionPlayerComponent);