@allbluecn/web-app 0.12.0 → 0.12.3

package/src/components/harness/__tests__/turn-group.test.ts

@@ -0,0 +1,124 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+import { describe, expect, it } from "vitest";
+import { sliceTurns } from "../turn-group";
+
+const msg = (
+  id: string,
+  role: "user" | "assistant",
+  partTypes: string[] = [],
+) => ({ id, role, parts: partTypes.map((type) => ({ type })) });
+
+describe("sliceTurns", () => {
+  it("user 消息开启新 turn，下一条 user 出现即完成", () => {
+    const turns = sliceTurns(
+      [
+        msg("1", "user"),
+        msg("2", "assistant", ["text"]),
+        msg("3", "user"),
+        msg("4", "assistant", ["text"]),
+      ],
+      false,
+    );
+    expect(turns).toHaveLength(2);
+    expect(turns[0].userMessage?.id).toBe("1");
+    expect(turns[0].finished).toBe(true);
+    expect(turns[1].userMessage?.id).toBe("3");
+    expect(turns[1].finished).toBe(true);
+  });
+
+  it("streaming=false 时末 turn 完成；streaming=true 时末 turn 进行中", () => {
+    const done = sliceTurns(
+      [msg("1", "user"), msg("2", "assistant", ["text"])],
+      false,
+    );
+    expect(done[0].finished).toBe(true);
+
+    const streaming = sliceTurns(
+      [msg("1", "user"), msg("2", "assistant", ["text"])],
+      true,
+    );
+    expect(streaming[0].finished).toBe(false);
+  });
+
+  it("开头无 user 的 assistant 消息归入无名 turn", () => {
+    const turns = sliceTurns([msg("1", "assistant", ["text"])], false);
+    expect(turns).toHaveLength(1);
+    expect(turns[0].userMessage).toBeUndefined();
+    expect(turns[0].assistantMessages).toHaveLength(1);
+  });
+
+  it("tool 类 part 计入 toolCount，text 类不计入", () => {
+    const turns = sliceTurns(
+      [
+        msg("1", "user"),
+        msg("2", "assistant", ["thinking", "tool-call", "tool-result", "text"]),
+      ],
+      false,
+    );
+    expect(turns[0].toolCount).toBe(2);
+    expect(turns[0].replyCount).toBe(1);
+  });
+
+  it("单条 assistant 消息累计 toolCount", () => {
+    const turns = sliceTurns(
+      [
+        msg("1", "user"),
+        msg("2", "assistant", ["tool-call"]),
+        msg("3", "assistant", ["tool-call", "text"]),
+      ],
+      false,
+    );
+    expect(turns[0].toolCount).toBe(2);
+    expect(turns[0].replyCount).toBe(2);
+    expect(turns[0].assistantMessages).toHaveLength(2);
+  });
+
+  it("空消息数组返回空 turns", () => {
+    expect(sliceTurns([], false)).toHaveLength(0);
+    expect(sliceTurns([], true)).toHaveLength(0);
+  });
+
+  it("中间 turn 的 finished 由下一条 user 触发", () => {
+    const turns = sliceTurns(
+      [
+        msg("1", "user"),
+        msg("2", "assistant", ["text"]),
+        msg("3", "user"),
+        msg("4", "assistant", ["text"]),
+      ],
+      false,
+    );
+    expect(turns[0].finished).toBe(true);
+    expect(turns[1].finished).toBe(true);
+  });
+
+  it("streaming=true 时仅末 turn 未完成", () => {
+    const turns = sliceTurns(
+      [
+        msg("1", "user"),
+        msg("2", "assistant", ["text"]),
+        msg("3", "user"),
+        msg("4", "assistant", ["text"]),
+      ],
+      true,
+    );
+    expect(turns[0].finished).toBe(true);
+    expect(turns[1].finished).toBe(false);
+  });
+});

package/src/components/harness/__tests__/use-track-columns.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, it } from "vitest"
+import { clampColumns } from "../workbench/use-track-columns"
+
+describe("clampColumns（dsh 让位顺序：右栏先缩后失轨，center 最后让步）", () => {
+  it("视口充足 → 各栏取偏好值", () => {
+    expect(
+      clampColumns(1600, { sidebar: 280, rail: 360 }),
+    ).toEqual({ sidebar: 280, rail: 360, railVisible: true })
+  })
+
+  it("视口紧张 → 右栏先压缩到 RAIL_MIN，sidebar/center 不动", () => {
+    expect(
+      clampColumns(1050, { sidebar: 280, rail: 420 }),
+    ).toEqual({ sidebar: 280, rail: 370, railVisible: true })
+  })
+
+  it("继续收紧 → 右栏失轨（0px），center 才允许低于 400", () => {
+    expect(
+      clampColumns(800, { sidebar: 280, rail: 360 }),
+    ).toEqual({ sidebar: 280, rail: 0, railVisible: false })
+  })
+
+  it("sidebar 超上限/低于下限 → 钳制", () => {
+    expect(clampColumns(2000, { sidebar: 999, rail: 300 }).sidebar).toBe(420)
+    expect(clampColumns(2000, { sidebar: 10, rail: 300 }).sidebar).toBe(264)
+  })
+})

package/src/components/harness/agent-preset-picker.tsx

@@ -0,0 +1,104 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+"use client";
+
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Check, ChevronDown } from "lucide-react";
+import type { AgentData } from "@/components/agents/agents-page";
+import { m } from "@/paraglide/messages.js";
+
+interface AgentPresetPickerProps {
+  value?: string;
+  onValueChange: (value: string | undefined) => void;
+  agents?: AgentData[];
+}
+
+export function AgentPresetPicker({
+  value,
+  onValueChange,
+  agents = [],
+}: AgentPresetPickerProps) {
+  const selectedAgent = agents.find((a) => a.id === value);
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger render={<Button variant="ghost"
+          size="sm"
+          className="h-8 w-[200px] justify-between gap-1.5 text-xs" />}>
+          <span className="flex items-center gap-1.5 truncate">
+            <span className="text-base">
+              {selectedAgent?.avatarEmoji || "🤖"}
+            </span>
+            <span className="truncate">
+              {selectedAgent?.name || m.harness_agent_default()}
+            </span>
+          </span>
+          <ChevronDown className="size-3 shrink-0 text-muted-foreground" />
+        </DropdownMenuTrigger>
+      <DropdownMenuContent align="start" className="w-64">
+        <DropdownMenuItem
+          onClick={() => onValueChange(undefined)}
+          className="justify-between"
+        >
+          <span className="flex items-center gap-1.5">
+            <span>🤖</span>
+            <span>{m.harness_agent_default()}</span>
+          </span>
+          {!value && <Check className="size-4" />}
+        </DropdownMenuItem>
+        {agents.length > 0 && <DropdownMenuSeparator />}
+        {agents.map((agent) => (
+          <DropdownMenuItem
+            key={agent.id}
+            onClick={() => onValueChange(agent.id)}
+            className="justify-between gap-2"
+          >
+            <span className="flex min-w-0 flex-1 items-center gap-1.5">
+              <span>{agent.avatarEmoji || "🤖"}</span>
+              <span className="truncate">{agent.name}</span>
+            </span>
+            <span className="flex shrink-0 items-center gap-1">
+              {agent.model && (
+                <Badge variant="secondary" className="text-[10px] px-1.5">
+                  {agent.model}
+                </Badge>
+              )}
+              {agent.temperature !== null && agent.temperature !== undefined && (
+                <Badge
+                  variant="outline"
+                  className="text-[10px] px-1.5"
+                >
+                  t={agent.temperature}
+                </Badge>
+              )}
+              {value === agent.id && <Check className="size-4" />}
+            </span>
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}

package/src/components/{chat → harness}/ai-chat-history/components/conversation-group.tsx

@@ -37,6 +37,7 @@ export interface ConversationGroupProps {
   onDelete?: (conversationId: string) => Promise<void>;
   onArchive?: (conversationId: string) => Promise<void>;
   onUnarchive?: (conversationId: string) => Promise<void>;
+  onFork?: (conversationId: string) => Promise<void>;
   isLoading?: Record<string, boolean>;
 }
 
@@ -56,6 +57,7 @@ export function ConversationGroup({
   onDelete,
   onArchive,
   onUnarchive,
+  onFork,
   isLoading = {},
 }: ConversationGroupProps) {
   return (
@@ -79,6 +81,7 @@ export function ConversationGroup({
               isLoading={isLoading[conversation.id]}
               key={conversation.id}
               onArchive={onArchive}
+              onFork={onFork}
               onDelete={onDelete}
               onEditValueChange={onEditValueChange}
               onRename={onRename}

package/src/components/{chat → harness}/ai-chat-history/components/conversation-item.tsx

@@ -19,6 +19,7 @@
 
 import {
   Archive,
+  Copy,
   Loader2,
   MoreVertical,
   Pencil,
@@ -63,6 +64,7 @@ export interface ConversationItemProps {
   onDelete?: (conversationId: string) => Promise<void>;
   onArchive?: (conversationId: string) => Promise<void>;
   onUnarchive?: (conversationId: string) => Promise<void>;
+  onFork?: (conversationId: string) => Promise<void>;
   isLoading?: boolean;
 }
 
@@ -81,6 +83,7 @@ export function ConversationItem({
   onDelete,
   onArchive,
   onUnarchive,
+  onFork,
   isLoading = false,
 }: ConversationItemProps) {
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
@@ -157,6 +160,12 @@ export function ConversationItem({
                   <h4 className="wrap-break-word min-w-0 font-medium text-sm">
                     {conversation.title ?? ""}
                   </h4>
+                  {conversation.pendingInteraction && (
+                    <span
+                      className="size-2 shrink-0 rounded-full bg-amber-500"
+                      title={m.harness_conversation_pending()}
+                    />
+                  )}
                 </div>
                 {conversation.lastMessage && (
                   <p className="wrap-break-word line-clamp-2 min-w-0 text-muted-foreground text-xs">
@@ -186,18 +195,14 @@ export function ConversationItem({
           {!isEditing && (
             <div className="absolute top-2 right-2 z-10">
               <DropdownMenu>
-                <DropdownMenuTrigger asChild>
-                  <Button
-                    aria-label={m.chat_history_moreActions({ title: conversation.title ?? "" })}
+                <DropdownMenuTrigger render={<Button aria-label={m.chat_history_moreActions({ title: conversation.title ?? "" })}
                     className="min-h-[44px] min-w-[44px] shrink-0 text-muted-foreground transition-opacity [-webkit-tap-highlight-color:transparent] hover:text-foreground group-hover:opacity-100 sm:min-h-[24px] sm:min-w-[24px]"
                     disabled={isLoading}
                     size="icon"
                     type="button"
-                    variant="ghost"
-                  >
+                    variant="ghost" />}>
                     <MoreVertical className="size-4" />
-                  </Button>
-                </DropdownMenuTrigger>
+                  </DropdownMenuTrigger>
                 <DropdownMenuContent align="end">
                   {onRename && (
                     <DropdownMenuItem
@@ -208,6 +213,15 @@ export function ConversationItem({
                       {m.chat_history_rename()}
                     </DropdownMenuItem>
                   )}
+                  {onFork && (
+                    <DropdownMenuItem
+                      disabled={isLoading}
+                      onClick={() => onFork(conversation.id)}
+                    >
+                      <Copy className="size-4" />
+                      {m.harness_conversation_fork()}
+                    </DropdownMenuItem>
+                  )}
                   <DropdownMenuSeparator />
                   {conversation.isArchived
                     ? onUnarchive && (

package/src/components/{chat → harness}/ai-chat-history/index.tsx

@@ -42,6 +42,7 @@ export default function AIChatHistory({
   onDelete,
   onArchive,
   onUnarchive,
+  onFork,
   className,
   showSearch = true,
   showNewButton = true,
@@ -182,6 +183,7 @@ export default function AIChatHistory({
                   isLoading={loadingStates}
                   label={groupLabelKeys[group.label]?.() ?? group.label}
                   onArchive={onArchive}
+                  onFork={onFork}
                   onDelete={onDelete}
                   onEditValueChange={setEditValue}
                   onRename={onRename}

package/src/components/{chat → harness}/ai-chat-history/types.ts

@@ -23,6 +23,7 @@ export interface Conversation {
   messageCount?: number;
   isArchived?: boolean;
   isActive?: boolean;
+  pendingInteraction?: boolean;
 }
 
 export interface AIChatHistoryProps {
@@ -34,6 +35,7 @@ export interface AIChatHistoryProps {
   onDelete?: (conversationId: string) => Promise<void>;
   onArchive?: (conversationId: string) => Promise<void>;
   onUnarchive?: (conversationId: string) => Promise<void>;
+  onFork?: (conversationId: string) => Promise<void>;
   className?: string;
   showSearch?: boolean;
   showNewButton?: boolean;

package/src/components/harness/chat-ui.tsx

@@ -0,0 +1,192 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+"use client";
+
+import { fetchServerSentEvents } from "@tanstack/ai-react";
+import {
+  createChatHook,
+  type PartProps,
+} from "@tanstack/ai-react/ui";
+import {
+  automaticPartsForMessage,
+  selectMessageUI,
+} from "@tanstack/ai-client/ui";
+import type { UIMessage } from "@tanstack/ai-client";
+import type { ChatUISelectedPart } from "@tanstack/ai-client/ui";
+import type { ComponentType } from "react";
+import { byok } from "@/lib/ai/byok";
+import { MarkdownContent } from "./ai-message/components/markdown-content";
+import { HarnessLayout } from "./harness-layout";
+import { HarnessMessage } from "./harness-message";
+import { harnessChatContexts } from "./harness-chat-contexts";
+import { harnessByokProvider, harnessOnCustomEvent } from "./harness-chat-slots";
+import { QueueItem } from "./queue-item";
+import {
+  FallbackToolCard,
+  KnowledgeSearchCard,
+  WebSearchCard,
+} from "@/components/ai/tool-cards";
+import { PlanApprovalCard } from "./plan-approval-card";
+import { PluginDefineApproval } from "./plugin-define-approval";
+import { buildPluginClientTools } from "@/lib/plugin-runtime/plugin-client-tools";
+
+/**
+ * Harness chat 组件树工厂（P1 Harness 任务 5a 新增；5b 接线页面并接入 slots）。
+ *
+ * 组件与选项一次性绑定，实例差异（threadId、forwardedProps、body、
+ * initialMessages）通过 `useHarnessChat` 传入：
+ *
+ *   const chat = useHarnessChat({
+ *     threadId: activeId,
+ *     forwardedProps: { model, provider, promptKey: "chat.default" },
+ *     initialMessages: loaded,
+ *   });
+ *   return <chat.AppChat />;
+ *
+ * `byokProvider` / `onCustomEvent` 是页面级动态值（`byokProvider` 依赖
+ * `searchCapability.adapterKind`；`onCustomEvent` 承接 citations 状态），
+ * 而 `createChatHook` 的 `ChatInstanceOverrides` 类型不暴露这两项。
+ * 通过 `harness-chat-slots.ts` 的模块级插槽注入：页面 mount 时
+ * `registerHarnessChatSlots({ byokProvider, onCustomEvent })`，卸载时
+ * `clearHarnessChatSlots()`，与 `chat-handoff.ts` 的跨实例状态共享模式
+ * 一致。这里注册的 wrapper 是稳定引用（不捕获旧值），页面注册新 handler
+ * 时下次调用即读到最新 slot。
+ *
+ * 由于 `chatOptions` 不传 `tools`（等价复现 `chat-thread-page.tsx:53` 与
+ * `route.lazy.tsx:93` 的既有配置），`ChatUIHasNamedTools` 为 false，
+ * `toolsComponents` 走可选分支——仍为实际会出现的服务端工具名提供映射，
+ * 其余工具通过 `FallbackToolCard` 通用渲染。
+ */
+const chatOptions = {
+  connection: fetchServerSentEvents("/api/chat"),
+  byok,
+  byokProvider: harnessByokProvider,
+  onCustomEvent: harnessOnCustomEvent,
+  tools: buildPluginClientTools(),
+};
+
+/**
+ * 可复用的 parts 渲染器（P4d 任务 11 修复抽取）：与 workbench 的
+ * `createChatHook` 工厂使用**同一份** partsComponents / toolsComponents 映射，
+ * 把单条 `UIMessage` 的 parts 走 `selectMessageUI` + `automaticPartsForMessage`
+ * 选出结构化片段（text / tool-call / tool-result），再按既有卡片渲染。
+ *
+ * workbench 经 `chat.AppChat` 整体渲染时，`createChatUI` 内部用
+ * `MessageRenderContext` 闭包为每条消息提供 `Parts` 组件（零 props，靠
+ * `usePartContext` 取数）。该 `MessageRenderContext` 是工厂私有闭包，
+ * 不通过 `createChatHookContexts` 暴露，因此 `GlobalHarnessSidebar` 这类
+ * 在 `createChatHook` 之外直接 `chat.messages.map` 渲染 `HarnessMessage`
+ * 的场景拿不到内部 `Parts`。
+ *
+ * `HarnessMessage` 渲染 parts 的方式是 `<Parts />`（零 props，见
+ * harness-message.tsx:107/184），不向 `Parts` 透传 `message`。因此
+ * `HarnessPartsFactory(message)` 返回**已绑定该 message 的零参组件**，
+ * 侧边栏以 `Parts={HarnessPartsFactory(msg) as never}` 传入即可复现
+ * workbench 同一套渲染语义（text=MarkdownContent、tool=WebSearchCard /
+ * KnowledgeSearchCard / 其余 FallbackToolCard）。
+ *
+ * `message.role === "user"` 时 `HarnessMessage` 走 user 气泡分支并渲染
+ * `<Parts />`：user 消息 parts 均为 text，此处拼接为纯文本保留
+ * `whitespace-pre-wrap` 语义（与旧手写 map 一致）。
+ */
+export function HarnessPartsFactory(
+  message: UIMessage,
+): ComponentType<Record<string, never>> {
+  return function BoundHarnessParts() {
+    const selected = selectMessageUI(message, {
+      interrupts: [],
+      inlineToolNames: [],
+    });
+    const parts = automaticPartsForMessage(selected);
+    if (message.role === "user") {
+      const text = parts
+        .filter((p) => p.key !== "toolCall" && p.key !== "toolResult")
+        .map((p) => (p.part as { type: string; content?: string }).content ?? "")
+        .join("");
+      if (!text.trim()) return null;
+      return <p className="whitespace-pre-wrap">{text}</p>;
+    }
+    return (
+      <>
+        {parts.map((part, i) => (
+          <HarnessSelectedPart key={i} part={part} />
+        ))}
+      </>
+    );
+  };
+}
+
+function HarnessSelectedPart({ part }: { part: ChatUISelectedPart }) {
+  if (part.key === "toolCall") {
+    switch (part.part.name) {
+      case "web_search":
+        return <WebSearchCard part={part.part as never} result={part.result as never} />;
+      case "knowledge_search":
+        return (
+          <KnowledgeSearchCard part={part.part as never} result={part.result as never} />
+        );
+      default:
+        return <FallbackToolCard part={part.part as never} result={part.result as never} />;
+    }
+  }
+  if (part.key === "toolResult") return null;
+  const p = part.part as { type: string; content?: string };
+  if (p.type === "text") {
+    return <MarkdownContent content={p.content ?? ""} skipCodeHighlighting />;
+  }
+  return null;
+}
+
+export const {
+  useAppChat: useHarnessChat,
+  useChatContext: useHarnessChatContext,
+} = createChatHook({
+  options: chatOptions,
+  context: harnessChatContexts,
+  components: {
+    layout: HarnessLayout,
+    message: HarnessMessage,
+    queue: QueueItem,
+  },
+  partsComponents: {
+    text: ({ part }: PartProps<typeof chatOptions, "text">) => (
+      <MarkdownContent content={part.content} skipCodeHighlighting />
+    ),
+  },
+  toolsComponents: {
+    web_search: WebSearchCard,
+    knowledge_search: KnowledgeSearchCard,
+    document_action: FallbackToolCard,
+    user_data_query: FallbackToolCard,
+    reindex_knowledge_base: FallbackToolCard,
+    delete_project: FallbackToolCard,
+    todo_write: FallbackToolCard,
+    plan_submit: FallbackToolCard,
+    plugin_define: FallbackToolCard,
+    plugin_run: FallbackToolCard,
+    plugin_stop: FallbackToolCard,
+    plugin_undefine: FallbackToolCard,
+    plugin_inspect_list: FallbackToolCard,
+  },
+  interruptsComponents: {
+    generic: {
+      plan_approval: PlanApprovalCard,
+      plugin_define: PluginDefineApproval,
+    } as Record<string, unknown>,
+  },
+});