@stream-io/video-client 1.38.0 → 1.38.2

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

@@ -38,6 +38,12 @@ export declare class StreamVideoWriteableStateStore {
      * @param call the call to add.
      */
     registerCall: (call: Call) => void;
+    /**
+     * Registers a {@link Call} object if it doesn't exist, otherwise updates it.
+     *
+     * @param call the call to register or update.
+     */
+    registerOrUpdateCall: (call: Call) => void | Call[];
     /**
      * Removes a {@link Call} object from the list of {@link Call} objects created/tracked by this client.
      *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-client",
-  "version": "1.38.0",
+  "version": "1.38.2",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
   "browser": "dist/index.browser.es.js",

package/src/Call.ts

@@ -757,7 +757,7 @@ export class Call {
 
     if (this.streamClient._hasConnectionID()) {
       this.watching = true;
-      this.clientStore.registerCall(this);
+      this.clientStore.registerOrUpdateCall(this);
     }
 
     await this.applyDeviceConfig(response.call.settings, false);
@@ -787,7 +787,7 @@ export class Call {
 
     if (this.streamClient._hasConnectionID()) {
       this.watching = true;
-      this.clientStore.registerCall(this);
+      this.clientStore.registerOrUpdateCall(this);
     }
 
     await this.applyDeviceConfig(response.call.settings, false);

package/src/store/CallState.ts

@@ -74,29 +74,6 @@ type OrphanedTrack = {
   track: MediaStream;
 };
 
-/**
- * Creates a stable participant filter function, ready to be used in combination
- * with the `useSyncExternalStore` hook.
- *
- * @param predicate the predicate to use.
- */
-const createStableParticipantsFilter = (
-  predicate: (p: StreamVideoParticipant) => boolean,
-) => {
-  const empty: StreamVideoParticipant[] = [];
-  return (participants: StreamVideoParticipant[]) => {
-    // no need to filter if there are no participants
-    if (!participants.length) return participants;
-
-    // return a stable empty array if there are no remote participants
-    // instead of creating an empty one
-    const filteredParticipants = participants.filter(predicate);
-    if (!filteredParticipants.length) return empty;
-
-    return filteredParticipants;
-  };
-};
-
 /**
  * Holds the state of the current call.
  * @react You don't have to use this class directly, as we are exposing the state through Hooks.
@@ -376,12 +353,12 @@ export class CallState {
     );
 
     this.remoteParticipants$ = this.participants$.pipe(
-      map(createStableParticipantsFilter((p) => !p.isLocalParticipant)),
+      map((participants) => participants.filter((p) => !p.isLocalParticipant)),
       shareReplay({ bufferSize: 1, refCount: true }),
     );
 
     this.pinnedParticipants$ = this.participants$.pipe(
-      map(createStableParticipantsFilter((p) => !!p.pin)),
+      map((participants) => participants.filter((p) => !!p.pin)),
       shareReplay({ bufferSize: 1, refCount: true }),
     );
 

package/src/store/stateStore.ts

@@ -81,6 +81,21 @@ export class StreamVideoWriteableStateStore {
     }
   };
 
+  /**
+   * Registers a {@link Call} object if it doesn't exist, otherwise updates it.
+   *
+   * @param call the call to register or update.
+   */
+  registerOrUpdateCall = (call: Call) => {
+    if (this.calls.find((c) => c.cid === call.cid)) {
+      return this.setCalls((calls) =>
+        calls.map((c) => (c.cid === call.cid ? call : c)),
+      );
+    } else {
+      return this.registerCall(call);
+    }
+  };
+
   /**
    * Removes a {@link Call} object from the list of {@link Call} objects created/tracked by this client.
    *