feat(agent): in-drawer history tab and denser session layout (AGUI-2)

- Drawer tabs 当前/历史: searchable run list (status/source/time filters,
  cursor auto-load), opens runs inside the drawer, keeps scroll and filters,
  remembers the last tab; 在页面打开 is secondary
- Ended runs: append to resume, or 用同目标新建 with 先看方案再执行 toggle
- Session page: 88ch conversation column, turns grouped with one timestamp,
  tool cards collapse to one line, 3+ activities fold; steps/subagents/budget
  moved to a right rail (collapsible overview bar on narrow screens and in
  the drawer), long model reports fold behind 展开全文
- Smoke covers the drawer history flow

Co-Authored-By: Claude Opus 5.5 <[email protected]>

apps/web/app/components/agentui/tool-result.tsx

@@ -2,7 +2,8 @@
 // Copyright (c) 2026 Saurabh Chauhan. MIT License, see ./LICENSE-agentui.md
 // 改造:状态色 blue/emerald/rose → 中性/success/destructive(并配文字);ActionSwapRollText 滚字去掉;
 // 折叠用 Disclosure;新增 `badges` 槽(scope/风险/幂等等审计徽标)与 `summary`(收起时的一行结果);
-// 默认不在完成后自动展开历史卡片(回放时 defaultOpen=false),运行中的卡片展开、完成后按 collapseOnComplete 收起。
+// AGUI-2:收起态压成一行(能力名 · 状态 · 耗时 · 摘要),能力 ID 与徽标移进展开区;
+// 默认一律收起(运行中也只显示一行状态);用户点开的卡片完成后保持展开(collapseOnComplete 可改)。
 import { Ban, Braces, ChevronDown, CircleCheck, CircleX, LoaderCircle, SquareTerminal, Wrench } from "lucide-react";
 import { type ReactNode, useCallback, useEffect, useId, useRef, useState } from "react";
 import { cn } from "~/lib/utils.ts";
@@ -61,8 +62,8 @@ export function ToolResult({
   badges,
   summary,
   icon,
-  defaultOpen = status === "running",
-  collapseOnComplete = true,
+  defaultOpen = false,
+  collapseOnComplete = false,
   className,
 }: ToolResultProps) {
   const id = useId();
@@ -70,7 +71,6 @@ export function ToolResult({
   const prev = useRef(status);
   const setOpen = useCallback((v: boolean) => setOpenState(v), []);
   useEffect(() => {
-    if (prev.current !== "running" && status === "running") setOpen(true);
     if (prev.current === "running" && status !== "running" && collapseOnComplete) setOpen(false);
     prev.current = status;
   }, [collapseOnComplete, setOpen, status]);
@@ -88,28 +88,31 @@ export function ToolResult({
         aria-expanded={open}
         aria-controls={`${id}-c`}
         onClick={() => setOpen(!open)}
-        className="group flex min-h-10 w-full min-w-0 cursor-pointer items-center gap-2 rounded-xl px-3 py-1.5 text-left outline-none transition-colors duration-micro hover:bg-foreground/[0.03] focus-visible:ring-2 focus-visible:ring-ring"
+        className="group flex min-h-9 w-full min-w-0 cursor-pointer items-center gap-2 rounded-xl px-3 py-1.5 text-left outline-none transition-colors duration-micro hover:bg-foreground/[0.03] focus-visible:ring-2 focus-visible:ring-ring"
       >
         <span aria-hidden className="grid size-4 shrink-0 place-items-center text-muted-foreground">
           {icon ?? <KindIcon kind={kind} />}
         </span>
-        <span className="flex min-w-0 flex-1 flex-wrap items-baseline gap-x-2 gap-y-0.5">
-          <span className="min-w-0 truncate text-caption font-medium text-foreground/90">{title}</span>
-          <span className="min-w-0 truncate font-mono text-label text-muted-foreground">{tool}</span>
-          {meta ? <span className="shrink-0 text-label text-muted-foreground tabular-nums">{meta}</span> : null}
-        </span>
+        {/* 收起时一行:能力名 · 状态 · 耗时 · 摘要;展开后摘要让位给完整输入输出 */}
+        <span className="max-w-[45%] shrink-0 truncate text-caption font-medium text-foreground/90">{title}</span>
         <span className={cn("inline-flex shrink-0 items-center gap-1 text-label font-medium", st.cls)}>
           <StatusIcon status={status} />
           {st.label}
         </span>
-        <ChevronDown aria-hidden className={cn("size-3.5", CHEVRON_CLASS, open && "rotate-180")} />
+        {meta ? <span className="shrink-0 text-label text-muted-foreground tabular-nums">{meta}</span> : null}
+        <span className="min-w-0 flex-1 truncate text-meta text-muted-foreground">
+          {!open && summary ? summary : null}
+        </span>
+        <ChevronDown aria-hidden className={cn("size-3.5 shrink-0", CHEVRON_CLASS, open && "rotate-180")} />
       </button>
-      {badges ? <div className="flex flex-wrap items-center gap-1 px-3 pb-2 pl-9">{badges}</div> : null}
-      {!open && summary ? (
-        <p className="-mt-1 truncate px-3 pb-2 pl-9 text-meta text-muted-foreground">{summary}</p>
-      ) : null}
       <Disclosure id={`${id}-c`} role="region" aria-labelledby={`${id}-t`} open={open}>
-        <div className="space-y-2 border-t border-border/60 px-3 py-2.5">{children}</div>
+        <div className="space-y-2 border-t border-border/60 px-3 py-2.5">
+          <div className="flex flex-wrap items-center gap-1">
+            <span className="mr-1 min-w-0 truncate font-mono text-label text-muted-foreground">{tool}</span>
+            {badges}
+          </div>
+          {children}
+        </div>
       </Disclosure>
     </div>
   );