feat(web): 智能体对话重做(AGUI-3)

- 会话流:用户消息 → 一行进度 → 结论正文 → 没做的事 → 一行实际结果。进度行把一段里的工具调用、思考和过程中的话
  聚成一行(1 次也折叠),按能力 verb/noun 人话计数(「查了站点、2 个下载任务和媒体库 · 1 项没做 · 3 秒」),
  展开每步一行;工具名、调用 ID、幂等键、输入输出进技术信息。去掉回合头、「模型说的」重复卡和系统核实大卡。
- agent.plan / agent.propose_options 不作为工具调用出现(旧事件回放同样跳过);被拒调用不出红卡,
  回合末尾一行「没做：检测站点，需要你批准 [批准并重试]」(非计划类能力建一次性持续授权后重试)。
- 方案卡:每个方案一个按钮,点一下就选定;推荐项第一位、主按钮;按钮写服务端给的动作要点;风险折叠;
  「都不要…」点开才出原因框;选完收成一行。审批卡只留摘要和批准 / 拒绝,计划 ID、hash、版本、到期进技术信息。
- 会话页去掉右侧栏和页头目标,步骤 / 子会话 / 模型 / 预算 / ID 进顶部概况条;输入区只有输入框和发送 / 停止,
  / 指令 /先给方案、/重跑(「先看方案再执行」开关原本只是新建时的本地状态,不需要迁移)。
- 抽屉去掉「当前 / 历史」Tab:头部「历史」弹层(最近 20 条)+「新对话」;上下文显示成名称标签,可去掉。
- 会话列表:搜索 + 全部 / 等你处理 / 失败;等你处理置顶,子会话收在父会话下,正常结束不加徽章。
- 入口页与空态给 3 个快捷目标。mock 加审查报告 3 个示例的演示数据;smoke 改测历史弹层。
- 组件测试:聚合、隐藏、拒绝一行、方案一键选定、历史置顶与子会话、指令。

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

apps/web/app/routes/console/agent.$runId.tsx

@@ -1,47 +1,31 @@
 import { ArrowLeft } from "lucide-react";
 import { Link, useParams } from "react-router";
-import { agentMockEnabled, useAgentRun } from "~/api/agent.ts";
+import { agentMockEnabled } from "~/api/agent.ts";
 import { AgentRunPanel } from "~/components/agent/agent-run-panel.tsx";
 import { AgentSessionList } from "~/components/agent/agent-session-list.tsx";
-import { shortGoalTitle } from "~/components/agent/agent-store.ts";
-import { PageHeader } from "~/components/console/page-header.tsx";
 import { Button } from "~/components/ui/button.tsx";
 
-// 会话页:左栏会话列表(xl 以上)· 中间会话列(统一最大宽度,输入区固定在底部)· 右侧栏状态/步骤/预算(lg 以上;
-// 更窄时换成会话列顶部的可折叠概况条)。
+// 会话页(AGUI-3):左栏会话列表(xl 以上)· 会话列占满其余宽度(顶部概况条、底部输入区)。
+// 不再有页头目标描述和右侧栏;步骤、子会话、预算与模型在概况条里。
 export default function AgentRunPage() {
   const { runId = "" } = useParams();
-  const run = useAgentRun(runId);
   const mock = agentMockEnabled();
   const suffix = mock ? "?mock=1" : "";
   return (
     <>
-      <PageHeader
-        title="智能体会话"
-        description={
-          run.data ? (
-            <span className="line-clamp-2 break-words" title={run.data.run.goal}>
-              {shortGoalTitle(run.data.run.goal)}
-            </span>
-          ) : (
-            "加载中…"
-          )
-        }
-        actions={
-          <Button asChild variant="ghost" size="sm">
+      <h1 className="sr-only">智能体会话</h1>
+      <div className="grid grid-cols-1 gap-4 xl:grid-cols-[minmax(0,17rem)_minmax(0,1fr)]">
+        <aside className="pg-slab hidden rounded-xl p-3 xl:block xl:h-[calc(100dvh-7rem)] xl:overflow-hidden">
+          <AgentSessionList activeId={runId} hrefFor={(id) => `/console/agent/${id}${suffix}`} className="h-full" />
+        </aside>
+        <div className="pg-slab flex h-[calc(100dvh-7rem)] min-h-[28rem] flex-col gap-2 rounded-xl p-3 md:p-4">
+          <Button asChild variant="ghost" size="sm" className="-mt-1 -ml-2 self-start text-muted-foreground xl:hidden">
             <Link to={`/console/agent${suffix}`}>
               <ArrowLeft />
               全部会话
             </Link>
           </Button>
-        }
-      />
-      <div className="grid grid-cols-1 gap-4 xl:grid-cols-[minmax(0,16rem)_minmax(0,1fr)]">
-        <aside className="pg-slab hidden rounded-xl p-3 xl:block xl:h-[calc(100dvh-13rem)] xl:overflow-hidden">
-          <AgentSessionList activeId={runId} hrefFor={(id) => `/console/agent/${id}${suffix}`} className="h-full" />
-        </aside>
-        <div className="pg-slab flex h-[calc(100dvh-11rem)] min-h-[32rem] flex-col rounded-xl p-3 md:p-4 lg:h-[calc(100dvh-13rem)]">
-          <AgentRunPanel key={runId} runId={runId} className="flex-1" />
+          <AgentRunPanel key={runId} runId={runId} className="min-h-0 flex-1" />
         </div>
       </div>
     </>

apps/web/app/routes/console/agent.tsx

@@ -1,13 +1,15 @@
-import { FlaskConical, ShieldCheck } from "lucide-react";
+import { FlaskConical } from "lucide-react";
 import { useNavigate } from "react-router";
 import { toast } from "sonner";
 import { agentMockEnabled, useCreateAgentRun } from "~/api/agent.ts";
 import { GoalComposer } from "~/components/agent/agent-run-panel.tsx";
 import { AgentSessionList } from "~/components/agent/agent-session-list.tsx";
+import { quickGoalsFor } from "~/components/agent/quick-goals.ts";
 import { PageHeader } from "~/components/console/page-header.tsx";
 import { Button } from "~/components/ui/button.tsx";
 import { errorMessage } from "~/lib/api.ts";
 
+// 智能体入口页(AGUI-3):左栏会话列表(等你处理置顶),右边新对话输入框 + 3 个快捷目标。
 export default function AgentPage() {
   const create = useCreateAgentRun();
   const navigate = useNavigate();
@@ -15,7 +17,7 @@ export default function AgentPage() {
 
   return (
     <>
-      <PageHeader title="智能体会话" />
+      <PageHeader title="智能体" />
       {mock ? (
         <div className="mb-4 flex flex-wrap items-center gap-3 rounded-xl border border-warning/40 bg-warning/10 px-4 py-3 text-caption text-warning">
           <FlaskConical className="h-4 w-4 shrink-0" />
@@ -29,26 +31,20 @@ export default function AgentPage() {
         <div className="pg-slab order-2 rounded-xl p-3 lg:order-1 lg:h-[calc(100dvh-12rem)] lg:overflow-hidden">
           <AgentSessionList hrefFor={(id) => `/console/agent/${id}${mock ? "?mock=1" : ""}`} className="h-full" />
         </div>
-        <div className="order-1 mx-auto w-full max-w-[88ch] space-y-3 lg:order-2">
-          <div className="pg-slab rounded-xl p-4">
-            <h2 className="mb-3 text-body font-medium text-foreground">新会话</h2>
-            <GoalComposer
-              pending={create.isPending}
-              onSubmit={(goal, opts) =>
-                create.mutate(
-                  { goal, ...opts },
-                  {
-                    onSuccess: (run) => navigate(`/console/agent/${run.id}${mock ? "?mock=1" : ""}`),
-                    onError: (e) => toast.error(errorMessage(e)),
-                  },
-                )
-              }
-            />
-          </div>
-          <p className="flex items-center gap-2 px-1 text-meta text-muted-foreground">
-            <ShieldCheck aria-hidden className="size-3.5 shrink-0" />
-            每次工具调用都经服务端授权校验，汇报以系统核实的结果为准。
-          </p>
+        <div className="pg-slab order-1 mx-auto w-full max-w-[88ch] rounded-xl p-4 lg:order-2">
+          <GoalComposer
+            pending={create.isPending}
+            suggestions={quickGoalsFor("/console/agent")}
+            onSubmit={(goal, opts) =>
+              create.mutate(
+                { goal, ...opts },
+                {
+                  onSuccess: (run) => navigate(`/console/agent/${run.id}${mock ? "?mock=1" : ""}`),
+                  onError: (e) => toast.error(errorMessage(e)),
+                },
+              )
+            }
+          />
         </div>
       </div>
     </>