@stream-io/video-client 1.45.0 → 1.46.1

package/dist/index.es.js

@@ -3266,6 +3266,7 @@ class ParticipantJoined$Type extends MessageType {
         super('stream.video.sfu.event.ParticipantJoined', [
             { no: 1, name: 'call_cid', kind: 'scalar', T: 9 /*ScalarType.STRING*/ },
             { no: 2, name: 'participant', kind: 'message', T: () => Participant },
+            { no: 3, name: 'is_pinned', kind: 'scalar', T: 8 /*ScalarType.BOOL*/ },
         ]);
     }
 }
@@ -4785,7 +4786,7 @@ class StreamVideoWriteableStateStore {
      * The currently connected user.
      */
     get connectedUser() {
-        return getCurrentValue(this.connectedUserSubject);
+        return this.connectedUserSubject.getValue();
     }
     /**
      * A list of {@link Call} objects created/tracked by this client.
@@ -6284,7 +6285,7 @@ const getSdkVersion = (sdk) => {
     return sdk ? `${sdk.major}.${sdk.minor}.${sdk.patch}` : '0.0.0-development';
 };
 
-const version = "1.45.0";
+const version = "1.46.1";
 const [major, minor, patch] = version.split('.');
 let sdkInfo = {
     type: SdkType.PLAIN_JAVASCRIPT,
@@ -8983,6 +8984,7 @@ const watchCallRejected = (call) => {
         else {
             if (rejectedBy[eventCall.created_by.id]) {
                 call.logger.info('call creator rejected, leaving call');
+                globalThis.streamRNVideoSDK?.callingX?.endCall(call, 'remote');
                 await call.leave({ message: 'ring: creator rejected' });
             }
         }
@@ -8993,6 +8995,7 @@ const watchCallRejected = (call) => {
  */
 const watchCallEnded = (call) => {
     return function onCallEnded() {
+        globalThis.streamRNVideoSDK?.callingX?.endCall(call, 'remote');
         const { callingState } = call.state;
         if (callingState !== CallingState.IDLE &&
             callingState !== CallingState.LEFT) {
@@ -9024,6 +9027,7 @@ const watchSfuCallEnded = (call) => {
             // update the call state to reflect the call has ended.
             call.state.setEndedAt(new Date());
             const reason = CallEndedReason[e.reason];
+            globalThis.streamRNVideoSDK?.callingX?.endCall(call, 'remote');
             await call.leave({ message: `callEnded received: ${reason}` });
         }
         catch (err) {
@@ -9219,6 +9223,7 @@ const watchParticipantJoined = (state) => {
         // already announced participants.
         const orphanedTracks = reconcileOrphanedTracks(state, participant);
         state.updateOrAddParticipant(participant.sessionId, Object.assign(participant, orphanedTracks, {
+            ...(e.isPinned && { pin: { isLocalPin: false, pinnedAt: Date.now() } }),
             viewportVisibilityState: {
                 videoTrack: VisibilityState.UNKNOWN,
                 screenShareTrack: VisibilityState.UNKNOWN,
@@ -9612,6 +9617,31 @@ class DynascaleManager {
         this.logger = videoLoggerSystem.getLogger('DynascaleManager');
         this.useWebAudio = false;
         this.pendingSubscriptionsUpdate = null;
+        /**
+         * Audio elements that were blocked by the browser's autoplay policy.
+         * These can be retried by calling `resumeAudio()` from a user gesture.
+         */
+        this.blockedAudioElementsSubject = new BehaviorSubject(new Set());
+        /**
+         * Whether the browser's autoplay policy is blocking audio playback.
+         * Will be `true` when the browser blocks autoplay (e.g., no prior user interaction).
+         * Use `resumeAudio()` within a user gesture to unblock.
+         */
+        this.autoplayBlocked$ = this.blockedAudioElementsSubject.pipe(map((elements) => elements.size > 0), distinctUntilChanged());
+        this.addBlockedAudioElement = (audioElement) => {
+            setCurrentValue(this.blockedAudioElementsSubject, (elements) => {
+                const next = new Set(elements);
+                next.add(audioElement);
+                return next;
+            });
+        };
+        this.removeBlockedAudioElement = (audioElement) => {
+            setCurrentValue(this.blockedAudioElementsSubject, (elements) => {
+                const nextElements = new Set(elements);
+                nextElements.delete(audioElement);
+                return nextElements;
+            });
+        };
         this.videoTrackSubscriptionOverridesSubject = new BehaviorSubject({});
         this.videoTrackSubscriptionOverrides$ = this.videoTrackSubscriptionOverridesSubject.asObservable();
         this.incomingVideoSettings$ = this.videoTrackSubscriptionOverrides$.pipe(map((overrides) => {
@@ -9643,6 +9673,7 @@ class DynascaleManager {
                 clearTimeout(this.pendingSubscriptionsUpdate);
             }
             this.audioBindingsWatchdog?.dispose();
+            setCurrentValue(this.blockedAudioElementsSubject, new Set());
             const context = this.audioContext;
             if (context && context.state !== 'closed') {
                 document.removeEventListener('click', this.resumeAudioContext);
@@ -9940,8 +9971,10 @@ class DynascaleManager {
                     return;
                 setTimeout(() => {
                     audioElement.srcObject = source ?? null;
-                    if (!source)
+                    if (!source) {
+                        this.removeBlockedAudioElement(audioElement);
                         return;
+                    }
                     // Safari has a special quirk that prevents playing audio until the user
                     // interacts with the page or focuses on the tab where the call happens.
                     // This is a workaround for the issue where:
@@ -9965,6 +9998,10 @@ class DynascaleManager {
                         audioElement.muted = false;
                         audioElement.play().catch((e) => {
                             this.tracer.trace('audioPlaybackError', e.message);
+                            if (e.name === 'NotAllowedError') {
+                                this.tracer.trace('audioPlaybackBlocked', null);
+                                this.addBlockedAudioElement(audioElement);
+                            }
                             this.logger.warn(`Failed to play audio stream`, e);
                         });
                     }
@@ -9991,6 +10028,7 @@ class DynascaleManager {
             audioElement.autoplay = true;
             return () => {
                 this.audioBindingsWatchdog?.unregister(sessionId, trackType);
+                this.removeBlockedAudioElement(audioElement);
                 sinkIdSubscription?.unsubscribe();
                 volumeSubscription.unsubscribe();
                 updateMediaStreamSubscription.unsubscribe();
@@ -9999,6 +10037,28 @@ class DynascaleManager {
                 gainNode?.disconnect();
             };
         };
+        /**
+         * Plays all audio elements blocked by the browser's autoplay policy.
+         * Must be called from within a user gesture (e.g., click handler).
+         *
+         * @returns a promise that resolves when all blocked elements have been retried.
+         */
+        this.resumeAudio = async () => {
+            this.tracer.trace('resumeAudio', null);
+            const blocked = new Set();
+            await Promise.all(Array.from(getCurrentValue(this.blockedAudioElementsSubject), async (el) => {
+                try {
+                    if (el.srcObject) {
+                        await el.play();
+                    }
+                }
+                catch {
+                    this.logger.warn(`Can't resume audio for element: `, el);
+                    blocked.add(el);
+                }
+            }));
+            setCurrentValue(this.blockedAudioElementsSubject, blocked);
+        };
         this.getOrCreateAudioContext = () => {
             if (!this.useWebAudio)
                 return;
@@ -11868,31 +11928,43 @@ class RNSpeechDetector {
     constructor(externalAudioStream) {
         this.pc1 = new RTCPeerConnection({});
         this.pc2 = new RTCPeerConnection({});
+        this.isStopped = false;
         this.externalAudioStream = externalAudioStream;
     }
     /**
      * Starts the speech detection.
      */
     async start(onSoundDetectedStateChanged) {
+        let detachListeners;
+        let unsubscribe;
         try {
+            this.isStopped = false;
             const audioStream = this.externalAudioStream != null
                 ? this.externalAudioStream
                 : await navigator.mediaDevices.getUserMedia({ audio: true });
             this.audioStream = audioStream;
-            this.pc1.addEventListener('icecandidate', async (e) => {
-                await this.pc2.addIceCandidate(e.candidate);
-            });
-            this.pc2.addEventListener('icecandidate', async (e) => {
-                await this.pc1.addIceCandidate(e.candidate);
-            });
-            this.pc2.addEventListener('track', (e) => {
+            const onPc1IceCandidate = (e) => {
+                this.forwardIceCandidate(this.pc2, e.candidate);
+            };
+            const onPc2IceCandidate = (e) => {
+                this.forwardIceCandidate(this.pc1, e.candidate);
+            };
+            const onTrackPc2 = (e) => {
                 e.streams[0].getTracks().forEach((track) => {
                     // In RN, the remote track is automatically added to the audio output device
                     // so we need to mute it to avoid hearing the audio back
                     // @ts-expect-error _setVolume is a private method in react-native-webrtc
                     track._setVolume(0);
                 });
-            });
+            };
+            this.pc1.addEventListener('icecandidate', onPc1IceCandidate);
+            this.pc2.addEventListener('icecandidate', onPc2IceCandidate);
+            this.pc2.addEventListener('track', onTrackPc2);
+            detachListeners = () => {
+                this.pc1.removeEventListener('icecandidate', onPc1IceCandidate);
+                this.pc2.removeEventListener('icecandidate', onPc2IceCandidate);
+                this.pc2.removeEventListener('track', onTrackPc2);
+            };
             audioStream
                 .getTracks()
                 .forEach((track) => this.pc1.addTrack(track, audioStream));
@@ -11902,13 +11974,17 @@ class RNSpeechDetector {
             const answer = await this.pc2.createAnswer();
             await this.pc1.setRemoteDescription(answer);
             await this.pc2.setLocalDescription(answer);
-            const unsubscribe = this.onSpeakingDetectedStateChange(onSoundDetectedStateChanged);
+            unsubscribe = this.onSpeakingDetectedStateChange(onSoundDetectedStateChanged);
             return () => {
-                unsubscribe();
+                detachListeners?.();
+                unsubscribe?.();
                 this.stop();
             };
         }
         catch (error) {
+            detachListeners?.();
+            unsubscribe?.();
+            this.stop();
             const logger = videoLoggerSystem.getLogger('RNSpeechDetector');
             logger.error('error handling permissions: ', error);
             return () => { };
@@ -11918,6 +11994,9 @@ class RNSpeechDetector {
      * Stops the speech detection and releases all allocated resources.
      */
     stop() {
+        if (this.isStopped)
+            return;
+        this.isStopped = true;
         this.pc1.close();
         this.pc2.close();
         if (this.externalAudioStream != null) {
@@ -12017,6 +12096,18 @@ class RNSpeechDetector {
             this.audioStream.release();
         }
     }
+    forwardIceCandidate(destination, candidate) {
+        if (this.isStopped ||
+            !candidate ||
+            destination.signalingState === 'closed') {
+            return;
+        }
+        destination.addIceCandidate(candidate).catch(() => {
+            // silently ignore the error
+            const logger = videoLoggerSystem.getLogger('RNSpeechDetector');
+            logger.info('cannot add ice candidate - ignoring');
+        });
+    }
 }
 
 class MicrophoneManager extends AudioDeviceManager {
@@ -12112,6 +12203,7 @@ class MicrophoneManager extends AudioDeviceManager {
                 const deviceId = this.state.selectedDevice;
                 const devices = await firstValueFrom(this.listDevices());
                 const label = devices.find((d) => d.deviceId === deviceId)?.label;
+                let lastCapturesAudio;
                 this.noAudioDetectorCleanup = createNoAudioDetector(mediaStream, {
                     noAudioThresholdMs: this.silenceThresholdMs,
                     emitIntervalMs: this.silenceThresholdMs,
@@ -12123,7 +12215,10 @@ class MicrophoneManager extends AudioDeviceManager {
                             deviceId,
                             label,
                         };
-                        this.call.tracer.trace('mic.capture_report', event);
+                        if (capturesAudio !== lastCapturesAudio) {
+                            lastCapturesAudio = capturesAudio;
+                            this.call.tracer.trace('mic.capture_report', event);
+                        }
                         this.call.streamClient.dispatchEvent(event);
                     },
                 });
@@ -12645,6 +12740,7 @@ class SpeakerManager {
             this.defaultDevice = defaultDevice;
             globalThis.streamRNVideoSDK?.callManager.setup({
                 defaultDevice,
+                isRingingTypeCall: this.call.ringing,
             });
         }
     }
@@ -12844,6 +12940,7 @@ class Call {
                 const currentUserId = this.currentUserId;
                 if (currentUserId && blockedUserIds.includes(currentUserId)) {
                     this.logger.info('Leaving call because of being blocked');
+                    globalThis.streamRNVideoSDK?.callingX?.endCall(this, 'restricted');
                     await this.leave({ message: 'user blocked' }).catch((err) => {
                         this.logger.error('Error leaving call after being blocked', err);
                     });
@@ -12880,6 +12977,7 @@ class Call {
                 const isAcceptedElsewhere = isAcceptedByMe && this.state.callingState === CallingState.RINGING;
                 if ((isAcceptedElsewhere || isRejectedByMe) &&
                     !hasPending(this.joinLeaveConcurrencyTag)) {
+                    globalThis.streamRNVideoSDK?.callingX?.endCall(this, isAcceptedElsewhere ? 'answeredElsewhere' : 'rejected');
                     this.leave().catch(() => {
                         this.logger.error('Could not leave a call that was accepted or rejected elsewhere');
                     });
@@ -12891,6 +12989,9 @@ class Call {
             const receiver_id = this.clientStore.connectedUser?.id;
             const ended_at = callSession?.ended_at;
             const created_by_id = this.state.createdBy?.id;
+            if (this.currentUserId && created_by_id === this.currentUserId) {
+                globalThis.streamRNVideoSDK?.callingX?.registerOutgoingCall(this);
+            }
             const rejected_by = callSession?.rejected_by;
             const accepted_by = callSession?.accepted_by;
             let leaveCallIdle = false;
@@ -13029,7 +13130,16 @@ class Call {
                 }
                 if (callingState === CallingState.RINGING && reject !== false) {
                     if (reject) {
-                        await this.reject(reason ?? 'decline');
+                        const reasonToEndCallReason = {
+                            timeout: 'missed',
+                            cancel: 'canceled',
+                            busy: 'busy',
+                            decline: 'rejected',
+                        };
+                        const rejectReason = reason ?? 'decline';
+                        const endCallReason = reasonToEndCallReason[rejectReason] ?? 'rejected';
+                        await this.reject(rejectReason);
+                        globalThis.streamRNVideoSDK?.callingX?.endCall(this, endCallReason);
                     }
                     else {
                         // if reject was undefined, we still have to cancel the call automatically
@@ -13037,9 +13147,11 @@ class Call {
                         const hasOtherParticipants = this.state.remoteParticipants.length > 0;
                         if (this.isCreatedByMe && !hasOtherParticipants) {
                             await this.reject('cancel');
+                            globalThis.streamRNVideoSDK?.callingX?.endCall(this, 'canceled');
                         }
                     }
                 }
+                globalThis.streamRNVideoSDK?.callingX?.endCall(this);
                 this.statsReporter?.stop();
                 this.statsReporter = undefined;
                 const leaveReason = message ?? reason ?? 'user is leaving the call';
@@ -13066,7 +13178,9 @@ class Call {
                 this.ringingSubject.next(false);
                 this.cancelAutoDrop();
                 this.clientStore.unregisterCall(this);
-                globalThis.streamRNVideoSDK?.callManager.stop();
+                globalThis.streamRNVideoSDK?.callManager.stop({
+                    isRingingTypeCall: this.ringing,
+                });
                 this.camera.dispose();
                 this.microphone.dispose();
                 this.screenShare.dispose();
@@ -13232,11 +13346,19 @@ class Call {
          * @returns a promise which resolves once the call join-flow has finished.
          */
         this.join = async ({ maxJoinRetries = 3, joinResponseTimeout, rpcRequestTimeout, ...data } = {}) => {
-            await this.setup();
             const callingState = this.state.callingState;
             if ([CallingState.JOINED, CallingState.JOINING].includes(callingState)) {
                 throw new Error(`Illegal State: call.join() shall be called only once`);
             }
+            if (data?.ring) {
+                this.ringingSubject.next(true);
+            }
+            const callingX = globalThis.streamRNVideoSDK?.callingX;
+            if (callingX) {
+                // for Android/iOS, we need to start the call in the callingx library as soon as possible
+                await callingX.joinCall(this, this.clientStore.calls);
+            }
+            await this.setup();
             this.joinResponseTimeout = joinResponseTimeout;
             this.rpcRequestTimeout = rpcRequestTimeout;
             // we will count the number of join failures per SFU.
@@ -13245,38 +13367,44 @@ class Call {
             const sfuJoinFailures = new Map();
             const joinData = data;
             maxJoinRetries = Math.max(maxJoinRetries, 1);
-            for (let attempt = 0; attempt < maxJoinRetries; attempt++) {
-                try {
-                    this.logger.trace(`Joining call (${attempt})`, this.cid);
-                    await this.doJoin(data);
-                    delete joinData.migrating_from;
-                    delete joinData.migrating_from_list;
-                    break;
-                }
-                catch (err) {
-                    this.logger.warn(`Failed to join call (${attempt})`, this.cid);
-                    if ((err instanceof ErrorFromResponse && err.unrecoverable) ||
-                        (err instanceof SfuJoinError && err.unrecoverable)) {
-                        // if the error is unrecoverable, we should not retry as that signals
-                        // that connectivity is good, but the coordinator doesn't allow the user
-                        // to join the call due to some reason (e.g., ended call, expired token...)
-                        throw err;
-                    }
-                    // immediately switch to a different SFU in case of recoverable join error
-                    const switchSfu = err instanceof SfuJoinError &&
-                        SfuJoinError.isJoinErrorCode(err.errorEvent);
-                    const sfuId = this.credentials?.server.edge_name || '';
-                    const failures = (sfuJoinFailures.get(sfuId) || 0) + 1;
-                    sfuJoinFailures.set(sfuId, failures);
-                    if (switchSfu || failures >= 2) {
-                        joinData.migrating_from = sfuId;
-                        joinData.migrating_from_list = Array.from(sfuJoinFailures.keys());
+            try {
+                for (let attempt = 0; attempt < maxJoinRetries; attempt++) {
+                    try {
+                        this.logger.trace(`Joining call (${attempt})`, this.cid);
+                        await this.doJoin(data);
+                        delete joinData.migrating_from;
+                        delete joinData.migrating_from_list;
+                        break;
                     }
-                    if (attempt === maxJoinRetries - 1) {
-                        throw err;
+                    catch (err) {
+                        this.logger.warn(`Failed to join call (${attempt})`, this.cid);
+                        if ((err instanceof ErrorFromResponse && err.unrecoverable) ||
+                            (err instanceof SfuJoinError && err.unrecoverable)) {
+                            // if the error is unrecoverable, we should not retry as that signals
+                            // that connectivity is good, but the coordinator doesn't allow the user
+                            // to join the call due to some reason (e.g., ended call, expired token...)
+                            throw err;
+                        }
+                        // immediately switch to a different SFU in case of recoverable join error
+                        const switchSfu = err instanceof SfuJoinError &&
+                            SfuJoinError.isJoinErrorCode(err.errorEvent);
+                        const sfuId = this.credentials?.server.edge_name || '';
+                        const failures = (sfuJoinFailures.get(sfuId) || 0) + 1;
+                        sfuJoinFailures.set(sfuId, failures);
+                        if (switchSfu || failures >= 2) {
+                            joinData.migrating_from = sfuId;
+                            joinData.migrating_from_list = Array.from(sfuJoinFailures.keys());
+                        }
+                        if (attempt === maxJoinRetries - 1) {
+                            throw err;
+                        }
                     }
+                    await sleep(retryInterval(attempt));
                 }
-                await sleep(retryInterval(attempt));
+            }
+            catch (error) {
+                callingX?.endCall(this, 'error');
+                throw error;
             }
         };
         /**
@@ -13423,7 +13551,9 @@ class Call {
             // re-apply them on later reconnections or server-side data fetches
             if (!this.deviceSettingsAppliedOnce && this.state.settings) {
                 await this.applyDeviceConfig(this.state.settings, true, false);
-                globalThis.streamRNVideoSDK?.callManager.start();
+                globalThis.streamRNVideoSDK?.callManager.start({
+                    isRingingTypeCall: this.ringing,
+                });
                 this.deviceSettingsAppliedOnce = true;
             }
             // We shouldn't persist the `ring` and `notify` state after joining the call
@@ -13851,6 +13981,7 @@ class Call {
                 if (strategy === WebsocketReconnectStrategy.UNSPECIFIED)
                     return;
                 if (strategy === WebsocketReconnectStrategy.DISCONNECT) {
+                    globalThis.streamRNVideoSDK?.callingX?.endCall(this, 'error');
                     this.leave({ message: 'SFU instructed to disconnect' }).catch((err) => {
                         this.logger.warn(`Can't leave call after disconnect request`, err);
                     });
@@ -14755,6 +14886,12 @@ class Call {
                 unbind();
             };
         };
+        /**
+         * Plays all audio elements blocked by the browser's autoplay policy.
+         */
+        this.resumeAudio = () => {
+            return this.dynascaleManager.resumeAudio();
+        };
         /**
          * Binds a DOM <img> element to this call's thumbnail (if enabled in settings).
          *
@@ -14872,7 +15009,7 @@ class Call {
      * A flag indicating whether the call was created by the current user.
      */
     get isCreatedByMe() {
-        return this.state.createdBy?.id === this.currentUserId;
+        return (this.currentUserId && this.state.createdBy?.id === this.currentUserId);
     }
 }
 
@@ -15996,7 +16133,7 @@ class StreamClient {
         this.getUserAgent = () => {
             if (!this.cachedUserAgent) {
                 const { clientAppIdentifier = {} } = this.options;
-                const { sdkName = 'js', sdkVersion = "1.45.0", ...extras } = clientAppIdentifier;
+                const { sdkName = 'js', sdkVersion = "1.46.1", ...extras } = clientAppIdentifier;
                 this.cachedUserAgent = [
                     `stream-video-${sdkName}-v${sdkVersion}`,
                     ...Object.entries(extras).map(([key, value]) => `${key}=${value}`),