@ateam-ai-mobile/ui 0.1.5 → 0.1.7

package/src/voice/useVoiceCall.ts

@@ -1,245 +1,54 @@
 /**
- * useVoiceCall — WebView-based voice hook.
+ * useVoiceCall — a React VIEW onto the one `voiceSession`.
  *
- * The WebView runs WebRTC + OpenAI Realtime internally (iOS WebView supports
- * WebRTC); communication is postMessage (transcript/state events → RN).
- * Requires `voiceUrl` in the initAdas() config — getWebViewSource() throws
- * without it. Identity (token/tenant/actor) comes from the host-owned config.
- */
-import { useState, useRef, useCallback } from 'react';
-import { getVoiceApiUrl, getToken, getTenant, getUser, refreshToken } from '@ateam-ai-mobile/core';
-
-/**
- * The voice WebView bakes the JWT into its URL once at mount and never
- * refreshes it (unlike the SDK REST client, which self-heals on 401). So a
- * token that has gone stale by the time the user taps the mic is handed to
- * voice-backend and rejected by Core /api/auth/me ("Invalid or expired
- * token"). Guard: if the current token is expired or within `SKEW_MS` of
- * expiry, refresh it BEFORE the WebView mounts so it gets a fresh token.
- * Cheap in the common case — we only pay the round-trip when actually near
- * expiry (decoded locally, no network unless needed).
+ * The session itself (WebRTC WebView, transcript, device tools, mute, token
+ * refresh) no longer lives here — it moved to `voiceSession`, a singleton the
+ * app roots via VoiceSessionHost so the loop survives any screen unmounting. This
+ * hook is now just a subscription: it re-renders its caller on session changes
+ * and forwards the controls. VoiceCallSheet is one such view; a plugin's own UI
+ * is another, via `props.voice`.
+ *
+ * The return shape is kept backward-compatible for VoiceCallSheet, minus the
+ * WebView plumbing (source/ref/message handler/track hook) — that is the host's
+ * job now, not any screen's.
  */
-const TOKEN_REFRESH_SKEW_MS = 90_000; // refresh if <90s of life left (or expired)
-function tokenNeedsRefresh(token: string | null): boolean {
-  if (!token) return true;
-  try {
-    const payloadB64 = token.split('.')[1];
-    const padded = payloadB64.replace(/-/g, '+').replace(/_/g, '/');
-    // Hermes has atob; Buffer fallback for older runtimes (mirrors
-    // apps/mobile authStore.decodeJwtPayload).
-    const json = typeof atob === 'function'
-      ? atob(padded)
-      : Buffer.from(padded, 'base64').toString('utf8');
-    const exp = JSON.parse(json)?.exp;
-    if (typeof exp !== 'number') return false;
-    return Date.now() >= exp * 1000 - TOKEN_REFRESH_SKEW_MS;
-  } catch {
-    return false; // can't decode → let the server decide, don't block the call
-  }
-}
-
-export interface TranscriptEntry {
-  role: 'user' | 'ai' | 'tool';
-  text: string;
-  ts: number;
-}
-
-export type CallState = 'idle' | 'connecting' | 'connected' | 'error';
-
-// Installed BEFORE the voice app loads. Captures every audio track that
-// could possibly be sent to the peer connection so the mute button can flip
-// enabled=false on all of them, regardless of how the voice app obtained or
-// added the track.
-const INJECT_TRACK_HOOK = `
-(function() {
-  if (window._adaTrackHookInstalled) return;
-  window._adaTrackHookInstalled = true;
-  window._allAudioTracks = [];
-  window._adaPeerConnections = [];
-
-  function track(t) {
-    if (t && t.kind === 'audio' && window._allAudioTracks.indexOf(t) === -1) {
-      window._allAudioTracks.push(t);
-    }
-  }
+import { useCallback, useEffect, useReducer } from 'react';
+import { voiceSession, type CallState, type TranscriptEntry } from './voiceSession';
 
-  // 1) Hook getUserMedia — captures mic streams at request time.
-  try {
-    if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
-      const origGUM = navigator.mediaDevices.getUserMedia.bind(navigator.mediaDevices);
-      navigator.mediaDevices.getUserMedia = async function(constraints) {
-        const stream = await origGUM(constraints);
-        if (constraints && constraints.audio) {
-          try { stream.getAudioTracks().forEach(track); } catch (e) {}
-        }
-        return stream;
-      };
-    }
-  } catch (e) {}
-
-  // 2) Hook RTCPeerConnection.addTrack — catches whatever the app sends.
-  try {
-    if (window.RTCPeerConnection) {
-      const origPC = window.RTCPeerConnection;
-      const origAddTrack = origPC.prototype.addTrack;
-      const origAddStream = origPC.prototype.addStream;
-      const origAddTransceiver = origPC.prototype.addTransceiver;
-
-      origPC.prototype.addTrack = function(t) {
-        if (t && t.kind === 'audio') track(t);
-        return origAddTrack.apply(this, arguments);
-      };
-      if (origAddStream) {
-        origPC.prototype.addStream = function(stream) {
-          try { stream.getAudioTracks().forEach(track); } catch (e) {}
-          return origAddStream.apply(this, arguments);
-        };
-      }
-      if (origAddTransceiver) {
-        origPC.prototype.addTransceiver = function(arg) {
-          if (arg && arg.kind === 'audio') {
-            // Transceiver created with kind 'audio' — sender track set later.
-          } else if (arg && arg.kind === undefined && arg.track && arg.track.kind === 'audio') {
-            track(arg.track);
-          }
-          const tx = origAddTransceiver.apply(this, arguments);
-          try {
-            if (tx && tx.sender && tx.sender.track && tx.sender.track.kind === 'audio') track(tx.sender.track);
-          } catch (e) {}
-          return tx;
-        };
-      }
-    }
-  } catch (e) {}
-
-  // 3) Helper exposed for direct calls.
-  window._adaSetMuted = function(muted) {
-    let n = 0;
-    if (Array.isArray(window._allAudioTracks)) {
-      window._allAudioTracks.forEach(function(t) {
-        try { t.enabled = !muted; n++; } catch (e) {}
-      });
-    }
-    return n;
-  };
-})(); true;
-`;
-
-const buildMuteScript = (muted: boolean) => `
-(function(muted) {
-  if (typeof window.setMuted === 'function') { window.setMuted(muted); }
-  let n = 0;
-  if (typeof window._adaSetMuted === 'function') {
-    n = window._adaSetMuted(muted);
-  }
-  // Last-resort scan if hook somehow missed.
-  if (n === 0 && Array.isArray(window._allAudioTracks)) {
-    window._allAudioTracks.forEach(function(t) {
-      try { t.enabled = !muted; n++; } catch (e) {}
-    });
-  }
-  console.log('[ada-mute]', muted ? 'MUTED' : 'UNMUTED', 'tracks=', n);
-})(${muted}); true;
-`;
+export type { CallState, TranscriptEntry };
 
 export default function useVoiceCall({ skillSlug }: { skillSlug?: string } = {}) {
-  const [callState, setCallState] = useState<CallState>('idle');
-  const [sessionId, setSessionId] = useState<string | null>(null);
-  const [error, setError] = useState<string | null>(null);
-  const [transcript, setTranscript] = useState<TranscriptEntry[]>([]);
-  const [aiPartial, setAiPartial] = useState('');
-  const [userPartial, setUserPartial] = useState('');
-  const [muted, setMuted] = useState(false);
-  const webViewRef = useRef<any>(null);
+  const [, force] = useReducer((x: number) => x + 1, 0);
 
-  /** Handle postMessage events from the WebView */
-  const handleWebViewMessage = useCallback((event: any) => {
-    try {
-      const data = JSON.parse(event.nativeEvent.data);
-      console.log('[VoiceWebView] message:', data.type, data.text?.slice?.(0, 50) || data.state || '');
-      switch (data.type) {
-        case 'callState':
-        case 'call-state':
-          setCallState(data.state);
-          if (data.sessionId) setSessionId(data.sessionId);
-          if (data.error) setError(data.error);
-          break;
-        case 'transcript':
-          setTranscript(prev => [...prev, { role: data.role, text: data.text, ts: Date.now() }]);
-          break;
-        case 'aiPartial':
-          setAiPartial(data.text);
-          break;
-        case 'userPartial':
-          setUserPartial(data.text);
-          break;
-        case 'clearPartials':
-          setAiPartial('');
-          setUserPartial('');
-          break;
-        case 'error':
-          setError(data.message);
-          setCallState('error');
-          break;
-      }
-    } catch {}
+  useEffect(() => {
+    const sub = voiceSession.subscribe(() => force());
+    return () => sub.unsubscribe();
   }, []);
 
-  const startCall = useCallback(async () => {
-    setError(null);
-    setTranscript([]);
-    setAiPartial('');
-    setUserPartial('');
-    // Ensure the WebView is handed a FRESH token BEFORE it mounts (it never
-    // refreshes once mounted, and the WebView mounts as soon as callState
-    // leaves 'idle'). Only pays a round-trip when the token is expired or
-    // near-expiry; otherwise instant. Flip to 'connecting' only after, so
-    // getWebViewSource() reads the refreshed token.
-    try {
-      if (tokenNeedsRefresh(getToken())) {
-        await refreshToken();
-      }
-    } catch {
-      // Refresh failed — proceed with whatever token we have; voice-backend
-      // will surface a clean auth error rather than us blocking the call.
-    }
-    setCallState('connecting');
-  }, []);
-
-  const stopCall = useCallback(() => {
-    // Tell WebView to hang up
-    webViewRef.current?.injectJavaScript?.('window.hangUp && window.hangUp(); true;');
-    setCallState('idle');
-    setAiPartial('');
-    setUserPartial('');
-    setMuted(false);
-  }, []);
-
-  const toggleMute = useCallback(() => {
-    setMuted(prev => {
-      const next = !prev;
-      webViewRef.current?.injectJavaScript?.(buildMuteScript(next));
-      return next;
-    });
-  }, []);
+  const s = voiceSession.getInternal();
 
-  /** Build the WebView source. Identity comes from the SDK config (host-owned
-   *  auth) — token, tenant, actorId are passed to the voice mini-app. */
-  const getWebViewSource = useCallback(() => {
-    const token = getToken();
-    const tenant = getTenant();
-    const actorId = getUser()?.actorId || '';
-    // skillSlug (when opened for a specific skill) is read by the voice mini-app
-    // and posted to /session, which turns it into takeMic (E1 held-mic entry).
-    const skillParam = skillSlug ? `&skillSlug=${encodeURIComponent(skillSlug)}` : '';
-    return {
-      uri: `${getVoiceApiUrl()}/app?mode=mini&embedded=rn&authToken=${encodeURIComponent(token || '')}&tenant=${encodeURIComponent(tenant)}&actorId=${encodeURIComponent(actorId)}${skillParam}`,
-    };
-  }, [skillSlug]);
+  // Opening a screen while a session is already live ATTACHES to it (start() is
+  // a no-op that resolves) — never a second Realtime loop (invariant 2).
+  const startCall = useCallback(
+    (opts?: { skillSlug?: string }) => voiceSession.start(opts ?? { skillSlug }),
+    [skillSlug],
+  );
+  const stopCall = useCallback(() => voiceSession.stop(), []);
+  const toggleMute = useCallback(
+    () => voiceSession.setMuted(!voiceSession.getSnapshot().muted),
+    [],
+  );
 
   return {
-    callState, sessionId, error, transcript, aiPartial, userPartial, muted,
-    startCall, stopCall, toggleMute, handleWebViewMessage, getWebViewSource, webViewRef,
-    injectedTrackHook: INJECT_TRACK_HOOK,
+    callState: s.callState,
+    sessionId: s.sessionId,
+    error: s.error,
+    transcript: s.transcript,
+    aiPartial: s.aiPartial,
+    userPartial: s.userPartial,
+    muted: s.muted,
+    startCall,
+    stopCall,
+    toggleMute,
   };
 }