@stigmer/react 3.0.8-dev.20260612122433 → 3.0.8-dev.20260613051837

package/src/execution/MessageThread.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { lazy, memo, Suspense, useCallback, useMemo } from "react";
+import { lazy, memo, Suspense, useCallback, useMemo, useState } from "react";
 import { create } from "@bufbuild/protobuf";
 import type { AgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
 import type { AgentMessage, ToolCall } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
@@ -60,6 +60,27 @@ export interface MessageThreadProps {
    * first snapshot.
    */
   readonly pendingUserMessage?: string | null;
+  /**
+   * Marks the pending user message as failed-to-send. The optimistic
+   * bubble renders an inline "Couldn't send — Retry" affordance instead
+   * of the sending indicator, so a failed follow-up never silently
+   * vanishes. Pair with {@link onRetrySend}.
+   *
+   * @default false
+   */
+  readonly pendingMessageFailed?: boolean;
+  /**
+   * Retry handler for a failed pending message. Wired to the inline
+   * "Retry" control when {@link pendingMessageFailed} is `true`.
+   */
+  readonly onRetrySend?: () => void;
+  /**
+   * Retry handler for a terminal-failed execution that exposed a server
+   * error reason. Receives the originating message; the consumer typically
+   * resends it as a new execution. When omitted, no Retry control is shown
+   * beside the surfaced failure reason.
+   */
+  readonly onRetryExecution?: (message: string) => void;
   /** Additional CSS class names for the root container. */
   readonly className?: string;
   /**
@@ -178,10 +199,11 @@ export interface MessageThreadProps {
  * part of the public API.
  */
 export type ThreadItem =
-  | { readonly kind: "message"; readonly message: AgentMessage; readonly key: string; readonly isPending?: boolean }
+  | { readonly kind: "message"; readonly message: AgentMessage; readonly key: string; readonly isPending?: boolean; readonly isFailed?: boolean }
   | { readonly kind: "tool-group"; readonly toolCalls: readonly ToolCall[]; readonly subAgentExecutions: readonly SubAgentExecution[]; readonly key: string }
   | { readonly kind: "sub-agent"; readonly subAgentExecution: SubAgentExecution; readonly key: string }
   | { readonly kind: "phase-badge"; readonly phase: ExecutionPhase; readonly key: string }
+  | { readonly kind: "execution-error"; readonly error: string; readonly retryMessage?: string; readonly key: string }
   | { readonly kind: "approval-request"; readonly pendingApproval: PendingApproval; readonly key: string }
   | { readonly kind: "setup-progress"; readonly workspaceEntries: readonly WorkspaceEntry[]; readonly serverPhase?: string; readonly isAwaitingResponse?: boolean; readonly key: string }
   | { readonly kind: "context-compacted"; readonly event: SummarizationEventView; readonly key: string }
@@ -216,6 +238,7 @@ export function buildThreadItems(
   includeApprovals: boolean,
   workspaceEntries: readonly WorkspaceEntry[] | undefined,
   summarizationEvents?: readonly SummarizationEventView[],
+  pendingMessageFailed = false,
 ): ThreadItem[] {
   const items: ThreadItem[] = [];
   const allExecutions = activeStreamExecution
@@ -393,6 +416,22 @@ export function buildThreadItems(
       phase: lastPhase,
       key: `phase-${lastPhase}`,
     });
+
+    // The server populates `status.error` only on EXECUTION_FAILED. Surface it
+    // beside the badge so a failure that produced no messages still explains
+    // itself (the CLI shows this reason; the chat previously showed nothing).
+    // Kept as its own item so the badge component stays presentational.
+    const reason = lastExec?.status?.error;
+    if (reason) {
+      const specMessage = lastExec?.spec?.message;
+      items.push({
+        kind: "execution-error",
+        error: reason,
+        retryMessage:
+          specMessage && specMessage !== "execute" ? specMessage : undefined,
+        key: `execution-error-${lastExec?.metadata?.id ?? lastPhase}`,
+      });
+    }
   }
 
   if (
@@ -430,7 +469,10 @@ export function buildThreadItems(
         kind: "message",
         message: syntheticPending,
         key: "pending-user-turn",
-        isPending: true,
+        // A failed turn shows the inline error instead of the dimmed
+        // sending state — the two are mutually exclusive.
+        isPending: !pendingMessageFailed,
+        isFailed: pendingMessageFailed,
       });
     }
   }
@@ -465,6 +507,9 @@ export function MessageThread({
   executions,
   activeStreamExecution,
   pendingUserMessage,
+  pendingMessageFailed = false,
+  onRetrySend,
+  onRetryExecution,
   className,
   formatToolCallSummary,
   onApprovalSubmit,
@@ -483,8 +528,8 @@ export function MessageThread({
 
   const includeApprovals = onApprovalSubmit != null;
   const items = useMemo(
-    () => buildThreadItems(executions, activeStreamExecution, pendingUserMessage, includeApprovals, workspaceEntries, summarizationEvents),
-    [executions, activeStreamExecution, pendingUserMessage, includeApprovals, workspaceEntries, summarizationEvents],
+    () => buildThreadItems(executions, activeStreamExecution, pendingUserMessage, includeApprovals, workspaceEntries, summarizationEvents, pendingMessageFailed),
+    [executions, activeStreamExecution, pendingUserMessage, includeApprovals, workspaceEntries, summarizationEvents, pendingMessageFailed],
   );
 
   useKeyStability(items);
@@ -517,6 +562,8 @@ export function MessageThread({
             org={org}
             planActionsDisabled={planActionsDisabled}
             centerContent={centerContent}
+            onRetrySend={onRetrySend}
+            onRetryExecution={onRetryExecution}
           />
         </Suspense>
       </div>
@@ -536,6 +583,8 @@ export function MessageThread({
       onBuildFromPlan={onBuildFromPlan}
       org={org}
       planActionsDisabled={planActionsDisabled}
+      onRetrySend={onRetrySend}
+      onRetryExecution={onRetryExecution}
     />
   );
 }
@@ -560,6 +609,8 @@ interface NonVirtualizedThreadProps {
   readonly onBuildFromPlan?: () => void;
   readonly org?: string;
   readonly planActionsDisabled?: boolean;
+  readonly onRetrySend?: () => void;
+  readonly onRetryExecution?: (message: string) => void;
 }
 
 function NonVirtualizedThread({
@@ -574,6 +625,8 @@ function NonVirtualizedThread({
   onBuildFromPlan,
   org,
   planActionsDisabled,
+  onRetrySend,
+  onRetryExecution,
 }: NonVirtualizedThreadProps) {
   const { scrollRef, sentinelRef, contentRef, isFollowing, jumpToLatest } =
     useAutoScroll();
@@ -609,6 +662,8 @@ function NonVirtualizedThread({
                   onBuildFromPlan={onBuildFromPlan}
                   org={org}
                   planActionsDisabled={planActionsDisabled}
+                  onRetrySend={onRetrySend}
+                  onRetryExecution={onRetryExecution}
                 />
               </ThreadItemWrapper>
             ))}
@@ -645,6 +700,8 @@ export interface ThreadItemRendererProps {
   readonly onBuildFromPlan?: () => void;
   readonly org?: string;
   readonly planActionsDisabled?: boolean;
+  readonly onRetrySend?: () => void;
+  readonly onRetryExecution?: (message: string) => void;
 }
 
 /**
@@ -666,9 +723,16 @@ export function ThreadItemRenderer({
   onBuildFromPlan,
   org,
   planActionsDisabled,
+  onRetrySend,
+  onRetryExecution,
 }: ThreadItemRendererProps) {
   switch (item.kind) {
     case "message":
+      if (item.isFailed) {
+        return (
+          <FailedUserMessage message={item.message} onRetry={onRetrySend} />
+        );
+      }
       return (
         <MessageEntry
           message={item.message}
@@ -697,6 +761,14 @@ export function ThreadItemRenderer({
           <ExecutionPhaseBadge phase={item.phase} />
         </div>
       );
+    case "execution-error":
+      return (
+        <ExecutionErrorNotice
+          error={item.error}
+          retryMessage={item.retryMessage}
+          onRetry={onRetryExecution}
+        />
+      );
     case "approval-request":
       return (
         <ApprovalCardRow
@@ -736,6 +808,103 @@ export function ThreadItemRenderer({
   }
 }
 
+// ---------------------------------------------------------------------------
+// FailedUserMessage — optimistic turn whose send failed
+// ---------------------------------------------------------------------------
+
+/**
+ * Renders a user message whose send failed: the message itself stays visible
+ * (so the typed text is never lost) with an inline, actionable error beneath
+ * it. The error copy is intentionally short — the full reason is surfaced by
+ * the consumer's send-error banner; this is the in-thread "Retry" affordance.
+ */
+function FailedUserMessage({
+  message,
+  onRetry,
+}: {
+  message: AgentMessage;
+  onRetry?: () => void;
+}) {
+  return (
+    <div className="flex flex-col gap-1">
+      <MessageEntry message={message} />
+      <div
+        role="alert"
+        className="mx-4 flex items-center gap-2 text-xs text-destructive"
+      >
+        <span className="min-w-0 flex-1 truncate">Couldn&rsquo;t send.</span>
+        {onRetry && (
+          <button
+            type="button"
+            onClick={onRetry}
+            className="shrink-0 rounded font-medium underline-offset-2 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          >
+            Retry
+          </button>
+        )}
+      </div>
+    </div>
+  );
+}
+
+// ---------------------------------------------------------------------------
+// ExecutionErrorNotice — server failure reason for a terminal-failed execution
+// ---------------------------------------------------------------------------
+
+/**
+ * Renders the server-reported failure reason (`AgentExecutionStatus.error`)
+ * for an execution that died — typically before producing any messages. The
+ * reason can be a long Temporal error, so it is clamped by default with a
+ * Show more / Show less toggle. An optional Retry resends the originating
+ * message as a fresh execution.
+ */
+function ExecutionErrorNotice({
+  error,
+  retryMessage,
+  onRetry,
+}: {
+  error: string;
+  retryMessage?: string;
+  onRetry?: (message: string) => void;
+}) {
+  const [expanded, setExpanded] = useState(false);
+  const canRetry = !!onRetry && !!retryMessage;
+
+  return (
+    <div
+      role="alert"
+      className="mx-4 flex flex-col gap-1.5 rounded-md bg-destructive-subtle px-3 py-2"
+    >
+      <p
+        className={cn(
+          "text-xs whitespace-pre-wrap break-words text-destructive",
+          !expanded && "line-clamp-3",
+        )}
+      >
+        {error}
+      </p>
+      <div className="flex items-center gap-3 text-xs">
+        <button
+          type="button"
+          onClick={() => setExpanded((v) => !v)}
+          className="font-medium text-muted-foreground underline-offset-2 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+        >
+          {expanded ? "Show less" : "Show more"}
+        </button>
+        {canRetry && (
+          <button
+            type="button"
+            onClick={() => onRetry!(retryMessage!)}
+            className="font-medium text-foreground underline-offset-2 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          >
+            Retry
+          </button>
+        )}
+      </div>
+    </div>
+  );
+}
+
 // ---------------------------------------------------------------------------
 // ApprovalCardRow — stabilizes the onSubmit callback for React.memo
 // ---------------------------------------------------------------------------

package/src/execution/__tests__/MessageThread.test.tsx

@@ -73,6 +73,7 @@ function makeExecution(opts: {
   phase?: ExecutionPhase;
   interactionMode?: InteractionMode;
   aiContent?: string;
+  error?: string;
 }): AgentExecution {
   const exec = create(AgentExecutionSchema);
 
@@ -91,6 +92,9 @@ function makeExecution(opts: {
 
   const status = create(AgentExecutionStatusSchema);
   status.phase = opts.phase ?? ExecutionPhase.EXECUTION_COMPLETED;
+  if (opts.error !== undefined) {
+    status.error = opts.error;
+  }
 
   const humanMsg = create(AgentMessageSchema);
   humanMsg.type = MessageType.MESSAGE_HUMAN;
@@ -246,6 +250,66 @@ describe("MessageThread", () => {
     expect(screen.getByText(/failed/i)).toBeTruthy();
   });
 
+  it("surfaces the server failure reason for a FAILED execution", () => {
+    const exec = makeExecution({
+      id: "exec-fail-reason",
+      phase: ExecutionPhase.EXECUTION_FAILED,
+      error: "Activity task timed out (RETRY_STATE_MAXIMUM_ATTEMPTS_REACHED)",
+    });
+
+    render(<MessageThread executions={[exec]} />);
+
+    expect(
+      screen.getByText(/Activity task timed out/i),
+    ).toBeTruthy();
+  });
+
+  it("does NOT surface a failure reason for a COMPLETED execution", () => {
+    const exec = makeExecution({
+      id: "exec-ok",
+      phase: ExecutionPhase.EXECUTION_COMPLETED,
+      error: "stale error that should be ignored",
+    });
+
+    render(<MessageThread executions={[exec]} />);
+
+    expect(screen.queryByText(/stale error/i)).toBeNull();
+  });
+
+  it("offers a Retry that resends the originating message on failure", () => {
+    const exec = makeExecution({
+      id: "exec-retry",
+      specMessage: "do the thing",
+      phase: ExecutionPhase.EXECUTION_FAILED,
+      error: "boom",
+    });
+    const onRetryExecution = vi.fn();
+
+    render(
+      <MessageThread executions={[exec]} onRetryExecution={onRetryExecution} />,
+    );
+
+    fireEvent.click(screen.getByRole("button", { name: /retry/i }));
+    expect(onRetryExecution).toHaveBeenCalledWith("do the thing");
+  });
+
+  it("renders a failed pending message with an inline Retry", () => {
+    const onRetrySend = vi.fn();
+
+    render(
+      <MessageThread
+        executions={[]}
+        pendingUserMessage="unsent message"
+        pendingMessageFailed
+        onRetrySend={onRetrySend}
+      />,
+    );
+
+    expect(screen.getByText("unsent message")).toBeTruthy();
+    fireEvent.click(screen.getByRole("button", { name: /retry/i }));
+    expect(onRetrySend).toHaveBeenCalledOnce();
+  });
+
   it("renders plan-completion card when last execution is completed Plan mode", () => {
     const exec = makeExecution({
       id: "exec-plan",

package/src/execution/__tests__/useExecutionStream.test.tsx

@@ -309,6 +309,21 @@ describe("useExecutionStream", () => {
     });
   });
 
+  it("does not auto-retry a non-transient error (goes straight to error)", async () => {
+    const { result } = renderHook(() => useExecutionStream("exec-1"), {
+      wrapper: createWrapper(mockStigmer),
+    });
+
+    // A deterministic error (plain Error, not transport noise) must not retry.
+    act(() => stream.fail(new Error("invalid argument")));
+
+    await waitFor(() => {
+      expect(result.current.error?.message).toBe("invalid argument");
+    });
+    expect(result.current.isReconnecting).toBe(false);
+    expect(subscribeFn).toHaveBeenCalledTimes(1);
+  });
+
   it("handles all terminal phases correctly", async () => {
     for (const terminalPhase of [
       ExecutionPhase.EXECUTION_COMPLETED,
@@ -337,3 +352,267 @@ describe("useExecutionStream", () => {
     }
   });
 });
+
+// ---------------------------------------------------------------------------
+// Auto-reconnect (#174)
+// ---------------------------------------------------------------------------
+
+describe("useExecutionStream — auto-reconnect", () => {
+  const IN_PROGRESS = ExecutionPhase.EXECUTION_IN_PROGRESS;
+  // Tiny backoff so retries fire near-instantly under real timers; avoids the
+  // fake-timer / `waitFor` interaction that makes such tests brittle.
+  const fastReconnect = { baseDelayMs: 5, maxDelayMs: 5 } as const;
+
+  it("auto-reconnects after a transient drop and keeps the last snapshot", async () => {
+    const s1 = createControllableStream<AgentExecution>();
+    const s2 = createControllableStream<AgentExecution>();
+    let call = 0;
+    const subscribeFn = vi.fn(() => (call++ === 0 ? s1.generator : s2.generator));
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () => useExecutionStream("exec-1", { reconnectOptions: fastReconnect }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    act(() => s1.push(makeSnapshot(IN_PROGRESS)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(true));
+
+    // WebKit's bare `TypeError: Load failed` — the #174 symptom.
+    act(() => s1.fail(new TypeError("Load failed")));
+
+    await waitFor(() => expect(result.current.isReconnecting).toBe(true));
+    // No error surfaced and the conversation stays visible while retrying.
+    expect(result.current.error).toBeNull();
+    expect(result.current.execution).not.toBeNull();
+
+    // Backoff elapses → the stream is re-subscribed (full snapshot resume).
+    await waitFor(() => expect(subscribeFn).toHaveBeenCalledTimes(2));
+
+    act(() => s2.push(makeSnapshot(IN_PROGRESS)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(true));
+    expect(result.current.isReconnecting).toBe(false);
+  });
+
+  it("auto-reconnects when the stream ends before a terminal phase", async () => {
+    const s1 = createControllableStream<AgentExecution>();
+    const s2 = createControllableStream<AgentExecution>();
+    let call = 0;
+    const subscribeFn = vi.fn(() => (call++ === 0 ? s1.generator : s2.generator));
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () => useExecutionStream("exec-1", { reconnectOptions: fastReconnect }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    act(() => s1.push(makeSnapshot(IN_PROGRESS)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(true));
+
+    // A graceful close of a still-running execution (idle timeout, LB recycle)
+    // must reconnect, never be reported as "complete".
+    act(() => s1.finish());
+
+    await waitFor(() => expect(subscribeFn).toHaveBeenCalledTimes(2));
+    expect(result.current.isReconnecting).toBe(true);
+    expect(result.current.error).toBeNull();
+  });
+
+  it("surfaces an error only after retries are exhausted", async () => {
+    const subscribeFn = vi.fn(
+      () =>
+        (async function* (): AsyncGenerator<AgentExecution> {
+          throw new TypeError("Load failed");
+        })(),
+    );
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () =>
+        useExecutionStream("exec-1", {
+          reconnectOptions: { baseDelayMs: 1, maxDelayMs: 1, maxAttempts: 2 },
+        }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    await waitFor(() => expect(result.current.error).not.toBeNull(), {
+      timeout: 2000,
+    });
+    expect(result.current.error?.message).toBe("Load failed");
+    expect(result.current.isReconnecting).toBe(false);
+    // 1 initial attempt + 2 retries.
+    expect(subscribeFn).toHaveBeenCalledTimes(3);
+  });
+
+  it("does not reconnect after a terminal snapshot", async () => {
+    const s1 = createControllableStream<AgentExecution>();
+    const subscribeFn = vi.fn(() => s1.generator);
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () => useExecutionStream("exec-1", { reconnectOptions: fastReconnect }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    act(() => s1.push(makeSnapshot(ExecutionPhase.EXECUTION_COMPLETED)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(false));
+
+    await new Promise((r) => setTimeout(r, 30));
+    expect(subscribeFn).toHaveBeenCalledTimes(1);
+    expect(result.current.isReconnecting).toBe(false);
+  });
+
+  it("does not re-subscribe when unmounted during backoff", async () => {
+    const randomSpy = vi.spyOn(Math, "random").mockReturnValue(1); // full delay
+    const subscribeFn = vi.fn(
+      () =>
+        (async function* (): AsyncGenerator<AgentExecution> {
+          throw new TypeError("Load failed");
+        })(),
+    );
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result, unmount } = renderHook(
+      () =>
+        useExecutionStream("exec-1", {
+          reconnectOptions: { baseDelayMs: 1_000, maxDelayMs: 1_000 },
+        }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    await waitFor(() => expect(result.current.isReconnecting).toBe(true));
+    expect(subscribeFn).toHaveBeenCalledTimes(1);
+
+    unmount();
+    await new Promise((r) => setTimeout(r, 50));
+    expect(subscribeFn).toHaveBeenCalledTimes(1);
+
+    randomSpy.mockRestore();
+  });
+
+  it("respects autoReconnect: false (immediate error, no retry)", async () => {
+    const s1 = createControllableStream<AgentExecution>();
+    const subscribeFn = vi.fn(() => s1.generator);
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () => useExecutionStream("exec-1", { autoReconnect: false }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    act(() => s1.push(makeSnapshot(IN_PROGRESS)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(true));
+
+    act(() => s1.fail(new TypeError("Load failed")));
+    await waitFor(() => expect(result.current.error).not.toBeNull());
+    expect(result.current.isReconnecting).toBe(false);
+    expect(subscribeFn).toHaveBeenCalledTimes(1);
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Watchdog (#175) — silent connect timeout + slow-stall hint
+// ---------------------------------------------------------------------------
+
+describe("useExecutionStream — watchdog", () => {
+  const IN_PROGRESS = ExecutionPhase.EXECUTION_IN_PROGRESS;
+
+  it("self-heals once then surfaces connectTimedOut on a silent connect", async () => {
+    // Every subscribe returns a stream that never delivers a snapshot.
+    const subscribeFn = vi.fn(
+      () => createControllableStream<AgentExecution>().generator,
+    );
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () =>
+        useExecutionStream("exec-1", {
+          connectTimeoutMs: 20,
+          slowThresholdMs: 10_000,
+        }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    // First timeout self-heals silently (no surfaced signal, a 2nd subscribe).
+    await waitFor(() => expect(subscribeFn).toHaveBeenCalledTimes(2));
+    // Second timeout surfaces the actionable signal — but never an error.
+    await waitFor(() => expect(result.current.connectTimedOut).toBe(true), {
+      timeout: 2000,
+    });
+    expect(result.current.error).toBeNull();
+  });
+
+  it("reconnect() clears connectTimedOut and re-subscribes", async () => {
+    const subscribeFn = vi.fn(
+      () => createControllableStream<AgentExecution>().generator,
+    );
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () =>
+        useExecutionStream("exec-1", {
+          connectTimeoutMs: 20,
+          slowThresholdMs: 10_000,
+        }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    await waitFor(() => expect(result.current.connectTimedOut).toBe(true), {
+      timeout: 2000,
+    });
+
+    const before = subscribeFn.mock.calls.length;
+    act(() => result.current.reconnect());
+
+    expect(result.current.connectTimedOut).toBe(false);
+    await waitFor(() =>
+      expect(subscribeFn.mock.calls.length).toBeGreaterThan(before),
+    );
+  });
+
+  it("flips isSlow on a silent live stream and clears it on the next snapshot", async () => {
+    const s = createControllableStream<AgentExecution>();
+    const subscribeFn = vi.fn(() => s.generator);
+    const stigmer = createMockStigmer(
+      subscribeFn as unknown as Stigmer["agentExecution"]["subscribe"],
+    );
+
+    const { result } = renderHook(
+      () =>
+        useExecutionStream("exec-1", {
+          connectTimeoutMs: 10_000,
+          slowThresholdMs: 20,
+        }),
+      { wrapper: createWrapper(stigmer) },
+    );
+
+    act(() => s.push(makeSnapshot(IN_PROGRESS)));
+    await waitFor(() => expect(result.current.isStreaming).toBe(true));
+
+    await waitFor(() => expect(result.current.isSlow).toBe(true), {
+      timeout: 2000,
+    });
+
+    // A terminal snapshot resolves the stall deterministically (no re-arm).
+    // The non-terminal "next snapshot clears + re-arms" path is covered without
+    // timing races in the StreamController unit test.
+    act(() => s.push(makeSnapshot(ExecutionPhase.EXECUTION_COMPLETED)));
+    await waitFor(() => expect(result.current.isSlow).toBe(false));
+  });
+});