@ethora/chat-component-rn 26.10.7 → 26.10.8

package/src/components/VideoCalls/useCallKeep.ts

@@ -4,10 +4,16 @@ import { useDispatch, useSelector } from 'react-redux';
 import { RootState, store } from '../../roomStore';
 import { acceptIncomingCall, declineIncomingCall } from '../../roomStore/callSlice';
 import { sendCallStateSignal } from '../../networking/callTokenStanza';
-import { terminateActiveCall } from './callActions';
+import { declineActiveCallWhenOnline, terminateActiveCall } from './callActions';
 import { setCallMicEnabled, useCallSession } from './callSessionController';
 import { loadLiveKit } from './livekitRuntime';
 import { setCallSystemRinging } from './callUiStore';
+import {
+  callKitUuid,
+  loadCallKeep,
+  rememberSystemCallAction,
+  takeSystemCallAction,
+} from './systemCall';
 
 /**
  * Native incoming-call UI (Android ConnectionService / iOS CallKit) via
@@ -27,95 +33,15 @@ import { setCallSystemRinging } from './callUiStore';
  * Platform reality, stated plainly:
  *  - Android: full value. A ConnectionService call shows the system
  *    incoming-call screen over the lock screen.
- *  - iOS: this only fires while the app is running. A CallKit screen from
- *    a killed app requires a VoIP push over PushKit, which needs a
- *    separate Apple VoIP certificate and a separate send path on the
- *    backend (not FCM). Until that exists, iOS falls back to the regular
- *    data push and the in-app ring screen.
+ *  - iOS: this hook only runs while `<Chat>` is mounted. A CallKit screen
+ *    from a killed app comes from the host: its PushKit handler reports
+ *    the VoIP push to CallKit natively under `callKitUuid(callId)` and
+ *    hands the payload to `handlePushPayload`. This hook then adopts that
+ *    call (same UUID, CallKit answers "CallUUIDAlreadyExists" to our own
+ *    report) and replays what the user did on it before JS was up.
  */
 
-interface CallKeepModule {
-  setup: (options: any) => Promise<void>;
-  displayIncomingCall: (
-    uuid: string,
-    handle: string,
-    localizedCallerName?: string,
-    handleType?: string,
-    hasVideo?: boolean
-  ) => void;
-  endCall: (uuid: string) => void;
-  endAllCalls: () => void;
-  startCall?: (
-    uuid: string,
-    handle: string,
-    contactIdentifier?: string,
-    handleType?: string,
-    hasVideo?: boolean
-  ) => void;
-  answerIncomingCall?: (uuid: string) => void;
-  reportConnectingOutgoingCallWithUUID?: (uuid: string) => void;
-  reportConnectedOutgoingCallWithUUID?: (uuid: string) => void;
-  reportEndCallWithUUID?: (uuid: string, reason: number) => void;
-  setMutedCall?: (uuid: string, muted: boolean) => void;
-  addEventListener: (event: string, handler: (payload: any) => void) => void;
-  removeEventListener: (event: string) => void;
-  setAvailable?: (available: boolean) => void;
-  backToForeground?: () => void;
-}
-
-let cachedCallKeep: CallKeepModule | null | undefined;
-
-export const loadCallKeep = (): CallKeepModule | null => {
-  if (cachedCallKeep !== undefined) {
-    return cachedCallKeep;
-  }
-  try {
-    // The JS package being installed does NOT mean the native side is
-    // linked: a host can `npm i react-native-callkeep` and skip
-    // `pod install`, or (very common in this repo) node_modules can carry
-    // it over from another branch whose build did link it. In that state
-    // requiring the package builds a `new NativeEventEmitter(null)` at
-    // module scope, which throws an invariant that RN surfaces as an
-    // uncaught redbox on every render of the call overlay — the whole app
-    // becomes unusable over a feature the host never switched on.
-    // Probing NativeModules first keeps the optional dependency genuinely
-    // optional: no native module => behave exactly as if it isn't installed.
-    // eslint-disable-next-line @typescript-eslint/no-require-imports
-    const { NativeModules } = require('react-native');
-    if (!NativeModules?.RNCallKeep) {
-      cachedCallKeep = null;
-      return cachedCallKeep;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-require-imports
-    const mod = require('react-native-callkeep');
-    cachedCallKeep = (mod?.default || mod) as CallKeepModule;
-  } catch {
-    cachedCallKeep = null;
-  }
-  return cachedCallKeep;
-};
-
-// CallKeep identifies calls by UUID. Our callIds aren't UUIDs, so derive a
-// stable v4-shaped string from the callId: same call always maps to the
-// same UUID, which is what endCall() needs to dismiss the right screen.
-const toUuid = (seed: string): string => {
-  let hash = 0x811c9dc5;
-  const bytes: number[] = [];
-  for (let i = 0; i < 32; i++) {
-    const ch = seed.charCodeAt(i % Math.max(1, seed.length)) + i;
-    hash ^= ch;
-    hash = Math.imul(hash, 0x01000193) >>> 0;
-    bytes.push(hash & 0xff);
-  }
-  const hex = bytes.map((b) => b.toString(16).padStart(2, '0')).join('');
-  return [
-    hex.slice(0, 8),
-    hex.slice(8, 12),
-    '4' + hex.slice(13, 16),
-    ((parseInt(hex[16], 16) & 0x3) | 0x8).toString(16) + hex.slice(17, 20),
-    hex.slice(20, 32),
-  ].join('-');
-};
+export { loadCallKeep };
 
 const trace = (...args: unknown[]) => {
   if (__DEV__) {console.log('[calls] CallKit:', ...args);}
@@ -192,7 +118,25 @@ export const useCallKeep = (): void => {
   useEffect(() => {
     if (!callKeep) {return;}
 
-    const onAnswer = () => {
+    const isOtherCall = (payload: any): boolean => {
+      const uuid = String(payload?.callUUID || '').toLowerCase();
+      if (!uuid) {return false;}
+      const active = activeUuidRef.current?.toLowerCase() || null;
+      if (active === uuid) {return false;}
+      const current = store.getState().call;
+      const ringingUuid =
+        current.direction === 'incoming' && current.callId
+          ? callKitUuid(current.callId)
+          : null;
+      return ringingUuid !== uuid;
+    };
+
+    const onAnswer = (payload?: any) => {
+      if (isOtherCall(payload)) {
+        trace('answer before the call arrived', payload?.callUUID);
+        rememberSystemCallAction(String(payload.callUUID), 'answer');
+        return;
+      }
       answeredRef.current = true;
       // The user answered from the system screen, which on Android may
       // mean the app was not even in the foreground.
@@ -206,7 +150,12 @@ export const useCallKeep = (): void => {
       }
     };
 
-    const onEnd = () => {
+    const onEnd = (payload?: any) => {
+      if (isOtherCall(payload)) {
+        trace('declined before the call arrived', payload?.callUUID);
+        rememberSystemCallAction(String(payload.callUUID), 'end');
+        return;
+      }
       const snapshot = store.getState().call;
       if (snapshot.phase === 'idle') {return;}
       if (
@@ -262,16 +211,46 @@ export const useCallKeep = (): void => {
     callKeep.addEventListener('didResetProvider', onReset);
     // The system's verdict on displayIncomingCall ("Unentitled" means the
     // app lacks the voip background mode).
-    const onDisplayed = ({ error, errorCode }: { error?: string; errorCode?: string }) => {
-      trace('incoming call shown', error ? `failed: ${errorCode || ''} ${error}` : 'ok');
+    const onDisplayed = ({
+      error,
+      errorCode,
+      fromPushKit,
+    }: {
+      error?: string;
+      errorCode?: string;
+      fromPushKit?: string;
+    }) => {
+      trace(
+        `incoming call shown${fromPushKit === '1' ? ' (PushKit)' : ''}`,
+        error ? `failed: ${errorCode || ''} ${error}` : 'ok'
+      );
+      if (errorCode === 'CallUUIDAlreadyExists') {return;}
       // CallKit refused it (Do Not Disturb, unentitled...): bring the
-      // in-app ring card back so the call can still be answered.
-      if (error) {setCallSystemRinging(false);}
+      if (error && fromPushKit !== '1') {setCallSystemRinging(false);}
     };
     callKeep.addEventListener('didDisplayIncomingCall', onDisplayed);
     callKeep.addEventListener('didDeactivateAudioSession', onAudioDeactivated);
 
+    const replay: Record<string, (data: any) => void> = {
+      RNCallKeepPerformAnswerCallAction: onAnswer,
+      RNCallKeepPerformEndCallAction: onEnd,
+      RNCallKeepDidDisplayIncomingCall: onDisplayed,
+      RNCallKeepDidActivateAudioSession: onAudioActivated,
+      RNCallKeepDidDeactivateAudioSession: onAudioDeactivated,
+      RNCallKeepDidPerformSetMutedCallAction: onMuted,
+    };
+    const onLoadWithEvents = (events: { name: string; data: any }[]) => {
+      if (!Array.isArray(events) || events.length === 0) {return;}
+      trace('replaying', events.map((e) => e.name).join(', '));
+      callKeep.clearInitialEvents?.();
+      for (const event of events) {
+        replay[event.name]?.(event.data);
+      }
+    };
+    callKeep.addEventListener('didLoadWithEvents', onLoadWithEvents);
+
     return () => {
+      callKeep.removeEventListener('didLoadWithEvents');
       callKeep.removeEventListener('answerCall');
       callKeep.removeEventListener('endCall');
       callKeep.removeEventListener('didPerformSetMutedCallAction');
@@ -313,11 +292,23 @@ export const useCallKeep = (): void => {
 
     if (isRinging) {
       if (activeUuidRef.current) {return;}
-      const uuid = toUuid(call.callId || call.roomJid || String(Date.now()));
+      const uuid = callKitUuid(call.callId || call.roomJid || String(Date.now()));
       activeUuidRef.current = uuid;
       answeredRef.current = false;
+      const earlier = takeSystemCallAction(uuid);
+      if (earlier === 'answer') {
+        trace('answered earlier on the system screen', uuid);
+        answeredRef.current = true;
+        dispatch(acceptIncomingCall());
+        return;
+      }
+      if (earlier === 'end') {
+        trace('declined earlier on the system screen', uuid);
+        activeUuidRef.current = null;
+        declineActiveCallWhenOnline();
+        return;
+      }
       // iOS: the system banner is the ring UI (Telegram-style); the in-app
-      // card would only cover the screen under it.
       if (isIOS) {setCallSystemRinging(true);}
       try {
         callKeep.displayIncomingCall(
@@ -339,7 +330,7 @@ export const useCallKeep = (): void => {
     if (isIOS && isOutgoing && !activeUuidRef.current && callKeep.startCall) {
       // Unique per call: CallKit refuses a UUID it has seen before, and
       // the callId only arrives with the token.
-      const uuid = toUuid(`${call.roomJid || ''}|${call.startedAt || Date.now()}`);
+      const uuid = callKitUuid(`${call.roomJid || ''}|${call.startedAt || Date.now()}`);
       activeUuidRef.current = uuid;
       outgoingReportedRef.current = 'none';
       trace('startCall', uuid);
@@ -382,6 +373,7 @@ export const useCallKeep = (): void => {
   }, [
     callKeep,
     ready,
+    dispatch,
     isIOS,
     isRinging,
     isLive,

package/src/helpers/incomingCallFromPush.ts

@@ -1,33 +1,61 @@
 import { store } from '../roomStore';
-import { setIncomingCallToken } from '../roomStore/callSlice';
+import { acceptIncomingCall, setIncomingCallToken } from '../roomStore/callSlice';
+import { endSystemIncomingCall } from '../components/VideoCalls/systemCall';
+import { declineActiveCallWhenOnline } from '../components/VideoCalls/callActions';
 import { isCallPush, parseCallPush } from './callPush';
+import { normalizeRoomJid } from './normalizeRoomJid';
 
-/**
- * Turn an incoming-call push into a ringing call.
- *
- * On mobile the XMPP socket dies whenever the OS backgrounds or kills the
- * app, and the `call-token` stanza that normally opens the ring screen is
- * lost with it. The backend also delivers the call as a data push, so this
- * is the path every call takes when the app was not in the foreground.
- *
- * Returns true when the payload WAS a call push (whether or not it could
- * be rung), so the caller knows to stop and not also show it as a chat
- * notification. A user should never get a "new message: call-state" toast.
- */
-export const handleCallPush = (
-  data: Record<string, any> | null | undefined
-): boolean => {
-  if (!isCallPush(data)) {
-    return false;
-  }
+const PENDING_CALL_PUSH_TTL_MS = 60_000;
+
+
+export type CallPushIntent = 'ring' | 'answer' | 'decline';
+
+let pendingPush: { data: Record<string, any>; intent: CallPushIntent; at: number } | null = null;
+let unwatch: (() => void) | null = null;
+
+const trace = (...args: unknown[]) => {
+  if (__DEV__) {console.log('[calls] push:', ...args);}
+};
+
+const callsConfigured = (): boolean =>
+  store.getState().chatSettingStore.config?.videoCalls !== undefined;
+
+const holdUntilConfigured = (data: Record<string, any>, intent: CallPushIntent): void => {
+  pendingPush = { data, intent, at: Date.now() };
+  if (unwatch) {return;}
+  unwatch = store.subscribe(() => {
+    if (!callsConfigured()) {return;}
+    unwatch?.();
+    unwatch = null;
+    const held = pendingPush;
+    pendingPush = null;
+    if (!held) {return;}
+    if (Date.now() - held.at > PENDING_CALL_PUSH_TTL_MS) {
+      trace('held call push expired');
+      endSystemIncomingCall(parseCallPush(held.data).callId);
+      return;
+    }
+    ringFromPush(held.data, held.intent);
+  });
+};
 
+const applyIntent = (intent: CallPushIntent): void => {
+  const call = store.getState().call;
+  if (call.direction !== 'incoming' || call.phase !== 'ringing-incoming') {return;}
+  if (intent === 'answer') {store.dispatch(acceptIncomingCall());}
+  if (intent === 'decline') {declineActiveCallWhenOnline();}
+};
+
+const ringFromPush = (data: Record<string, any>, intent: CallPushIntent): boolean => {
   const parsed = parseCallPush(data);
   const state = store.getState();
 
   // Calls off in this deployment: swallow the push rather than ringing a
   // screen the host never opted into.
   if (state.chatSettingStore.config?.videoCalls?.enabled !== true) {
-    return true;
+    trace('calls are off, dropping', parsed.callId);
+    endSystemIncomingCall(parsed.callId);
+    return false;
   }
 
   // Already ringing or in this exact call (the push raced the stanza, or
@@ -38,9 +66,15 @@ export const handleCallPush = (
     const sameCall =
       (!!parsed.callId && parsed.callId === current.callId) ||
       (!!parsed.roomBareName && parsed.roomBareName === current.roomBareName);
-    if (sameCall || current.phase === 'in-call') {
+    if (sameCall) {
+      applyIntent(intent);
       return true;
     }
+    if (current.phase === 'in-call') {
+      // Busy with another call: no second ring.
+      endSystemIncomingCall(parsed.callId);
+      return false;
+    }
   }
 
   // Without a LiveKit token there is nothing to accept: the push is only
@@ -48,7 +82,8 @@ export const handleCallPush = (
   // cannot work, so treat it as handled and let the stanza (once the
   // socket is back up) open the real ring screen.
   if (!parsed.token) {
-    return true;
+    endSystemIncomingCall(parsed.callId);
+    return false;
   }
 
   // Resolve the full room JID from the local room map. The push carries
@@ -60,11 +95,16 @@ export const handleCallPush = (
       room?.jid === parsed.roomRef
   ) as { jid?: string; name?: string; title?: string } | undefined;
 
-  const roomJid =
-    resolved?.jid ||
-    (parsed.roomRef && parsed.roomRef.includes('@') ? parsed.roomRef : '');
+  const conference =
+    state.chatSettingStore.config?.xmppSettings?.conference || '';
+  const fromRef = parsed.roomRef
+    ? normalizeRoomJid(parsed.roomRef, conference)
+    : '';
+  const roomJid = resolved?.jid || (fromRef.includes('@') ? fromRef : '');
   if (!roomJid) {
-    return true;
+    trace('no room for call push', parsed.roomRef);
+    endSystemIncomingCall(parsed.callId);
+    return false;
   }
 
   store.dispatch(
@@ -78,6 +118,37 @@ export const handleCallPush = (
       peerXmppUsername: parsed.callerXmppUsername,
     })
   );
+  trace('ringing', parsed.callId, intent);
+  applyIntent(intent);
+  return true;
+};
 
+export const handleCallPush = (
+  data: Record<string, any> | null | undefined,
+  intent: CallPushIntent = 'ring'
+): boolean => {
+  if (!isCallPush(data)) {
+    return false;
+  }
+  if (!callsConfigured()) {
+    trace('holding call push until the chat is configured');
+    holdUntilConfigured(data as Record<string, any>, intent);
+    return true;
+  }
+  ringFromPush(data as Record<string, any>, intent);
   return true;
 };
+
+export const answerCallFromPush = (
+  data: Record<string, any> | null | undefined
+): boolean => handleCallPush(data, 'answer');
+
+export const declineCallFromPush = (
+  data: Record<string, any> | null | undefined
+): boolean => handleCallPush(data, 'decline');
+
+export const __resetCallPushForTests = (): void => {
+  unwatch?.();
+  unwatch = null;
+  pendingPush = null;
+};

package/src/main.ts

@@ -33,6 +33,14 @@ export { XmppProvider } from './context/xmppProvider';
 export { useUnread } from './hooks/useUnreadMessagesCounter';
 
 export { handlePushPayload, openRoomFromPush } from './helpers/pushPayload';
+export { callKitUuid } from './components/VideoCalls/systemCall';
+export {
+  answerCallFromPush,
+  declineCallFromPush,
+} from './helpers/incomingCallFromPush';
+export type { CallPushIntent } from './helpers/incomingCallFromPush';
+export { isCallPush, parseCallPush } from './helpers/callPush';
+export type { ParsedCallPush } from './helpers/callPush';
 export type { PushPayloadOutcome } from './helpers/pushPayload';
 export {
   registerPushToken,

package/src/networking/callTokenStanza.ts

@@ -528,6 +528,16 @@ export const onCallTokenMessage = (stanza: Element): boolean => {
         return true;
       }
 
+      if (
+        callState.direction === 'incoming' &&
+        callState.phase !== 'idle' &&
+        !!callId &&
+        callState.callId === callId
+      ) {
+        callTrace('drop call-token: call already known from push', { callId });
+        return true;
+      }
+
       store.dispatch(
         setIncomingCallToken({
           roomJid,

package/src/networking/xmpp/sendMessageReaction.xmpp.ts

@@ -1,18 +1,51 @@
 import { Client, xml } from '@xmpp/client';
+import { shouldEncrypt } from '../../e2ee/send';
+
+export interface ReactionStanzaData {
+  firstName?: string;
+  lastName?: string;
+  photoURL?: string;
+  push?: boolean;
+  messageAuthor?: string;
+  messageText?: string;
+  isMediafile?: string;
+  mimetype?: string;
+  fileName?: string;
+}
+
+export const REACTION_MESSAGE_TEXT_MAX = 120;
 
 export function sendMessageReaction(
   client: Client,
   messageId: string,
   roomJid: string,
   reactionsList: string[],
-  data: any,
-  reactionSymbol?: any,
+  data: ReactionStanzaData = {}
 ) {
   const id = `message-reaction:${Date.now().toString()}`;
 
-  const dataReaction = {
-    senderFirstName: data.firstName,
-    senderLastName: data.lastName,
+  const push = Boolean(data.push) && reactionsList.length > 0;
+  const messageText =
+    push && !shouldEncrypt(roomJid)
+      ? String(data.messageText ?? '').slice(0, REACTION_MESSAGE_TEXT_MAX)
+      : '';
+
+  const dataReaction: Record<string, string> = {
+    senderFirstName: data.firstName ?? '',
+    senderLastName: data.lastName ?? '',
+    senderJID: client.jid?.toString() ?? '',
+    roomJid,
+    ...(data.photoURL ? { photoURL: data.photoURL } : {}),
+    ...(push
+      ? {
+          push: 'true',
+          messageAuthor: data.messageAuthor ?? '',
+          messageText,
+          isMediafile: data.isMediafile ?? '',
+          mimetype: data.mimetype ?? '',
+          fileName: data.fileName ?? '',
+        }
+      : {}),
   };
 
   const message = xml(
@@ -31,7 +64,6 @@ export function sendMessageReaction(
         xmlns: 'urn:xmpp:reactions:0',
       },
       ...reactionsList.map((reaction) => xml('reaction', {}, reaction ?? ''))
-      // xml('reaction', {}, reactionSymbol ?? '👋'),
     ),
     xml('data', dataReaction),
     xml('store', { xmlns: 'urn:xmpp:hints' })

package/src/networking/xmppClient.ts

@@ -16,7 +16,7 @@ import {
   HistoryPageCursor,
 } from './xmpp/getHistory.xmpp';
 import { sendTextMessage } from './xmpp/sendTextMessage.xmpp';
-import { sendMessageReaction } from './xmpp/sendMessageReaction.xmpp';
+import { sendMessageReaction, type ReactionStanzaData } from './xmpp/sendMessageReaction.xmpp';
 import { sendReceivedReceipt } from './xmpp/sendReceivedReceipt.xmpp';
 import { sendDisplayedMarker } from './xmpp/sendDisplayedMarker.xmpp';
 import { sendTextMessageWithTranslateTag } from './xmpp/sendTextMessageWithTranslateTag.xmpp';
@@ -1646,7 +1646,7 @@ export class XmppClient {
     messageId: string,
     roomJid: string,
     reactionsList: string[],
-    data?: { firstName?: string; lastName?: string }
+    data?: ReactionStanzaData
   ) {
     sendMessageReaction(
       this.client,

package/src/push/sealedPush.ts

@@ -20,6 +20,8 @@ export interface SealedPushEnvelope {
   msgID: string;
   /** Recipient. */
   userJid: string;
+  /** 'reaction' for a push about an emoji put on the user's message; absent for a message. */
+  type?: string;
   /** Base64 of the sealed box; absent when the service could not seal. */
   enc?: string;
 }
@@ -35,8 +37,14 @@ export interface SealedPushContent {
   msgID: string;
   /** Sender avatar URL, '' when none. */
   image: string;
+  /** 'reaction' with the emoji in `reaction`; absent for a message. */
+  type?: string;
+  reaction?: string;
 }
 
+export const isReactionPush = (envelope: Pick<SealedPushEnvelope, 'type'>): boolean =>
+  envelope.type === 'reaction';
+
 export type SealedPushFailure =
   /** No key on this device (never generated, or the store is not readable). */
   | 'no-key'
@@ -68,6 +76,7 @@ export const sealedPushEnvelopeOf = (
     jid: str(data.jid),
     msgID: str(data.msgID),
     userJid: str(data.userJid),
+    ...(str(data.type) ? { type: str(data.type) } : {}),
     ...(enc ? { enc } : {}),
   };
 };
@@ -88,6 +97,8 @@ const parseContent = (plaintext: Uint8Array): SealedPushContent | null => {
       chatJid: str(parsed.chatJid),
       msgID: str(parsed.msgID),
       image: str(parsed.image),
+      ...(str(parsed.type) ? { type: str(parsed.type) } : {}),
+      ...(str(parsed.reaction) ? { reaction: str(parsed.reaction) } : {}),
     };
   } catch {
     return null;