feat: update knowledge and agent UI

frontend-web/src/components/knowledge-graph/GraphDetailPanel.tsx

@@ -1,4 +1,13 @@
-import { Crosshair, EyeOff, FileText, Loader2, MousePointerClick } from "lucide-react";
+import {
+  Compass,
+  Crosshair,
+  EyeOff,
+  FileText,
+  Loader2,
+  MousePointerClick,
+  Waypoints,
+  X,
+} from "lucide-react";
 
 import type { KnowledgeNote } from "@/core/knowledge/types";
 
@@ -37,10 +46,20 @@ interface GraphDetailPanelProps {
   /** Note detail (only for note-type nodes; undefined while absent/loading). */
   note: KnowledgeNote | undefined;
   noteLoading: boolean;
+  /** Explore-mode context; null when in full mode. */
+  explore: {
+    /** Depth of this node in the explore graph; null = not yet visible. */
+    depth: number | null;
+    expanded: boolean;
+    isRoot: boolean;
+  } | null;
   onViewSource: (noteId: string) => void;
   onLocate: (id: string) => void;
   onHide: (id: string) => void;
   onPickNeighbor: (id: string) => void;
+  onExpandNode: (id: string) => void;
+  onSetExploreRoot: (id: string) => void;
+  onClose: () => void;
 }
 
 function formatTime(value: string | null | undefined): string {
@@ -57,6 +76,14 @@ export function GraphDetailPanel(props: GraphDetailPanelProps) {
     <aside className="kg-panel kg-detail">
       <div className="kg-panel-header">
         <span className="kg-panel-title">节点详情</span>
+        <button
+          type="button"
+          className="kg-panel-close-btn"
+          title="收起详情面板"
+          onClick={props.onClose}
+        >
+          <X size={15} />
+        </button>
       </div>
       {!node ? (
         <div className="kg-detail-empty">
@@ -104,6 +131,28 @@ function DetailBody(props: GraphDetailPanelProps & { node: GraphNode }) {
         >
           度数 {props.degree}
         </span>
+        {props.explore && props.explore.depth !== null ? (
+          <>
+            <span
+              className="kg-detail-type"
+              style={{ background: "rgba(56, 189, 248, 0.14)", color: "#7dd3fc" }}
+            >
+              {props.explore.isRoot
+                ? "探索起点"
+                : `第 ${props.explore.depth} 层`}
+            </span>
+            <span
+              className="kg-detail-type"
+              style={
+                props.explore.expanded
+                  ? { background: "rgba(52, 211, 153, 0.14)", color: "#6ee7b7" }
+                  : { background: "rgba(251, 191, 36, 0.14)", color: "#fcd34d" }
+              }
+            >
+              {props.explore.expanded ? "已展开" : "可展开"}
+            </span>
+          </>
+        ) : null}
       </div>
 
       {props.noteLoading ? (
@@ -171,6 +220,31 @@ function DetailBody(props: GraphDetailPanelProps & { node: GraphNode }) {
         >
           <EyeOff size={14} /> 隐藏节点
         </button>
+        {props.explore ? (
+          <>
+            <button
+              type="button"
+              className="kg-icon-button"
+              disabled={props.explore.depth === null || props.explore.expanded}
+              title={
+                props.explore.expanded
+                  ? "该节点的一跳邻居已全部展开"
+                  : "展开该节点的一跳邻居"
+              }
+              onClick={() => props.onExpandNode(node.id)}
+            >
+              <Waypoints size={14} /> 展开一跳邻居
+            </button>
+            <button
+              type="button"
+              className="kg-icon-button"
+              title="清空当前探索路径,以此节点为新起点"
+              onClick={() => props.onSetExploreRoot(node.id)}
+            >
+              <Compass size={14} /> 以此为新起点
+            </button>
+          </>
+        ) : null}
       </div>
 
       <h3 className="kg-detail-section-title">