@agent-native/toolkit 0.204.0 → 0.204.1-nightly-20261008034100

package/src/app/chat/AgentKitAssistantChat.tsx

@@ -169,7 +169,9 @@ import {
 } from "./chat/tool-call-display.js";
 import { resolveAgentKitToolSource } from "./chat/tool-integration.js";
 import { ExternalAgentNudge } from "./external-agent-host.js";
+import { formatFeedbackReport } from "./feedback-report.js";
 import { FileStorageSetupPopover } from "./FileStorageSetupPopover.js";
+import { reconcileSettledRun } from "./reconcile-settled-run.js";
 import { RunStuckBanner } from "./RunStuckBanner.js";
 import { ThinkingDisplayProvider } from "./thinking-display.js";
 
@@ -856,6 +858,11 @@ export const AgentKitAssistantChat = forwardRef<
         shortcut: "{{shortcut}}",
       }),
       feedbackSubmit: t("agentChat.feedback.submit"),
+      feedbackReasonMisread: t("agentChat.feedback.reasonMisread"),
+      feedbackReasonNotDone: t("agentChat.feedback.reasonNotDone"),
+      feedbackReasonWrongNumbers: t("agentChat.feedback.reasonWrongNumbers"),
+      feedbackReasonTooSlow: t("agentChat.feedback.tooSlow"),
+      feedbackCopyDetails: t("agentChat.feedback.copyDetails"),
       fork: t("agentChat.message.forkChat"),
       previousBranch: t("agentChat.message.previousBranch"),
       nextBranch: t("agentChat.message.nextBranch"),
@@ -863,6 +870,8 @@ export const AgentKitAssistantChat = forwardRef<
       error: t("agentChat.error.failed"),
       renderError: t("agentChat.error.render"),
       runFailed: t("agentChat.error.failed"),
+      continueRun: t("agentChat.common.continue"),
+      continueRunUnavailable: t("agentChat.recovery.continueUnavailable"),
       reconnect: t("agentChat.agentPanel.chatgptSubscriptionReconnect"),
       reasoning: t("agentChat.status.thinking"),
       expandActivity: t("agentChat.common.expand"),
@@ -1202,6 +1211,7 @@ export const AgentKitAssistantChat = forwardRef<
           labels={labels}
           branchNavigation={props.branchNavigation}
           loadRunUsage={loadRunUsage}
+          buildFeedbackReport={formatFeedbackReport}
           onThreadForked={(thread) => props.onForkedThread?.(thread.id)}
           onCopyMessage={({ text }) => {
             const html = renderMarkdownToClipboardHtml(text);
@@ -1522,6 +1532,15 @@ const AgentKitAssistantChatBody = forwardRef<
     () => hasActiveAgentRuns(controller.getThread(threadId)),
     [controller, threadId],
   );
+  const reconcileServerSettled = useCallback(
+    () =>
+      reconcileSettledRun({
+        load: control.load,
+        getThread: () => controller.getThread(threadId),
+        tabId: props.tabId ?? threadId,
+      }),
+    [control.load, controller, props.tabId, threadId],
+  );
 
   useEffect(() => {
     if (previousPrefillRevisionRef.current === prefillRevision) return;
@@ -3141,6 +3160,7 @@ const AgentKitAssistantChatBody = forwardRef<
           )
         }
         isAwaitingResponse={() => isRunning}
+        onServerSettled={reconcileServerSettled}
         onRetry={() =>
           void sendRecoveryMessage(RECOVERY_CONTINUE_PROMPT, "continue")
         }
@@ -4607,6 +4627,7 @@ function AgentKitRunFailure({
   const surface = useAgentKitSurface();
   const t = useT();
   const [dismissed, setDismissed] = useState<string | null>(null);
+  const [continueFailed, setContinueFailed] = useState(false);
   const authErrorReason =
     error.code === "unauthorized" || error.code === "http_401"
       ? "session-expired"
@@ -4690,6 +4711,17 @@ function AgentKitRunFailure({
     );
   }
   if (wasRetried(thread.messages, runId)) return null;
+  // Continuing resumes the stopped run's own turn, so finished steps are not
+  // run again; that needs it to still be the turn's newest run.
+  const continueStoppedRun = control.canContinueRun
+    ? superseded
+      ? undefined
+      : () => {
+          setContinueFailed(false);
+          control.continueRun(runId).catch(() => setContinueFailed(true));
+        }
+    : () =>
+        void surface.sendRecoveryMessage(RECOVERY_CONTINUE_PROMPT, "continue");
   const info: RunErrorInfo = {
     message: formatAgentKitErrorText(error, t),
     errorCode: error.code,
@@ -4700,8 +4732,9 @@ function AgentKitRunFailure({
   return (
     <RunErrorRecoveryCard
       info={info}
-      onContinue={() =>
-        void surface.sendRecoveryMessage(RECOVERY_CONTINUE_PROMPT, "continue")
+      onContinue={continueStoppedRun}
+      continueError={
+        continueFailed ? t("agentChat.recovery.continueUnavailable") : null
       }
       onRetry={() => void retryFailedTurn()}
       retryHasUnavailableAttachment={retryRequest.hasUnavailableAttachment}

package/src/app/chat/AgentPanel.header.spec.ts

@@ -9,7 +9,7 @@ import {
 } from "@agent-native/toolkit/ui/dropdown-menu";
 import React, { act } from "react";
 import { createRoot, type Root } from "react-dom/client";
-import { MemoryRouter, useLocation } from "react-router";
+import { MemoryRouter, useHref, useLocation } from "react-router";
 import { describe, expect, it, vi } from "vitest";
 
 import {
@@ -445,6 +445,45 @@ describe("AgentPanel settings navigation", () => {
     }
   });
 
+  it("keeps a settings request inside the mounted app path", () => {
+    const container = document.createElement("div");
+    document.body.appendChild(container);
+    const root: Root = createRoot(container);
+    let href = "";
+
+    function LocationProbe() {
+      const location = useLocation();
+      href = useHref(`${location.pathname}${location.hash}`);
+      return null;
+    }
+
+    try {
+      vi.stubEnv("VITE_APP_BASE_PATH", "/dispatch");
+      act(() => {
+        window.history.replaceState(null, "", "/dispatch/chat#llm");
+        root.render(
+          React.createElement(
+            MemoryRouter,
+            { basename: "/dispatch", initialEntries: ["/dispatch/chat#llm"] },
+            React.createElement(AgentPanelSettingsNavigation),
+            React.createElement(LocationProbe),
+          ),
+        );
+      });
+
+      act(() => {
+        window.dispatchEvent(new CustomEvent("agent-panel:open-settings"));
+      });
+
+      expect(href).toBe("/dispatch/settings#llm");
+    } finally {
+      act(() => root.unmount());
+      container.remove();
+      window.history.replaceState(null, "", "/");
+      vi.unstubAllEnvs();
+    }
+  });
+
   it("routes a mounted settings request to an existing secret-specific hash", () => {
     const container = document.createElement("div");
     document.body.appendChild(container);
@@ -532,7 +571,7 @@ describe("AgentPanel settings navigation", () => {
     }
   });
 
-  it("preserves the app base path when opening settings", () => {
+  it("navigates with a router-local settings path", () => {
     const container = document.createElement("div");
     document.body.appendChild(container);
     const root: Root = createRoot(container);
@@ -545,11 +584,10 @@ describe("AgentPanel settings navigation", () => {
 
     try {
       act(() => {
-        window.history.replaceState(null, "", "/dispatch/_agent-native/poll");
         root.render(
           React.createElement(
             MemoryRouter,
-            { initialEntries: ["/"] },
+            { initialEntries: ["/chat"] },
             React.createElement(AgentPanelSettingsNavigation),
             React.createElement(LocationProbe),
           ),
@@ -564,11 +602,10 @@ describe("AgentPanel settings navigation", () => {
         );
       });
 
-      expect(pathname).toBe("/dispatch/settings");
+      expect(pathname).toBe("/settings");
     } finally {
       act(() => root.unmount());
       container.remove();
-      window.history.replaceState(null, "", "/");
     }
   });
 
@@ -1134,7 +1171,6 @@ describe("AgentChatSurface chrome defaults", () => {
     expect(source).not.toContain("SettingsPanel");
     expect(source).not.toContain("allowSettingsMode");
     expect(source).not.toContain('mode === "settings"');
-    expect(source).toContain('pathname: appPath("/settings")');
   });
 
   it("mounts URL command sync for a full-page chat surface", () => {

package/src/app/chat/AgentPanel.tsx

@@ -199,7 +199,7 @@ export function AgentPanelSettingsNavigation({
       const requested = requestedSettingsSection(section, window.location.hash);
       const navigation = navigate(
         {
-          pathname: appPath("/settings"),
+          pathname: "/settings",
           hash: settingsRouteHashForSection(section, window.location.hash),
         },
         // The hash can't tell API keys from Integrations; the redesigned

package/src/app/chat/RunStuckBanner.spec.tsx

@@ -1,5 +1,6 @@
 // @vitest-environment happy-dom
 
+import type { RunStuckState } from "@agent-native/core/client/agent-chat";
 import { act } from "react";
 import { createRoot, type Root } from "react-dom/client";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
@@ -8,20 +9,42 @@ import { RunStuckBanner } from "./RunStuckBanner.js";
 
 const trackEventMock = vi.hoisted(() => vi.fn());
 
+const STUCK_STATE: RunStuckState = {
+  isStuck: true,
+  runId: "run-1",
+  status: "running",
+  lastProgressAt: 0,
+  stuckSinceMs: 90_000,
+  lastProgressSeq: 1,
+  heartbeatAt: null,
+  heartbeatSinceMs: null,
+  dispatchMode: null,
+  hasInFlightWork: false,
+  serverSettled: false,
+  statusUnreadable: false,
+};
+
+const SETTLED_STATE: RunStuckState = {
+  ...STUCK_STATE,
+  isStuck: false,
+  status: "idle",
+  stuckSinceMs: null,
+  serverSettled: true,
+};
+
+const hookState = vi.hoisted(() => ({
+  current: null as RunStuckState | null,
+  awaitingResponse: undefined as boolean | undefined,
+}));
+
+const abortRunMock = vi.hoisted(() => vi.fn(async () => null));
+
 vi.mock("@agent-native/core/client/agent-chat", () => ({
-  useRunStuckDetection: () => ({
-    isStuck: true,
-    runId: "run-1",
-    status: "running",
-    lastProgressAt: 0,
-    stuckSinceMs: 90_000,
-    lastProgressSeq: 1,
-    heartbeatAt: null,
-    heartbeatSinceMs: null,
-    dispatchMode: null,
-    hasInFlightWork: false,
-  }),
-  useAbortRun: () => vi.fn(),
+  useRunStuckDetection: (options: { awaitingResponse?: boolean }) => {
+    hookState.awaitingResponse = options.awaitingResponse;
+    return hookState.current;
+  },
+  useAbortRun: () => abortRunMock,
 }));
 
 vi.mock("@agent-native/core/client/analytics", () => ({
@@ -38,28 +61,246 @@ describe("RunStuckBanner", () => {
 
   beforeEach(() => {
     vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
+    vi.useFakeTimers({ toFake: ["Date"] });
+    vi.setSystemTime(1_000_000);
+    trackEventMock.mockClear();
+    abortRunMock.mockClear();
+    window.localStorage.clear();
+    hookState.current = STUCK_STATE;
     container = document.createElement("div");
     document.body.appendChild(container);
+    root = createRoot(container);
   });
 
   afterEach(() => {
+    act(() => root.unmount());
     container.remove();
+    vi.useRealTimers();
     vi.unstubAllGlobals();
   });
 
+  async function render(props: Parameters<typeof RunStuckBanner>[0]) {
+    await act(async () => {
+      root.render(<RunStuckBanner {...props} />);
+    });
+  }
+
   it("reports a stuck run once, even when the chat view remounts", async () => {
     for (let mount = 0; mount < 2; mount += 1) {
-      root = createRoot(container);
+      const remounted = createRoot(document.createElement("div"));
       await act(async () => {
-        root.render(<RunStuckBanner threadId="thread-1" />);
+        remounted.render(<RunStuckBanner threadId="thread-1" />);
       });
-      await act(async () => root.unmount());
+      await act(async () => remounted.unmount());
     }
 
     expect(trackEventMock).toHaveBeenCalledTimes(1);
     expect(trackEventMock).toHaveBeenCalledWith(
       "agent_chat_stuck_detected",
-      expect.objectContaining({ runId: "run-1", threadId: "thread-1" }),
+      expect.objectContaining({
+        runId: "run-1",
+        threadId: "thread-1",
+        reason: "no_progress",
+        dispatchMode: null,
+        hasInFlightWork: false,
+      }),
+    );
+  });
+
+  const isAwaitingResponse = () => true;
+
+  describe("when the server stops tracking a run the chat shows as running", () => {
+    beforeEach(() => {
+      hookState.current = SETTLED_STATE;
+    });
+
+    it("reloads the thread once and says nothing when that settles the chat", async () => {
+      const onServerSettled = vi.fn(async () => "settled" as const);
+
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+
+      expect(onServerSettled).toHaveBeenCalledTimes(1);
+      expect(container.textContent).toBe("");
+    });
+
+    it("does not reconcile a host that cannot say whether the chat is waiting", async () => {
+      const onServerSettled = vi.fn(async () => "settled" as const);
+
+      await render({ threadId: "thread-1", onServerSettled });
+
+      expect(onServerSettled).not.toHaveBeenCalled();
+    });
+
+    it("does nothing for a chat that is not waiting on a response", async () => {
+      const onServerSettled = vi.fn(async () => "settled" as const);
+
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse: () => false,
+      });
+
+      expect(onServerSettled).not.toHaveBeenCalled();
+      expect(container.textContent).toBe("");
+    });
+
+    it("tells the user when the reload could not settle the chat, and retries at a bounded pace", async () => {
+      const onServerSettled = vi.fn(async () => "still_running" as const);
+
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      expect(container.textContent).toContain(
+        "agentChat.recovery.statusMismatch",
+      );
+      expect(container.textContent).toContain("agentChat.recovery.reload");
+      expect(container.textContent).not.toContain("recovery.stuckTitle");
+
+      // Every poll hands the banner a fresh state object.
+      vi.setSystemTime(1_015_000);
+      hookState.current = { ...SETTLED_STATE };
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      expect(onServerSettled).toHaveBeenCalledTimes(1);
+
+      vi.setSystemTime(1_031_000);
+      hookState.current = { ...SETTLED_STATE };
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      expect(onServerSettled).toHaveBeenCalledTimes(2);
+    });
+
+    it("tells the detector whether the chat is waiting, so a settle predating the wait is dropped", async () => {
+      await render({ threadId: "thread-1", isAwaitingResponse: () => true });
+      expect(hookState.awaitingResponse).toBe(true);
+
+      await render({ threadId: "thread-1", isAwaitingResponse: () => false });
+      expect(hookState.awaitingResponse).toBe(false);
+
+      await render({ threadId: "thread-1" });
+      expect(hookState.awaitingResponse).toBeUndefined();
+    });
+
+    it("ignores a reload that finishes after the server started a run again", async () => {
+      let finishReload: (outcome: "still_running") => void = () => {};
+      const onServerSettled = vi.fn(
+        () =>
+          new Promise<"still_running">((resolve) => {
+            finishReload = resolve;
+          }),
+      );
+
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      expect(onServerSettled).toHaveBeenCalledTimes(1);
+
+      hookState.current = {
+        ...STUCK_STATE,
+        isStuck: false,
+        serverSettled: false,
+      };
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+      await act(async () => finishReload("still_running"));
+
+      expect(container.textContent).toBe("");
+    });
+
+    it("shows an unreadable status, not a finished chat, when the reload itself fails", async () => {
+      const onServerSettled = vi.fn(async () => {
+        throw new Error("thread unavailable");
+      });
+
+      await render({
+        threadId: "thread-1",
+        onServerSettled,
+        isAwaitingResponse,
+      });
+
+      expect(container.textContent).toContain(
+        "agentChat.recovery.statusUnreadable",
+      );
+      expect(container.textContent).not.toContain(
+        "agentChat.recovery.statusMismatch",
+      );
+    });
+  });
+
+  it("shows an unreadable status when the run's status cannot be fetched", async () => {
+    hookState.current = {
+      ...STUCK_STATE,
+      isStuck: false,
+      stuckSinceMs: null,
+      statusUnreadable: true,
+    };
+
+    await render({ threadId: "thread-1" });
+    expect(container.textContent).toContain(
+      "agentChat.recovery.statusUnreadable",
+    );
+    expect(container.textContent).not.toContain("recovery.stuckTitle");
+    expect(container.textContent).not.toContain("agentChat.recovery.reload");
+
+    await render({ threadId: "thread-1", isAwaitingResponse: () => false });
+    expect(container.textContent).toBe("");
+
+    // A host that cannot say whether the chat waits only doubts a run it saw.
+    hookState.current = { ...hookState.current!, status: "idle", runId: null };
+    await render({ threadId: "thread-1" });
+    expect(container.textContent).toBe("");
+  });
+
+  it("shows the unreadable status, not a stuck banner, when the status is unreadable", async () => {
+    hookState.current = { ...STUCK_STATE, statusUnreadable: true };
+
+    await render({ threadId: "thread-1" });
+
+    expect(container.textContent).toContain(
+      "agentChat.recovery.statusUnreadable",
     );
+    expect(container.textContent).not.toContain(
+      "agentChat.recovery.stuckTitle",
+    );
+    expect(container.querySelectorAll("button")).toHaveLength(0);
+  });
+
+  it("does not auto-abort a run on a stuck verdict it cannot confirm", async () => {
+    const props = {
+      threadId: "thread-auto-retry",
+      autoRetry: true,
+      autoRetryOwnerId: "owner-1",
+    };
+    hookState.current = { ...STUCK_STATE, statusUnreadable: true };
+
+    await render(props);
+    expect(abortRunMock).not.toHaveBeenCalled();
+
+    hookState.current = { ...STUCK_STATE };
+    await render(props);
+    await act(async () => {});
+    expect(abortRunMock).toHaveBeenCalledWith("run-1", "auto_stuck_retry");
   });
 });

package/src/app/chat/RunStuckBanner.tsx

@@ -18,11 +18,20 @@ export interface RunStuckBannerProps {
   hasInFlightWork?: () => boolean;
   isAwaitingResponse?: () => boolean;
   onStuckStateChange?: (state: RunStuckState) => void;
+  /**
+   * The server has stopped tracking a run this chat still shows as running.
+   * Resolves `settled` once the chat no longer shows it running; rejects when
+   * the thread could not be refreshed.
+   */
+  onServerSettled?: () => Promise<RunReconcileOutcome>;
   autoRetry?: boolean;
   autoRetryOwnerId?: string;
   className?: string;
 }
 
+export type RunReconcileOutcome = "settled" | "still_running";
+
+const RECONCILE_RETRY_MS = 30_000;
 const AUTO_RETRY_CLAIM_TTL_MS = 5 * 60 * 1000;
 const BACKGROUND_WORKER_FRESH_HEARTBEAT_MS = 30_000;
 
@@ -123,6 +132,7 @@ export function RunStuckBanner({
   stuckThresholdMs,
   onRetry,
   onStuckStateChange,
+  onServerSettled,
   autoRetry = false,
   autoRetryOwnerId,
   hasInFlightWork,
@@ -130,9 +140,11 @@ export function RunStuckBanner({
   className,
 }: RunStuckBannerProps) {
   const t = useT();
+  const chatAwaiting = isAwaitingResponse?.();
   const state = useRunStuckDetection({
     threadId,
     enabled,
+    awaitingResponse: chatAwaiting,
     stuckThresholdMs,
     apiUrl,
   });
@@ -148,9 +160,13 @@ export function RunStuckBanner({
   const backgroundWorkerStillAlive = isFreshBackgroundWorker(state);
   const inFlightWork =
     state.hasInFlightWork === true || (hasInFlightWork?.() ?? false);
-  const awaitingResponse = isAwaitingResponse?.() ?? true;
+  const awaitingResponse = chatAwaiting ?? true;
+  // While the status is unreadable `isStuck` is the last answer carried forward
+  // by the clock, not a fresh one: only the unreadable notice may speak, and
+  // nothing may abort a run on it.
+  const isStuck = state.isStuck && !state.statusUnreadable;
   const showsStuckBanner =
-    state.isStuck &&
+    isStuck &&
     !!state.runId &&
     !backgroundWorkerStillAlive &&
     !inFlightWork &&
@@ -159,6 +175,50 @@ export function RunStuckBanner({
     state.dispatchMode === "foreground-self-chain" ||
     state.dispatchMode?.startsWith("background") === true;
 
+  // Only a host that says when the chat is waiting can tell a lost ending from
+  // an idle chat, so reconciling needs `isAwaitingResponse`.
+  const chatShowsRunning = isAwaitingResponse != null && awaitingResponse;
+  const settledWhileRunning = chatShowsRunning && state.serverSettled;
+  const [reconcile, setReconcile] = useState<"idle" | "failed" | "unsettled">(
+    "idle",
+  );
+  const lastReconcileAtRef = useRef(0);
+  const reconcileEpochRef = useRef(0);
+  const mountedRef = useRef(true);
+  useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  // `state` changes on every poll, so a reconcile that did not settle the chat
+  // is retried at most once per RECONCILE_RETRY_MS, never in a loop.
+  useEffect(() => {
+    if (!settledWhileRunning || !onServerSettled) {
+      // A reload still in flight answers a chat that has since moved on.
+      reconcileEpochRef.current += 1;
+      lastReconcileAtRef.current = 0;
+      setReconcile("idle");
+      return;
+    }
+    const now = Date.now();
+    if (now - lastReconcileAtRef.current < RECONCILE_RETRY_MS) return;
+    lastReconcileAtRef.current = now;
+    const epoch = reconcileEpochRef.current;
+    const current = () =>
+      mountedRef.current && epoch === reconcileEpochRef.current;
+    onServerSettled().then(
+      (outcome) => {
+        if (current()) {
+          setReconcile(outcome === "settled" ? "idle" : "unsettled");
+        }
+      },
+      () => {
+        if (current()) setReconcile("failed");
+      },
+    );
+  }, [onServerSettled, settledWhileRunning, state]);
+
   const lastReportedRef = useRef<{
     isStuck: boolean;
     runId: string | null;
@@ -185,6 +245,13 @@ export function RunStuckBanner({
           ? Math.floor(state.stuckSinceMs / 1000)
           : null,
       runStatus: state.status,
+      reason: "no_progress",
+      dispatchMode: state.dispatchMode,
+      hasInFlightWork: state.hasInFlightWork,
+      heartbeatSinceSec:
+        state.heartbeatSinceMs != null
+          ? Math.floor(state.heartbeatSinceMs / 1000)
+          : null,
     });
   }, [showsStuckBanner, state, threadId]);
 
@@ -204,7 +271,7 @@ export function RunStuckBanner({
       backgroundWorkerStillAlive ||
       inFlightWork ||
       !awaitingResponse ||
-      !state.isStuck ||
+      !isStuck ||
       !state.runId ||
       busy.type !== "none" ||
       autoRetriedRunIdsRef.current.has(state.runId)
@@ -239,9 +306,9 @@ export function RunStuckBanner({
     busy,
     inFlightWork,
     isServerContinuedDispatch,
+    isStuck,
     onRetry,
     ownerId,
-    state.isStuck,
     state.runId,
     state.stuckSinceMs,
     threadId,
@@ -249,7 +316,42 @@ export function RunStuckBanner({
   ]);
 
   if (!showsStuckBanner) {
-    return null;
+    const notice =
+      reconcile === "unsettled"
+        ? "agentChat.recovery.statusMismatch"
+        : (isAwaitingResponse
+              ? awaitingResponse
+              : state.status === "running") &&
+            (state.statusUnreadable || reconcile === "failed")
+          ? "agentChat.recovery.statusUnreadable"
+          : null;
+    if (!notice) return null;
+    return (
+      <div
+        role="status"
+        aria-live="polite"
+        className={cn(
+          "mx-3 mt-2 flex items-center gap-2.5 rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2.5 text-xs text-foreground",
+          className,
+        )}
+      >
+        <IconAlertTriangle
+          size={16}
+          className="shrink-0 text-amber-500"
+          aria-hidden="true"
+        />
+        <span className="min-w-0 flex-1 leading-snug">{t(notice)}</span>
+        {reconcile === "unsettled" ? (
+          <button
+            type="button"
+            onClick={() => window.location.reload()}
+            className="inline-flex h-7 shrink-0 cursor-pointer items-center rounded-md bg-foreground px-2.5 text-[11px] font-medium text-background transition-colors hover:bg-foreground/90"
+          >
+            {t("agentChat.recovery.reload")}
+          </button>
+        ) : null}
+      </div>
+    );
   }
 
   const handleCancel = async () => {