From 070d8d8cd1e060b652cbd3b8789edb4863136070 Mon Sep 17 00:00:00 2001
From: xiongxiao <kevisual@xiongxiao.me>
Date: Mon, 16 Mar 2026 00:09:30 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E8=81=8A=E5=A4=A9?=
 =?UTF-8?q?=E5=8A=A9=E6=89=8B=E5=8A=9F=E8=83=BD=EF=BC=8C=E5=88=9B=E5=BB=BA?=
 =?UTF-8?q?=20ChatDev=20=E9=A1=B5=E9=9D=A2=E5=8F=8A=E7=9B=B8=E5=85=B3?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86=EF=BC=9B=E6=9B=B4=E6=96=B0?=
 =?UTF-8?q?=E8=B7=AF=E7=94=B1=E9=85=8D=E7=BD=AE=EF=BC=8C=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E8=81=8A=E5=A4=A9=E5=8A=A9=E6=89=8B=E7=9A=84=E8=B7=AF=E5=BE=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |  1 +
 .../components/Graph3DConfigDialog.tsx        | 65 +++++++++++++++++++
 .../code-graph/modules/graph3d-config.ts      | 50 ++++++++++++++
 3 files changed, 116 insertions(+)
 create mode 100644 src/pages/code-graph/components/Graph3DConfigDialog.tsx
 create mode 100644 src/pages/code-graph/modules/graph3d-config.ts

diff --git a/package.json b/package.json
index 404287f..5377e78 100644
--- a/package.json
+++ b/package.json
@@ -53,6 +53,7 @@
     "sigma": "^3.0.2",
     "sonner": "^2.0.7",
     "three": "^0.183.2",
+    "three-spritetext": "^1.10.0",
     "zustand": "^5.0.11"
   },
   "publishConfig": {
diff --git a/src/pages/code-graph/components/Graph3DConfigDialog.tsx b/src/pages/code-graph/components/Graph3DConfigDialog.tsx
new file mode 100644
index 0000000..3673df3
--- /dev/null
+++ b/src/pages/code-graph/components/Graph3DConfigDialog.tsx
@@ -0,0 +1,65 @@
+import { SlidersHorizontalIcon } from 'lucide-react';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@/components/ui/dialog';
+import { Checkbox } from '@/components/ui/checkbox';
+import { Button } from '@/components/ui/button';
+import { Graph3DConfig } from '../modules/graph3d-config';
+
+interface Graph3DConfigDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  config: Graph3DConfig;
+  onUpdate: (patch: Partial<Graph3DConfig>) => void;
+  onReset: () => void;
+}
+
+export function Graph3DConfigDialog({ open, onOpenChange, config, onUpdate, onReset }: Graph3DConfigDialogProps) {
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className='max-w-md'>
+        <DialogHeader>
+          <DialogTitle className='flex items-center gap-2'>
+            <SlidersHorizontalIcon className='w-4 h-4' />
+            3D 图谱配置
+          </DialogTitle>
+          <DialogDescription>配置 3D 力导向图的显示效果，设置自动保存到本地。</DialogDescription>
+        </DialogHeader>
+
+        <div className='py-2 space-y-5'>
+          {/* ── 显示 ── */}
+          <section>
+            <p className='text-xs font-semibold text-slate-400 uppercase tracking-wider mb-3'>显示</p>
+            <div className='space-y-3'>
+              <label className='flex items-center gap-3 cursor-pointer select-none group'>
+                <Checkbox
+                  checked={config.showLabels}
+                  onCheckedChange={(checked) => onUpdate({ showLabels: !!checked })}
+                />
+                <div>
+                  <p className='text-sm font-medium text-slate-100'>显示节点文字标签</p>
+                  <p className='text-xs text-slate-400'>在节点旁以 3D 精灵字体显示名称</p>
+                </div>
+              </label>
+            </div>
+          </section>
+
+          {/* ── 其他配置暂留 ── */}
+          <section>
+            <p className='text-xs font-semibold text-slate-400 uppercase tracking-wider mb-3'>其他（暂留）</p>
+            <div className='rounded-md border border-dashed border-white/10 px-4 py-3 text-xs text-slate-500'>
+              更多配置项开发中…
+            </div>
+          </section>
+        </div>
+
+        <div className='flex justify-between pt-2'>
+          <Button variant='ghost' size='sm' className='text-slate-400 hover:text-slate-200' onClick={onReset}>
+            恢复默认
+          </Button>
+          <Button size='sm' onClick={() => onOpenChange(false)}>
+            完成
+          </Button>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/src/pages/code-graph/modules/graph3d-config.ts b/src/pages/code-graph/modules/graph3d-config.ts
new file mode 100644
index 0000000..eeea0d3
--- /dev/null
+++ b/src/pages/code-graph/modules/graph3d-config.ts
@@ -0,0 +1,50 @@
+import { useState, useCallback } from 'react';
+
+const STORAGE_KEY = 'code-graph-3d-config';
+
+export interface Graph3DConfig {
+  /** 是否默认显示文字标签（SpriteText） */
+  showLabels: boolean;
+  // 其他配置项暂留
+}
+
+const DEFAULT_CONFIG: Graph3DConfig = {
+  showLabels: true,
+};
+
+function loadConfig(): Graph3DConfig {
+  try {
+    const raw = localStorage.getItem(STORAGE_KEY);
+    if (!raw) return { ...DEFAULT_CONFIG };
+    return { ...DEFAULT_CONFIG, ...JSON.parse(raw) };
+  } catch {
+    return { ...DEFAULT_CONFIG };
+  }
+}
+
+function saveConfig(config: Graph3DConfig): void {
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(config));
+  } catch {
+    // ignore
+  }
+}
+
+export function useGraph3DConfig() {
+  const [config, setConfigState] = useState<Graph3DConfig>(() => loadConfig());
+
+  const updateConfig = useCallback((patch: Partial<Graph3DConfig>) => {
+    setConfigState((prev) => {
+      const next = { ...prev, ...patch };
+      saveConfig(next);
+      return next;
+    });
+  }, []);
+
+  const resetConfig = useCallback(() => {
+    saveConfig(DEFAULT_CONFIG);
+    setConfigState({ ...DEFAULT_CONFIG });
+  }, []);
+
+  return { config, updateConfig, resetConfig };
+}