Interrupt focused agent before realtime turns

packages/app/src/app/agent/[id].tsx

@@ -35,6 +35,7 @@ export default function AgentScreen() {
     respondToPermission,
     initializeAgent,
     refreshAgent,
+    setFocusedAgentId,
   } = useSession();
   const { registerFooterControls, unregisterFooterControls } = useFooterControls();
   const { width: windowWidth, height: windowHeight } = useWindowDimensions();
@@ -66,6 +67,18 @@ export default function AgentScreen() {
     Array.from(pendingPermissions.entries()).filter(([_, perm]) => perm.agentId === id)
   );
 
+  useEffect(() => {
+    if (!id) {
+      setFocusedAgentId(null);
+      return;
+    }
+
+    setFocusedAgentId(id);
+    return () => {
+      setFocusedAgentId(null);
+    };
+  }, [id, setFocusedAgentId]);
+
   const hasStreamState = id ? agentStreamState.has(id) : false;
   const initializationState = id ? initializingAgents.get(id) : undefined;
   const isInitializing = id

packages/app/src/contexts/realtime-context.tsx

@@ -31,7 +31,15 @@ interface RealtimeProviderProps {
 }
 
 export function RealtimeProvider({ children }: RealtimeProviderProps) {
-  const { ws, audioPlayer, isPlayingAudio, setMessages, setVoiceDetectionFlags } = useSession();
+  const {
+    ws,
+    audioPlayer,
+    isPlayingAudio,
+    setMessages,
+    setVoiceDetectionFlags,
+    cancelAgentRun,
+    focusedAgentId,
+  } = useSession();
   const [isRealtimeMode, setIsRealtimeMode] = useState(false);
 
   const realtimeAudio = useSpeechmaticsAudio({
@@ -41,6 +49,17 @@ export function RealtimeProvider({ children }: RealtimeProviderProps) {
       if (isPlayingAudio) {
         audioPlayer.stop();
       }
+
+      if (focusedAgentId) {
+        try {
+          cancelAgentRun(focusedAgentId);
+          console.log(
+            `[Realtime] Sent cancel_agent_request for agent ${focusedAgentId} before streaming audio`
+          );
+        } catch (error) {
+          console.error("[Realtime] Failed to cancel focused agent:", error);
+        }
+      }
       // Abort any in-flight LLM turn before the new speech segment streams
       try {
         const abortMessage: WSInboundMessage = {

packages/app/src/contexts/session-context.tsx

@@ -190,6 +190,8 @@ interface SessionContextValue {
   
   // Voice detection flags (updated by RealtimeContext)
   setVoiceDetectionFlags: (isDetecting: boolean, isSpeaking: boolean) => void;
+  focusedAgentId: string | null;
+  setFocusedAgentId: (agentId: string | null) => void;
 
   // Messages and stream state
   messages: MessageEntry[];
@@ -260,6 +262,7 @@ export function SessionProvider({ children, serverUrl }: SessionProviderProps) {
   });
 
   const [isPlayingAudio, setIsPlayingAudio] = useState(false);
+  const [focusedAgentId, setFocusedAgentId] = useState<string | null>(null);
   const [messages, setMessages] = useState<MessageEntry[]>([]);
   const [currentAssistantMessage, setCurrentAssistantMessage] = useState("");
   const [agentStreamState, setAgentStreamState] = useState<Map<string, StreamItem[]>>(new Map());
@@ -1073,6 +1076,8 @@ export function SessionProvider({ children, serverUrl }: SessionProviderProps) {
     isPlayingAudio,
     setIsPlayingAudio,
     setVoiceDetectionFlags,
+    focusedAgentId,
+    setFocusedAgentId,
     messages,
     setMessages,
     currentAssistantMessage,