@stream-io/video-react-native-sdk 1.43.0 → 1.44.0

package/src/components/Participant/ParticipantView/VideoRenderer/TrackSubscriber.tsx

@@ -1,5 +1,4 @@
-import { forwardRef, useImperativeHandle, useEffect, useMemo } from 'react';
-import { LayoutChangeEvent } from 'react-native';
+import { useEffect } from 'react';
 import {
   Call,
   CallingState,
@@ -18,15 +17,17 @@ import {
   filter,
   map,
 } from 'rxjs';
-export type TrackSubscriberHandle = {
-  onLayoutUpdate: (event: LayoutChangeEvent) => void;
-};
 
 type TrackSubscriberProps = {
   participantSessionId: string;
   call: Call;
   trackType: VideoTrackType;
   isVisible: boolean;
+  /**
+   * The dimensions of the view rendering the track, owned by the parent so that
+   * the last reported layout survives a remount of this component.
+   */
+  dimensions$: BehaviorSubject<SfuModels.VideoDimension | undefined>;
 };
 
 /**
@@ -40,81 +41,61 @@ type TrackSubscriberProps = {
  * 1. When the participant stops publishing the video track
  * 2. When the participant becomes invisible
 */
-const TrackSubscriber = forwardRef<TrackSubscriberHandle, TrackSubscriberProps>(
-  (props, ref) => {
-    const { call, participantSessionId, trackType, isVisible } = props;
-    const dimensions$ = useMemo(() => {
-      return new BehaviorSubject<SfuModels.VideoDimension | undefined>(
-        undefined,
-      );
-    }, []);
-
-    useEffect(() => {
-      const requestTrackWithDimensions = (
-        debounceType: DebounceType,
-        dimension: SfuModels.VideoDimension | undefined,
-      ) => {
-        if (dimension && (dimension.width === 0 || dimension.height === 0)) {
-          // ignore 0x0 dimensions. this can happen when the video element
-          // is not visible (e.g., has display: none).
-          // we treat this as "unsubscription" as we don't want to keep
-          // consuming bandwidth for a video that is not visible on the screen.
-          dimension = undefined;
-        }
-        call.state.updateParticipantTracks(trackType, {
-          [participantSessionId]: { dimension },
-        });
-        call.trackSubscriptionManager.apply(debounceType);
-      };
-      const isPublishingTrack$ = call.state.participants$.pipe(
-        map((ps) => ps.find((p) => p.sessionId === participantSessionId)),
-        filter((p): p is StreamVideoParticipant => !!p),
-        distinctUntilKeyChanged('publishedTracks'),
-        map((p) =>
-          trackType === 'videoTrack' ? hasVideo(p) : hasScreenShare(p),
-        ),
-        distinctUntilChanged(),
-      );
-      const isJoinedState$ = call.state.callingState$.pipe(
-        map((callingState) => callingState === CallingState.JOINED),
-      );
+const TrackSubscriber = (props: TrackSubscriberProps) => {
+  const { call, participantSessionId, trackType, isVisible, dimensions$ } =
+    props;
 
-      const subscription = combineLatest([
-        dimensions$,
-        isPublishingTrack$,
-        isJoinedState$,
-      ]).subscribe(([dimension, isPublishing, isJoined]) => {
-        if (isJoined) {
-          if (!isVisible || !isPublishing) {
-            requestTrackWithDimensions(DebounceType.MEDIUM, undefined);
-          } else if (dimension) {
-            requestTrackWithDimensions(DebounceType.IMMEDIATE, dimension);
-          }
-        }
+  useEffect(() => {
+    const requestTrackWithDimensions = (
+      debounceType: DebounceType,
+      dimension: SfuModels.VideoDimension | undefined,
+    ) => {
+      if (dimension && (dimension.width === 0 || dimension.height === 0)) {
+        // ignore 0x0 dimensions. this can happen when the video element
+        // is not visible (e.g., has display: none).
+        // we treat this as "unsubscription" as we don't want to keep
+        // consuming bandwidth for a video that is not visible on the screen.
+        dimension = undefined;
+      }
+      call.state.updateParticipantTracks(trackType, {
+        [participantSessionId]: { dimension },
       });
+      call.trackSubscriptionManager.apply(debounceType);
+    };
+    const isPublishingTrack$ = call.state.participants$.pipe(
+      map((ps) => ps.find((p) => p.sessionId === participantSessionId)),
+      filter((p): p is StreamVideoParticipant => !!p),
+      distinctUntilKeyChanged('publishedTracks'),
+      map((p) =>
+        trackType === 'videoTrack' ? hasVideo(p) : hasScreenShare(p),
+      ),
+      distinctUntilChanged(),
+    );
+    const isJoinedState$ = call.state.callingState$.pipe(
+      map((callingState) => callingState === CallingState.JOINED),
+    );
 
-      return () => {
-        subscription.unsubscribe();
-      };
-    }, [call, participantSessionId, trackType, isVisible, dimensions$]);
+    const subscription = combineLatest([
+      dimensions$,
+      isPublishingTrack$,
+      isJoinedState$,
+    ]).subscribe(([dimension, isPublishing, isJoined]) => {
+      if (isJoined) {
+        if (!isVisible || !isPublishing) {
+          requestTrackWithDimensions(DebounceType.MEDIUM, undefined);
+        } else if (dimension) {
+          requestTrackWithDimensions(DebounceType.IMMEDIATE, dimension);
+        }
+      }
+    });
 
-    useImperativeHandle(
-      ref,
-      () => ({
-        onLayoutUpdate: (event) => {
-          const dimension = {
-            width: Math.trunc(event.nativeEvent.layout.width),
-            height: Math.trunc(event.nativeEvent.layout.height),
-          };
-          dimensions$.next(dimension);
-        },
-      }),
-      [dimensions$],
-    );
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, [call, participantSessionId, trackType, isVisible, dimensions$]);
 
-    return null;
-  },
-);
+  return null;
+};
 
 TrackSubscriber.displayName = 'TrackSubscriber';
 

package/src/components/Participant/ParticipantView/VideoRenderer/index.tsx

@@ -1,5 +1,5 @@
-import React, { useEffect, useRef } from 'react';
-import { Platform, StyleSheet, View } from 'react-native';
+import React, { useEffect, useMemo, useRef } from 'react';
+import { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native';
 import type { MediaStream } from '@stream-io/react-native-webrtc';
 import { RTCView } from '@stream-io/react-native-webrtc';
 import type { ParticipantViewProps } from '../ParticipantView';
@@ -7,15 +7,17 @@ import {
   hasPausedTrack,
   hasScreenShare,
   hasVideo,
+  SfuModels,
   type VideoTrackType,
   VisibilityState,
 } from '@stream-io/video-client';
 import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
+import { BehaviorSubject } from 'rxjs';
 import { ParticipantVideoFallback as DefaultParticipantVideoFallback } from '../ParticipantVideoFallback';
 import { useTheme } from '../../../../contexts/ThemeContext';
 import { useTrackDimensions } from '../../../../hooks/useTrackDimensions';
 import { useScreenshotIosContext } from '../../../../contexts/internal/ScreenshotIosContext';
-import TrackSubscriber, { TrackSubscriberHandle } from './TrackSubscriber';
+import TrackSubscriber from './TrackSubscriber';
 
 const DEFAULT_VIEWPORT_VISIBILITY_STATE: Record<
   VideoTrackType,
@@ -59,7 +61,13 @@ export const VideoRenderer = React.memo(
     } = useTheme();
     const call = useCall();
     const { useCameraState, useIncomingVideoSettings } = useCallStateHooks();
-    const trackSubscriberRef = useRef<TrackSubscriberHandle>(null);
+    // a sticky note of the dimensions of the RTCView from onLayout
+    // to reuse for a new participant even if dimensions dont change
+    const dimensions$ = useMemo(
+      () =>
+        new BehaviorSubject<SfuModels.VideoDimension | undefined>(undefined),
+      [],
+    );
     const { isParticipantVideoEnabled } = useIncomingVideoSettings();
     const { direction } = useCameraState();
     const viewRef = useRef(null);
@@ -199,9 +207,12 @@ export const VideoRenderer = React.memo(
     ]);
 
     const onLayout: React.ComponentProps<typeof RTCView>['onLayout'] = (
-      event,
+      event: LayoutChangeEvent,
     ) => {
-      trackSubscriberRef.current?.onLayoutUpdate(event);
+      dimensions$.next({
+        width: Math.trunc(event.nativeEvent.layout.width),
+        height: Math.trunc(event.nativeEvent.layout.height),
+      });
     };
 
     return (
@@ -211,11 +222,11 @@ export const VideoRenderer = React.memo(
       >
         {call && !isLocalParticipant && (
           <TrackSubscriber
-            ref={trackSubscriberRef}
             call={call}
             participantSessionId={sessionId}
             trackType={trackType}
             isVisible={isVisible}
+            dimensions$={dimensions$}
           />
         )}
         {canShowVideo &&

package/src/modules/call-manager/CallManager.ts

@@ -9,8 +9,8 @@ import type {
   AudioEndpoint as CallingxAudioEndpoint,
   AudioEndpointsSnapshot as CallingxAudioSnapshot,
 } from '@stream-io/react-native-callingx';
-import { getCallingxLibIfAvailable } from '../../utils/push/libs/callingx';
 import { videoLoggerSystem } from '@stream-io/video-client';
+import { getCallingxLibIfAvailable } from '../../utils/push/libs';
 
 const NativeManager = NativeModules.StreamInCallManager;
 const CallingxModule = getCallingxLibIfAvailable();
@@ -296,26 +296,32 @@ class SpeakerManager {
   };
 }
 
-const shouldBypassForCallKit = (): boolean => {
-  if (Platform.OS !== 'ios') {
-    return false;
-  }
-  if (!CallingxModule) {
-    return false;
-  }
-  return (
-    CallingxModule.isSetup &&
-    (CallingxModule.hasRegisteredCall() || CallingxModule.isOngoingCallsEnabled)
-  );
-};
-
 export class CallManager {
   audioDevices = new AudioDevicesManager();
   ios = new IOSCallManager();
   speaker = new SpeakerManager();
 
   /**
-   * Starts the in call manager.
+   * The audio config recorded via {@link start}. The SDK's internal call manager reads it at the
+   * next join-time start and applies it before the native audio manager is activated.
+   */
+  private storedConfig?: StreamInCallManagerConfig;
+
+  /**
+   * The config recorded via {@link start}.
+   *
+   * @internal Read by the SDK's internal call manager at join; not intended for app use.
+   */
+  getStoredConfig = (): StreamInCallManagerConfig | undefined =>
+    this.storedConfig;
+
+  /**
+   * Records the desired audio config for the call.
+   *
+   * This does NOT start the native audio manager — the SDK owns native start/stop and applies this
+   * config at the next join-time start (before the audio manager is activated). Call it **before**
+   * joining. Calling it mid-call only updates the stored config; it does not change the running
+   * call's audio, and the new config takes effect on the next call/rejoin.
    *
    * @param config.audioRole The audio role to set. It can be one of the following:
    * - `'communicator'`: (Default) For use cases like video or voice calls.
@@ -325,80 +331,43 @@ export class CallManager {
    * It prioritizes high-quality stereo audio streaming.
    * Audio routing is controlled by the OS, and manual switching is not supported.
    *
-   * @param config.deviceEndpointType The default audio device endpoint type to set. It can be one of the following:
-   * - `'speaker'`: (Default) For normal video or voice calls.
+   * @param config.deviceEndpointType Overrides the default audio device endpoint. When omitted,
+   * the SDK uses the device derived from the call settings. It can be one of the following:
+   * - `'speaker'`: For normal video or voice calls.
    * - `'earpiece'`: For voice-only mobile call type scenarios.
-   *
-   * @param config.enableStereoAudioOutput Whether to enable stereo audio output. Only supported for listener audio role.
    */
   start = (config?: StreamInCallManagerConfig): void => {
-    if (shouldBypassForCallKit()) {
-      if (config?.audioRole === 'communicator' && CallingxModule) {
-        const type = config.deviceEndpointType ?? 'speaker';
-        safeNativeCall('setDefaultAudioDeviceEndpointType (callingx)', () =>
-          CallingxModule.setDefaultAudioDeviceEndpointType(type),
-        );
-        safeNativeCall('setDefaultAudioDeviceEndpointType', () =>
-          NativeManager.setDefaultAudioDeviceEndpointType(type),
-        );
-      }
-      videoLoggerSystem
-        .getLogger('CallManager')
-        .debug(
-          'start: skipping start as callkit is handling the audio session',
-        );
-      return;
-    }
-    if (isAndroidTelecomManaged()) {
-      // Telecom owns routing/focus; forward the sticky preference to callingx and run in
-      // telecom-managed mode (StreamInCallManager keeps proximity/keep-screen-on only).
-      if (config?.audioRole !== 'listener' && CallingxModule) {
-        safeNativeCall('setDefaultAudioDeviceEndpointType (callingx)', () =>
-          CallingxModule.setDefaultAudioDeviceEndpointType(
-            config?.deviceEndpointType ?? 'speaker',
-          ),
-        );
-      }
-      NativeManager.setTelecomManagedMode(true);
-      NativeManager.setAudioRole(config?.audioRole ?? 'communicator');
-      NativeManager.start();
-      return;
-    }
-    if (Platform.OS === 'android') {
-      NativeManager.setTelecomManagedMode(false);
-    }
-    NativeManager.setAudioRole(config?.audioRole ?? 'communicator');
-    if (config?.audioRole === 'communicator') {
-      const type = config.deviceEndpointType ?? 'speaker';
-      NativeManager.setDefaultAudioDeviceEndpointType(type);
-    }
-    if (config?.audioRole === 'listener' && config.enableStereoAudioOutput) {
-      NativeManager.setEnableStereoAudioOutput(true);
-    }
-    NativeManager.start();
+    this.storedConfig = config;
+    videoLoggerSystem
+      .getLogger('CallManager')
+      .debug('start: stored call manager config', { config });
   };
 
   /**
-   * Stops the in call manager.
+   * Clears the stored audio config.
    */
   stop = (): void => {
-    if (shouldBypassForCallKit()) {
-      videoLoggerSystem
-        .getLogger('CallManager')
-        .debug('stop: skipping stop as callkit is handling the audio session');
-      return;
-    }
-    NativeManager.stop();
+    this.storedConfig = undefined;
+    videoLoggerSystem
+      .getLogger('CallManager')
+      .debug('[public] stop(): cleared stored config');
   };
 
   /**
    * For debugging purposes, will emit a log event with the current audio state.
    * in the native layer.
+   *
+   * NOTE: This method might be called outside of the call JOIN/LEFT window,
+   * so it may lead to default peer connection factory and adm being created.
    */
   logAudioState = (): void => NativeManager.logAudioState();
 
   /**
    * For debugging purposes, returns the current audio state as a string.
+   *
+   * NOTE: This method might be called outside of the call JOIN/LEFT window,
+   * so it may lead to default peer connection factory and adm being created.
+   *
    * @returns A string containing the current audio state information.
    */
   getAudioStateLog = (): string => NativeManager.getAudioStateLog();

package/src/modules/call-manager/native-module.d.ts

@@ -92,6 +92,19 @@ export interface CallManager extends NativeModule {
    */
   setEnableStereoAudioOutput: (enable: boolean) => void;
 
+  /**
+   * Sets the microphone mute mode on the call's ADM. No-ops when no call ADM is active. iOS-only.
+   * @param mode - The `AudioEngineMuteMode` value.
+   */
+  setMuteMode: (mode: number) => void;
+
+  /**
+   * Keeps the recording chain prepared while muted so the engine stays
+   * full-duplex. No-ops when no call ADM is active. iOS-only.
+   * @param enabled - Whether to keep recording always prepared.
+   */
+  setRecordingAlwaysPreparedMode: (enabled: boolean) => void;
+
   /**
    * Log the current audio state natively.
    * Meant for debugging purposes.

package/src/modules/call-manager/types.ts

@@ -56,5 +56,4 @@ export type StreamInCallManagerConfig =
     }
   | {
       audioRole: 'listener';
-      enableStereoAudioOutput?: boolean;
     };

package/src/utils/StreamVideoRN/types.ts

@@ -26,6 +26,9 @@ export type StreamVideoConfig = {
    * @default undefined
    */
   push?: {
+    /**
+     * @deprecated Expo is auto-detected; this value is ignored and the property will be removed in a future major version.
+     */
     isExpo?: boolean;
     /**
      * The publish options to be used when joining a call from a push notification.

package/src/utils/internal/callingx/callingx.ts

@@ -2,7 +2,7 @@
  * Internal utils for callingx library usage from video-client.
  * See @./registerSDKGlobals.ts for more usage details.
  */
-import { NativeModules, Platform } from 'react-native';
+import { Platform } from 'react-native';
 import type { EndCallReason } from '@stream-io/react-native-callingx';
 import { getCallingxLibIfAvailable } from '../../push/libs/callingx';
 import type {
@@ -14,46 +14,6 @@ import { CallingState, videoLoggerSystem } from '@stream-io/video-client';
 
 const CallingxModule = getCallingxLibIfAvailable();
 
-/**
- * Fallback when Telecom registration fails/times out on Android: no component would own audio
- * (Telecom never took over), so re-establish StreamInCallManager in its classic (non-telecom)
- * mode to keep the call audible.
- */
-function recoverAudioToClassicMode() {
-  if (Platform.OS !== 'android') {
-    return;
-  }
-  if (!CallingxModule?.isSetup || !CallingxModule.isTelecomBacked) {
-    return;
-  }
-  // If a call is already registered, Telecom owns audio for it (the registration
-  // partially succeeded). Switching to classic mode here would fight Telecom's
-  // routing/focus — leave ownership intact.
-  if (CallingxModule.hasRegisteredCall()) {
-    videoLoggerSystem
-      .getLogger('callingx')
-      .debug(
-        'recoverAudioToClassicMode: Telecom already owns a registered call; skipping classic fallback',
-      );
-    return;
-  }
-  const StreamInCallManagerNativeModule = NativeModules.StreamInCallManager;
-  if (!StreamInCallManagerNativeModule) {
-    return;
-  }
-  const logger = videoLoggerSystem.getLogger('callingx');
-  logger.warn(
-    'Telecom registration failed; falling back to classic StreamInCallManager audio',
-  );
-  try {
-    StreamInCallManagerNativeModule.stop();
-    StreamInCallManagerNativeModule.setTelecomManagedMode(false);
-    StreamInCallManagerNativeModule.start();
-  } catch (error) {
-    logger.error('recoverAudioToClassicMode: failed to recover audio', error);
-  }
-}
-
 /**
  * Gets the call display name. To be used for display in native call screen.
  */
@@ -136,7 +96,6 @@ export async function registerOutgoingCall(call: Call) {
       `registerOutgoingCall: Error registering outgoing call in callingx: ${call.cid}`,
       error,
     );
-    recoverAudioToClassicMode();
   }
 }
 
@@ -183,7 +142,6 @@ export async function joinCallingxCall(call: Call, activeCalls: Call[]) {
         `startCallingxCall: Error starting call in callingx: ${call.cid}`,
         error,
       );
-      recoverAudioToClassicMode();
     }
   } else if (isIncomingCall) {
     logger.debug(`joinCallingxCall: Joining incoming call ${call.cid}`);
@@ -221,7 +179,6 @@ export async function joinCallingxCall(call: Call, activeCalls: Call[]) {
         `Error joining incoming call in callingx: ${call.cid}`,
         error,
       );
-      recoverAudioToClassicMode();
     }
   }
 }
@@ -246,3 +203,37 @@ export async function endCallingxCall(call: Call, reason?: EndCallReason) {
     );
   }
 }
+
+export async function wireAudioEngineSubscription() {
+  if (!CallingxModule || !CallingxModule.isSetup || Platform.OS !== 'ios') {
+    return;
+  }
+  const logger = videoLoggerSystem.getLogger('callingx');
+
+  try {
+    logger.debug('wireEngineSubscription: Wiring engine subscription');
+    CallingxModule.wireAudioEngineSubscription();
+  } catch (error) {
+    logger.error(
+      'wireAudioEngineSubscription: Error wiring engine subscription',
+      error,
+    );
+  }
+}
+
+export function unwireAudioEngineSubscription() {
+  if (!CallingxModule || !CallingxModule.isSetup || Platform.OS !== 'ios') {
+    return;
+  }
+  const logger = videoLoggerSystem.getLogger('callingx');
+
+  try {
+    logger.debug('unwireEngineSubscription: Cancelling engine subscription');
+    CallingxModule.unwireAudioEngineSubscription();
+  } catch (error) {
+    logger.error(
+      'unwireAudioEngineSubscription: Error cancelling engine subscription',
+      error,
+    );
+  }
+}

package/src/utils/internal/registerMediaEngine.ts

@@ -0,0 +1,42 @@
+import {
+  type CallMediaEngine,
+  setCallMediaEngineProvider,
+  videoLoggerSystem,
+} from '@stream-io/video-client';
+import { CallFactory } from '@stream-io/react-native-webrtc';
+import { callManager } from '../../modules/call-manager';
+
+const logger = videoLoggerSystem.getLogger('CallMediaEngine');
+
+/**
+ * Registers the React Native {@link CallMediaEngine} provider.
+ *
+ * Once registered, every `Call.ensureMediaFactory()` builds the call's native
+ * `PeerConnectionFactory` (with the call's audio configuration) and sets it as
+ * the single live factory. The WebRTC globals (`getUserMedia`/`getDisplayMedia`/
+ * `new RTCPeerConnection`) then resolve to it, so the call's tracks and peer
+ * connections are created with — and torn down with — that one native factory,
+ * which is what lets the call own its AudioDeviceModule. The engine itself only
+ * manages the factory lifecycle (`dispose` at leave).
+ *
+ * @internal
+ */
+export function registerCallMediaEngine() {
+  setCallMediaEngineProvider(async (): Promise<CallMediaEngine> => {
+    const config = callManager.getStoredConfig();
+    const bypassVoiceProcessing = config?.audioRole === 'listener';
+    const factory = await CallFactory.create({
+      bypassVoiceProcessing,
+    });
+    logger.debug(
+      `Created per-call factory (bypassVoiceProcessing=${bypassVoiceProcessing})`,
+    );
+
+    return {
+      dispose: async () => {
+        logger.debug('Disposing per-call factory');
+        return await factory.dispose();
+      },
+    };
+  });
+}