@stream-io/video-client 1.0.1 → 1.0.2

package/dist/index.cjs.js

@@ -10890,18 +10890,27 @@ class InputMediaDeviceManager {
      * Starts stream.
      */
     async enable() {
-        if (this.state.status === 'enabled')
+        if (this.state.optimisticStatus === 'enabled') {
+            await this.statusChangePromise;
             return;
-        this.enablePromise = this.unmuteStream();
-        try {
-            await this.enablePromise;
-            this.state.setStatus('enabled');
-            this.enablePromise = undefined;
-        }
-        catch (error) {
-            this.enablePromise = undefined;
-            throw error;
         }
+        const signal = this.nextAbortableStatusChangeRequest('enabled');
+        const doEnable = async () => {
+            if (signal.aborted)
+                return;
+            try {
+                await this.unmuteStream();
+                this.state.setStatus('enabled');
+            }
+            finally {
+                if (!signal.aborted)
+                    this.resetStatusChangeRequest();
+            }
+        };
+        this.statusChangePromise = this.statusChangePromise
+            ? this.statusChangePromise.then(doEnable)
+            : doEnable();
+        await this.statusChangePromise;
     }
     /**
      * Stops or pauses the stream based on state.disableMode
@@ -10909,19 +10918,28 @@ class InputMediaDeviceManager {
      */
     async disable(forceStop = false) {
         this.state.prevStatus = this.state.status;
-        if (!forceStop && this.state.status === 'disabled')
+        if (!forceStop && this.state.optimisticStatus === 'disabled') {
+            await this.statusChangePromise;
             return;
-        const stopTracks = forceStop || this.state.disableMode === 'stop-tracks';
-        this.disablePromise = this.muteStream(stopTracks);
-        try {
-            await this.disablePromise;
-            this.state.setStatus('disabled');
-            this.disablePromise = undefined;
-        }
-        catch (error) {
-            this.disablePromise = undefined;
-            throw error;
         }
+        const stopTracks = forceStop || this.state.disableMode === 'stop-tracks';
+        const signal = this.nextAbortableStatusChangeRequest('disabled');
+        const doDisable = async () => {
+            if (signal.aborted)
+                return;
+            try {
+                await this.muteStream(stopTracks);
+                this.state.setStatus('disabled');
+            }
+            finally {
+                if (!signal.aborted)
+                    this.resetStatusChangeRequest();
+            }
+        };
+        this.statusChangePromise = this.statusChangePromise
+            ? this.statusChangePromise.then(doDisable)
+            : doDisable();
+        await this.statusChangePromise;
     }
     /**
      * If status was previously enabled, it will re-enable the device.
@@ -10937,7 +10955,7 @@ class InputMediaDeviceManager {
      * else it will disable it.
      */
     async toggle() {
-        if (this.state.status === 'enabled') {
+        if (this.state.optimisticStatus === 'enabled') {
             return this.disable();
         }
         else {
@@ -11124,11 +11142,8 @@ class InputMediaDeviceManager {
             this.state.setMediaStream(stream, await rootStream);
             this.getTracks().forEach((track) => {
                 track.addEventListener('ended', async () => {
-                    if (this.enablePromise) {
-                        await this.enablePromise;
-                    }
-                    if (this.disablePromise) {
-                        await this.disablePromise;
+                    if (this.statusChangePromise) {
+                        await this.statusChangePromise;
                     }
                     if (this.state.status === 'enabled') {
                         this.isTrackStoppedDueToTrackEnd = true;
@@ -11158,11 +11173,8 @@ class InputMediaDeviceManager {
             if (!deviceId) {
                 return;
             }
-            if (this.enablePromise) {
-                await this.enablePromise;
-            }
-            if (this.disablePromise) {
-                await this.disablePromise;
+            if (this.statusChangePromise) {
+                await this.statusChangePromise;
             }
             let isDeviceDisconnected = false;
             let isDeviceReplaced = false;
@@ -11196,6 +11208,16 @@ 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;
+    }
 }
 
 class InputMediaDeviceManagerState {
@@ -11210,6 +11232,7 @@ class InputMediaDeviceManagerState {
         this.disableMode = disableMode;
         this.permissionName = permissionName;
         this.statusSubject = new rxjs.BehaviorSubject(undefined);
+        this.optimisticStatusSubject = new rxjs.BehaviorSubject(undefined);
         this.mediaStreamSubject = new rxjs.BehaviorSubject(undefined);
         this.selectedDeviceSubject = new rxjs.BehaviorSubject(undefined);
         this.defaultConstraintsSubject = new rxjs.BehaviorSubject(undefined);
@@ -11228,6 +11251,12 @@ class InputMediaDeviceManagerState {
          * An Observable that emits the device status
          */
         this.status$ = this.statusSubject.asObservable().pipe(rxjs.distinctUntilChanged());
+        /**
+         * An Observable the reflects the requested device status. Useful for optimistic UIs
+         */
+        this.optimisticStatus$ = this.optimisticStatusSubject
+            .asObservable()
+            .pipe(rxjs.distinctUntilChanged());
         /**
          * The default constraints for the device.
          */
@@ -11295,6 +11324,12 @@ class InputMediaDeviceManagerState {
     get status() {
         return this.getCurrentValue(this.status$);
     }
+    /**
+     * The requested device status. Useful for optimistic UIs
+     */
+    get optimisticStatus() {
+        return this.getCurrentValue(this.optimisticStatus$);
+    }
     /**
      * The currently selected device
      */
@@ -11314,6 +11349,13 @@ class InputMediaDeviceManagerState {
     setStatus(status) {
         this.setCurrentValue(this.statusSubject, status);
     }
+    /**
+     * @internal
+     * @param pendingStatus
+     */
+    setPendingStatus(pendingStatus) {
+        this.setCurrentValue(this.optimisticStatusSubject, pendingStatus);
+    }
     /**
      * Updates the `mediaStream` state variable.
      *
@@ -11433,9 +11475,9 @@ class CameraManager extends InputMediaDeviceManager {
     async selectTargetResolution(resolution) {
         this.targetResolution.height = resolution.height;
         this.targetResolution.width = resolution.width;
-        if (this.enablePromise) {
+        if (this.statusChangePromise && this.state.optimisticStatus === 'enabled') {
             try {
-                await this.enablePromise;
+                await this.statusChangePromise;
             }
             catch (error) {
                 // couldn't enable device, target resolution will be applied the next time user attempts to start the device
@@ -13576,12 +13618,7 @@ class Call {
     }
     async initCamera(options) {
         // Wait for any in progress camera operation
-        if (this.camera.enablePromise) {
-            await this.camera.enablePromise;
-        }
-        if (this.camera.disablePromise) {
-            await this.camera.disablePromise;
-        }
+        await this.camera.statusChangePromise;
         if (this.state.localParticipant?.videoStream ||
             !this.permissionsContext.hasPermission('send-video')) {
             return;
@@ -13618,12 +13655,7 @@ class Call {
     }
     async initMic(options) {
         // Wait for any in progress mic operation
-        if (this.microphone.enablePromise) {
-            await this.microphone.enablePromise;
-        }
-        if (this.microphone.disablePromise) {
-            await this.microphone.disablePromise;
-        }
+        await this.microphone.statusChangePromise;
         if (this.state.localParticipant?.audioStream ||
             !this.permissionsContext.hasPermission('send-audio')) {
             return;
@@ -15164,7 +15196,7 @@ class StreamClient {
             });
         };
         this.getUserAgent = () => {
-            const version = "1.0.1" ;
+            const version = "1.0.2" ;
             return (this.userAgent ||
                 `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${version}`);
         };