@stream-io/video-react-native-sdk 1.30.5 → 1.31.1-beta.0

package/src/hooks/push/useCallingExpWithCallingStateEffect.ts

@@ -0,0 +1,189 @@
+import { Call, CallingState, videoLoggerSystem } from '@stream-io/video-client';
+import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
+import { useEffect, useMemo } from 'react';
+import { filter, take } from 'rxjs/operators';
+import { getCallDisplayName } from '../../utils/internal/callingx/callingx';
+import { getCallingxLibIfAvailable } from '../../utils/push/libs/callingx';
+
+const logger = videoLoggerSystem.getLogger('callingx');
+
+/**
+ * This hook is used to inform sync call state with CallKit/Telecom (i.e. start call, end call, mute/unmute call).
+ */
+export const useCallingExpWithCallingStateEffect = () => {
+  const { useMicrophoneState, useParticipants, useCallMembers } =
+    useCallStateHooks();
+
+  const activeCall = useCall();
+  const { isMute, microphone } = useMicrophoneState();
+  const callMembers = useCallMembers();
+  const participants = useParticipants();
+
+  const activeCallCid = activeCall?.cid;
+  const currentUserId = activeCall?.currentUserId;
+  const isIncoming =
+    (activeCall?.ringing && !activeCall?.isCreatedByMe) || false;
+
+  const callDisplayName = useMemo(
+    () => getCallDisplayName(callMembers, participants, currentUserId),
+    [callMembers, participants, currentUserId],
+  );
+
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCall) {
+      return;
+    }
+    // need to capture RINGING -> Joining -> Joined state change for the first time
+    // and inform callingx that the call is active
+    const shouldMakeCallActive = (call: Call): boolean => {
+      // only for outgoing calls or non-ringing ongoing calls in callingx
+      // Note: incoming calls are handled by callingx pending states instead
+      return (
+        (call.ringing && call.isCreatedByMe) ||
+        (!call.ringing && callingx.isOngoingCallsEnabled)
+      );
+    };
+    const subscription = activeCall.state.callingState$
+      .pipe(
+        filter(
+          (callingState) =>
+            shouldMakeCallActive(activeCall) &&
+            callingState === CallingState.JOINED &&
+            callingx.isCallTracked(activeCall.cid),
+        ),
+        take(1), // only need to capture the first joined state for outgoing calls
+        // then subscription completes and is automatically unsubscribed
+      )
+      .subscribe(() => {
+        callingx.setCurrentCallActive(activeCall.cid);
+      });
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, [activeCall]);
+
+  useEffect(() => {
+    return () => {
+      const callingx = getCallingxLibIfAvailable();
+      if (!callingx?.isSetup || !activeCallCid) {
+        return;
+      }
+
+      const isCallTracked = callingx.isCallTracked(activeCallCid);
+      if (!isCallTracked) {
+        logger.debug(
+          `useCallingExpWithCallingStateEffect:No active call cid to end in calling exp: ${activeCallCid} isCallTracked: ${isCallTracked}`,
+        );
+        return;
+      }
+      //if incoming stream call was unmounted, we need to end the call in CallKit/Telecom
+      logger.debug(
+        `useCallingExpWithCallingStateEffect: Ending call in callingx: ${activeCallCid}`,
+      );
+      callingx
+        .endCallWithReason(activeCallCid, 'local')
+        .catch((error: unknown) => {
+          logger.error(
+            `useCallingExpWithCallingStateEffect: Error ending call in callingx: ${activeCallCid}`,
+            error,
+          );
+        });
+    };
+  }, [activeCallCid]);
+
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCallCid) {
+      return;
+    }
+
+    const isCallTracked = callingx.isCallTracked(activeCallCid);
+    if (!isCallTracked) {
+      logger.debug(
+        `useCallingExpWithCallingStateEffect:No active call cid to update callingx: ${activeCallCid} isCallTracked: ${isCallTracked}`,
+      );
+      return;
+    }
+
+    callingx.updateDisplay(
+      activeCallCid,
+      activeCallCid,
+      callDisplayName,
+      isIncoming,
+    );
+  }, [activeCallCid, callDisplayName, isIncoming]);
+
+  // Sync microphone mute state from app → CallKit
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCallCid) {
+      return;
+    }
+
+    const isCallTracked = callingx.isCallTracked(activeCallCid);
+    if (!isCallTracked) {
+      logger.debug(
+        `useCallingExpWithCallingStateEffect: No active call cid to set muted in calling exp: ${activeCallCid} isCallTracked: ${isCallTracked}`,
+      );
+      return;
+    }
+
+    callingx.setMutedCall(activeCallCid, isMute);
+  }, [activeCallCid, isMute]);
+
+  // Sync mute state from CallKit → app (only for system-initiated mute actions)
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCallCid) {
+      logger.debug(
+        `useCallingExpWithCallingStateEffect: No active call cid to set muted in calling exp: ${activeCallCid} callingx isSetup: ${callingx?.isSetup}`,
+      );
+      return;
+    }
+
+    // Listen to mic toggle events from CallKit/Telecom and update stream call microphone state.
+    // Only system-initiated mute actions (e.g. user tapped mute on the native CallKit UI)
+    // are sent here — app-initiated actions are filtered out on the native side to prevent
+    // the feedback loop: app mutes mic → setMutedCall → CallKit delegate → event to JS → loop.
+    const subscription = callingx.addEventListener(
+      'didPerformSetMutedCallAction',
+      async (event: { callId: string; muted: boolean }) => {
+        const { callId, muted } = event;
+
+        const isCallTracked = callingx.isCallTracked(activeCallCid);
+        if (!isCallTracked || callId !== activeCallCid) {
+          logger.debug(
+            `useCallingExpWithCallingStateEffect: No active call cid to set muted in calling exp: ${activeCallCid} isCallTracked: ${isCallTracked} callId: ${callId}`,
+          );
+          return;
+        }
+
+        const isCurrentlyMuted = microphone.state.status === 'disabled';
+        if (isCurrentlyMuted === muted) {
+          logger.debug(
+            `useCallingExpWithCallingStateEffect: Mic toggle is already in the desired state: ${muted} for call: ${activeCallCid}`,
+          );
+          return;
+        }
+
+        try {
+          if (muted) {
+            await microphone.disable();
+          } else {
+            await microphone.enable();
+          }
+        } catch (error: unknown) {
+          logger.error(
+            `useCallingExpWithCallingStateEffect: Error toggling mic in calling exp: ${activeCallCid}`,
+            error,
+          );
+        }
+      },
+    );
+
+    return () => {
+      subscription.remove();
+    };
+  }, [activeCallCid, microphone]);
+};

package/src/hooks/push/useIosVoipPushEventsSetupEffect.ts

@@ -1,6 +1,4 @@
 import { type MutableRefObject, useEffect, useRef, useState } from 'react';
-import { getVoipPushNotificationLib } from '../../utils/push/libs';
-
 import { Platform } from 'react-native';
 import { StreamVideoRN } from '../../utils';
 import { onVoipNotificationReceived } from '../../utils/push/internal/ios';
@@ -10,6 +8,7 @@ import {
 } from '@stream-io/video-react-bindings';
 import { setPushLogoutCallback } from '../../utils/internal/pushLogoutCallback';
 import { StreamVideoClient, videoLoggerSystem } from '@stream-io/video-client';
+import { getCallingxLibIfAvailable } from '../../utils/push/libs';
 
 const logger = videoLoggerSystem.getLogger('useIosVoipPushEventsSetupEffect');
 
@@ -28,6 +27,7 @@ function setLogoutCallback(
     lastVoipTokenRef.current = { token: '', userId: '' };
     try {
       await client.removeDevice(token);
+      logger.debug('PushLogoutCallback - Removed voip token', token);
     } catch (err) {
       logger.warn('PushLogoutCallback - Failed to remove voip token', err);
     }
@@ -89,24 +89,12 @@ export const useIosVoipPushEventsSetupEffect = () => {
   useEffect(() => {
     const pushConfig = StreamVideoRN.getConfig().push;
     const pushProviderName = pushConfig?.ios.pushProviderName;
-    if (Platform.OS !== 'ios' || !client || !pushProviderName) {
-      return;
-    }
-    if (!pushConfig.android.incomingCallChannel) {
-      // TODO: remove this check and find a better way once we have telecom integration for android
-      logger.debug(
-        'android incomingCallChannel is not defined, so skipping the useIosVoipPushEventsSetupEffect',
-      );
+    const callingx = getCallingxLibIfAvailable();
+
+    if (Platform.OS !== 'ios' || !client || !pushProviderName || !callingx) {
       return;
     }
 
-    const voipPushNotification = getVoipPushNotificationLib();
-
-    // even though we do this natively, we have to still register here again
-    // natively this will make sure "register" event for JS is sent with the last push token
-    // Necessary if client changed before we got the event here or user logged out and logged in again
-    voipPushNotification.registerVoipToken();
-
     const onTokenReceived = (token: string) => {
       const userId = client.streamClient._user?.id ?? '';
       if (client.streamClient.anonymous || !token || !userId) {
@@ -145,24 +133,24 @@ export const useIosVoipPushEventsSetupEffect = () => {
         });
     };
     // fired when PushKit give us the latest token
-    voipPushNotification.addEventListener('register', (token) => {
-      onTokenReceived(token);
-    });
+    const voipRegisterListener = callingx.addEventListener(
+      'voipNotificationsRegistered',
+      ({ token }) => {
+        onTokenReceived(token);
+      },
+    );
 
-    // this will fire when there are events occured before js bridge initialized
-    voipPushNotification.addEventListener('didLoadWithEvents', (events) => {
-      if (!events || !Array.isArray(events) || events.length < 1) {
-        return;
-      }
-      for (const voipPushEvent of events) {
-        const { name, data } = voipPushEvent;
-        if (name === 'RNVoipPushRemoteNotificationsRegisteredEvent') {
-          onTokenReceived(data);
-        } else if (name === 'RNVoipPushRemoteNotificationReceivedEvent') {
-          onVoipNotificationReceived(data, pushConfig);
-        }
+    // this will return events that were fired before js bridge initialized
+    callingx.getInitialVoipEvents().forEach(({ eventName, params }) => {
+      if (eventName === 'voipNotificationsRegistered' && 'token' in params) {
+        onTokenReceived(params.token);
+      } else if (eventName === 'voipNotificationReceived') {
+        onVoipNotificationReceived(params, pushConfig);
       }
     });
+
+    callingx.registerVoipToken();
+
     lastListener.count += 1;
     const currentListenerCount = lastListener.count;
 
@@ -175,8 +163,7 @@ export const useIosVoipPushEventsSetupEffect = () => {
         return;
       }
       logger.debug(`Voip event listeners are removed for user: ${userId}`);
-      voipPushNotification.removeEventListener('didLoadWithEvents');
-      voipPushNotification.removeEventListener('register');
+      voipRegisterListener.remove();
     };
   }, [client]);
 };

package/src/hooks/useAndroidKeepCallAliveEffect.ts

@@ -5,76 +5,48 @@ import {
   AppState,
   type AppStateStatus,
   NativeModules,
+  PermissionsAndroid,
   Platform,
 } from 'react-native';
-import { Call, CallingState, videoLoggerSystem } from '@stream-io/video-client';
-import {
-  getKeepCallAliveForegroundServiceTypes,
-  getNotifeeLibNoThrowForKeepCallAlive,
-} from '../utils/push/libs/notifee';
+import { CallingState, videoLoggerSystem } from '@stream-io/video-client';
+import { keepCallAliveCallRef } from '../utils/keepCallAliveHeadlessTask';
+import { getNotifeeLibNoThrowForKeepCallAlive } from '../utils/push/libs/notifee';
+import { getCallingxLibIfAvailable } from '../utils/push/libs';
 
 const notifeeLib = getNotifeeLibNoThrowForKeepCallAlive();
-const callToPassToForegroundService: { current: Call | undefined } = {
-  current: undefined,
-};
 
-function setForegroundService() {
-  if (Platform.OS === 'ios' || !notifeeLib) return;
-  NativeModules.StreamVideoReactNative.isCallAliveConfigured().then(
-    (isConfigured: boolean) => {
-      if (!isConfigured) {
-        const logger = videoLoggerSystem.getLogger(
-          'setForegroundService method',
-        );
-        logger.info(
-          'KeepCallAlive is not configured. Skipping foreground service setup.',
-        );
-        return;
-      }
-      notifeeLib.default.registerForegroundService(() => {
-        const task = new Promise((resolve) => {
-          const logger = videoLoggerSystem.getLogger(
-            'setForegroundService method',
-          );
-          logger.info('Foreground service running for call in progress');
-          // any task to run from SDK in the foreground service must be added
-          resolve(true);
-        });
-        const videoConfig = StreamVideoRN.getConfig();
-        const foregroundServiceConfig = videoConfig.foregroundService;
-        const { taskToRun } = foregroundServiceConfig.android;
-        const call = callToPassToForegroundService.current;
-        if (!call) {
-          const logger = videoLoggerSystem.getLogger(
-            'setForegroundService method',
-          );
-          logger.warn('No call to pass to foreground service');
-          return task.then(() => new Promise(() => {}));
-        }
-        callToPassToForegroundService.current = undefined;
-        return task.then(() => taskToRun(call));
-      });
-    },
-  );
+async function stopForegroundServiceNoThrow() {
+  const logger = videoLoggerSystem.getLogger('stopForegroundServiceNoThrow');
+  try {
+    await NativeModules.StreamVideoReactNative.stopKeepCallAliveService();
+  } catch (e) {
+    logger.warn('Failed to stop keep-call-alive foreground service', e);
+  }
 }
 
 async function startForegroundService(call_cid: string) {
-  const isCallAliveConfigured =
-    await NativeModules.StreamVideoReactNative.isCallAliveConfigured();
+  const logger = videoLoggerSystem.getLogger('startForegroundService');
+  const isCallAliveConfigured = await (async () => {
+    try {
+      return await NativeModules.StreamVideoReactNative.isCallAliveConfigured();
+    } catch (e) {
+      logger.warn('Failed to check whether KeepCallAlive is configured', e);
+      return false;
+    }
+  })();
   if (!isCallAliveConfigured) {
-    const logger = videoLoggerSystem.getLogger('startForegroundService');
     logger.info(
       'KeepCallAlive is not configured. Skipping foreground service setup.',
     );
     return;
   }
-  // check for notification permission and then start the foreground service
-  if (!notifeeLib) return;
-  const settings = await notifeeLib.default.getNotificationSettings();
-  if (
-    settings.authorizationStatus !== notifeeLib.AuthorizationStatus.AUTHORIZED
-  ) {
-    const logger = videoLoggerSystem.getLogger('startForegroundService');
+  // Check for notification permission (Android 13+) before starting the service.
+  const hasPostNotificationsPermission =
+    Number(Platform.Version) < 33 ||
+    (await PermissionsAndroid.check(
+      PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS,
+    ));
+  if (!hasPostNotificationsPermission) {
     logger.info(
       'Notification permission not granted, can not start foreground service to keep the call alive',
     );
@@ -83,38 +55,28 @@ async function startForegroundService(call_cid: string) {
   const videoConfig = StreamVideoRN.getConfig();
   const foregroundServiceConfig = videoConfig.foregroundService;
   const notificationTexts = foregroundServiceConfig.android.notificationTexts;
-  const channelId = foregroundServiceConfig.android.channel.id;
-  await notifeeLib.default.createChannel(
-    foregroundServiceConfig.android.channel,
-  );
-  const foregroundServiceTypes = await getKeepCallAliveForegroundServiceTypes();
+  const channel = foregroundServiceConfig.android.channel;
+  const smallIconName = videoConfig.push?.android.smallIcon;
+
   // NOTE: we use requestAnimationFrame to ensure that the foreground service is started after all the current UI operations are done
   // this is a workaround for the crash - android.app.RemoteServiceException$ForegroundServiceDidNotStartInTimeException: Context.startForegroundService() did not then call Service.startForeground()
   // this crash was reproducible only in some android devices
-  requestAnimationFrame(() => {
-    notifeeLib.default.displayNotification({
-      id: call_cid,
-      title: notificationTexts.title,
-      body: notificationTexts.body,
-      android: {
-        channelId,
-        smallIcon: videoConfig.push?.android.smallIcon,
-        foregroundServiceTypes,
-        asForegroundService: true,
-        ongoing: true, // user cannot dismiss the notification
-        colorized: true,
-        pressAction: {
-          id: 'default',
-          launchActivity: 'default', // open the app when the notification is pressed
-        },
-      },
-    });
+  requestAnimationFrame(async () => {
+    try {
+      await NativeModules.StreamVideoReactNative.startKeepCallAliveService(
+        call_cid,
+        channel.id,
+        channel.name,
+        notificationTexts.title,
+        notificationTexts.body,
+        smallIconName ?? null,
+      );
+    } catch (e) {
+      logger.warn('Failed to start keep-call-alive foreground service', e);
+    }
   });
 }
 
-// flag to check if setForegroundService has already been run once
-let isSetForegroundServiceRan = false;
-
 /**
  * This hook is used to keep the call alive in the background for Android.
  * It starts a foreground service to keep the call alive as soon as the call is joined
@@ -125,7 +87,7 @@ export const useAndroidKeepCallAliveEffect = () => {
   const foregroundServiceStartedRef = useRef(false);
 
   const call = useCall();
-  callToPassToForegroundService.current = call;
+  keepCallAliveCallRef.current = call;
   const activeCallCid = call?.cid;
   const { useCallCallingState } = useCallStateHooks();
   const callingState = useCallCallingState();
@@ -133,6 +95,7 @@ export const useAndroidKeepCallAliveEffect = () => {
   const isOutgoingCall =
     callingState === CallingState.RINGING && call?.isCreatedByMe;
   const isCallJoined = callingState === CallingState.JOINED;
+  const isRingingCall = call?.ringing;
 
   const shouldStartForegroundService =
     !foregroundServiceStartedRef.current && (isOutgoingCall || isCallJoined);
@@ -141,7 +104,14 @@ export const useAndroidKeepCallAliveEffect = () => {
     if (Platform.OS === 'ios' || !activeCallCid) {
       return undefined;
     }
-    if (!notifeeLib) return undefined;
+
+    const callingx = getCallingxLibIfAvailable();
+    if (
+      callingx?.isSetup &&
+      (isRingingCall || (!isRingingCall && callingx?.isOngoingCallsEnabled))
+    ) {
+      return undefined;
+    }
 
     // start foreground service as soon as the call is joined
     if (shouldStartForegroundService) {
@@ -149,23 +119,21 @@ export const useAndroidKeepCallAliveEffect = () => {
         if (foregroundServiceStartedRef.current) {
           return;
         }
-        if (!isSetForegroundServiceRan) {
-          isSetForegroundServiceRan = true;
-          setForegroundService();
-        }
-        const notifee = notifeeLib.default;
-        const displayedNotifications =
-          await notifee.getDisplayedNotifications();
-        const activeCallNotification = displayedNotifications.find(
-          (notification) => notification.id === activeCallCid,
-        );
-        if (activeCallNotification) {
-          callToPassToForegroundService.current = undefined;
-          // this means that we have a incoming call notification shown as foreground service and we must stop it
-          notifee.stopForegroundService();
-          notifee.cancelDisplayedNotification(activeCallCid);
+        // Optional compatibility cleanup: if the app uses Notifee for ringing push,
+        // we might have an incoming call notification running as a foreground service.
+        if (notifeeLib) {
+          const notifee = notifeeLib.default;
+          const displayedNotifications =
+            await notifee.getDisplayedNotifications();
+          const activeCallNotification = displayedNotifications.find(
+            (notification) => notification.id === activeCallCid,
+          );
+          if (activeCallNotification) {
+            // this means that we have a incoming call notification shown as foreground service and we must stop it
+            notifee.stopForegroundService();
+            notifee.cancelDisplayedNotification(activeCallCid);
+          }
         }
-        // check for notification permission and then start the foreground service
 
         await startForegroundService(activeCallCid);
         foregroundServiceStartedRef.current = true;
@@ -174,7 +142,6 @@ export const useAndroidKeepCallAliveEffect = () => {
       // ensure that app is active before running the function
       if (AppState.currentState === 'active') {
         run();
-        return undefined;
       }
       const sub = AppState.addEventListener(
         'change',
@@ -192,42 +159,49 @@ export const useAndroidKeepCallAliveEffect = () => {
       return () => {
         // cancel any notifee displayed notification when the call has transitioned out of ringing
         // NOTE: cancels only the non fg service notifications
-        notifeeLib.default.cancelDisplayedNotification(activeCallCid);
+        if (notifeeLib) {
+          notifeeLib.default.cancelDisplayedNotification(activeCallCid);
+        }
       };
     } else if (
       callingState === CallingState.IDLE ||
       callingState === CallingState.LEFT
     ) {
       if (foregroundServiceStartedRef.current) {
-        callToPassToForegroundService.current = undefined;
+        keepCallAliveCallRef.current = undefined;
         // stop foreground service when the call is not active
-        notifeeLib.default.stopForegroundService();
+        stopForegroundServiceNoThrow();
         foregroundServiceStartedRef.current = false;
       } else {
-        notifeeLib.default
-          .getDisplayedNotifications()
-          .then((displayedNotifications) => {
-            const activeCallNotification = displayedNotifications.find(
-              (notification) => notification.id === activeCallCid,
-            );
-            if (activeCallNotification) {
-              callToPassToForegroundService.current = undefined;
-              // this means that we have a incoming call notification shown as foreground service and we must stop it
-              notifeeLib.default.stopForegroundService();
-            }
-          });
+        if (notifeeLib) {
+          notifeeLib.default
+            .getDisplayedNotifications()
+            .then((displayedNotifications) => {
+              const activeCallNotification = displayedNotifications.find(
+                (notification) => notification.id === activeCallCid,
+              );
+              if (activeCallNotification) {
+                // this means that we have a incoming call notification shown as foreground service and we must stop it
+                notifeeLib.default.stopForegroundService();
+              }
+            });
+        }
       }
     }
     return undefined;
-  }, [activeCallCid, callingState, shouldStartForegroundService]);
+  }, [
+    activeCallCid,
+    callingState,
+    shouldStartForegroundService,
+    isRingingCall,
+  ]);
 
   useEffect(() => {
     return () => {
       // stop foreground service when this effect is unmounted
       if (foregroundServiceStartedRef.current) {
-        if (!notifeeLib) return;
-        callToPassToForegroundService.current = undefined;
-        notifeeLib.default.stopForegroundService();
+        keepCallAliveCallRef.current = undefined;
+        stopForegroundServiceNoThrow();
         foregroundServiceStartedRef.current = false;
       }
     };