feat(product-source): 光湖知识库模块 v0.1.0 — Git 驱动的完整知识库系统
铸渊 2026-08-08 开发，冰朔架构决策：
- Git 是底层引擎，不依赖任何数据库（PostgreSQL/Redis/ORM）
- Agent 直达底层，中间不隔第三方服务
- 拆解 Outline v0.80.2 为参考样本，光湖自己实现全部能力
技术栈：
- 后端：Express v5 + simple-git + gray-matter（Git 操作层）
- 前端：Vite + React 19 + TypeScript + marked
- 存储：Markdown 文件 + Git 仓库（commit=版本历史，diff=对比）
功能清单（全部可用）：
- 文档 CRUD（创建/读取/更新/删除/移动）
- 文档树导航（文件夹层级）
- Markdown 编辑器（编辑/预览双栏）
- 全文搜索（防抖 + 下拉结果）
- 版本历史（git log）
- 版本 diff 对比（选择两个 commit 对比）
API 端点（Agent 和 UI 共用）：
- GET/POST/PUT/DELETE /api/docs/{*path}
- GET /api/tree
- GET /api/history/{*path}
- GET /api/version/:hash/{*path}
- GET /api/diff/{*path}?from=&to=
- GET /api/search?q=
- POST /api/move
- GET /api/health
This commit is contained in:
parent
920b6bf690
commit
ecfeca40e2
16 changed files with 5970 additions and 0 deletions
174
product-source/guanghu-knowledge-base/src/App.tsx
Normal file
174
product-source/guanghu-knowledge-base/src/App.tsx
Normal file
|
|
@ -0,0 +1,174 @@
|
|||
import { useState, useEffect, useCallback } from 'react';
|
||||
import { api, DocTreeNode, DocContent } from './api';
|
||||
import { DocTree } from './components/DocTree';
|
||||
import { Editor } from './components/Editor';
|
||||
import { SearchBar } from './components/SearchBar';
|
||||
import { VersionHistory } from './components/VersionHistory';
|
||||
|
||||
type View = 'editor' | 'history';
|
||||
|
||||
export default function App() {
|
||||
const [tree, setTree] = useState<DocTreeNode[]>([]);
|
||||
const [currentDoc, setCurrentDoc] = useState<DocContent | null>(null);
|
||||
const [currentPath, setCurrentPath] = useState<string>('');
|
||||
const [view, setView] = useState<View>('editor');
|
||||
const [sidebarOpen, setSidebarOpen] = useState(true);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
const refreshTree = useCallback(async () => {
|
||||
try {
|
||||
const t = await api.getTree();
|
||||
setTree(t);
|
||||
} catch (err: any) {
|
||||
setError(`加载文档树失败: ${err.message}`);
|
||||
}
|
||||
}, []);
|
||||
|
||||
const openDoc = useCallback(async (docPath: string) => {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
try {
|
||||
const doc = await api.getDoc(docPath);
|
||||
setCurrentDoc(doc);
|
||||
setCurrentPath(docPath);
|
||||
setView('editor');
|
||||
} catch (err: any) {
|
||||
setError(`加载文档失败: ${err.message}`);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
const saveDoc = useCallback(async (title: string, body: string) => {
|
||||
if (!currentPath) return;
|
||||
setLoading(true);
|
||||
try {
|
||||
const doc = await api.updateDoc(currentPath, title, body);
|
||||
setCurrentDoc(doc);
|
||||
await refreshTree();
|
||||
} catch (err: any) {
|
||||
setError(`保存失败: ${err.message}`);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [currentPath, refreshTree]);
|
||||
|
||||
const createDoc = useCallback(async (parentPath: string) => {
|
||||
const name = prompt('文档文件名（不含 .md）：');
|
||||
if (!name) return;
|
||||
const title = prompt('文档标题：') || name;
|
||||
const docPath = parentPath ? `${parentPath}/${name}.md` : `${name}.md`;
|
||||
try {
|
||||
const doc = await api.createDoc(docPath, title, `# ${title}\n\n在这里开始写作...\n`);
|
||||
setCurrentDoc(doc);
|
||||
setCurrentPath(docPath);
|
||||
await refreshTree();
|
||||
} catch (err: any) {
|
||||
setError(`创建失败: ${err.message}`);
|
||||
}
|
||||
}, [refreshTree]);
|
||||
|
||||
const deleteDoc = useCallback(async () => {
|
||||
if (!currentPath) return;
|
||||
if (!confirm(`确认删除 ${currentPath}？`)) return;
|
||||
try {
|
||||
await api.deleteDoc(currentPath);
|
||||
setCurrentDoc(null);
|
||||
setCurrentPath('');
|
||||
await refreshTree();
|
||||
} catch (err: any) {
|
||||
setError(`删除失败: ${err.message}`);
|
||||
}
|
||||
}, [currentPath, refreshTree]);
|
||||
|
||||
useEffect(() => {
|
||||
refreshTree();
|
||||
}, [refreshTree]);
|
||||
|
||||
return (
|
||||
<div className="kb-app">
|
||||
{/* 顶栏 */}
|
||||
<header className="kb-header">
|
||||
<div className="kb-header-left">
|
||||
<button
|
||||
className="kb-btn-icon"
|
||||
onClick={() => setSidebarOpen(!sidebarOpen)}
|
||||
title={sidebarOpen ? '收起侧栏' : '展开侧栏'}
|
||||
>
|
||||
{sidebarOpen ? '◀' : '▶'}
|
||||
</button>
|
||||
<h1 className="kb-title">光湖知识库</h1>
|
||||
</div>
|
||||
<div className="kb-header-center">
|
||||
<SearchBar onSelect={openDoc} />
|
||||
</div>
|
||||
<div className="kb-header-right">
|
||||
{currentDoc && (
|
||||
<>
|
||||
<button
|
||||
className={`kb-btn-tab ${view === 'editor' ? 'active' : ''}`}
|
||||
onClick={() => setView('editor')}
|
||||
>
|
||||
编辑
|
||||
</button>
|
||||
<button
|
||||
className={`kb-btn-tab ${view === 'history' ? 'active' : ''}`}
|
||||
onClick={() => setView('history')}
|
||||
>
|
||||
历史
|
||||
</button>
|
||||
<button className="kb-btn-icon kb-btn-danger" onClick={deleteDoc} title="删除">
|
||||
🗑
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{/* 主体 */}
|
||||
<div className="kb-body">
|
||||
{/* 侧栏 */}
|
||||
{sidebarOpen && (
|
||||
<aside className="kb-sidebar">
|
||||
<div className="kb-sidebar-actions">
|
||||
<button className="kb-btn-small" onClick={() => createDoc('')}>
|
||||
+ 根目录文档
|
||||
</button>
|
||||
</div>
|
||||
<DocTree
|
||||
nodes={tree}
|
||||
currentPath={currentPath}
|
||||
onSelect={openDoc}
|
||||
onCreate={createDoc}
|
||||
/>
|
||||
</aside>
|
||||
)}
|
||||
|
||||
{/* 内容区 */}
|
||||
<main className="kb-content">
|
||||
{error && (
|
||||
<div className="kb-error">
|
||||
{error}
|
||||
<button onClick={() => setError(null)}>✕</button>
|
||||
</div>
|
||||
)}
|
||||
{loading && <div className="kb-loading">加载中...</div>}
|
||||
{!currentDoc && !loading && (
|
||||
<div className="kb-empty">
|
||||
<div className="kb-empty-icon">📖</div>
|
||||
<p>选择左侧文档开始阅读</p>
|
||||
<p className="kb-empty-hint">或点击「+ 根目录文档」创建新文档</p>
|
||||
</div>
|
||||
)}
|
||||
{currentDoc && view === 'editor' && (
|
||||
<Editor doc={currentDoc} onSave={saveDoc} />
|
||||
)}
|
||||
{currentDoc && view === 'history' && (
|
||||
<VersionHistory docPath={currentPath} />
|
||||
)}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in a new issue