@stream-io/video-client 1.2.3 → 1.3.1

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+### [1.3.1](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.3.0...@stream-io/video-client-1.3.1) (2024-06-12)
+
+
+### Bug Fixes
+
+* add concurrency helpers ([#1392](https://github.com/GetStream/stream-video-js/issues/1392)) ([b87068e](https://github.com/GetStream/stream-video-js/commit/b87068e14d40253a42d0383a4015c52be8f9c03b))
+
+## [1.3.0](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.2.3...@stream-io/video-client-1.3.0) (2024-06-07)
+
+
+### Features
+
+* improve `isSupported` method for noise cancellation ([#1388](https://github.com/GetStream/stream-video-js/issues/1388)) ([07031ba](https://github.com/GetStream/stream-video-js/commit/07031ba72443a84cac8856c7481f3d4053b46d4c))
+
 ### [1.2.3](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.2.2...@stream-io/video-client-1.2.3) (2024-06-05)
 
 

package/dist/index.browser.es.js

@@ -6730,6 +6730,101 @@ const muteTypeToTrackType = (muteType) => {
     }
 };
 
+/**
+ * Runs async functions serially. Useful for wrapping async actions that
+ * should never run simultaneously: if marked with the same tag, functions
+ * will run one after another.
+ *
+ * @param tag Async functions with the same tag will run serially. Async functions
+ * with different tags can run in parallel.
+ * @param cb Async function to run.
+ * @returns Promise that resolves when async functions returns.
+ */
+const withoutConcurrency = createRunner(wrapWithContinuationTracking);
+/**
+ * Runs async functions serially, and cancels all other actions with the same tag
+ * when a new action is scheduled. Useful for wrapping async actions that override
+ * each other (e.g. enabling and disabling camera).
+ *
+ * If an async function hasn't started yet and was canceled, it will never run.
+ * If an async function is already running and was canceled, it will be notified
+ * via an abort signal passed as an argument.
+ *
+ * @param tag Async functions with the same tag will run serially and are canceled
+ * when a new action with the same tag is scheduled.
+ * @param cb Async function to run. Receives AbortSignal as the only argument.
+ * @returns Promise that resolves when async functions returns. If the function didn't
+ * start and was canceled, will resolve with 'canceled'. If the function started to run,
+ * it's up to the function to decide how to react to cancelation.
+ */
+const withCancellation = createRunner(wrapWithCancellation);
+const pendingPromises = new Map();
+async function settled(tag) {
+    await pendingPromises.get(tag)?.promise;
+}
+/**
+ * Implements common functionality of running async functions serially, by chaining
+ * their promises one after another.
+ *
+ * Before running, async function is "wrapped" using the provided wrapper. This wrapper
+ * can add additional steps to run before or after the function.
+ *
+ * When async function is scheduled to run, the previous function is notified
+ * by calling the associated onContinued callback. This behavior of this callback
+ * is defined by the wrapper.
+ */
+function createRunner(wrapper) {
+    return function run(tag, cb) {
+        const { cb: wrapped, onContinued } = wrapper(tag, cb);
+        const pending = pendingPromises.get(tag);
+        pending?.onContinued();
+        const promise = pending
+            ? pending.promise.then(wrapped, wrapped)
+            : wrapped();
+        pendingPromises.set(tag, { promise, onContinued });
+        return promise;
+    };
+}
+/**
+ * Wraps an async function with an additional step run after the function:
+ * if the function is the last in the queue, it cleans up the whole chain
+ * of promises after finishing.
+ */
+function wrapWithContinuationTracking(tag, cb) {
+    let hasContinuation = false;
+    const wrapped = () => cb().finally(() => {
+        if (!hasContinuation) {
+            pendingPromises.delete(tag);
+        }
+    });
+    const onContinued = () => (hasContinuation = true);
+    return { cb: wrapped, onContinued };
+}
+/**
+ * Wraps an async function with additional functionalilty:
+ * 1. Associates an abort signal with every function, that is passed to it
+ *    as an argument. When a new function is scheduled to run after the current
+ *    one, current signal is aborted.
+ * 2. If current function didn't start and was aborted, in will never start.
+ * 3. If the function is the last in the queue, it cleans up the whole chain
+ *    of promises after finishing.
+ */
+function wrapWithCancellation(tag, cb) {
+    const ac = new AbortController();
+    const wrapped = () => {
+        if (ac.signal.aborted) {
+            return Promise.resolve('canceled');
+        }
+        return cb(ac.signal).finally(() => {
+            if (!ac.signal.aborted) {
+                pendingPromises.delete(tag);
+            }
+        });
+    };
+    const onContinued = () => ac.abort();
+    return { cb: wrapped, onContinued };
+}
+
 /**
  * Checks if the provided update is a function patch.
  *
@@ -6787,9 +6882,27 @@ const createSubscription = (observable, handler) => {
         subscription.unsubscribe();
     };
 };
+/**
+ * Creates a subscription and returns a function to unsubscribe. Makes sure that
+ * only one async handler runs at the same time. If updates come in quicker than
+ * it takes for the current handler to finish, other handlers will wait.
+ *
+ * @param observable the observable to subscribe to.
+ * @param handler the async handler to call when the observable emits a value.
+ */
+const createSafeAsyncSubscription = (observable, handler) => {
+    const tag = Symbol();
+    const subscription = observable.subscribe((value) => {
+        withoutConcurrency(tag, () => handler(value));
+    });
+    return () => {
+        subscription.unsubscribe();
+    };
+};
 
 var rxUtils = /*#__PURE__*/Object.freeze({
     __proto__: null,
+    createSafeAsyncSubscription: createSafeAsyncSubscription,
     createSubscription: createSubscription,
     getCurrentValue: getCurrentValue,
     setCurrentValue: setCurrentValue
@@ -10919,6 +11032,7 @@ class InputMediaDeviceManager {
         this.subscriptions = [];
         this.isTrackStoppedDueToTrackEnd = false;
         this.filters = [];
+        this.statusChangeConcurrencyTag = Symbol('statusChangeConcurrencyTag');
         /**
          * Disposes the manager.
          *
@@ -10949,26 +11063,20 @@ class InputMediaDeviceManager {
      */
     async enable() {
         if (this.state.optimisticStatus === 'enabled') {
-            await this.statusChangePromise;
             return;
         }
-        const signal = this.nextAbortableStatusChangeRequest('enabled');
-        const doEnable = async () => {
-            if (signal.aborted)
-                return;
+        this.state.setPendingStatus('enabled');
+        await withCancellation(this.statusChangeConcurrencyTag, async (signal) => {
             try {
                 await this.unmuteStream();
                 this.state.setStatus('enabled');
             }
             finally {
-                if (!signal.aborted)
-                    this.resetStatusChangeRequest();
+                if (!signal.aborted) {
+                    this.state.setPendingStatus(this.state.status);
+                }
             }
-        };
-        this.statusChangePromise = this.statusChangePromise
-            ? this.statusChangePromise.then(doEnable)
-            : doEnable();
-        await this.statusChangePromise;
+        });
     }
     /**
      * Stops or pauses the stream based on state.disableMode
@@ -10977,27 +11085,27 @@ class InputMediaDeviceManager {
     async disable(forceStop = false) {
         this.state.prevStatus = this.state.status;
         if (!forceStop && this.state.optimisticStatus === 'disabled') {
-            await this.statusChangePromise;
             return;
         }
-        const stopTracks = forceStop || this.state.disableMode === 'stop-tracks';
-        const signal = this.nextAbortableStatusChangeRequest('disabled');
-        const doDisable = async () => {
-            if (signal.aborted)
-                return;
+        this.state.setPendingStatus('disabled');
+        await withCancellation(this.statusChangeConcurrencyTag, async (signal) => {
             try {
+                const stopTracks = forceStop || this.state.disableMode === 'stop-tracks';
                 await this.muteStream(stopTracks);
                 this.state.setStatus('disabled');
             }
             finally {
-                if (!signal.aborted)
-                    this.resetStatusChangeRequest();
+                if (!signal.aborted) {
+                    this.state.setPendingStatus(this.state.status);
+                }
             }
-        };
-        this.statusChangePromise = this.statusChangePromise
-            ? this.statusChangePromise.then(doDisable)
-            : doDisable();
-        await this.statusChangePromise;
+        });
+    }
+    /**
+     * Returns a promise that resolves when all pe
+     */
+    async statusChangeSettled() {
+        await settled(this.statusChangeConcurrencyTag);
     }
     /**
      * If status was previously enabled, it will re-enable the device.
@@ -11014,10 +11122,10 @@ class InputMediaDeviceManager {
      */
     async toggle() {
         if (this.state.optimisticStatus === 'enabled') {
-            return this.disable();
+            return await this.disable();
         }
         else {
-            return this.enable();
+            return await this.enable();
         }
     }
     /**
@@ -11200,9 +11308,7 @@ class InputMediaDeviceManager {
             this.state.setMediaStream(stream, await rootStream);
             this.getTracks().forEach((track) => {
                 track.addEventListener('ended', async () => {
-                    if (this.statusChangePromise) {
-                        await this.statusChangePromise;
-                    }
+                    await this.statusChangeSettled();
                     if (this.state.status === 'enabled') {
                         this.isTrackStoppedDueToTrackEnd = true;
                         setTimeout(() => {
@@ -11231,7 +11337,7 @@ class InputMediaDeviceManager {
             try {
                 if (!deviceId)
                     return;
-                await this.statusChangePromise;
+                await this.statusChangeSettled();
                 let isDeviceDisconnected = false;
                 let isDeviceReplaced = false;
                 const currentDevice = this.findDeviceInList(currentDevices, deviceId);
@@ -11268,17 +11374,6 @@ class InputMediaDeviceManager {
     findDeviceInList(devices, deviceId) {
         return devices.find((d) => d.deviceId === deviceId && d.kind === this.mediaDeviceKind);
     }
-    nextAbortableStatusChangeRequest(status) {
-        this.statusChangeAbortController?.abort();
-        this.statusChangeAbortController = new AbortController();
-        this.state.setPendingStatus(status);
-        return this.statusChangeAbortController.signal;
-    }
-    resetStatusChangeRequest() {
-        this.statusChangePromise = undefined;
-        this.statusChangeAbortController = undefined;
-        this.state.setPendingStatus(this.state.status);
-    }
 }
 
 class InputMediaDeviceManagerState {
@@ -11536,9 +11631,9 @@ class CameraManager extends InputMediaDeviceManager {
     async selectTargetResolution(resolution) {
         this.targetResolution.height = resolution.height;
         this.targetResolution.width = resolution.width;
-        if (this.statusChangePromise && this.state.optimisticStatus === 'enabled') {
+        if (this.state.optimisticStatus === 'enabled') {
             try {
-                await this.statusChangePromise;
+                await this.statusChangeSettled();
             }
             catch (error) {
                 // couldn't enable device, target resolution will be applied the next time user attempts to start the device
@@ -11760,6 +11855,7 @@ class MicrophoneManager extends InputMediaDeviceManager {
         : 'stop-tracks') {
         super(call, new MicrophoneManagerState(disableMode), TrackType.AUDIO);
         this.speakingWhileMutedNotificationEnabled = true;
+        this.soundDetectorConcurrencyTag = Symbol('soundDetectorConcurrencyTag');
         this.subscriptions.push(createSubscription(combineLatest([
             this.call.state.callingState$,
             this.call.state.ownCapabilities$,
@@ -11913,7 +12009,7 @@ class MicrophoneManager extends InputMediaDeviceManager {
         return this.call.stopPublish(TrackType.AUDIO, stopTracks);
     }
     async startSpeakingWhileMutedDetection(deviceId) {
-        const startPromise = (async () => {
+        await withoutConcurrency(this.soundDetectorConcurrencyTag, async () => {
             await this.stopSpeakingWhileMutedDetection();
             if (isReactNative()) {
                 this.rnSpeechDetector = new RNSpeechDetector();
@@ -11921,7 +12017,7 @@ class MicrophoneManager extends InputMediaDeviceManager {
                 const unsubscribe = this.rnSpeechDetector?.onSpeakingDetectedStateChange((event) => {
                     this.state.setSpeakingWhileMuted(event.isSoundDetected);
                 });
-                return () => {
+                this.soundDetectorCleanup = () => {
                     unsubscribe();
                     this.rnSpeechDetector?.stop();
                     this.rnSpeechDetector = undefined;
@@ -11932,24 +12028,21 @@ class MicrophoneManager extends InputMediaDeviceManager {
                 const stream = await this.getStream({
                     deviceId,
                 });
-                return createSoundDetector(stream, (event) => {
+                this.soundDetectorCleanup = createSoundDetector(stream, (event) => {
                     this.state.setSpeakingWhileMuted(event.isSoundDetected);
                 });
             }
-        })();
-        this.soundDetectorCleanup = async () => {
-            const cleanup = await startPromise;
-            await cleanup();
-        };
-        await startPromise;
+        });
     }
     async stopSpeakingWhileMutedDetection() {
-        if (!this.soundDetectorCleanup)
-            return;
-        const soundDetectorCleanup = this.soundDetectorCleanup;
-        this.soundDetectorCleanup = undefined;
-        this.state.setSpeakingWhileMuted(false);
-        await soundDetectorCleanup();
+        await withoutConcurrency(this.soundDetectorConcurrencyTag, async () => {
+            if (!this.soundDetectorCleanup)
+                return;
+            const soundDetectorCleanup = this.soundDetectorCleanup;
+            this.soundDetectorCleanup = undefined;
+            this.state.setSpeakingWhileMuted(false);
+            await soundDetectorCleanup();
+        });
     }
 }
 
@@ -13711,7 +13804,7 @@ class Call {
     }
     async initCamera(options) {
         // Wait for any in progress camera operation
-        await this.camera.statusChangePromise;
+        await this.camera.statusChangeSettled();
         if (this.state.localParticipant?.videoStream ||
             !this.permissionsContext.hasPermission('send-video')) {
             return;
@@ -13748,7 +13841,7 @@ class Call {
     }
     async initMic(options) {
         // Wait for any in progress mic operation
-        await this.microphone.statusChangePromise;
+        await this.microphone.statusChangeSettled();
         if (this.state.localParticipant?.audioStream ||
             !this.permissionsContext.hasPermission('send-audio')) {
             return;
@@ -15291,7 +15384,7 @@ class StreamClient {
             });
         };
         this.getUserAgent = () => {
-            const version = "1.2.3" ;
+            const version = "1.3.1" ;
             return (this.userAgent ||
                 `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${version}`);
         };