@stream-io/video-client 0.3.24 → 0.3.26

package/dist/src/sorting/__tests__/presets.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/sorting/presets.d.ts

@@ -7,6 +7,11 @@ export declare const defaultSortPreset: import("./comparator").Comparator<Stream
  * The sorting preset for speaker layout.
  */
 export declare const speakerLayoutSortPreset: import("./comparator").Comparator<StreamVideoParticipant>;
+/**
+ * The sorting preset for layouts that don't render all participants but
+ * instead, render them in pages.
+ */
+export declare const paginatedLayoutSortPreset: import("./comparator").Comparator<StreamVideoParticipant>;
 /**
  * The sorting preset for livestreams and audio rooms.
  */

package/dist/src/store/CallState.d.ts

@@ -2,7 +2,7 @@ import { Observable } from 'rxjs';
 import type { Patch } from './rxUtils';
 import { StreamVideoLocalParticipant, StreamVideoParticipant, StreamVideoParticipantPatch, StreamVideoParticipantPatches } from '../types';
 import { CallStatsReport } from '../stats/types';
-import { CallIngressResponse, CallResponse, CallSessionResponse, CallSettingsResponse, EgressResponse, MemberResponse, OwnCapability, UserResponse, VideoEvent } from '../gen/coordinator';
+import { CallIngressResponse, CallResponse, CallSessionResponse, CallSettingsResponse, EgressResponse, MemberResponse, OwnCapability, ThumbnailResponse, UserResponse, VideoEvent } from '../gen/coordinator';
 import { Pin } from '../gen/video/sfu/models/models';
 import { Comparator } from '../sorting';
 import { Logger } from '../coordinator/connection/types';
@@ -72,6 +72,7 @@ export declare class CallState {
     private settingsSubject;
     private transcribingSubject;
     private endedBySubject;
+    private thumbnailsSubject;
     private membersSubject;
     private ownCapabilitiesSubject;
     private callingStateSubject;
@@ -206,6 +207,10 @@ export declare class CallState {
      * Will provide the user who ended this call.
      */
     endedBy$: Observable<UserResponse | undefined>;
+    /**
+     * Will provide the thumbnails of this call.
+     */
+    thumbnails$: Observable<ThumbnailResponse | undefined>;
     readonly logger: Logger;
     /**
      * A list of comparators that are used to sort the participants.
@@ -417,6 +422,10 @@ export declare class CallState {
      * Will provide the user who ended this call.
      */
     get endedBy(): UserResponse | undefined;
+    /**
+     * Will provide the thumbnails of this call, if enabled in the call settings.
+     */
+    get thumbnails(): ThumbnailResponse | undefined;
     /**
      * Will try to find the participant with the given sessionId in the current call.
      *
@@ -484,8 +493,8 @@ export declare class CallState {
     updateFromCallResponse: (call: CallResponse) => void;
     private updateFromMemberRemoved;
     private updateFromMemberAdded;
-    private updateFromBroadcastStopped;
-    private updateFromBroadcastStarted;
+    private updateFromHLSBroadcastStopped;
+    private updateFromHLSBroadcastStarted;
     private updateFromSessionParticipantLeft;
     private updateFromSessionParticipantJoined;
     private updateMembers;

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.3.24";
+export declare const version = "0.3.26";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-client",
-  "version": "0.3.24",
+  "version": "0.3.26",
   "packageManager": "yarn@3.2.4",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -44,7 +44,7 @@
     "ws": "^8.13.0"
   },
   "devDependencies": {
-    "@openapitools/openapi-generator-cli": "^2.6.0",
+    "@openapitools/openapi-generator-cli": "^2.7.0",
     "@rollup/plugin-replace": "^5.0.2",
     "@rollup/plugin-typescript": "^11.1.2",
     "@types/jsonwebtoken": "^9.0.1",

package/src/Call.ts

@@ -50,9 +50,9 @@ import {
   SendReactionRequest,
   SendReactionResponse,
   SFUResponse,
-  StartBroadcastingResponse,
+  StartHLSBroadcastingResponse,
   StartRecordingResponse,
-  StopBroadcastingResponse,
+  StopHLSBroadcastingResponse,
   StopLiveResponse,
   StopRecordingResponse,
   UnblockUserRequest,
@@ -1597,7 +1597,7 @@ export class Call {
    * Starts the broadcasting of the call.
    */
   startHLS = async () => {
-    return this.streamClient.post<StartBroadcastingResponse>(
+    return this.streamClient.post<StartHLSBroadcastingResponse>(
       `${this.streamClientBasePath}/start_broadcasting`,
       {},
     );
@@ -1607,7 +1607,7 @@ export class Call {
    * Stops the broadcasting of the call.
    */
   stopHLS = async () => {
-    return this.streamClient.post<StopBroadcastingResponse>(
+    return this.streamClient.post<StopHLSBroadcastingResponse>(
       `${this.streamClientBasePath}/stop_broadcasting`,
       {},
     );
@@ -1966,4 +1966,42 @@ export class Call {
       unbind();
     };
   };
+
+  /**
+   * Binds a DOM <img> element to this call's thumbnail (if enabled in settings).
+   *
+   * @param imageElement the image element to bind to.
+   * @param opts options for the binding.
+   */
+  bindCallThumbnailElement = (
+    imageElement: HTMLImageElement,
+    opts: {
+      fallbackImageSource?: string;
+    } = {},
+  ) => {
+    const handleError = () => {
+      imageElement.src =
+        opts.fallbackImageSource ||
+        'https://getstream.io/random_svg/?name=x&id=x';
+    };
+
+    const unsubscribe = createSubscription(
+      this.state.thumbnails$,
+      (thumbnails) => {
+        if (!thumbnails) return;
+        imageElement.addEventListener('error', handleError);
+
+        const thumbnailUrl = new URL(thumbnails.image_url);
+        thumbnailUrl.searchParams.set('w', String(imageElement.clientWidth));
+        thumbnailUrl.searchParams.set('h', String(imageElement.clientHeight));
+
+        imageElement.src = thumbnailUrl.toString();
+      },
+    );
+
+    return () => {
+      unsubscribe();
+      imageElement.removeEventListener('error', handleError);
+    };
+  };
 }

package/src/__tests__/server-side/call-types.test.ts

@@ -5,8 +5,7 @@ import { generateUUIDv4 } from '../../coordinator/connection/utils';
 import { LogLevel } from '../../coordinator/connection/types';
 import {
   OwnCapability,
-  RecordSettingsModeEnum,
-  RecordSettingsQualityEnum,
+  RecordSettingsRequestModeEnum,
 } from '../../gen/coordinator';
 
 const apiKey = process.env.STREAM_API_KEY!;
@@ -98,10 +97,7 @@ describe('call types CRUD API', () => {
       settings: {
         audio: { mic_default_on: false, default_device: 'earpiece' },
         recording: {
-          mode: RecordSettingsModeEnum.DISABLED,
-          // FIXME OL: these props shouldn't be required to be set when recording is disabled
-          audio_only: false,
-          quality: RecordSettingsQualityEnum._1080P,
+          mode: RecordSettingsRequestModeEnum.DISABLED,
         },
       },
     });
@@ -109,7 +105,7 @@ describe('call types CRUD API', () => {
     expect(updateResponse.settings.audio.mic_default_on).toBeFalsy();
     expect(updateResponse.settings.audio.default_device).toBe('earpiece');
     expect(updateResponse.settings.recording.mode).toBe(
-      RecordSettingsModeEnum.DISABLED,
+      RecordSettingsRequestModeEnum.DISABLED,
     );
   });