@stream-io/video-react-native-sdk 1.32.3 → 1.33.0

package/src/contexts/BackgroundFilters.tsx

@@ -2,6 +2,7 @@ import React, {
   type PropsWithChildren,
   useCallback,
   useContext,
+  useEffect,
   useMemo,
   useRef,
   useState,
@@ -76,6 +77,10 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
   const isBackgroundBlurRegisteredRef = useRef(false);
   const isVideoBlurRegisteredRef = useRef(false);
   const registeredImageFiltersSetRef = useRef(new Set<string>());
+  // The currently applied native filter name. Used to reapply on track
+  // replacement, and as a staleness signal so a later apply/disable can
+  // invalidate an in-flight apply() call.
+  const lastAppliedFilterNameRef = useRef<string | null>(null);
 
   const [currentBackgroundFilter, setCurrentBackgroundFilter] =
     useState<CurrentBackgroundFilter>();
@@ -85,16 +90,19 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
       if (!isSupported) {
         return;
       }
-      if (!isBackgroundBlurRegisteredRef.current) {
-        await videoFiltersModule?.registerBackgroundBlurVideoFilters();
-        isBackgroundBlurRegisteredRef.current = true;
-      }
       let filterName = 'BackgroundBlurMedium';
       if (blurIntensity === 'heavy') {
         filterName = 'BackgroundBlurHeavy';
       } else if (blurIntensity === 'light') {
         filterName = 'BackgroundBlurLight';
       }
+      // Set before awaiting so a later apply/disable can mark this call stale.
+      lastAppliedFilterNameRef.current = filterName;
+      if (!isBackgroundBlurRegisteredRef.current) {
+        await videoFiltersModule?.registerBackgroundBlurVideoFilters();
+        if (lastAppliedFilterNameRef.current !== filterName) return;
+        isBackgroundBlurRegisteredRef.current = true;
+      }
       call?.tracer.trace('backgroundFilters.apply', filterName);
       (call?.camera.state.mediaStream as MediaStream | undefined)
         ?.getVideoTracks()
@@ -111,16 +119,18 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
       if (!isSupported) {
         return;
       }
-      if (!isVideoBlurRegisteredRef.current) {
-        await videoFiltersModule?.registerBlurVideoFilters();
-        isVideoBlurRegisteredRef.current = true;
-      }
       let filterName = 'BlurMedium';
       if (blurIntensity === 'heavy') {
         filterName = 'BlurHeavy';
       } else if (blurIntensity === 'light') {
         filterName = 'BlurLight';
       }
+      lastAppliedFilterNameRef.current = filterName;
+      if (!isVideoBlurRegisteredRef.current) {
+        await videoFiltersModule?.registerBlurVideoFilters();
+        if (lastAppliedFilterNameRef.current !== filterName) return;
+        isVideoBlurRegisteredRef.current = true;
+      }
       call?.tracer.trace('videoFilters.apply', filterName);
       (call?.camera.state.mediaStream as MediaStream | undefined)
         ?.getVideoTracks()
@@ -139,12 +149,14 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
       }
       const source = Image.resolveAssetSource(imageSource);
       const imageUri = source.uri;
+      const filterName = `VirtualBackground-${imageUri}`;
+      lastAppliedFilterNameRef.current = filterName;
       const registeredImageFiltersSet = registeredImageFiltersSetRef.current;
       if (!registeredImageFiltersSet.has(imageUri)) {
         await videoFiltersModule?.registerVirtualBackgroundFilter(imageSource);
+        if (lastAppliedFilterNameRef.current !== filterName) return;
         registeredImageFiltersSetRef.current.add(imageUri);
       }
-      const filterName = `VirtualBackground-${imageUri}`;
       call?.tracer.trace('backgroundFilters.apply', filterName);
       (call?.camera.state.mediaStream as MediaStream | undefined)
         ?.getVideoTracks()
@@ -161,6 +173,8 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
       return;
     }
     call?.tracer.trace('backgroundFilters.disableAll', null);
+    // Clearing the ref invalidates any in-flight apply — its stale check will bail.
+    lastAppliedFilterNameRef.current = null;
     (call?.camera.state.mediaStream as MediaStream | undefined)
       ?.getVideoTracks()
       .forEach((track) => {
@@ -169,6 +183,38 @@ export const BackgroundFiltersProvider = ({ children }: PropsWithChildren) => {
     setCurrentBackgroundFilter(undefined);
   }, [call]);
 
+  // Reapplies the filter on track replacement (flip, enable-after-disable).
+  // Releases native filter state on unmount / call change.
+  useEffect(() => {
+    if (!call || !isSupported) return;
+    const registeredImageFiltersSet = registeredImageFiltersSetRef.current;
+    const subscription = call.camera.state.mediaStream$.subscribe(() => {
+      const name = lastAppliedFilterNameRef.current;
+      if (!name) return;
+      (call.camera.state.mediaStream as MediaStream | undefined)
+        ?.getVideoTracks()
+        .forEach((track) => {
+          track._setVideoEffect(name);
+        });
+    });
+    return () => {
+      subscription.unsubscribe();
+      (call.camera.state.mediaStream as MediaStream | undefined)
+        ?.getVideoTracks()
+        .forEach((track) => {
+          track._setVideoEffect(null);
+        });
+      // Drop native processor refs so they can be deallocated. Otherwise the
+      // ProcessorProvider registry holds them for the app's lifetime.
+      videoFiltersModule?.unregisterAllFilters?.().catch(() => {});
+      lastAppliedFilterNameRef.current = null;
+      isBackgroundBlurRegisteredRef.current = false;
+      isVideoBlurRegisteredRef.current = false;
+      registeredImageFiltersSet.clear();
+      setCurrentBackgroundFilter(undefined);
+    };
+  }, [call]);
+
   const value = useMemo(
     () => ({
       currentBackgroundFilter,

package/src/hooks/index.ts

@@ -9,5 +9,4 @@ export * from './useScreenShareButton';
 export * from './useScreenShareAudioMixing';
 export * from './useTrackDimensions';
 export * from './useScreenshot';
-export * from './useSpeechDetection';
 export * from './useModeration';

package/src/utils/StreamVideoRN/index.ts

@@ -148,12 +148,12 @@ export class StreamVideoRN {
    * Typically used on user logout.
    */
   static onPushLogout() {
-    if (pushLogoutCallbacks.current) {
-      return Promise.all(
-        pushLogoutCallbacks.current.map((callback) => callback()),
-      ).then(() => {});
+    const callbacks = pushLogoutCallbacks.current;
+    if (!callbacks) {
+      return Promise.resolve();
     }
-    return Promise.resolve();
+    pushLogoutCallbacks.current = [];
+    return Promise.all(callbacks.map((callback) => callback())).then(() => {});
   }
 
   static clearPushLogoutCallbacks() {

package/src/utils/internal/registerSDKGlobals.ts

@@ -1,5 +1,6 @@
 import { StreamRNVideoSDKGlobals } from '@stream-io/video-client';
 import { NativeModules, PermissionsAndroid, Platform } from 'react-native';
+import { audioDeviceModuleEvents } from '@stream-io/react-native-webrtc';
 import { getCallingxLibIfAvailable } from '../push/libs/callingx';
 import {
   endCallingxCall,
@@ -85,6 +86,18 @@ const streamRNVideoSDKGlobals: StreamRNVideoSDKGlobals = {
       );
     },
   },
+  nativeEvents: {
+    speechActivity: {
+      subscribe(cb) {
+        const subscription = audioDeviceModuleEvents.addSpeechActivityListener(
+          (data) => {
+            cb({ isSoundDetected: data.event === 'started' });
+          },
+        );
+        return () => subscription.remove();
+      },
+    },
+  },
 };
 
 // Note: The global type declaration for `streamRNVideoSDK` is defined in

package/src/utils/push/setupCallingExpEvents.ts

@@ -4,7 +4,6 @@ import {
   clearPushWSEventSubscriptions,
   processCallFromPushInBackground,
 } from './internal/utils';
-import { setPushLogoutCallback } from '../internal/pushLogoutCallback';
 import { resolvePendingAudioSession } from '../internal/callingx/audioSessionPromise';
 import {
   getCallingxLib,
@@ -31,25 +30,19 @@ export function setupCallingExpEvents(pushConfig: NonNullable<PushConfig>) {
 
   const callingx = getCallingxLib();
 
-  const { remove: removeAnswerCall } = callingx.addEventListener(
-    'answerCall',
-    (params) => {
-      onAcceptCall(pushConfig)(params);
-    },
-  );
+  callingx.addEventListener('answerCall', (params) => {
+    onAcceptCall(pushConfig)(params);
+  });
 
-  const { remove: removeEndCall } = callingx.addEventListener(
-    'endCall',
-    (params) => {
-      onEndCall(pushConfig)(params);
-    },
-  );
+  callingx.addEventListener('endCall', (params) => {
+    onEndCall(pushConfig)(params);
+  });
 
-  const { remove: removeDidActivateAudioSession } = callingx.addEventListener(
+  callingx.addEventListener(
     'didActivateAudioSession',
     onDidActivateAudioSession,
   );
-  const { remove: removeDidDeactivateAudioSession } = callingx.addEventListener(
+  callingx.addEventListener(
     'didDeactivateAudioSession',
     onDidDeactivateAudioSession,
   );
@@ -71,13 +64,6 @@ export function setupCallingExpEvents(pushConfig: NonNullable<PushConfig>) {
       onDidDeactivateAudioSession();
     }
   });
-
-  setPushLogoutCallback(async () => {
-    removeAnswerCall();
-    removeEndCall();
-    removeDidActivateAudioSession();
-    removeDidDeactivateAudioSession();
-  });
 }
 
 const onDidActivateAudioSession = () => {

package/src/utils/push/setupIosVoipPushEvents.ts

@@ -2,7 +2,6 @@
 
 import { Platform } from 'react-native';
 import { onVoipNotificationReceived } from './internal/ios';
-import { setPushLogoutCallback } from '../internal/pushLogoutCallback';
 import { StreamVideoConfig } from '../StreamVideoRN/types';
 import { videoLoggerSystem } from '@stream-io/video-client';
 import { getCallingxLib } from './libs';
@@ -23,17 +22,7 @@ export function setupIosVoipPushEvents(
   }
 
   const callingx = getCallingxLib();
-  const voipNotificationReceivedListener = callingx.addEventListener(
-    'voipNotificationReceived',
-    (params) => {
-      onVoipNotificationReceived(params, pushConfig);
-    },
-  );
-
-  setPushLogoutCallback(async () => {
-    videoLoggerSystem
-      .getLogger('setPushLogoutCallback')
-      .debug('notification event listener removed');
-    voipNotificationReceivedListener.remove();
+  callingx.addEventListener('voipNotificationReceived', (params) => {
+    onVoipNotificationReceived(params, pushConfig);
   });
 }

package/src/version.ts

@@ -1 +1 @@
-export const version = '1.32.3';
+export const version = '1.33.0';

package/dist/commonjs/hooks/useSpeechDetection.js

@@ -1,39 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useSpeechDetection = useSpeechDetection;
-var _react = require("react");
-var _videoClient = require("@stream-io/video-client");
-var _videoReactBindings = require("@stream-io/video-react-bindings");
-/**
- * Hook that provides speech detection info using the RNSpeechDetector.
- *
- * @returns An object containing the current audio level (0 - 1) and whether sound is detected.
- */
-function useSpeechDetection() {
-  const [audioState, setAudioState] = (0, _react.useState)({
-    isSoundDetected: false,
-    audioLevel: 0
-  });
-  const {
-    useMicrophoneState
-  } = (0, _videoReactBindings.useCallStateHooks)();
-  const {
-    isEnabled,
-    mediaStream
-  } = useMicrophoneState();
-  (0, _react.useEffect)(() => {
-    if (!isEnabled) return;
-    const detector = new _videoClient.RNSpeechDetector(mediaStream);
-    const start = detector.start(state => {
-      setAudioState(state);
-    });
-    return () => {
-      start.then(stop => stop());
-    };
-  }, [mediaStream, isEnabled]);
-  return audioState;
-}
-//# sourceMappingURL=useSpeechDetection.js.map

package/dist/commonjs/hooks/useSpeechDetection.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","require","_videoClient","_videoReactBindings","useSpeechDetection","audioState","setAudioState","useState","isSoundDetected","audioLevel","useMicrophoneState","useCallStateHooks","isEnabled","mediaStream","useEffect","detector","RNSpeechDetector","start","state","then","stop"],"sourceRoot":"../../../src","sources":["hooks/useSpeechDetection.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAIA,IAAAE,mBAAA,GAAAF,OAAA;AAEA;AACA;AACA;AACA;AACA;AACO,SAASG,kBAAkBA,CAAA,EAAG;EACnC,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAC,eAAQ,EAAqB;IAC/DC,eAAe,EAAE,KAAK;IACtBC,UAAU,EAAE;EACd,CAAC,CAAC;EACF,MAAM;IAAEC;EAAmB,CAAC,GAAG,IAAAC,qCAAiB,EAAC,CAAC;EAClD,MAAM;IAAEC,SAAS;IAAEC;EAAY,CAAC,GAAGH,kBAAkB,CAAC,CAAC;EAEvD,IAAAI,gBAAS,EAAC,MAAM;IACd,IAAI,CAACF,SAAS,EAAE;IAEhB,MAAMG,QAAQ,GAAG,IAAIC,6BAAgB,CAACH,WAAW,CAAC;IAClD,MAAMI,KAAK,GAAGF,QAAQ,CAACE,KAAK,CAAEC,KAAyB,IAAK;MAC1DZ,aAAa,CAACY,KAAK,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,MAAM;MACXD,KAAK,CAACE,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAAC,CAAC,CAAC;IAC9B,CAAC;EACH,CAAC,EAAE,CAACP,WAAW,EAAED,SAAS,CAAC,CAAC;EAE5B,OAAOP,UAAU;AACnB","ignoreList":[]}

package/dist/module/hooks/useSpeechDetection.js

@@ -1,34 +0,0 @@
-import { useEffect, useState } from 'react';
-import { RNSpeechDetector } from '@stream-io/video-client';
-import { useCallStateHooks } from '@stream-io/video-react-bindings';
-
-/**
- * Hook that provides speech detection info using the RNSpeechDetector.
- *
- * @returns An object containing the current audio level (0 - 1) and whether sound is detected.
- */
-export function useSpeechDetection() {
-  const [audioState, setAudioState] = useState({
-    isSoundDetected: false,
-    audioLevel: 0
-  });
-  const {
-    useMicrophoneState
-  } = useCallStateHooks();
-  const {
-    isEnabled,
-    mediaStream
-  } = useMicrophoneState();
-  useEffect(() => {
-    if (!isEnabled) return;
-    const detector = new RNSpeechDetector(mediaStream);
-    const start = detector.start(state => {
-      setAudioState(state);
-    });
-    return () => {
-      start.then(stop => stop());
-    };
-  }, [mediaStream, isEnabled]);
-  return audioState;
-}
-//# sourceMappingURL=useSpeechDetection.js.map

package/dist/module/hooks/useSpeechDetection.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useEffect","useState","RNSpeechDetector","useCallStateHooks","useSpeechDetection","audioState","setAudioState","isSoundDetected","audioLevel","useMicrophoneState","isEnabled","mediaStream","detector","start","state","then","stop"],"sourceRoot":"../../../src","sources":["hooks/useSpeechDetection.ts"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAEEC,gBAAgB,QACX,yBAAyB;AAChC,SAASC,iBAAiB,QAAQ,iCAAiC;;AAEnE;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,kBAAkBA,CAAA,EAAG;EACnC,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGL,QAAQ,CAAqB;IAC/DM,eAAe,EAAE,KAAK;IACtBC,UAAU,EAAE;EACd,CAAC,CAAC;EACF,MAAM;IAAEC;EAAmB,CAAC,GAAGN,iBAAiB,CAAC,CAAC;EAClD,MAAM;IAAEO,SAAS;IAAEC;EAAY,CAAC,GAAGF,kBAAkB,CAAC,CAAC;EAEvDT,SAAS,CAAC,MAAM;IACd,IAAI,CAACU,SAAS,EAAE;IAEhB,MAAME,QAAQ,GAAG,IAAIV,gBAAgB,CAACS,WAAW,CAAC;IAClD,MAAME,KAAK,GAAGD,QAAQ,CAACC,KAAK,CAAEC,KAAyB,IAAK;MAC1DR,aAAa,CAACQ,KAAK,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,MAAM;MACXD,KAAK,CAACE,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAAC,CAAC,CAAC;IAC9B,CAAC;EACH,CAAC,EAAE,CAACL,WAAW,EAAED,SAAS,CAAC,CAAC;EAE5B,OAAOL,UAAU;AACnB","ignoreList":[]}

package/dist/typescript/hooks/useSpeechDetection.d.ts

@@ -1,8 +0,0 @@
-import { type SoundDetectorState } from '@stream-io/video-client';
-/**
- * Hook that provides speech detection info using the RNSpeechDetector.
- *
- * @returns An object containing the current audio level (0 - 1) and whether sound is detected.
- */
-export declare function useSpeechDetection(): SoundDetectorState;
-//# sourceMappingURL=useSpeechDetection.d.ts.map

package/dist/typescript/hooks/useSpeechDetection.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useSpeechDetection.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSpeechDetection.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,kBAAkB,EAExB,MAAM,yBAAyB,CAAC;AAGjC;;;;GAIG;AACH,wBAAgB,kBAAkB,uBAsBjC"}

package/src/hooks/useSpeechDetection.ts

@@ -1,35 +0,0 @@
-import { useEffect, useState } from 'react';
-import {
-  type SoundDetectorState,
-  RNSpeechDetector,
-} from '@stream-io/video-client';
-import { useCallStateHooks } from '@stream-io/video-react-bindings';
-
-/**
- * Hook that provides speech detection info using the RNSpeechDetector.
- *
- * @returns An object containing the current audio level (0 - 1) and whether sound is detected.
- */
-export function useSpeechDetection() {
-  const [audioState, setAudioState] = useState<SoundDetectorState>({
-    isSoundDetected: false,
-    audioLevel: 0,
-  });
-  const { useMicrophoneState } = useCallStateHooks();
-  const { isEnabled, mediaStream } = useMicrophoneState();
-
-  useEffect(() => {
-    if (!isEnabled) return;
-
-    const detector = new RNSpeechDetector(mediaStream);
-    const start = detector.start((state: SoundDetectorState) => {
-      setAudioState(state);
-    });
-
-    return () => {
-      start.then((stop) => stop());
-    };
-  }, [mediaStream, isEnabled]);
-
-  return audioState;
-}