feat(knowledge): 笔记阅读视图标题栏挂到体系入口（触点②接入）

Author: Aparencia

app/src/components/NoteReadingView.test.tsx

@@ -0,0 +1,69 @@
+// @vitest-environment jsdom
+/**
+ * NoteReadingView.test.tsx — 标题栏扩展插槽 headerExtra（v0.13.7 触点②）。
+ *
+ * @ai-context: 覆盖标题栏插槽契约——headerExtra 渲染于「编辑」与「删除」之间，
+ *              且未传时不渲染（回归：既有标题栏按钮布局不受影响）。
+ */
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { cleanup, render, screen } from "@testing-library/react";
+import type { Note } from "../types";
+import NoteReadingView from "./NoteReadingView";
+
+const baseNote = (): Note => ({
+  id: 1,
+  title: "标题",
+  content: "# 正文\n内容段落",
+  source: "session",
+  session_id: 42,
+  rule_version: null,
+  purify_stats: null,
+  tags: "[]",
+  properties: null,
+  pin: 0,
+  group_id: null,
+  created_at: 1,
+  updated_at: 2,
+});
+
+const noop = vi.fn();
+
+const renderView = (headerExtra?: React.ReactNode) =>
+  render(
+    <NoteReadingView
+      note={baseNote()}
+      editing={false}
+      headerExtra={headerExtra}
+      onEdit={noop}
+      onPinToggle={noop}
+      onDelete={noop}
+      onTagClick={noop}
+      onOpenSession={noop}
+      onTaskToggle={noop}
+      onImageOpen={noop}
+    />,
+  );
+
+afterEach(() => cleanup());
+
+describe("NoteReadingView 标题栏扩展插槽", () => {
+  it("headerExtra 渲染于「删除」按钮之前", () => {
+    renderView(<span data-testid="header-extra">🧭 挂到体系</span>);
+    const extra = screen.getByTestId("header-extra");
+    expect(extra).toBeTruthy();
+    // 位置契约：extra 在编辑按钮之后、删除按钮之前
+    const editBtn = screen.getByRole("button", { name: /编辑/ });
+    const delBtn = screen.getByRole("button", { name: "删除" });
+    const posOf = (a: Element, b: Element) => a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING;
+    expect(posOf(editBtn, extra)).toBeTruthy();
+    expect(posOf(extra, delBtn)).toBeTruthy();
+  });
+
+  it("未传 headerExtra 时标题栏正常渲染（回归）", () => {
+    renderView(undefined);
+    expect(screen.getByRole("button", { name: /编辑/ })).toBeTruthy();
+    expect(screen.getByRole("button", { name: "删除" })).toBeTruthy();
+    // 固定按钮内容为 📌（title=「固定」是可访问名称兜底）
+    expect(screen.getByRole("button", { name: "📌" })).toBeTruthy();
+  });
+});

app/src/components/NoteReadingView.tsx

@@ -22,6 +22,8 @@ interface Props {
   editor?: ReactNode;
   /** H3：版本时间线/知识补充等辅助面板插槽（阅读态显示） */
   auxPanels?: ReactNode;
+  /** 标题栏右侧扩展插槽（v0.13.7 触点② 挂到体系） */
+  headerExtra?: ReactNode;
   onEdit: () => void;
   onPinToggle: () => void;
   onDelete: () => void;
@@ -32,7 +34,7 @@ interface Props {
 }
 
 export default function NoteReadingView({
-  note, editing, editor, auxPanels,
+  note, editing, editor, auxPanels, headerExtra,
   onEdit, onPinToggle, onDelete, onTagClick, onOpenSession, onTaskToggle, onImageOpen,
 }: Props) {
   // A2：搜索高亮（M6：匹配集合=渲染产物只读查询，计数经此状态驱动）
@@ -161,6 +163,7 @@ export default function NoteReadingView({
           >
             ✏ 编辑（Ctrl+E）
           </button>
+          {headerExtra}
           <button
             onClick={onDelete}
             style={{ fontSize: 12, color: "#dc2626", cursor: "pointer", padding: "4px 10px", borderRadius: 4, border: "1px solid #fecaca", background: "#fff" }}

app/src/pages/NotesPage.test.tsx

@@ -59,9 +59,11 @@ describe("NotesPage 编辑完成即时刷新", () => {
         case "get_note":
           return store;
         default:
-          // 子面板（EnrichPanel/VersionPanel 等）挂载期查询——空值兜底不抛错
+          // 子面板（EnrichPanel/VersionPanel/NoteLinkToSystem 等）挂载期查询——空值兜底不抛错
           if (cmd === "note_versions_list") return [];
           if (cmd === "note_versions_usage") return [];
+          if (cmd === "list_knowledge_systems") return [];
+          if (cmd === "list_knowledge_links") return [];
           return null;
       }
     });

app/src/pages/NotesPage.tsx

@@ -25,6 +25,7 @@ import NoteReadingView from "../components/NoteReadingView";
 import ImagePreviewOverlay from "../components/ImagePreviewOverlay";
 import VersionPanel from "../components/VersionPanel";
 import EnrichPanel from "../components/EnrichPanel";
+import NoteLinkToSystem from "../components/NoteLinkToSystem";
 import { useNoteAttention } from "../components/useNoteAttention";
 
 interface Props {
@@ -354,6 +355,10 @@ export default function NotesPage({ focusNoteId, onOpenSessions, onOpenSystem }:
               />
             }
             auxPanels={auxPanels}
+            headerExtra={
+              // v0.13.7 触点②：标题栏「挂到体系」入口；key=note.id 切笔记重置内部态
+              <NoteLinkToSystem key={`link-${selected.id}`} noteId={selected.id} onChanged={() => void handleNoteChanged()} />
+            }
             onEdit={() => setEditing(true)}
             onPinToggle={() => void runPinToggle(selected)}
             onDelete={() => void runDelete(selected.id)}