@nextclaw/ui 0.15.21 → 0.15.23

package/src/features/chat/components/layout/__tests__/chat-sidebar-toolbar.test.tsx

@@ -37,11 +37,17 @@ describe("ChatSidebarToolbar", () => {
     render(<ChatSidebarDesktopToolbar {...toolbarProps} />);
 
     expect(searchIconClassName()).toContain("pointer-events-none");
+    expect(
+      screen.getByPlaceholderText("Search conversations...").className,
+    ).toContain("border-0");
   });
 
   it("keeps mobile search icon transparent to pointer input", () => {
     render(<ChatSidebarMobileToolbar {...toolbarProps} />);
 
     expect(searchIconClassName()).toContain("pointer-events-none");
+    expect(
+      screen.getByPlaceholderText("Search conversations...").className,
+    ).toContain("border-0");
   });
 });

package/src/features/chat/components/layout/__tests__/chat-sidebar.test.tsx

@@ -81,6 +81,9 @@ function expectCodexSelectedInSessionTypeMenu() {
     screen.getByRole("button", { name: /Codex/i }).getAttribute("aria-pressed"),
   ).toBe("true");
 }
+function expectSessionCreated(sessionType: string, projectRoot?: string) {
+  expect(mocks.createSession).toHaveBeenCalledWith({ projectRoot, sessionType });
+}
 
 vi.mock("@/features/chat/components/providers/chat-presenter.provider", () => ({
   usePresenter: () => ({
@@ -249,7 +252,7 @@ describe("ChatSidebar create and list basics", () => {
 
     fireEvent.click(screen.getByRole("button", { name: "New Task" }));
 
-    expect(mocks.createSession).toHaveBeenCalledWith("codex", undefined);
+    expectSessionCreated("codex");
   });
 
   it("hydrates the desktop new-session type from stored preferences", async () => {
@@ -265,7 +268,7 @@ describe("ChatSidebar create and list basics", () => {
 
     fireEvent.click(screen.getByRole("button", { name: "New Task" }));
 
-    expect(mocks.createSession).toHaveBeenCalledWith("codex", undefined);
+    expectSessionCreated("codex");
   });
 
   it("does not animate the desktop create task button width during runtime option hydration", () => {
@@ -311,7 +314,7 @@ describe("ChatSidebar create and list basics", () => {
   it("renders the lightweight list mode switch in the session header row and toggles to project view", () => {
     renderSidebar();
 
-    expect(screen.getByText("Sessions")).not.toBeNull();
+    expect(screen.queryByText("Sessions")).toBeNull();
     fireEvent.click(screen.getByRole("button", { name: "Project" }));
 
     expect(mocks.setListMode).toHaveBeenCalledWith("project-first");
@@ -332,7 +335,7 @@ describe("ChatSidebar create and list basics", () => {
     fireEvent.click(screen.getByText("Codex"));
 
     expect(mocks.setQuery).toHaveBeenCalledWith("release notes");
-    expect(mocks.createSession).toHaveBeenCalledWith("codex", undefined);
+    expectSessionCreated("codex");
     expect(mocks.goToChatRoot).not.toHaveBeenCalled();
   });
 
@@ -377,7 +380,7 @@ describe("ChatSidebar create and list basics", () => {
 
     fireEvent.click(screen.getByRole("button", { name: "New Task" }));
 
-    expect(mocks.createSession).toHaveBeenCalledWith("native", undefined);
+    expectSessionCreated("native");
     expect(mocks.goToChatRoot).not.toHaveBeenCalled();
   });
 
@@ -582,10 +585,7 @@ describe("ChatSidebar project-first mode", () => {
     );
     fireEvent.click(screen.getByText("Codex"));
 
-    expect(mocks.createSession).toHaveBeenCalledWith(
-      "codex",
-      "/tmp/project-beta",
-    );
+    expectSessionCreated("codex", "/tmp/project-beta");
     expect(mocks.goToSession).not.toHaveBeenCalled();
   });
 
@@ -617,10 +617,7 @@ describe("ChatSidebar project-first mode", () => {
       screen.getByRole("button", { name: "New Task · project-gamma" }),
     );
 
-    expect(mocks.createSession).toHaveBeenCalledWith(
-      "native",
-      "/tmp/project-gamma",
-    );
+    expectSessionCreated("native", "/tmp/project-gamma");
     expect(mocks.goToSession).not.toHaveBeenCalled();
   });
 
@@ -652,10 +649,7 @@ describe("ChatSidebar project-first mode", () => {
     );
     fireEvent.click(screen.getByText("Codex"));
 
-    expect(mocks.createSession).toHaveBeenCalledWith(
-      "codex",
-      "/tmp/project-mobile",
-    );
+    expectSessionCreated("codex", "/tmp/project-mobile");
     expect(mocks.goToChatRoot).not.toHaveBeenCalled();
   });
 });

package/src/features/chat/components/layout/chat-page-shell.tsx

@@ -11,30 +11,22 @@ export type MainPanelView = "chat" | "cron" | "skills" | "agents" | "inbox";
 export type ChatPageProps = {
   view: MainPanelView;
 };
+const MANAGEMENT_PAGE_CANVAS_WIDTH_CLASS = "max-w-[min(1180px,100%)]";
 type UseChatSessionSyncParams = {
-  view: MainPanelView;
   routeSessionKey: string | null;
-  syncRouteSessionSelection: (params: {
-    isChatView: boolean;
-    routeSessionKey: string | null;
-  }) => void;
+  syncRouteSessionSelection: (routeSessionKey: string | null) => void;
 };
 export function useChatSessionSync(params: UseChatSessionSyncParams): void {
   const {
-    view,
     routeSessionKey,
     syncRouteSessionSelection,
   } = params;
 
   useLayoutEffect(() => {
-    syncRouteSessionSelection({
-      isChatView: view === "chat",
-      routeSessionKey,
-    });
+    syncRouteSessionSelection(routeSessionKey);
   }, [
     routeSessionKey,
     syncRouteSessionSelection,
-    view,
   ]);
 }
 type ChatPageLayoutProps = {
@@ -53,24 +45,24 @@ export function ChatPageLayout({ view, confirmDialog }: ChatPageLayoutProps) {
       ) : (
         <section className="flex-1 min-h-0 overflow-hidden bg-background">
           {view === "inbox" ? (
-            <div className="mx-auto flex h-full min-h-0 w-full max-w-[min(1180px,100%)] flex-col py-4 sm:px-6 sm:py-5">
+            <div className={`mx-auto flex h-full min-h-0 w-full flex-col py-4 sm:px-6 sm:py-5 ${MANAGEMENT_PAGE_CANVAS_WIDTH_CLASS}`}>
               <InboxPage />
             </div>
           ) : view === "cron" ? (
             <div className="h-full overflow-auto custom-scrollbar">
-              <div className="mx-auto w-full max-w-[min(1120px,100%)] px-4 py-4 sm:px-6 sm:py-5">
+              <div className={`mx-auto w-full px-4 py-4 sm:px-6 sm:py-5 ${MANAGEMENT_PAGE_CANVAS_WIDTH_CLASS}`}>
                 <CronConfig />
               </div>
             </div>
           ) : view === "agents" ? (
             <div className="h-full overflow-auto custom-scrollbar">
-              <div className="mx-auto w-full max-w-[min(1180px,100%)] px-4 py-4 sm:px-6 sm:py-5">
+              <div className={`mx-auto w-full px-4 py-4 sm:px-6 sm:py-5 ${MANAGEMENT_PAGE_CANVAS_WIDTH_CLASS}`}>
                 <AgentsPage />
               </div>
             </div>
           ) : (
             <div className="h-full overflow-hidden">
-              <div className="mx-auto flex h-full min-h-0 w-full max-w-[min(1120px,100%)] flex-col px-4 py-4 sm:px-6 sm:py-5">
+              <div className={`mx-auto flex h-full min-h-0 w-full flex-col px-4 py-4 sm:px-6 sm:py-5 ${MANAGEMENT_PAGE_CANVAS_WIDTH_CLASS}`}>
                 <MarketplacePage forcedType="skills" />
               </div>
             </div>

package/src/features/chat/components/layout/chat-sidebar-desktop-layout.tsx

@@ -12,6 +12,7 @@ import { t, type I18nLanguage } from "@/shared/lib/i18n";
 import type { UiTheme } from "@/shared/lib/theme";
 import { SidebarNavLinkItem } from "@/app/components/layout/sidebar-items";
 import { IconActionButton } from "@/shared/components/ui/actions/icon-action-button";
+import { SCROLL_BOTTOM_EDGE_FADE_CLASS } from "@/shared/components/ui/scroll-area";
 import {
   AlarmClock,
   Bot,
@@ -19,7 +20,7 @@ import {
   Inbox,
   PanelLeftClose,
   PanelLeftOpen,
-  Plus,
+  FolderPlus,
 } from "lucide-react";
 import { useInboxUnreadCount } from "@/features/inbox";
 import { ChatSidebarSessionList } from "@/features/chat/features/session/components/chat-sidebar-session-list";
@@ -32,7 +33,6 @@ import {
   SIDEBAR_RAIL_PADDING_X_CLASS,
   SIDEBAR_RAIL_STACK_CLASS,
   SIDEBAR_RAIL_SURFACE_CLASS,
-  SIDEBAR_SCROLL_EDGE_FADE_CLASS,
 } from "@/app/components/layout/sidebar-rail.styles";
 
 const navItems = [
@@ -86,7 +86,7 @@ export function ChatSidebarDesktopHeader({
           ? "justify-center px-2 py-1.5"
           : isWindowsHost
             ? "justify-end px-3 py-1.5"
-            : "gap-2 px-5 py-2",
+            : "gap-2 px-4 py-2",
         isCollapsed && shouldReserveMacWindowControls ? "pt-8" : null,
       )}
     >
@@ -108,36 +108,29 @@ export function ChatSidebarDesktopNav({
 }) {
   const unreadCount = useInboxUnreadCount();
   return (
-    <>
-      <div className={cn("pb-2", isCollapsed ? "px-0" : "px-3")}>
-        <ul className={isCollapsed ? SIDEBAR_RAIL_STACK_CLASS : "space-y-0.5"}>
-          {navItems.map((item) => (
-            <li
-              key={item.target}
-              className={isCollapsed ? "flex justify-center" : undefined}
-            >
-              <SidebarNavLinkItem
-                to={item.target}
-                label={item.label()}
-                icon={item.icon}
-                density="compact"
-                collapsed={isCollapsed}
-                indicator={item.target === "/inbox" && unreadCount > 0}
-                trailing={item.target === "/inbox" && unreadCount > 0
-                  ? unreadCount > 99 ? "99+" : unreadCount
-                  : undefined}
-              />
-            </li>
-          ))}
-        </ul>
-      </div>
-      <div
-        className={cn(
-          "border-t border-border/70",
-          isCollapsed ? "mx-2 my-1.5" : "mx-4",
-        )}
-      />
-    </>
+    <div className={cn("pb-1", isCollapsed ? "px-0" : "px-3")}>
+      <ul className={isCollapsed ? SIDEBAR_RAIL_STACK_CLASS : "space-y-0.5"}>
+        {navItems.map((item) => (
+          <li
+            key={item.target}
+            className={isCollapsed ? "flex justify-center" : undefined}
+          >
+            <SidebarNavLinkItem
+              to={item.target}
+              label={item.label()}
+              icon={item.icon}
+              density="compact"
+              collapsed={isCollapsed}
+              indicator={item.target === "/inbox" && unreadCount > 0}
+              trailing={item.target === "/inbox" && unreadCount > 0
+                ? unreadCount > 99 ? "99+" : unreadCount
+                : undefined}
+              className={isCollapsed ? undefined : "rounded-lg px-2.5 py-1.5"}
+            />
+          </li>
+        ))}
+      </ul>
+    </div>
   );
 }
 
@@ -172,14 +165,11 @@ export function ChatSidebarSessionArea({
 
   return (
     <>
-      <div className="flex items-center justify-between px-5 pb-2 pt-3">
-        <div className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground/75">
-          {t("chatSidebarTaskRecords")}
-        </div>
-        <div className="flex items-center gap-1">
+      <div className="flex items-center justify-end px-4 pb-1 pt-2">
+        <div className="flex h-7 items-center gap-1.5">
           {isProjectFirstView ? (
             <IconActionButton
-              icon={<Plus className="h-3.5 w-3.5" />}
+              icon={<FolderPlus className="h-3.5 w-3.5" />}
               label={t("chatProjectAdd")}
               onClick={onAddProject}
             />
@@ -193,8 +183,8 @@ export function ChatSidebarSessionArea({
 
       <div
         className={cn(
-          "custom-scrollbar min-h-0 flex-1 overflow-y-auto px-3 pb-7 pt-2",
-          SIDEBAR_SCROLL_EDGE_FADE_CLASS,
+          "custom-scrollbar min-h-0 flex-1 overflow-y-auto px-3 pb-4 pt-1",
+          SCROLL_BOTTOM_EDGE_FADE_CLASS,
         )}
       >
         <ChatSidebarSessionList
@@ -246,7 +236,7 @@ export function ChatSidebarDesktopFooter({
   return (
     <div
       className={cn(
-        "py-3",
+        "py-2",
         isCollapsed
           ? cn("flex justify-center", SIDEBAR_RAIL_PADDING_X_CLASS)
           : "px-3",

package/src/features/chat/components/layout/chat-sidebar-toolbar.tsx

@@ -1,4 +1,4 @@
-import { Button, type ButtonProps } from "@/shared/components/ui/button";
+import { Button } from "@/shared/components/ui/button";
 import { IconActionButton } from "@/shared/components/ui/actions/icon-action-button";
 import { Input } from "@/shared/components/ui/input";
 import {
@@ -20,51 +20,6 @@ import {
 } from "@/app/components/layout/sidebar-rail.styles";
 
 type SessionTypeOption = ChatSessionTypeOption;
-type NewSessionActionStyleVariant =
-  | "neutralSurface"
-  | "brandSoft"
-  | "brandTextSurface"
-  | "brandSolid";
-
-const NEW_SESSION_ACTION_STYLE_VARIANT: NewSessionActionStyleVariant =
-  "brandSoft";
-
-const NEW_SESSION_ACTION_STYLE_CLASSES: Record<
-  NewSessionActionStyleVariant,
-  {
-    leftVariant: ButtonProps["variant"];
-    leftClassName: string;
-    rightClassName: string;
-  }
-> = {
-  neutralSurface: {
-    leftVariant: "ghost",
-    leftClassName:
-      "bg-card text-foreground shadow-none transition-[background-color,color,box-shadow] hover:bg-accent hover:text-accent-foreground hover:shadow-sm active:bg-accent",
-    rightClassName:
-      "bg-card text-muted-foreground shadow-none transition-[background-color,color,box-shadow] hover:bg-accent hover:text-accent-foreground hover:shadow-sm active:bg-accent",
-  },
-  brandSoft: {
-    leftVariant: "ghost",
-    leftClassName:
-      "bg-primary/10 text-primary shadow-none ring-1 ring-primary/10 transition-[background-color,color,box-shadow] hover:bg-primary/15 hover:text-primary-700 hover:shadow-sm active:bg-primary/20",
-    rightClassName:
-      "bg-primary/10 text-primary shadow-none ring-1 ring-primary/10 transition-[background-color,color,box-shadow] hover:bg-primary/15 hover:text-primary-700 hover:shadow-sm active:bg-primary/20",
-  },
-  brandTextSurface: {
-    leftVariant: "ghost",
-    leftClassName:
-      "bg-card text-primary shadow-none transition-[background-color,color,box-shadow] hover:bg-accent hover:text-primary-700 hover:shadow-sm active:bg-primary/15",
-    rightClassName:
-      "bg-card text-primary shadow-none transition-[background-color,color,box-shadow] hover:bg-accent hover:text-primary-700 hover:shadow-sm active:bg-primary/15",
-  },
-  brandSolid: {
-    leftVariant: "primary",
-    leftClassName: "",
-    rightClassName:
-      "bg-primary text-primary-foreground shadow-sm hover:bg-primary-600 hover:text-primary-foreground active:bg-primary-700",
-  },
-};
 
 type ChatSidebarToolbarProps = {
   query: string;
@@ -117,8 +72,6 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
     collapsed = false,
   } = props;
   const supportsSessionTypeSwitch = sessionTypeOptions.length > 1;
-  const actionStyle =
-    NEW_SESSION_ACTION_STYLE_CLASSES[NEW_SESSION_ACTION_STYLE_VARIANT];
 
   if (collapsed) {
     return (
@@ -183,21 +136,20 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
 
   return (
     <>
-      <div className="px-4 pb-3">
-        <div className="flex items-center gap-2">
+      <div className="px-4 pb-2">
+        <div className="flex overflow-hidden rounded-lg bg-primary/10 text-primary ring-1 ring-primary/10">
           <Button
-            variant={actionStyle.leftVariant}
+            variant="ghost"
             className={cn(
-              "min-w-0 rounded-xl",
-              actionStyle.leftClassName,
-              supportsSessionTypeSwitch ? "flex-1 rounded-r-md" : "w-full",
+              "min-w-0 rounded-none bg-transparent px-3 text-primary shadow-none hover:bg-primary/10 hover:text-primary-700 active:bg-primary/15",
+              supportsSessionTypeSwitch ? "flex-1" : "w-full",
             )}
             onClick={() => {
               onCreateMenuOpenChange(false);
               onCreateSession(selectedNewSessionType);
             }}
           >
-            <Plus className="mr-2 h-4 w-4" />
+            <Plus className="mr-1.5 h-4 w-4" />
             {t("chatSidebarNewTask")}
           </Button>
           {supportsSessionTypeSwitch ? (
@@ -208,19 +160,16 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
               <PopoverTrigger asChild>
                 <IconActionButton
                   icon={
-                    <span className="inline-flex items-center gap-0.5">
+                    <span className="inline-flex items-center gap-1">
                       <SessionTypeTriggerIcon
                         option={selectedNewSessionTypeOption}
                       />
-                      <ChevronDown className="h-3 w-3 opacity-60" />
+                      <ChevronDown className="h-3 w-3 opacity-50" />
                     </span>
                   }
                   label={t("chatSessionTypeLabel")}
                   tooltip={t("chatSessionTypeLabel")}
-                  className={cn(
-                    "h-9 w-12 shrink-0 rounded-xl rounded-l-md",
-                    actionStyle.rightClassName,
-                  )}
+                  className="h-9 w-12 shrink-0 rounded-none border-l border-primary/10 bg-transparent text-primary shadow-none hover:bg-primary/10 hover:text-primary-700 active:bg-primary/15"
                 />
               </PopoverTrigger>
               <ChatPopoverContent
@@ -241,14 +190,14 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
         </div>
       </div>
 
-      <div className="px-4 pb-3">
+      <div className="px-4 pb-2">
         <div className="relative">
-          <Search className="pointer-events-none absolute left-3 top-2.5 h-3.5 w-3.5 text-muted-foreground/70" />
+          <Search className="pointer-events-none absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground/60" />
           <Input
             value={query}
             onChange={(event) => onQueryChange(event.target.value)}
             placeholder={t("chatSidebarSearchPlaceholder")}
-            className="h-9 rounded-lg pl-8 text-xs"
+            className="h-8 rounded-lg border-0 bg-background/55 pl-8 text-xs shadow-none hover:bg-background/75"
           />
         </div>
       </div>
@@ -277,7 +226,7 @@ export function ChatSidebarMobileToolbar(props: ChatSidebarToolbarProps) {
             value={query}
             onChange={(event) => onQueryChange(event.target.value)}
             placeholder={t("chatSidebarSearchPlaceholder")}
-            className="h-9 rounded-full border-transparent bg-muted pl-9 pr-3 text-[13px] shadow-none focus:border-border focus:bg-card"
+            className="h-9 rounded-full border-0 bg-muted pl-9 pr-3 text-[13px] shadow-none"
           />
         </div>
 
@@ -291,7 +240,7 @@ export function ChatSidebarMobileToolbar(props: ChatSidebarToolbarProps) {
                 icon={<Plus className="h-4 w-4" />}
                 label={t("chatSidebarNewTask")}
                 tooltip={false}
-                className="h-9 w-9 shrink-0 rounded-full bg-muted text-foreground shadow-none hover:bg-accent hover:text-accent-foreground"
+                className="h-9 w-9 shrink-0 rounded-full bg-muted text-foreground shadow-none hover:bg-[var(--interaction-hover)] hover:text-accent-foreground"
               />
             </PopoverTrigger>
             <ChatPopoverContent
@@ -314,7 +263,7 @@ export function ChatSidebarMobileToolbar(props: ChatSidebarToolbarProps) {
           <IconActionButton
             icon={<Plus className="h-4 w-4" />}
             label={t("chatSidebarNewTask")}
-            className="h-9 w-9 shrink-0 rounded-full bg-muted text-foreground shadow-none hover:bg-accent hover:text-accent-foreground"
+            className="h-9 w-9 shrink-0 rounded-full bg-muted text-foreground shadow-none hover:bg-[var(--interaction-hover)] hover:text-accent-foreground"
             onClick={() => onCreateSession(defaultSessionType)}
           />
         )}

package/src/features/chat/components/layout/chat-sidebar-utility-menu.tsx

@@ -102,13 +102,10 @@ export function ChatSidebarUtilityMenu({
           <button
             type="button"
             aria-label={t("settingsMenu")}
-            className="flex w-full items-center gap-2.5 rounded-xl px-3 py-2 text-[13px] font-medium text-muted-foreground transition-colors duration-base hover:bg-gray-200/60 hover:text-gray-900 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border"
+            className="flex w-full items-center gap-2.5 rounded-lg px-2.5 py-1.5 text-[13px] font-medium text-muted-foreground transition-colors duration-base hover:bg-background/70 hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border"
           >
             <Settings className="h-4 w-4 shrink-0 text-muted-foreground/70" />
             <span className="min-w-0 flex-1 text-left">{t("settings")}</span>
-            <span className="max-w-[112px] truncate text-[13px] text-muted-foreground">
-              {currentThemeLabel} / {currentLanguageLabel}
-            </span>
           </button>
         </PopoverTrigger>
       )}

package/src/features/chat/components/providers/chat-presenter.provider.tsx

@@ -5,6 +5,7 @@ import type {
 import type { ChatUiManager } from '@/features/chat/managers/chat-ui.manager';
 import type { ChatQueryManager } from '@/features/chat/managers/chat-query.manager';
 import type { ChatThreadManager } from '@/features/chat/managers/chat-thread.manager';
+import type { ChatComposerIntentManager } from '@/features/chat/managers/chat-composer-intent.manager';
 
 type PublicManager<T extends object> = Pick<T, keyof T>;
 
@@ -15,6 +16,7 @@ export type ChatPresenterLike = {
   chatQueryManager: ChatQueryManager;
   chatSessionListManager: ChatSessionListManager;
   chatThreadManager: ChatThreadManagerLike;
+  chatComposerIntentManager: ChatComposerIntentManager;
 };
 
 const ChatPresenterContext = createContext<ChatPresenterLike | null>(null);

package/src/features/chat/features/conversation/components/__tests__/session-conversation-area.test.tsx

@@ -39,7 +39,7 @@ const mocks = vi.hoisted(() => {
     selectedSessionType: "default",
     pendingProjectRoot: null,
     composerFocusRequestId: 0,
-    sendError: null,
+    sendError: null as string | null,
   };
   const inputQuery = {
     defaultModel: undefined as string | undefined,
@@ -52,6 +52,7 @@ const mocks = vi.hoisted(() => {
     selectedSession: null as null | {
       activityPreview?: {
         state: "running" | "completed" | "failed" | "cancelled" | "idle";
+        statusKind?: "run-failed" | "run-interrupted";
         statusText?: string;
         replyText?: string;
       };
@@ -86,11 +87,11 @@ const mocks = vi.hoisted(() => {
     isHydrating: false,
     isRunning: true,
     isSending: true,
-    hydrateError: null,
+    hydrateError: null as Error | null,
     snapshot: {
       activeRun: null,
       contextWindow: null,
-      error: null,
+      error: null as { code?: string; message: string } | null,
     },
     send: vi.fn(),
     abort: vi.fn(),
@@ -206,8 +207,11 @@ vi.mock(
 vi.mock(
   "@/features/chat/features/conversation/hooks/use-session-conversation-input-state",
   () => ({
-    useSessionConversationInputState: (initialPrompt?: string | null) => {
-      mocks.initialPromptSpy(initialPrompt);
+    useSessionConversationInputState: (
+      initialPrompt?: string | null,
+      sessionKey?: string | null,
+    ) => {
+      mocks.initialPromptSpy(initialPrompt, sessionKey);
       return {
         inputActions: mocks.inputActions,
         inputSnapshot: mocks.inputSnapshot,
@@ -265,7 +269,11 @@ describe("SessionConversationArea input boundary", () => {
     mocks.agent.isHydrating = false;
     mocks.agent.isRunning = true;
     mocks.agent.isSending = true;
+    mocks.agent.hydrateError = null;
     mocks.agent.snapshot.contextWindow = null;
+    mocks.agent.snapshot.error = null;
+    mocks.controller.isSending = true;
+    mocks.inputSnapshot.sendError = null;
     mocks.inputQuery.defaultModel = undefined;
     mocks.inputQuery.fallbackPreferredModel = undefined;
     mocks.inputQuery.selectedSession = null;
@@ -319,13 +327,27 @@ describe("SessionConversationArea input boundary", () => {
       .toBe("false");
   });
 
-  it("does not replace the welcome composer just because draft send starts", () => {
-    renderArea(null);
+  it("leaves the welcome surface on the first local sending render", () => {
+    mocks.agent.isRunning = false;
+    mocks.agent.isSending = false;
+    mocks.controller.isSending = false;
+    const rendered = renderArea(null);
 
     expect(screen.getByTestId("conversation-content").dataset.showWelcome).toBe(
       "true",
     );
-    expect(screen.getByTestId("welcome")).toBeTruthy();
+
+    mocks.controller.isSending = true;
+    rendered.rerender(
+      <MemoryRouter>
+        <SessionConversationArea sessionKey={null} />
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByTestId("conversation-content").dataset.showWelcome).toBe(
+      "false",
+    );
+    expect(screen.queryByTestId("welcome")).toBeNull();
     expect(screen.getByTestId("conversation-input")).toBeTruthy();
   });
 
@@ -349,7 +371,13 @@ describe("SessionConversationArea input boundary", () => {
       </MemoryRouter>,
     );
 
-    expect(mocks.initialPromptSpy).toHaveBeenCalledWith("每天整理项目风险");
+    expect(mocks.initialPromptSpy).toHaveBeenCalledWith(
+      "每天整理项目风险",
+      null,
+    );
+    expect(mocks.inputActions.applyPromptSuggestion).toHaveBeenCalledWith(
+      "每天整理项目风险",
+    );
   });
 
   it("syncs draft preferences with the selected runtime context", () => {
@@ -380,7 +408,7 @@ describe("SessionConversationArea input boundary", () => {
     mocks.inputQuery.selectedSession = {
       activityPreview: {
         state: "failed",
-        statusText: "Run failed: Invalid API Key",
+        statusText: "Invalid API Key",
       },
       status: "idle",
     };
@@ -388,8 +416,31 @@ describe("SessionConversationArea input boundary", () => {
     renderArea("session-1");
 
     expect(screen.getByTestId("conversation-bottom-slot")).toBeTruthy();
-    expect(screen.getByText(/出错了|Something went wrong/)).toBeTruthy();
-    expect(screen.getByText("Run failed: Invalid API Key")).toBeTruthy();
+    expect(screen.getByText("Invalid API Key")).toBeTruthy();
+  });
+
+  it("renders overlapping runtime failures once with a subdued diagnostic surface", () => {
+    const providerError = `Chat Completions API failed (402): {\n  "error": "${"x".repeat(240)} END_OF_PROVIDER_ERROR"\n}`;
+    mocks.inputSnapshot.sendError = providerError;
+    mocks.agent.snapshot.error = { message: providerError };
+    mocks.inputQuery.selectedSession = {
+      activityPreview: {
+        state: "failed",
+        statusText: providerError,
+      },
+      status: "idle",
+    };
+
+    renderArea("session-1");
+
+    expect(screen.getAllByRole("status")).toHaveLength(1);
+    const failureStatus = screen.getByRole("status");
+    expect(failureStatus.className).toContain("bg-muted/45");
+    expect(failureStatus.className).not.toContain("bg-red");
+    const errorDetail = failureStatus.querySelector("pre");
+    expect(errorDetail?.className).toContain("max-h-32");
+    expect(errorDetail?.className).toContain("overflow-auto");
+    expect(errorDetail?.textContent).toBe(providerError);
   });
 
   it("does not surface user-cancelled previews as conversation errors", () => {
@@ -406,4 +457,25 @@ describe("SessionConversationArea input boundary", () => {
     expect(screen.queryByTestId("conversation-bottom-slot")).toBeNull();
     expect(screen.queryByText(/出错了|Something went wrong/)).toBeNull();
   });
+
+  it("does not expose recovered runtime interruption diagnostics as task errors", () => {
+    const recoveryDetail = "Run interrupted: internal recovery detail.";
+    mocks.agent.snapshot.error = {
+      code: "run-interrupted",
+      message: recoveryDetail,
+    };
+    mocks.inputQuery.selectedSession = {
+      activityPreview: {
+        state: "failed",
+        statusKind: "run-interrupted",
+        statusText: recoveryDetail,
+      },
+      status: "idle",
+    };
+
+    renderArea("session-1");
+
+    expect(screen.queryByTestId("conversation-bottom-slot")).toBeNull();
+    expect(screen.queryByText(recoveryDetail)).toBeNull();
+  });
 });