@stream-io/video-react-native-sdk 1.28.3 → 1.29.0-beta.1

package/src/hooks/push/useCallingExpWithCallingStateEffect.ts

@@ -0,0 +1,307 @@
+import { CallingState, videoLoggerSystem } from '@stream-io/video-client';
+import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
+import { useEffect, useMemo, useRef } from 'react';
+import { getCallDisplayName } from '../../utils/internal/callingx';
+import { getCallingxLibIfAvailable } from '../../utils/push/libs/callingx';
+
+const logger = videoLoggerSystem.getLogger(
+  'Callingx - useCallingExpWithCallingStateEffect',
+);
+
+//calling state methods are not exhaustive, so we need to add more methods to cover different cases
+const canActivateCall = (
+  prevState: CallingState | undefined,
+  currentState: CallingState | undefined,
+) => {
+  if (!prevState && !currentState) {
+    return false;
+  }
+
+  const isJoined = (state: CallingState | undefined) => {
+    if (!state) {
+      return false;
+    }
+
+    return state === CallingState.JOINING || state === CallingState.JOINED;
+  };
+
+  return !isJoined(prevState) && isJoined(currentState);
+};
+
+const canEndCall = (
+  prevState: CallingState | undefined,
+  currentState: CallingState | undefined,
+) => {
+  if (!prevState && !currentState) {
+    return false;
+  }
+
+  return (
+    (prevState === CallingState.JOINED ||
+      prevState === CallingState.JOINING ||
+      prevState === CallingState.RINGING ||
+      prevState === CallingState.RECONNECTING ||
+      prevState === CallingState.MIGRATING ||
+      prevState === CallingState.OFFLINE) &&
+    (currentState === CallingState.LEFT ||
+      currentState === CallingState.RECONNECTING_FAILED ||
+      currentState === CallingState.IDLE)
+  );
+};
+
+/**
+ * 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 {
+    useCallCallingState,
+    // useMicrophoneState,
+    useParticipants,
+    useCallMembers,
+  } = useCallStateHooks();
+
+  const activeCall = useCall();
+  const callingState = useCallCallingState();
+  // const { isMute, microphone } = useMicrophoneState();
+  const callMembers = useCallMembers();
+  const participants = useParticipants();
+
+  const prevState = useRef<CallingState | undefined>(undefined);
+
+  const activeCallCid = activeCall?.cid;
+  const isIncomingCall = activeCall?.ringing && !activeCall?.isCreatedByMe;
+  const isOutcomingCall = activeCall?.ringing && activeCall?.isCreatedByMe;
+  const currentUserId = activeCall?.currentUserId;
+  const isVideoCall = activeCall?.state.settings?.video?.enabled ?? false;
+
+  const callDisplayName = useMemo(
+    () => getCallDisplayName(callMembers, participants, currentUserId),
+    [callMembers, participants, currentUserId],
+  );
+
+  useEffect(() => {
+    return () => {
+      const callingx = getCallingxLibIfAvailable();
+      if (!callingx?.isSetup || !activeCallCid) {
+        return;
+      }
+
+      const isCallRegistered = callingx.isCallRegistered(activeCallCid);
+      if (!isCallRegistered) {
+        logger.debug(
+          `No active call cid to end in calling exp: ${activeCallCid} isCallRegistered: ${isCallRegistered}`,
+        );
+        return;
+      }
+      //if incoming stream call was unmounted, we need to end the call in CallKit/Telecom
+      logger.debug(`Ending call in callingx: ${activeCallCid}`);
+      callingx
+        .endCallWithReason(activeCallCid, 'local')
+        .catch((error: unknown) => {
+          logger.error(
+            `Error ending call in callingx: ${activeCallCid}`,
+            error,
+          );
+        });
+    };
+  }, [activeCallCid]);
+
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (
+      !callingx?.isSetup ||
+      !activeCallCid ||
+      prevState.current === callingState
+    ) {
+      return;
+    }
+
+    //tells if call is registered in CallKit/Telecom
+    const isCallRegistered = callingx.isCallRegistered(activeCallCid);
+    logger.debug(
+      `useEffect: ${activeCallCid} isCallRegistered: ${isCallRegistered} 
+      isIncomingCall: ${isIncomingCall} isOutcomingCall: ${isOutcomingCall} 
+      prevState: ${prevState.current}, currentState: ${callingState} 
+      isOngoingCallsEnabled: ${callingx.isOngoingCallsEnabled}`,
+    );
+
+    if (
+      isIncomingCall &&
+      isCallRegistered &&
+      canActivateCall(prevState.current, callingState)
+    ) {
+      logger.debug(`Should accept call in callingx: ${activeCallCid}`);
+      callingx.answerIncomingCall(activeCallCid).catch((error: unknown) => {
+        logger.error(
+          `Error answering call in callingx: ${activeCallCid}`,
+          error,
+        );
+      });
+    } else if (
+      (isOutcomingCall || callingx.isOngoingCallsEnabled) &&
+      isCallRegistered &&
+      canActivateCall(prevState.current, callingState)
+    ) {
+      logger.debug(`Should set call active in callingx: ${activeCallCid}`);
+      callingx.setCurrentCallActive(activeCallCid);
+    } else if (
+      isCallRegistered &&
+      canEndCall(prevState.current, callingState)
+    ) {
+      //in case call was registered as incoming and state changed to "not joined", we need to end the call and clear rxjs subject
+      logger.debug(`Should end call in callingx: ${activeCallCid}`);
+      //TODO: think about sending appropriate reason for end call
+      callingx
+        .endCallWithReason(activeCallCid, 'local')
+        .catch((error: unknown) => {
+          logger.error(
+            `Error ending call in callingx: ${activeCallCid}`,
+            error,
+          );
+        });
+    }
+
+    prevState.current = callingState;
+  }, [
+    activeCallCid,
+    callingState,
+    callDisplayName,
+    isIncomingCall,
+    isOutcomingCall,
+    isVideoCall,
+  ]);
+
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCallCid) {
+      return;
+    }
+
+    const isCallRegistered = callingx.isCallRegistered(activeCallCid);
+    if (!isCallRegistered) {
+      logger.debug(
+        `No active call cid to update callingx: ${activeCallCid} isCallRegistered: ${isCallRegistered}`,
+      );
+      return;
+    }
+
+    callingx.updateDisplay(activeCallCid, activeCallCid, callDisplayName);
+  }, [activeCallCid, callDisplayName]);
+
+  useEffect(() => {
+    const callingx = getCallingxLibIfAvailable();
+    if (!callingx?.isSetup || !activeCallCid || !isIncomingCall) {
+      return;
+    }
+
+    let isUnsubscribed = false;
+    const subscription = callingx.addEventListener(
+      'didDisplayIncomingCall',
+      (event: { callId: string }) => {
+        if (event.callId === activeCallCid) {
+          //we need to report the call as answered only if user accepts the call from the app UI and push notification was delivered after that
+          const _callingState = activeCall?.state.callingState;
+          const shouldSkip =
+            _callingState !== CallingState.JOINING &&
+            _callingState !== CallingState.JOINED &&
+            _callingState !== CallingState.RECONNECTING &&
+            _callingState !== CallingState.MIGRATING;
+          if (shouldSkip) {
+            return;
+          }
+
+          logger.debug(
+            `Reporting the incoming call as answered in callingx as already join() calledin the app: ${activeCallCid}`,
+          );
+          callingx
+            .answerIncomingCall(activeCallCid)
+            .catch((error: unknown) => {
+              logger.error(
+                `Error answering call in callingx: ${activeCallCid}`,
+                error,
+              );
+            })
+            .finally(() => {
+              subscription.remove();
+              isUnsubscribed = true;
+            });
+        }
+      },
+    );
+
+    return () => {
+      if (!isUnsubscribed) {
+        subscription.remove();
+      }
+    };
+  }, [activeCall, activeCallCid, isIncomingCall]);
+
+  // useEffect(() => {
+  //   const callingx = getCallingxLibIfAvailable();
+  //   if (!callingx?.isSetup || !activeCallCid) {
+  //     return;
+  //   }
+
+  //   const isCallRegistered = callingx.isCallRegistered(activeCallCid);
+  //   if (!isCallRegistered) {
+  //     logger.debug(
+  //       `No active call cid to set muted in calling exp: ${activeCallCid} isCallRegistered: ${isCallRegistered}`,
+  //     );
+  //     return;
+  //   }
+
+  //   callingx.setMutedCall(activeCallCid, isMute);
+  // }, [activeCallCid, isMute]);
+
+  // useEffect(() => {
+  //   const callingx = getCallingxLibIfAvailable();
+  //   if (!callingx?.isSetup || !activeCallCid) {
+  //     return;
+  //   }
+
+  //   const isCallRegistered = callingx.isCallRegistered(activeCallCid);
+  //   if (!isCallRegistered) {
+  //     logger.debug(
+  //       `No active call cid to set muted in calling exp: ${activeCallCid} isCallRegistered: ${isCallRegistered}`,
+  //     );
+  //     return;
+  //   }
+
+  //   //listen to mic toggle events from CallKit/Telecom and update stream call microphone state
+  //   const subscription = callingx.addEventListener(
+  //     'didPerformSetMutedCallAction',
+  //     async (event: { callId: string; muted: boolean }) => {
+  //       const { callId, muted } = event;
+
+  //       if (callId === activeCallCid) {
+  //         const isCurrentlyMuted =
+  //           RxUtils.getCurrentValue(microphone.state.status$) === 'disabled';
+  //         if (isCurrentlyMuted === muted) {
+  //           logger.debug(
+  //             `Mic toggle is already in the desired state: ${muted} for call: ${activeCallCid}`,
+  //           );
+  //           //this check prevents mic toggle when state change was initiated from client and not from CallKit/Telecom
+  //           return;
+  //         }
+
+  //         try {
+  //           if (muted) {
+  //             await microphone.disable();
+  //           } else {
+  //             await microphone.enable();
+  //           }
+  //         } catch (error: unknown) {
+  //           logger.error(
+  //             `Error toggling mic in calling exp: ${activeCallCid}`,
+  //             error,
+  //           );
+  //         }
+  //       }
+  //     },
+  //   );
+
+  //   return () => {
+  //     subscription.remove();
+  //   };
+  // }, [activeCallCid, microphone, isOutcomingCall, isIncomingCall]);
+};

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]);
 };