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

package/ios/TracksRecorder/RecorderVideoSink.swift

@@ -12,11 +12,21 @@ import WebRTC
 ///
 /// Each delivered `RTCVideoFrame` is normalised to a CVPixelBuffer in the
 /// hardware H.264 encoder's native format — **NV12**
-/// (`kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange`).
-/// `RTCCVPixelBuffer` sources (camera passthrough) are forwarded with
-/// the underlying pixel buffer unchanged. `RTCI420Buffer` and other YUV
-/// sources are converted into a fresh IOSurface-backed NV12 buffer via
-/// a plane reorder (no color-space conversion required).
+/// (`kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange`). One branch per
+/// buffer type `renderFrame` can be handed:
+///
+/// - `RTCCVPixelBuffer` (camera passthrough) already wraps a CVPixelBuffer,
+///   so the underlying buffer is forwarded unchanged.
+/// - `RTCNV12Buffer` already holds NV12 planes, but as raw pointers rather
+///   than a CVPixelBuffer, so the planes are copied row-wise into a fresh
+///   one. No format conversion. This is the buffer type decoded remote
+///   frames arrive as, so it is the hot path for loopback recording — do
+///   not remove it. Without it these frames fall through to `toI420()`
+///   below, which converts NV12 → I420 → NV12 and caps throughput at
+///   roughly half the source frame rate.
+/// - `RTCI420Buffer` (and anything else, via `toI420()`) is converted into
+///   a fresh IOSurface-backed NV12 buffer by interleaving the U and V
+///   planes — a plane reorder, no colour-space conversion.
 ///
 /// **Why NV12 and not BGRA?** AVAssetWriter's hardware encoder accepts
 /// both, but BGRA requires an internal colour-space conversion that
@@ -51,6 +61,8 @@ import WebRTC
         if let cvBuffer = frame.buffer as? RTCCVPixelBuffer {
             // Camera passthrough — already a CVPixelBuffer (typically NV12 on iOS).
             pixelBuffer = cvBuffer.pixelBuffer
+        } else if let nv12 = frame.buffer as? RTCNV12Buffer {
+            pixelBuffer = Self.makeNV12PixelBuffer(fromNV12: nv12)
         } else if let i420 = frame.buffer as? RTCI420Buffer {
             pixelBuffer = Self.makeNV12PixelBuffer(fromI420: i420)
         } else {
@@ -67,6 +79,81 @@ import WebRTC
         frameHandler(outputBuffer, frame.width, frame.height, frame.timeStampNs)
     }
 
+    private static func makeNV12PixelBuffer(fromNV12 nv12: RTCNV12Buffer) -> CVPixelBuffer? {
+        let width = Int(nv12.width)
+        let height = Int(nv12.height)
+        let chromaWidth = Int(nv12.chromaWidth)
+        let chromaHeight = Int(nv12.chromaHeight)
+
+        guard let buffer = makePixelBuffer(width: width, height: height) else { return nil }
+
+        CVPixelBufferLockBaseAddress(buffer, [])
+        defer { CVPixelBufferUnlockBaseAddress(buffer, []) }
+
+        guard let yDest = CVPixelBufferGetBaseAddressOfPlane(buffer, 0) else { return nil }
+        copyPlane(
+            source: UnsafeRawPointer(nv12.dataY),
+            sourceStride: Int(nv12.strideY),
+            destination: yDest,
+            destinationStride: CVPixelBufferGetBytesPerRowOfPlane(buffer, 0),
+            rowBytes: width,
+            rows: height
+        )
+
+        // Plane 1: UV — already interleaved, so two bytes per chroma sample.
+        guard let uvDest = CVPixelBufferGetBaseAddressOfPlane(buffer, 1) else { return nil }
+        copyPlane(
+            source: UnsafeRawPointer(nv12.dataUV),
+            sourceStride: Int(nv12.strideUV),
+            destination: uvDest,
+            destinationStride: CVPixelBufferGetBytesPerRowOfPlane(buffer, 1),
+            rowBytes: chromaWidth * 2,
+            rows: chromaHeight
+        )
+
+        return buffer
+    }
+
+    private static func makePixelBuffer(width: Int, height: Int) -> CVPixelBuffer? {
+        var pixelBuffer: CVPixelBuffer?
+        let attrs: [String: Any] = [
+            kCVPixelBufferIOSurfacePropertiesKey as String: [:] as [String: Any],
+        ]
+        let status = CVPixelBufferCreate(
+            kCFAllocatorDefault,
+            width,
+            height,
+            kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange,
+            attrs as CFDictionary,
+            &pixelBuffer
+        )
+        guard status == kCVReturnSuccess else { return nil }
+        return pixelBuffer
+    }
+
+    /// Row-wise copy, collapsing to a single `memcpy` when the strides match.
+    private static func copyPlane(
+        source: UnsafeRawPointer,
+        sourceStride: Int,
+        destination: UnsafeMutableRawPointer,
+        destinationStride: Int,
+        rowBytes: Int,
+        rows: Int
+    ) {
+        if sourceStride == destinationStride && sourceStride == rowBytes {
+            memcpy(destination, source, rowBytes * rows)
+            return
+        }
+        let copyBytes = min(rowBytes, min(sourceStride, destinationStride))
+        for row in 0..<rows {
+            memcpy(
+                destination.advanced(by: row * destinationStride),
+                source.advanced(by: row * sourceStride),
+                copyBytes
+            )
+        }
+    }
+
     // MARK: - I420 → NV12
 
     /// Allocates a fresh IOSurface-backed NV12 `CVPixelBuffer` and copies

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-react-native-sdk",
-  "version": "1.44.0",
+  "version": "1.45.0",
   "description": "Stream Video SDK for React Native",
   "author": "https://getstream.io",
   "homepage": "https://getstream.io/video/docs/react-native/",
@@ -52,8 +52,8 @@
     "!**/.*"
   ],
   "dependencies": {
-    "@stream-io/video-client": "1.58.0",
-    "@stream-io/video-react-bindings": "1.20.0",
+    "@stream-io/video-client": "1.59.0",
+    "@stream-io/video-react-bindings": "1.20.1",
     "intl-pluralrules": "2.0.1",
     "react-native-url-polyfill": "^3.0.0",
     "rxjs": "~7.8.2",
@@ -118,7 +118,7 @@
     "@react-native/jest-preset": "0.86.2",
     "@react-native/metro-config": "0.86.2",
     "@stream-io/noise-cancellation-react-native": "^0.11.0",
-    "@stream-io/react-native-callingx": "^0.10.0",
+    "@stream-io/react-native-callingx": "^0.11.0",
     "@stream-io/react-native-webrtc": "145.3.1",
     "@stream-io/typescript-config": "^0.0.0",
     "@stream-io/video-filters-react-native": "^0.16.0",

package/src/hooks/push/useCallingExpWithCallingStateEffect.ts

@@ -17,7 +17,7 @@ export const useCallingExpWithCallingStateEffect = () => {
     useCallStateHooks();
 
   const activeCall = useCall();
-  const { isMute, microphone } = useMicrophoneState();
+  const { optimisticStatus, microphone } = useMicrophoneState();
   const callMembers = useCallMembers();
   const participants = useParticipants();
 
@@ -30,7 +30,7 @@ export const useCallingExpWithCallingStateEffect = () => {
 
   const callDisplayName = useMemo(
     () =>
-      callCustomDisplayName ??
+      callCustomDisplayName ||
       getCallDisplayName(callMembers, participants, currentUserId),
     [callMembers, participants, currentUserId, callCustomDisplayName],
   );
@@ -135,8 +135,14 @@ export const useCallingExpWithCallingStateEffect = () => {
       return;
     }
 
-    callingx.setMutedCall(activeCallCid, isMute);
-  }, [activeCallCid, isMute]);
+    if (optimisticStatus === undefined) {
+      logger.debug(
+        `useCallingExpWithCallingStateEffect: mic status is not resolved yet, skipping mute sync for: ${activeCallCid}`,
+      );
+      return;
+    }
+    callingx.setMutedCall(activeCallCid, optimisticStatus === 'disabled');
+  }, [activeCallCid, optimisticStatus]);
 
   // Sync mute state from CallKit → app (only for system-initiated mute actions)
   useEffect(() => {
@@ -165,7 +171,8 @@ export const useCallingExpWithCallingStateEffect = () => {
           return;
         }
 
-        const isCurrentlyMuted = microphone.state.status === 'disabled';
+        const isCurrentlyMuted =
+          microphone.state.optimisticStatus === 'disabled';
         if (isCurrentlyMuted === muted) {
           logger.debug(
             `useCallingExpWithCallingStateEffect: Mic toggle is already in the desired state: ${muted} for call: ${activeCallCid}`,

package/src/hooks/useLoopbackRecording.ts

@@ -1,146 +1,71 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { NativeModules } from 'react-native';
-import { combineLatest } from 'rxjs';
 import {
-  Call,
   CallingState,
+  DEFAULT_LOOPBACK_RECORDING_DURATION_MS,
+  LOOPBACK_STREAMS_WAIT_TIMEOUT_MS,
+  clampLoopbackRecordingDuration,
+  getLoopbackStreams,
   videoLoggerSystem,
-  type StreamVideoParticipant,
+  waitForLoopbackStreams,
+  withLoopbackAudioEnabled,
+  type LoopbackStreams,
+  type LoopbackTracks,
 } from '@stream-io/video-client';
+
 import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
 
 /** @internal */
 const { StreamVideoReactNative } = NativeModules;
 
-// Upper bound on how long `startRecording` will wait for the SFU to
-// echo loopback tracks back via the Subscriber. Tuned generously since
-// this includes connection setup; consumers that want shorter feedback
-// should call `stopRecording` to cancel the wait early.
-const STREAMS_WAIT_TIMEOUT_MS = 10 * 1000;
-const DEFAULT_RECORDING_DURATION = 10 * 1000;
-const MIN_RECORDING_DURATION = 5 * 1000;
-const MAX_RECORDING_DURATION = 2 * 60 * 1000;
-
-type LoopbackStreams = {
-  loopbackVideoStream?: MediaStream;
-  loopbackAudioStream?: MediaStream;
-};
-
 export type LoopbackRecordingState = 'idle' | 'awaiting-streams' | 'recording';
 
-export type ResolvedStreams = {
-  audioTrack?: MediaStreamTrack;
-  videoTrack?: MediaStreamTrack;
-};
+export type ResolvedStreams = LoopbackTracks;
 
 export interface StartLoopbackRecordingOptions {
-  /**
-   * Whether to include the loopback video track in the recording.
-   * Defaults to `true`. Set to `false` for an audio-only recording.
-   * Audio is always recorded — there is no video-only mode.
-   */
+  /** Whether to include loopback video. Audio is always recorded. */
   includeVideo?: boolean;
-  /**
-   * Maximum recording duration in milliseconds, after which the
-   * recording auto-stops and finalises the file.
-   *
-   * Defaults to `10_000` (10 seconds). Clamped to
-   * `[5_000, 120_000]` (5 seconds — 2 minutes).
-   */
+  /** Maximum recording duration in milliseconds. */
   maxDurationMs?: number;
 }
 
 export interface UseLoopbackRecordingResult {
-  /**
-   * Start a recording. The hook waits internally for the SFU loopback
-   * streams to arrive on `localParticipant`, then begins recording.
-   *
-   * The returned promise resolves with the produced `file://` URI **at
-   * the recording's terminal moment** — whether that is the auto-stop
-   * timer expiring, an explicit `stopRecording` call, or a cleanup-
-   * driven stop on unmount/leave. Resolves with `null` if no file was
-   * produced (writer torn down before any buffer arrived, or
-   * `stopRecording` was called while still awaiting streams). Rejects
-   * on a fatal error, if a recording is already running, or if the
-   * stream-wait times out.
-   */
+  /** Starts recording and resolves with a `file://` URI. */
   startRecording: (
     options?: StartLoopbackRecordingOptions,
   ) => Promise<string | null>;
-  /**
-   * Signal an early termination. While `awaiting-streams` this aborts
-   * the wait and the pending `startRecording` resolves with `null`.
-   * While `recording` this signals native finalisation and resolves
-   * once it completes.
-   */
+  /** Stops the current recording or stream wait. */
   stopRecording: () => Promise<void>;
-  /**
-   * Recursively delete every file under the SDK's recordings directory.
-   */
+  /** Deletes all SDK recording files. */
   clearRecordings: () => Promise<void>;
-  /**
-   * List every `file://` URI in the SDK's recordings directory, sorted
-   * most-recent first. Returns an empty array if the directory doesn't
-   * exist yet.
-   */
+  /** Lists SDK recording file URIs. */
   getRecordings: () => Promise<string[]>;
-  /**
-   * Lifecycle phase of the recording, owned by the hook:
-   *  - `'idle'`: no recording in progress.
-   *  - `'awaiting-streams'`: `startRecording` was called but the SFU
-   *    has not yet echoed the loopback tracks back.
-   *  - `'recording'`: native pipeline is actively writing.
-   */
+  /** Lifecycle phase of the recording. */
   recordingState: LoopbackRecordingState;
-  /**
-   * The SFU loopback video stream on the local participant, when
-   * present. Identified by reference inequality against
-   * `call.camera.state.mediaStream`.
-   */
+  /** SFU-echoed video stream on the local participant. */
   loopbackVideoStream?: MediaStream;
-  /**
-   * The SFU loopback audio stream on the local participant, when
-   * present. Identified by reference inequality against
-   * `call.microphone.state.mediaStream`.
-   */
+  /** SFU-echoed audio stream on the local participant. */
   loopbackAudioStream?: MediaStream;
 }
 
-/**
- * Records the SFU loopback streams (audio + video) on the local participant
- * to a local MP4 file. Designed for the `allowOwnTracksLoopback` pre-call test mode:
- * the SFU echoes the caller's published tracks back through the Subscriber
- * peer connection. The hook identifies the loopback streams on the local
- * participant by reference inequality against
- * `call.camera.state.mediaStream` / `call.microphone.state.mediaStream` —
- * the canonical references to the local capture — and captures them.
- */
+/** Records SFU loopback streams to a local MP4 file. */
 export function useLoopbackRecording(): UseLoopbackRecordingResult {
   const call = useCall();
-  const {
-    useCallCallingState,
-    useParticipantCount,
-    useLocalParticipant,
-    useCameraState,
-    useMicrophoneState,
-  } = useCallStateHooks();
+  const { useCallCallingState, useParticipantCount, useLocalParticipant } =
+    useCallStateHooks();
   const callingState = useCallCallingState();
   const participantCount = useParticipantCount();
   const localParticipant = useLocalParticipant();
-  const { mediaStream: cameraStream } = useCameraState();
-  const { mediaStream: microphoneStream } = useMicrophoneState();
 
   const [recordingState, setRecordingState] =
     useState<LoopbackRecordingState>('idle');
   const recordingStateRef = useRef<LoopbackRecordingState>('idle');
   const isMountedRef = useRef(true);
-  // Used to abort the awaiting-streams wait on stop / leave / unmount.
   const awaitAbortRef = useRef<AbortController | null>(null);
 
   const loopbackStreams = useMemo<LoopbackStreams>(
-    () =>
-      getLoopbackStreamsFor(localParticipant, cameraStream, microphoneStream),
-    [localParticipant, cameraStream, microphoneStream],
+    () => getLoopbackStreams(call, localParticipant),
+    [call, localParticipant],
   );
 
   const updateState = useCallback((next: LoopbackRecordingState) => {
@@ -177,7 +102,7 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
   const startRecording = useCallback(
     async ({
       includeVideo = true,
-      maxDurationMs = DEFAULT_RECORDING_DURATION,
+      maxDurationMs = DEFAULT_LOOPBACK_RECORDING_DURATION_MS,
     }: StartLoopbackRecordingOptions = {}): Promise<string | null> => {
       if (!call) {
         return null;
@@ -200,12 +125,11 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
       awaitAbortRef.current = new AbortController();
       updateState('awaiting-streams');
 
-      let audioTrack: MediaStreamTrack | undefined;
       try {
         const streams = await waitForLoopbackStreams(call, {
           includeVideo,
           signal: awaitAbortRef.current.signal,
-          timeoutMs: STREAMS_WAIT_TIMEOUT_MS,
+          timeoutMs: LOOPBACK_STREAMS_WAIT_TIMEOUT_MS,
         });
 
         if (streams === null) {
@@ -215,38 +139,21 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
           return null;
         }
 
-        audioTrack = streams.audioTrack;
-        const videoTrackId = streams.videoTrack?.id;
-
-        // The loopback audio track lands disabled (the SDK default-mutes
-        // it to prevent echo). Enable it so the native recording
-        // pipeline receives PCM; `finally` returns it to muted.
-        if (audioTrack) {
-          audioTrack.enabled = true;
-        }
         updateState('recording');
 
-        const clampedDuration = Math.min(
-          MAX_RECORDING_DURATION,
-          Math.max(MIN_RECORDING_DURATION, maxDurationMs),
-        );
-
-        // Pre-size the native encoder to the publisher's max video
-        // publish-option dimension. Without this, the encoder locks to
-        // whatever the SFU happens to echo *first* and stays there for the
-        // rest of the recording even after the network improves and
-        // higher layers arrive.
         const publishMaxDim = call.getMaxVideoPublishDimension();
 
         try {
-          const uri: string | null =
-            await StreamVideoReactNative.startTrackRecording({
-              videoTrackId,
-              maxDurationMs: Math.round(clampedDuration),
-              targetWidth: publishMaxDim?.width,
-              targetHeight: publishMaxDim?.height,
-            });
-          return uri;
+          return await withLoopbackAudioEnabled(
+            streams,
+            (): Promise<string | null> =>
+              StreamVideoReactNative.startTrackRecording({
+                videoTrackId: streams.videoTrack?.id,
+                maxDurationMs: clampLoopbackRecordingDuration(maxDurationMs),
+                targetWidth: publishMaxDim?.width,
+                targetHeight: publishMaxDim?.height,
+              }),
+          );
         } catch (error) {
           videoLoggerSystem
             .getLogger('useLoopbackRecording')
@@ -254,9 +161,6 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
           throw new Error('failed to start recording');
         }
       } finally {
-        if (audioTrack) {
-          audioTrack.enabled = false;
-        }
         awaitAbortRef.current = null;
         updateState('idle');
       }
@@ -288,11 +192,6 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
     }
   }, []);
 
-  // Auto-stop on call leave / end. Aborts an awaiting-streams wait or
-  // signals native finalisation depending on which phase we're in.
-  // Without this, leaving the call mid-recording would leave native
-  // encoders mid-write while the SFU subscriber tracks end under their
-  // feet — undefined final file state.
   useEffect(() => {
     if (
       callingState === CallingState.LEFT ||
@@ -305,8 +204,6 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
     }
   }, [callingState, stopRecording]);
 
-  // Auto-stop if another participant joins. Loopback recording is a
-  // single-user pre-call test.
   useEffect(() => {
     if (recordingState !== 'idle' && participantCount > 1) {
       stopRecording().catch(() => {});
@@ -337,112 +234,3 @@ export function useLoopbackRecording(): UseLoopbackRecordingResult {
     loopbackAudioStream: loopbackStreams.loopbackAudioStream,
   };
 }
-
-function getLoopbackStreamsFor(
-  participant: StreamVideoParticipant | undefined,
-  cameraStream: MediaStream | undefined,
-  microphoneStream: MediaStream | undefined,
-): LoopbackStreams {
-  return {
-    loopbackVideoStream:
-      participant?.videoStream && participant.videoStream !== cameraStream
-        ? participant.videoStream
-        : undefined,
-    loopbackAudioStream:
-      participant?.audioStream && participant.audioStream !== microphoneStream
-        ? participant.audioStream
-        : undefined,
-  };
-}
-
-/**
- * Subscribe to `localParticipant$` and resolve once the requested loopback
- * streams are present on the participant. Aborts cleanly on `signal`
- * (resolves `null`) and rejects on timeout.
- */
-function waitForLoopbackStreams(
-  call: Call,
-  opts: { includeVideo: boolean; signal: AbortSignal; timeoutMs: number },
-): Promise<ResolvedStreams | null> {
-  return new Promise((resolve, reject) => {
-    const initial = getLoopbackStreams(
-      call.state.localParticipant,
-      call.camera.state.mediaStream,
-      call.microphone.state.mediaStream,
-      opts.includeVideo,
-    );
-    if (initial) {
-      resolve(initial);
-      return;
-    }
-
-    const cleanup = () => {
-      subscription.unsubscribe();
-      if (timeoutId !== undefined) {
-        clearTimeout(timeoutId);
-      }
-      opts.signal.removeEventListener('abort', onAbort);
-    };
-
-    const onAbort = () => {
-      cleanup();
-      resolve(null);
-    };
-
-    opts.signal.addEventListener('abort', onAbort);
-
-    const timeoutId = setTimeout(() => {
-      cleanup();
-      reject(
-        new Error(
-          'useLoopbackRecording: timed out waiting for loopback streams. ' +
-            'Ensure the call was joined with `allowOwnTracksLoopback: true` and ' +
-            'that the SFU is configured to echo self-sub tracks.',
-        ),
-      );
-    }, opts.timeoutMs);
-
-    const subscription = combineLatest([
-      call.state.localParticipant$,
-      call.camera.state.mediaStream$,
-      call.microphone.state.mediaStream$,
-    ]).subscribe(([participant, cameraStream, microphoneStream]) => {
-      const ready = getLoopbackStreams(
-        participant,
-        cameraStream,
-        microphoneStream,
-        opts.includeVideo,
-      );
-      if (ready) {
-        cleanup();
-        resolve(ready);
-      }
-    });
-  });
-}
-
-function getLoopbackStreams(
-  participant: StreamVideoParticipant | undefined,
-  cameraStream: MediaStream | undefined,
-  microphoneStream: MediaStream | undefined,
-  includeVideo: boolean,
-): ResolvedStreams | undefined {
-  if (!participant) return undefined;
-
-  const { loopbackAudioStream, loopbackVideoStream } = getLoopbackStreamsFor(
-    participant,
-    cameraStream,
-    microphoneStream,
-  );
-
-  const audioTrack = loopbackAudioStream?.getAudioTracks()[0];
-  const videoTrack = includeVideo
-    ? loopbackVideoStream?.getVideoTracks()[0]
-    : undefined;
-
-  if (!audioTrack || (includeVideo && !videoTrack)) {
-    return undefined;
-  }
-
-  return { audioTrack, videoTrack };
-}

package/src/utils/StreamVideoRN/index.ts

@@ -1,6 +1,7 @@
 import type { StreamVideoConfig } from './types';
 import pushLogoutCallbacks from '../internal/pushLogoutCallback';
 import { setupIosVoipPushEvents } from '../push/setupIosVoipPushEvents';
+import { setupAndroidPushEvents } from '../push/setupAndroidPushEvents';
 import { setupCallingExpEvents } from '../push/setupCallingExpEvents';
 import {
   extractCallingExpOptions,
@@ -133,6 +134,7 @@ export class StreamVideoRN {
 
     setupCallingExpEvents(pushConfig);
     setupIosVoipPushEvents(pushConfig);
+    setupAndroidPushEvents(pushConfig);
   }
 
   static getConfig() {

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

@@ -48,7 +48,7 @@ export function getCallDisplayName(
   if (names.length === 0) {
     names = [
       participants.find((participant) => participant.userId === currentUserId)
-        ?.name ?? 'Call',
+        ?.name || 'Call',
     ];
   }
 
@@ -57,7 +57,7 @@ export function getCallDisplayName(
 
 function getCallDisplayNameFromCall(call: Call): string {
   return (
-    call.state.custom?.display_name ??
+    call.state.custom?.display_name ||
     getCallDisplayName(
       call.state.members,
       call.state.participants,