fix: 图谱视图简化为单useEffect，修复节点不渲染；清理诊断代码

apps/desktop/src/renderer/features/graph/GraphView.tsx

@@ -1,20 +1,24 @@
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef } from 'react';
 import { Graph } from '@antv/g6';
 import { invoke } from '../../ipc-client';
 import { IPC, type GraphData, type GraphNode } from '@hunter/shared';
 import { useStore } from '../../store';
 
-// 按顶层分组固定坐标布局：每组一列，组内纵向排开，间距充足（FR-G2 组内分行排布）
-function layoutNodes(nodes: GraphNode[], width: number, height: number) {
+function truncate(s: string, n: number) { return s.length > n ? s.slice(0, n) + '…' : s; }
+
+function layoutNodes(nodes: GraphNode[], w: number, h: number) {
   const groups = new Map<string, GraphNode[]>();
   nodes.forEach(n => { const a = groups.get(n.group) ?? []; a.push(n); groups.set(n.group, a); });
   const groupList = [...groups.entries()];
-  const colWidth = groupList.length > 0 ? width / groupList.length : width;
   const positions = new Map<string, { x: number; y: number }>();
+  if (groupList.length === 0) return positions;
+  const margin = 100;
+  const usableW = Math.max(200, w - margin * 2);
+  const colWidth = usableW / groupList.length;
   groupList.forEach(([group, items], gi) => {
-    const colX = colWidth * gi + colWidth / 2;
-    const rowGap = Math.min(80, height / Math.max(items.length, 1));
-    const startY = height / 2 - (items.length * rowGap) / 2 + rowGap / 2;
+    const colX = margin + colWidth * gi + colWidth / 2;
+    const rowGap = items.length > 1 ? Math.min(80, (h - margin * 2) / (items.length - 1)) : 0;
+    const startY = h / 2 - ((items.length - 1) * rowGap) / 2;
     items.forEach((n, ni) => positions.set(n.id, { x: colX, y: startY + ni * rowGap }));
   });
   return positions;
@@ -22,59 +26,61 @@ function layoutNodes(nodes: GraphNode[], width: number, height: number) {
 
 export function GraphView() {
   const containerRef = useRef<HTMLDivElement>(null);
-  const [graph, setGraph] = useState<Graph | null>(null);
   const { openDoc } = useStore();
-  const sizeRef = useRef({ w: 800, h: 600 });
 
   useEffect(() => {
     if (!containerRef.current) return;
     const el = containerRef.current;
-    const updateSize = () => { sizeRef.current = { w: el.clientWidth || 800, h: el.clientHeight || 600 }; };
-    updateSize();
-    const ro = new ResizeObserver(updateSize);
-    ro.observe(el);
-    const g = new Graph({
-      container: el,
-      width: sizeRef.current.w,
-      height: sizeRef.current.h,
-      autoResize: true,
-      layout: { type: 'grid' } as any,
-      node: {
-        style: {
-          size: 28,
-          fill: (d: any) => d.color || '#4a9eff',
-          labelText: (d: any) => truncate(d.title, 10),
-          labelFill: '#ddd',
-          labelFontSize: 11,
-          labelPlacement: 'bottom',
-          labelOffsetY: 4,
-        }
-      } as any,
-      edge: { style: { stroke: '#555', lineWidth: 1, endArrow: true } } as any,
-      behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element'],
-    });
-    setGraph(g);
-    return () => { ro.disconnect(); g.destroy(); };
-  }, []);
+    const rect = el.getBoundingClientRect();
+    const w = rect.width || 800, h = rect.height || 600;
+    let g: Graph;
+    try {
+      g = new Graph({
+        container: el,
+        width: w,
+        height: h,
+        autoResize: true,
+        node: {
+          style: {
+            size: 30,
+            fill: (d: any) => (d.style && d.style.fill) || '#4a9eff',
+            stroke: '#6a8cff',
+            lineWidth: 2,
+            labelText: (d: any) => truncate((d.data && d.data.title) || d.id, 12),
+            labelFill: '#eee',
+            labelFontSize: 12,
+            labelPlacement: 'bottom',
+            labelOffsetY: 6,
+          }
+        } as any,
+        edge: { style: { stroke: '#666', lineWidth: 1.5, endArrow: true } } as any,
+        behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element'],
+      });
+    } catch (e) { console.error(e); return; }
 
-  useEffect(() => {
-    if (!graph) return;
     invoke(IPC.graph, undefined as never).then((data: GraphData) => {
-      const pos = layoutNodes(data.nodes, sizeRef.current.w, sizeRef.current.h);
-      graph.setData({
-        nodes: data.nodes.map(n => ({ id: n.id, x: pos.get(n.id)!.x, y: pos.get(n.id)!.y, style: { fill: n.color }, data: { title: n.title, star: n.star } })),
-        edges: data.edges.map(e => ({ source: e.source, target: e.target })),
-      } as any);
-      graph.render();
-    });
-    graph.on('node:click', (e: any) => { openDoc(e.target.id); });
-  }, [graph]);
+      const r = el.getBoundingClientRect();
+      const cw = r.width || 800, ch = r.height || 600;
+      const pos = layoutNodes(data.nodes, cw, ch);
+      const nodes = data.nodes.map(n => ({
+        id: n.id,
+        x: pos.get(n.id)?.x ?? cw / 2,
+        y: pos.get(n.id)?.y ?? ch / 2,
+        style: { fill: n.color, stroke: n.star ? '#ffd54a' : '#6a8cff' },
+        data: { title: n.title, star: n.star },
+      }));
+      const edges = data.edges.map(e => ({ source: e.source, target: e.target }));
+      g.setData({ nodes, edges } as any);
+      g.render();
+    }).catch(e => console.error(e));
+
+    g.on('node:click', (e: any) => { if (e.target && e.target.id) openDoc(e.target.id); });
+    return () => { try { g.destroy(); } catch {} };
+  }, []);
 
   return (
     <div style={{ flex: 1, background: '#111', position: 'relative', overflow: 'hidden' }}>
       <div ref={containerRef} style={{ position: 'absolute', inset: 0 }} />
     </div>
   );
-}
-
-function truncate(s: string, n: number) { return s.length > n ? s.slice(0, n) + '…' : s; }
+}