@mragentix/cli 4.2.37 → 4.2.38

package/dist/ui/hooks/useAgentLoop.js

@@ -1,5 +1,5 @@
 import { useState, useRef, useCallback, useEffect } from "react";
-import { agentLoop } from "@mragentix/agent";
+import { agentLoop, isAbortError } from "@mragentix/agent";
 /** Rough token estimate from message content (~4 chars per token). */
 function estimateTokens(msgs) {
     let chars = 0;
@@ -22,6 +22,31 @@ function estimateTokens(msgs) {
     }
     return Math.round(chars / 4);
 }
+/**
+ * Merge multiple UserContent items into a single one.
+ * Text-only items are joined with newlines. Mixed content (text + images)
+ * is flattened into a content array preserving all parts.
+ */
+function mergeUserContent(items) {
+    if (items.length === 1)
+        return items[0];
+    const hasArrayContent = items.some((c) => Array.isArray(c));
+    if (!hasArrayContent) {
+        // All items are strings — join with newlines
+        return items.join("\n");
+    }
+    // Flatten into a single content array
+    const parts = [];
+    for (const item of items) {
+        if (typeof item === "string") {
+            parts.push({ type: "text", text: item });
+        }
+        else {
+            parts.push(...item);
+        }
+    }
+    return parts;
+}
 export function useAgentLoop(messages, options, callbacks) {
     const onComplete = callbacks?.onComplete;
     const onTurnText = callbacks?.onTurnText;
@@ -33,6 +58,7 @@ export function useAgentLoop(messages, options, callbacks) {
     const onTurnEnd = callbacks?.onTurnEnd;
     const onDone = callbacks?.onDone;
     const onAborted = callbacks?.onAborted;
+    const onQueuedStart = callbacks?.onQueuedStart;
     const [isRunning, setIsRunning] = useState(false);
     const [streamingText, setStreamingText] = useState("");
     const [streamingThinking, setStreamingThinking] = useState("");
@@ -46,6 +72,8 @@ export function useAgentLoop(messages, options, callbacks) {
     const [isThinking, setIsThinking] = useState(false);
     const [streamedTokenEstimate, setStreamedTokenEstimate] = useState(0);
     const abortRef = useRef(null);
+    const queueRef = useRef([]);
+    const [queuedCount, setQueuedCount] = useState(0);
     const activeToolCallsRef = useRef([]);
     const textPendingRef = useRef("");
     const textVisibleRef = useRef("");
@@ -182,254 +210,304 @@ export function useAgentLoop(messages, options, callbacks) {
         setThinkingMs(0);
         setIsThinking(false);
         setStreamedTokenEstimate(0);
+        queueRef.current = [];
+        setQueuedCount(0);
+    }, []);
+    const queueMessage = useCallback((content) => {
+        queueRef.current.push(content);
+        setQueuedCount(queueRef.current.length);
+    }, []);
+    const clearQueue = useCallback(() => {
+        queueRef.current = [];
+        setQueuedCount(0);
     }, []);
     const run = useCallback(async (userContent) => {
-        const ac = new AbortController();
-        abortRef.current = ac;
-        let wasAborted = false;
-        // Reset state
-        doneCalledRef.current = false;
-        textPendingRef.current = "";
-        textVisibleRef.current = "";
-        thinkingBufferRef.current = "";
-        thinkingPendingRef.current = "";
-        thinkingVisibleRef.current = "";
-        runStartRef.current = Date.now();
-        toolsUsedRef.current = new Set();
-        charCountRef.current = 0;
-        realTokensAccumRef.current = 0;
-        thinkingAccumRef.current = 0;
-        thinkingStartRef.current = null;
-        phaseRef.current = "waiting";
-        setStreamingText("");
-        setStreamingThinking("");
-        setActiveToolCalls([]);
-        setActivityPhase("waiting");
-        setElapsedMs(0);
-        setThinkingMs(0);
-        setIsThinking(false);
-        setStreamedTokenEstimate(0);
-        setIsRunning(true);
-        // Start elapsed timer (ticks every 1000ms — less frequent to reduce
-        // Ink re-renders which cause live-area flickering and viewport snapping)
-        if (elapsedTimerRef.current)
-            clearInterval(elapsedTimerRef.current);
-        const timerStart = Date.now();
-        elapsedTimerRef.current = setInterval(() => {
-            const now = Date.now();
-            setElapsedMs(now - timerStart);
-            // Update live thinking time if currently thinking
-            if (thinkingStartRef.current !== null) {
-                setThinkingMs(thinkingAccumRef.current + (now - thinkingStartRef.current));
-            }
-            // Update token estimate
-            setStreamedTokenEstimate(realTokensAccumRef.current + Math.ceil(charCountRef.current / 4));
-        }, 1000);
-        /** Freeze thinking time if currently in thinking phase */
-        const freezeThinking = () => {
-            if (thinkingStartRef.current !== null) {
-                thinkingAccumRef.current += Date.now() - thinkingStartRef.current;
-                thinkingStartRef.current = null;
-                setThinkingMs(thinkingAccumRef.current);
-                setIsThinking(false);
-            }
-        };
-        // Push user message
-        const userMsg = { role: "user", content: userContent };
-        messages.current.push(userMsg);
-        const startIndex = messages.current.length;
-        try {
-            // Resolve fresh credentials (handles OAuth token refresh)
-            let apiKey = options.apiKey;
-            let accountId = options.accountId;
-            if (options.resolveCredentials) {
-                const creds = await options.resolveCredentials();
-                apiKey = creds.apiKey;
-                accountId = creds.accountId;
-            }
-            const generator = agentLoop(messages.current, {
-                provider: options.provider,
-                model: options.model,
-                tools: options.tools,
-                webSearch: options.webSearch,
-                maxTokens: options.maxTokens,
-                thinking: options.thinking,
-                apiKey,
-                baseUrl: options.baseUrl,
-                accountId,
-                signal: ac.signal,
-                transformContext: options.transformContext,
-            });
-            for await (const event of generator) {
-                switch (event.type) {
-                    case "text_delta":
-                        textPendingRef.current += event.text;
-                        charCountRef.current += event.text.length;
-                        startReveal();
-                        if (phaseRef.current !== "generating") {
+        /** Run a single user message through the agent loop. Returns true if aborted. */
+        const runSingle = async (content) => {
+            const ac = new AbortController();
+            abortRef.current = ac;
+            let wasAborted = false;
+            // Reset state
+            doneCalledRef.current = false;
+            textPendingRef.current = "";
+            textVisibleRef.current = "";
+            thinkingBufferRef.current = "";
+            thinkingPendingRef.current = "";
+            thinkingVisibleRef.current = "";
+            runStartRef.current = Date.now();
+            toolsUsedRef.current = new Set();
+            charCountRef.current = 0;
+            realTokensAccumRef.current = 0;
+            thinkingAccumRef.current = 0;
+            thinkingStartRef.current = null;
+            phaseRef.current = "waiting";
+            setStreamingText("");
+            setStreamingThinking("");
+            setActiveToolCalls([]);
+            setActivityPhase("waiting");
+            setElapsedMs(0);
+            setThinkingMs(0);
+            setIsThinking(false);
+            setStreamedTokenEstimate(0);
+            setIsRunning(true);
+            // Start elapsed timer (ticks every 1000ms — less frequent to reduce
+            // Ink re-renders which cause live-area flickering and viewport snapping)
+            if (elapsedTimerRef.current)
+                clearInterval(elapsedTimerRef.current);
+            const timerStart = Date.now();
+            elapsedTimerRef.current = setInterval(() => {
+                const now = Date.now();
+                setElapsedMs(now - timerStart);
+                // Update live thinking time if currently thinking
+                if (thinkingStartRef.current !== null) {
+                    setThinkingMs(thinkingAccumRef.current + (now - thinkingStartRef.current));
+                }
+                // Update token estimate
+                setStreamedTokenEstimate(realTokensAccumRef.current + Math.ceil(charCountRef.current / 4));
+            }, 1000);
+            /** Freeze thinking time if currently in thinking phase */
+            const freezeThinking = () => {
+                if (thinkingStartRef.current !== null) {
+                    thinkingAccumRef.current += Date.now() - thinkingStartRef.current;
+                    thinkingStartRef.current = null;
+                    setThinkingMs(thinkingAccumRef.current);
+                    setIsThinking(false);
+                }
+            };
+            // Push user message
+            const userMsg = { role: "user", content: content };
+            messages.current.push(userMsg);
+            const startIndex = messages.current.length;
+            try {
+                // Resolve fresh credentials (handles OAuth token refresh)
+                let apiKey = options.apiKey;
+                let accountId = options.accountId;
+                if (options.resolveCredentials) {
+                    const creds = await options.resolveCredentials();
+                    apiKey = creds.apiKey;
+                    accountId = creds.accountId;
+                }
+                const generator = agentLoop(messages.current, {
+                    provider: options.provider,
+                    model: options.model,
+                    tools: options.tools,
+                    webSearch: options.webSearch,
+                    maxTokens: options.maxTokens,
+                    thinking: options.thinking,
+                    apiKey,
+                    baseUrl: options.baseUrl,
+                    accountId,
+                    signal: ac.signal,
+                    transformContext: options.transformContext,
+                    // Drain queued messages as steering — injected between tool calls
+                    // and before the agent would stop, so the LLM sees user guidance
+                    // within the same run instead of waiting for a new one.
+                    getSteeringMessages: () => {
+                        if (queueRef.current.length === 0)
+                            return null;
+                        const batch = queueRef.current.splice(0);
+                        setQueuedCount(0);
+                        const merged = mergeUserContent(batch);
+                        onQueuedStart?.(merged);
+                        return [{ role: "user", content: merged }];
+                    },
+                });
+                for await (const event of generator) {
+                    switch (event.type) {
+                        case "text_delta":
+                            textPendingRef.current += event.text;
+                            charCountRef.current += event.text.length;
+                            startReveal();
+                            if (phaseRef.current !== "generating") {
+                                freezeThinking();
+                                phaseRef.current = "generating";
+                                setActivityPhase("generating");
+                            }
+                            break;
+                        case "thinking_delta":
+                            thinkingBufferRef.current += event.text;
+                            thinkingPendingRef.current += event.text;
+                            charCountRef.current += event.text.length;
+                            startThinkingReveal();
+                            if (phaseRef.current !== "thinking") {
+                                thinkingStartRef.current = Date.now();
+                                setIsThinking(true);
+                                phaseRef.current = "thinking";
+                                setActivityPhase("thinking");
+                            }
+                            break;
+                        case "tool_call_start": {
                             freezeThinking();
-                            phaseRef.current = "generating";
-                            setActivityPhase("generating");
+                            if (phaseRef.current !== "tools") {
+                                phaseRef.current = "tools";
+                                setActivityPhase("tools");
+                            }
+                            const newTc = {
+                                toolCallId: event.toolCallId,
+                                name: event.name,
+                                args: event.args,
+                                startTime: Date.now(),
+                                updates: [],
+                            };
+                            onToolStart?.(event.toolCallId, event.name, event.args);
+                            toolsUsedRef.current.add(event.name);
+                            activeToolCallsRef.current = [...activeToolCallsRef.current, newTc];
+                            setActiveToolCalls(activeToolCallsRef.current);
+                            break;
                         }
-                        break;
-                    case "thinking_delta":
-                        thinkingBufferRef.current += event.text;
-                        thinkingPendingRef.current += event.text;
-                        charCountRef.current += event.text.length;
-                        startThinkingReveal();
-                        if (phaseRef.current !== "thinking") {
-                            thinkingStartRef.current = Date.now();
-                            setIsThinking(true);
-                            phaseRef.current = "thinking";
-                            setActivityPhase("thinking");
+                        case "tool_call_update": {
+                            onToolUpdate?.(event.toolCallId, event.update);
+                            // Mutate the matching tool call in-place to avoid allocating
+                            // a new array + new objects on every update event. Over a 5h
+                            // session with thousands of tool calls this prevents significant
+                            // GC pressure from spread-copy churn.
+                            const target = activeToolCallsRef.current.find((tc) => tc.toolCallId === event.toolCallId);
+                            if (target) {
+                                if (target.updates.length >= 20) {
+                                    target.updates.shift();
+                                }
+                                target.updates.push(event.update);
+                            }
+                            // Spread once to create a new array reference for React state
+                            setActiveToolCalls([...activeToolCallsRef.current]);
+                            break;
                         }
-                        break;
-                    case "tool_call_start": {
-                        freezeThinking();
-                        if (phaseRef.current !== "tools") {
-                            phaseRef.current = "tools";
-                            setActivityPhase("tools");
+                        case "tool_call_end": {
+                            const tc = activeToolCallsRef.current.find((t) => t.toolCallId === event.toolCallId);
+                            const toolName = tc?.name ?? "unknown";
+                            const durationMs = tc ? Date.now() - tc.startTime : 0;
+                            onToolEnd?.(event.toolCallId, toolName, event.result, event.isError, durationMs, event.details);
+                            activeToolCallsRef.current = activeToolCallsRef.current.filter((t) => t.toolCallId !== event.toolCallId);
+                            setActiveToolCalls(activeToolCallsRef.current);
+                            break;
                         }
-                        const newTc = {
-                            toolCallId: event.toolCallId,
-                            name: event.name,
-                            args: event.args,
-                            startTime: Date.now(),
-                            updates: [],
-                        };
-                        onToolStart?.(event.toolCallId, event.name, event.args);
-                        toolsUsedRef.current.add(event.name);
-                        activeToolCallsRef.current = [...activeToolCallsRef.current, newTc];
-                        setActiveToolCalls(activeToolCallsRef.current);
-                        break;
-                    }
-                    case "tool_call_update": {
-                        onToolUpdate?.(event.toolCallId, event.update);
-                        // Mutate the matching tool call in-place to avoid allocating
-                        // a new array + new objects on every update event. Over a 5h
-                        // session with thousands of tool calls this prevents significant
-                        // GC pressure from spread-copy churn.
-                        const target = activeToolCallsRef.current.find((tc) => tc.toolCallId === event.toolCallId);
-                        if (target) {
-                            if (target.updates.length >= 20) {
-                                target.updates.shift();
+                        case "server_tool_call":
+                            onServerToolCall?.(event.id, event.name, event.input);
+                            break;
+                        case "server_tool_result":
+                            onServerToolResult?.(event.toolUseId, event.resultType, event.data);
+                            break;
+                        case "steering_message":
+                            // Steering message was injected — UI already notified via
+                            // onQueuedStart inside getSteeringMessages callback.
+                            break;
+                        case "turn_end":
+                            onTurnEnd?.(event.turn, event.stopReason, event.usage);
+                            setCurrentTurn(event.turn);
+                            setTotalTokens((prev) => ({
+                                input: prev.input + event.usage.inputTokens,
+                                output: prev.output + event.usage.outputTokens,
+                            }));
+                            // Latest turn's input tokens = current context window fill
+                            // With prompt caching, input_tokens only counts non-cached tokens.
+                            // Total context = input + cache_read + cache_write.
+                            setContextUsed(event.usage.inputTokens +
+                                (event.usage.cacheRead ?? 0) +
+                                (event.usage.cacheWrite ?? 0));
+                            // Replace char-based estimate with real output tokens
+                            realTokensAccumRef.current += event.usage.outputTokens;
+                            charCountRef.current = 0;
+                            setStreamedTokenEstimate(realTokensAccumRef.current);
+                            // Reset phase for next turn
+                            phaseRef.current = "waiting";
+                            setActivityPhase("waiting");
+                            // Flush all pending text before completing turn
+                            flushAllText();
+                            if (textVisibleRef.current) {
+                                onTurnText?.(textVisibleRef.current, thinkingBufferRef.current, thinkingAccumRef.current);
                             }
-                            target.updates.push(event.update);
-                        }
-                        // Spread once to create a new array reference for React state
-                        setActiveToolCalls([...activeToolCallsRef.current]);
-                        break;
+                            // Reset streaming buffers for next turn
+                            textPendingRef.current = "";
+                            textVisibleRef.current = "";
+                            thinkingBufferRef.current = "";
+                            thinkingPendingRef.current = "";
+                            thinkingVisibleRef.current = "";
+                            setStreamingText("");
+                            setStreamingThinking("");
+                            break;
+                        case "agent_done":
+                            flushAllText();
+                            // Batch ALL completion state into a single render so Ink
+                            // processes the live-area change atomically.  Previously
+                            // isRunning, activityPhase, and onDone landed in separate
+                            // render batches, causing multiple live-area height changes
+                            // that confused Ink's cursor math and clipped content.
+                            setIsRunning(false);
+                            phaseRef.current = "idle";
+                            setActivityPhase("idle");
+                            // Call onDone HERE (not in finally) so its state updates
+                            // (doneStatus, flushing items to Static) are batched too.
+                            onDone?.(Date.now() - runStartRef.current, [...toolsUsedRef.current]);
+                            doneCalledRef.current = true;
+                            break;
                     }
-                    case "tool_call_end": {
-                        const tc = activeToolCallsRef.current.find((t) => t.toolCallId === event.toolCallId);
-                        const toolName = tc?.name ?? "unknown";
-                        const durationMs = tc ? Date.now() - tc.startTime : 0;
-                        onToolEnd?.(event.toolCallId, toolName, event.result, event.isError, durationMs, event.details);
-                        activeToolCallsRef.current = activeToolCallsRef.current.filter((t) => t.toolCallId !== event.toolCallId);
-                        setActiveToolCalls(activeToolCallsRef.current);
-                        break;
-                    }
-                    case "server_tool_call":
-                        onServerToolCall?.(event.id, event.name, event.input);
-                        break;
-                    case "server_tool_result":
-                        onServerToolResult?.(event.toolUseId, event.resultType, event.data);
-                        break;
-                    case "turn_end":
-                        onTurnEnd?.(event.turn, event.stopReason, event.usage);
-                        setCurrentTurn(event.turn);
-                        setTotalTokens((prev) => ({
-                            input: prev.input + event.usage.inputTokens,
-                            output: prev.output + event.usage.outputTokens,
-                        }));
-                        // Latest turn's input tokens = current context window fill
-                        // With prompt caching, input_tokens only counts non-cached tokens.
-                        // Total context = input + cache_read + cache_write.
-                        setContextUsed(event.usage.inputTokens +
-                            (event.usage.cacheRead ?? 0) +
-                            (event.usage.cacheWrite ?? 0));
-                        // Replace char-based estimate with real output tokens
-                        realTokensAccumRef.current += event.usage.outputTokens;
-                        charCountRef.current = 0;
-                        setStreamedTokenEstimate(realTokensAccumRef.current);
-                        // Reset phase for next turn
-                        phaseRef.current = "waiting";
-                        setActivityPhase("waiting");
-                        // Flush all pending text before completing turn
-                        flushAllText();
-                        if (textVisibleRef.current) {
-                            onTurnText?.(textVisibleRef.current, thinkingBufferRef.current, thinkingAccumRef.current);
-                        }
-                        // Reset streaming buffers for next turn
-                        textPendingRef.current = "";
-                        textVisibleRef.current = "";
-                        thinkingBufferRef.current = "";
-                        thinkingPendingRef.current = "";
-                        thinkingVisibleRef.current = "";
-                        setStreamingText("");
-                        setStreamingThinking("");
-                        break;
-                    case "agent_done":
-                        flushAllText();
-                        // Batch ALL completion state into a single render so Ink
-                        // processes the live-area change atomically.  Previously
-                        // isRunning, activityPhase, and onDone landed in separate
-                        // render batches, causing multiple live-area height changes
-                        // that confused Ink's cursor math and clipped content.
-                        setIsRunning(false);
-                        phaseRef.current = "idle";
-                        setActivityPhase("idle");
-                        // Call onDone HERE (not in finally) so its state updates
-                        // (doneStatus, flushing items to Static) are batched too.
-                        onDone?.(Date.now() - runStartRef.current, [...toolsUsedRef.current]);
-                        doneCalledRef.current = true;
-                        break;
                 }
             }
-        }
-        catch (err) {
-            const isAbort = err instanceof Error && (err.name === "AbortError" || err.message.includes("aborted"));
-            if (!isAbort) {
-                throw err;
-            }
-            wasAborted = true;
-        }
-        finally {
-            setIsRunning(false);
-            abortRef.current = null;
-            stopReveal();
-            stopThinkingReveal();
-            if (elapsedTimerRef.current) {
-                clearInterval(elapsedTimerRef.current);
-                elapsedTimerRef.current = null;
-            }
-            phaseRef.current = "idle";
-            setActivityPhase("idle");
-            if (wasAborted) {
-                // Flush any visible streaming text so onAborted (which adds
-                // "Request was stopped.") lands AFTER the agent's partial text
-                // in liveItems — not above it.
-                flushAllText();
-                if (textVisibleRef.current) {
-                    onTurnText?.(textVisibleRef.current, thinkingBufferRef.current, thinkingAccumRef.current);
+            catch (err) {
+                if (!isAbortError(err)) {
+                    throw err;
                 }
-                textPendingRef.current = "";
-                textVisibleRef.current = "";
-                thinkingBufferRef.current = "";
-                thinkingPendingRef.current = "";
-                thinkingVisibleRef.current = "";
-                setStreamingText("");
-                setStreamingThinking("");
-                onAborted?.();
+                wasAborted = true;
             }
-            else if (!doneCalledRef.current) {
-                // Safety fallback — normally agent_done calls onDone in-band
-                const durationMs = Date.now() - runStartRef.current;
-                onDone?.(durationMs, [...toolsUsedRef.current]);
+            finally {
+                // If the signal was aborted but the loop exited normally (e.g.
+                // agent_done fired right before the abort), treat it as aborted so
+                // the user sees "Request was stopped." instead of a duration verb.
+                if (!wasAborted && ac.signal.aborted) {
+                    wasAborted = true;
+                }
+                setIsRunning(false);
+                abortRef.current = null;
+                stopReveal();
+                stopThinkingReveal();
+                if (elapsedTimerRef.current) {
+                    clearInterval(elapsedTimerRef.current);
+                    elapsedTimerRef.current = null;
+                }
+                phaseRef.current = "idle";
+                setActivityPhase("idle");
+                if (wasAborted) {
+                    // Flush any visible streaming text so onAborted (which adds
+                    // "Request was stopped.") lands AFTER the agent's partial text
+                    // in liveItems — not above it.
+                    flushAllText();
+                    if (textVisibleRef.current) {
+                        onTurnText?.(textVisibleRef.current, thinkingBufferRef.current, thinkingAccumRef.current);
+                    }
+                    textPendingRef.current = "";
+                    textVisibleRef.current = "";
+                    thinkingBufferRef.current = "";
+                    thinkingPendingRef.current = "";
+                    thinkingVisibleRef.current = "";
+                    setStreamingText("");
+                    setStreamingThinking("");
+                    onAborted?.();
+                }
+                else if (!doneCalledRef.current) {
+                    // Safety fallback — normally agent_done calls onDone in-band
+                    const durationMs = Date.now() - runStartRef.current;
+                    onDone?.(durationMs, [...toolsUsedRef.current]);
+                }
+                // Notify parent of new messages
+                const newMsgs = messages.current.slice(startIndex);
+                onComplete?.(newMsgs);
             }
-            // Notify parent of new messages
-            const newMsgs = messages.current.slice(startIndex);
-            onComplete?.(newMsgs);
+            return wasAborted;
+        }; // end runSingle
+        // Run the initial message
+        const aborted = await runSingle(userContent);
+        // Drain the queue: process follow-up messages that arrived after agent_done.
+        // Most queued messages are consumed mid-run via getSteeringMessages, but
+        // messages that arrive after the agent finishes (no more tool calls to
+        // trigger steering) land here. Batch all remaining into a single run.
+        if (!aborted && queueRef.current.length > 0) {
+            const batch = queueRef.current.splice(0);
+            setQueuedCount(0);
+            const merged = mergeUserContent(batch);
+            // Let React process the onDone state updates before starting next run
+            await new Promise((r) => setTimeout(r, 100));
+            onQueuedStart?.(merged);
+            await runSingle(merged);
         }
     }, [
         messages,
@@ -444,6 +522,7 @@ export function useAgentLoop(messages, options, callbacks) {
         onTurnEnd,
         onDone,
         onAborted,
+        onQueuedStart,
         startReveal,
         stopReveal,
         startThinkingReveal,
@@ -466,6 +545,9 @@ export function useAgentLoop(messages, options, callbacks) {
         run,
         abort,
         reset,
+        queueMessage,
+        queuedCount,
+        clearQueue,
         isRunning,
         streamingText,
         streamingThinking,