-
欢迎使用 TreeChat
+
欢迎使用 TreeAI
创建一个新会话，开始与 AI 进行树状结构的对话。
@@ -116,4 +116,4 @@ const App: React.FC = () => {
);
};
-export default App;
\ No newline at end of file
+export default App;
diff --git a/src/components/ChatFlow.tsx b/src/components/ChatFlow.tsx
index e1cba92..6eb2d1b 100644
--- a/src/components/ChatFlow.tsx
+++ b/src/components/ChatFlow.tsx
@@ -14,13 +14,12 @@ import SystemNode from './nodes/SystemNode';
import ChatNode from './nodes/ChatNode';
import { useSessionStore } from '../stores/sessionStore';
import { useModelStore } from '../stores/modelStore';
-import { ChatNode as ChatNodeType, Session } from '../types';
-import { sendChatRequest, abortRequest } from '../services/apiService';
-import { Share2, UploadCloud, LayoutGrid, FileUp } from 'lucide-react';
+import { ChatNode as ChatNodeType } from '../types';
+import { sendChatRequest } from '../services/apiService';
+import { Share2, LayoutGrid, FileUp } from 'lucide-react';
import { exportToMindmap } from '../utils/exportUtils';
-import { gsap } from 'gsap';
import FileUploadButton from './FileUploadButton';
-import { showSuccess, showInfo, showWarning, showError } from '../utils/notification';
+import { showSuccess, showError } from '../utils/notification';
const nodeTypes = {
system: SystemNode,
@@ -32,17 +31,14 @@ interface ChatFlowProps {
}
const ReactFlowWrapper: React.FC
= ({ sessionId }) => {
- const { sessions, updateSession, addNodeToSession, updateNodeInSession, deleteNodeFromSession } = useSessionStore();
+ const { sessions, addNodeToSession, updateNodeInSession, deleteNodeFromSession } = useSessionStore();
const { models, defaultModelId } = useModelStore();
const session = sessions.find(s => s.id === sessionId);
const [nodes, setNodes] = useState([]);
const [edges, setEdges] = useState([]);
const reactFlowInstance = useReactFlow();
const abortControllerRef = useRef>({});
- const prevNodeCountRef = useRef(0);
- const [nodeDimensions, setNodeDimensions] = useState>({});
- const [autoLayout, setAutoLayout] = useState(true);
- const [isTyping, setIsTyping] = useState(false);
+ const [nodeDimensions] = useState>({});
const [streamingResponses, setStreamingResponses] = useState>({});
const calculateNodeLayout = useCallback((forceRecalculate = false) => {
@@ -108,8 +104,6 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
calculateSubtreeWidth(systemNode.id);
}
- const levelHeights = new Map();
-
const calculateNodePosition = (nodeId: string, startX: number, level: number, startY: number) => {
const nodeDim = getNodeDimensions(nodeId);
const width = subtreeWidths.get(nodeId) || nodeDim.width;
@@ -191,10 +185,12 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
reactFlowInstance.fitView({ padding: 0.2 });
}, 50);
+ // The handlers below intentionally read the latest session state from this render.
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [session, nodeDimensions, streamingResponses, sessionId, updateNodeInSession]);
- const handleAddChildNode = async (parentId: string) => {
+ const handleAddChildNode = (parentId: string) => {
if (!session || !defaultModelId) return;
const parentNode = session.nodes.find(n => n.id === parentId);
@@ -232,7 +228,7 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
addNodeToSession(sessionId, newNode);
};
- const handleEditNode = (nodeId: string, content: string, type: 'user' | 'assistant' | 'system', isInputting = false) => {
+ const handleEditNode = (nodeId: string, content: string, type: 'user' | 'assistant' | 'system') => {
if (!session) return;
const node = session.nodes.find(n => n.id === nodeId);
@@ -353,13 +349,14 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
return newState;
});
- } catch (error: any) {
+ } catch (error: unknown) {
console.error('Chat request failed:', error);
+ const message = error instanceof Error ? error.message : 'Failed to get response';
updateNodeInSession(sessionId, {
...node,
isStreaming: false,
- error: error.message || 'Failed to get response'
+ error: message
});
// 清除流式状态
@@ -414,8 +411,9 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
try {
exportToMindmap(session);
showSuccess('导出成功');
- } catch (error: any) {
- showError('导出失败:' + error.message);
+ } catch (error: unknown) {
+ const message = error instanceof Error ? error.message : 'Unknown error';
+ showError('导出失败:' + message);
}
};
@@ -507,6 +505,8 @@ const ReactFlowWrapper: React.FC = ({ sessionId }) => {
setNodes(reactFlowNodes);
setEdges(reactFlowEdges);
+ // Keep node callbacks bound to the current render without rebuilding this effect recursively.
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [session?.nodes, sessionId, streamingResponses]); // 添加 sessionId 到依赖数组
@@ -592,4 +592,4 @@ const ChatFlow: React.FC = ({ sessionId }) => (
);
-export default ChatFlow;
\ No newline at end of file
+export default ChatFlow;
diff --git a/src/components/FileUploadButton.tsx b/src/components/FileUploadButton.tsx
index a35bb01..42a7abc 100644
--- a/src/components/FileUploadButton.tsx
+++ b/src/components/FileUploadButton.tsx
@@ -3,7 +3,7 @@ import { useDropzone } from 'react-dropzone';
import { FileUp, X, Check } from 'lucide-react';
import { extractTextFromFiles } from '../utils/fileUtils';
import { FileExtractResult } from '../types';
-import { showSuccess, showInfo, showWarning, showError } from '../utils/notification';
+import { showSuccess, showError } from '../utils/notification';
interface FileUploadButtonProps {
onUploadComplete: (text: string) => void;
@@ -19,8 +19,6 @@ const FileUploadButton: React.FC = ({ onUploadComplete, c
const { getRootProps, getInputProps, isDragActive } = useDropzone({
accept: {
- 'application/pdf': ['.pdf'],
- 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': ['.docx'],
'text/plain': ['.txt'],
'text/markdown': ['.md'],
},
@@ -48,9 +46,10 @@ const FileUploadButton: React.FC = ({ onUploadComplete, c
setIsUploading(false);
}, 1500);
showSuccess('文件已上传');
- } catch (err: any) {
- setError(err.message || 'Failed to extract text from files');
- showError('文件上传失败：' + err.message);
+ } catch (error: unknown) {
+ const message = error instanceof Error ? error.message : 'Failed to extract text from files';
+ setError(message);
+ showError('文件上传失败：' + message);
setIsUploading(false);
}
},
@@ -117,7 +116,7 @@ const FileUploadButton: React.FC = ({ onUploadComplete, c
拖拽文件到此处，或点击选择文件
- 支持 PDF, DOCX, TXT, MD 文件格式
+ 支持 TXT 和 MD 文件格式
)}
@@ -161,4 +160,4 @@ const FileUploadButton: React.FC = ({ onUploadComplete, c
);
};
-export default FileUploadButton;
\ No newline at end of file
+export default FileUploadButton;
diff --git a/src/components/ModelManager.tsx b/src/components/ModelManager.tsx
index 603baeb..02bd794 100644
--- a/src/components/ModelManager.tsx
+++ b/src/components/ModelManager.tsx
@@ -3,7 +3,7 @@ import { X, Plus, Save, Trash2 } from 'lucide-react';
import { useModelStore } from '../stores/modelStore';
import { Model } from '../types';
import { gsap } from 'gsap';
-import { showSuccess, showInfo, showWarning, showError } from '../utils/notification';
+
interface ModelManagerProps {
onClose: () => void;
}
@@ -284,4 +284,4 @@ const ModelManager: React.FC = ({ onClose }) => {
);
};
-export default ModelManager;
\ No newline at end of file
+export default ModelManager;
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 1ccc0ee..e1a8fb1 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -2,10 +2,10 @@ import React, { useState, useRef, useEffect } from 'react';
import { useSessionStore } from '../stores/sessionStore';
import {
Search, Plus, Settings, Trash2, Edit, X, ChevronLeft,
- MessageSquare, Library, Home, MoreHorizontal
+ MessageSquare, Library, MoreHorizontal
} from 'lucide-react';
import { gsap } from 'gsap';
-import { showSuccess, showWarning, showError, showInfo } from '../utils/notification';
+import { showSuccess, showWarning, showInfo } from '../utils/notification';
interface SidebarProps {
onModelManagerClick: () => void;
@@ -101,7 +101,7 @@ const Sidebar: React.FC = ({ onModelManagerClick, collapsed, onTog
-
TreeChat
+ TreeAI
@@ -218,4 +218,4 @@ const Sidebar: React.FC
= ({ onModelManagerClick, collapsed, onTog
);
};
-export default Sidebar;
\ No newline at end of file
+export default Sidebar;
diff --git a/src/components/nodes/ChatNode.tsx b/src/components/nodes/ChatNode.tsx
index c381810..52c33a4 100644
--- a/src/components/nodes/ChatNode.tsx
+++ b/src/components/nodes/ChatNode.tsx
@@ -1,25 +1,20 @@
import React, { useState, useEffect, useRef, useCallback } from 'react';
-import { Handle, Position } from 'reactflow';
+import { Handle, Position, NodeProps } from 'reactflow';
import { MdPreview } from 'md-editor-rt';
import 'md-editor-rt/lib/preview.css';
-import { Plus, Send, RefreshCcw, Copy, Settings, Trash2, MessageSquare, MoreHorizontal } from 'lucide-react';
+import { Plus, Send, RefreshCcw, Copy, Settings, Trash2, MessageSquare } from 'lucide-react';
import { useModelStore } from '../../stores/modelStore';
import { gsap } from 'gsap';
import { showSuccess, showInfo, showWarning } from '../../utils/notification';
+import { NodeData } from '../../types';
-interface ChatNodeProps {
- id: string;
- data: any;
-}
-
-const ChatNode: React.FC = ({ id, data }) => {
+const ChatNode: React.FC> = ({ id, data }) => {
const { node, streamingResponse, onEdit, onAddChild, onDelete, onRetry, onModelChange, onTemperatureChange, onMaxTokensChange } = data;
const [userMessage, setUserMessage] = useState(node.userMessage || '');
const [isEditingUser, setIsEditingUser] = useState(!node.userMessage);
const [showSettings, setShowSettings] = useState(false);
const { models } = useModelStore();
- const model = models.find(m => m.id === node.modelId);
const userInputRef = useRef(null);
const nodeRef = useRef(null);
@@ -385,4 +380,4 @@ const ChatNode: React.FC = ({ id, data }) => {
);
};
-export default ChatNode;
\ No newline at end of file
+export default ChatNode;
diff --git a/src/components/nodes/SystemNode.tsx b/src/components/nodes/SystemNode.tsx
index 6a89e56..62d10a6 100644
--- a/src/components/nodes/SystemNode.tsx
+++ b/src/components/nodes/SystemNode.tsx
@@ -1,22 +1,17 @@
import React, { useState, useEffect, useRef } from 'react';
-import { Handle, Position } from 'reactflow';
-import { Plus, Settings, Trash2 } from 'lucide-react';
+import { Handle, Position, NodeProps } from 'reactflow';
+import { Plus, Settings } from 'lucide-react';
import { useModelStore } from '../../stores/modelStore';
import { gsap } from 'gsap';
+import { NodeData } from '../../types';
-interface SystemNodeProps {
- id: string;
- data: any;
-}
-
-const SystemNode: React.FC = ({ id, data }) => {
- const { node, onEdit, onAddChild, onDelete, onModelChange, onTemperatureChange, onMaxTokensChange } = data;
+const SystemNode: React.FC> = ({ id, data }) => {
+ const { node, onEdit, onAddChild, onModelChange, onTemperatureChange, onMaxTokensChange } = data;
const [isEditing, setIsEditing] = useState(false);
const [showSettings, setShowSettings] = useState(false);
const [systemPrompt, setSystemPrompt] = useState(node.userMessage || '');
const { models } = useModelStore();
- const model = models.find(m => m.id === node.modelId);
const nodeRef = useRef(null);
const textareaRef = useRef(null);
@@ -193,4 +188,4 @@ const SystemNode: React.FC = ({ id, data }) => {
);
};
-export default SystemNode;
\ No newline at end of file
+export default SystemNode;
diff --git a/src/context/DatabaseContext.tsx b/src/context/DatabaseContext.tsx
index 5eef471..a4163d7 100644
--- a/src/context/DatabaseContext.tsx
+++ b/src/context/DatabaseContext.tsx
@@ -39,10 +39,11 @@ export const DatabaseProvider: React.FC<{ children: ReactNode }> = ({ children }
);
};
+// eslint-disable-next-line react-refresh/only-export-components
export const useDatabaseContext = () => {
const context = useContext(DatabaseContext);
if (!context) {
throw new Error('useDatabaseContext must be used within a DatabaseProvider');
}
return context;
-};
\ No newline at end of file
+};
diff --git a/src/db/db.ts b/src/db/db.ts
index 9fc3812..7cb7797 100644
--- a/src/db/db.ts
+++ b/src/db/db.ts
@@ -1,5 +1,5 @@
import Dexie, { Table } from 'dexie';
-import { Session, Model, ChatNode } from '../types';
+import { Session, Model } from '../types';
class TreeChatDatabase extends Dexie {
sessions!: Table;
@@ -55,4 +55,4 @@ class TreeChatDatabase extends Dexie {
}
const db = new TreeChatDatabase();
-export default db;
\ No newline at end of file
+export default db;
diff --git a/src/main.tsx b/src/main.tsx
index 997b9fe..6f6fe55 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -13,7 +13,7 @@ window.addEventListener('unhandledrejection', (event) => {
console.error('Unhandled rejection:', event.reason);
});
-console.log('TreeChat App starting...');
+console.log('TreeAI app starting...');
const rootElement = document.getElementById('root');
if (!rootElement) {
@@ -28,4 +28,4 @@ if (!rootElement) {
);
console.log('App rendered successfully');
-}
\ No newline at end of file
+}
diff --git a/src/services/apiService.ts b/src/services/apiService.ts
index 489b260..875446f 100644
--- a/src/services/apiService.ts
+++ b/src/services/apiService.ts
@@ -1,4 +1,4 @@
-import { Model, ModelResponse } from '../types';
+import { Model } from '../types';
interface ChatMessage {
role: 'system' | 'user' | 'assistant';
@@ -14,13 +14,9 @@ interface ChatRequestOptions {
onChunk: (chunk: string) => void;
}
-const activeAbortControllers = new Map();
-
export async function sendChatRequest(options: ChatRequestOptions): Promise {
const { messages, model, temperature, maxTokens, signal, onChunk } = options;
- const requestId = crypto.randomUUID();
-
try {
const isOpenAI = model.baseUrl.includes('openai.com');
const endpoint = isOpenAI
@@ -93,26 +89,16 @@ export async function sendChatRequest(options: ChatRequestOptions): Promise void;
}
-export const useModelStore = create((set, get) => ({
+const getErrorMessage = (error: unknown): string => (
+ error instanceof Error ? error.message : 'Unknown error'
+);
+
+export const useModelStore = create((set) => ({
models: [],
defaultModelId: null,
@@ -42,8 +46,8 @@ export const useModelStore = create((set, get) => ({
};
});
showSuccess('模型创建成功');
- } catch (error: any) {
- showError('模型创建失败:' + error.message);
+ } catch (error: unknown) {
+ showError('模型创建失败:' + getErrorMessage(error));
console.error('Failed to create model:', error);
}
},
@@ -57,8 +61,8 @@ export const useModelStore = create((set, get) => ({
)
}));
showSuccess('模型更新成功');
- } catch (error: any) {
- showError('模型更新失败：' + error.message);
+ } catch (error: unknown) {
+ showError('模型更新失败：' + getErrorMessage(error));
console.error('Failed to update model:', error);
}
},
@@ -78,9 +82,9 @@ export const useModelStore = create((set, get) => ({
};
});
showInfo('模型已删除');
- } catch (error: any) {
- showError('模型删除失败:' + error.message);
+ } catch (error: unknown) {
+ showError('模型删除失败:' + getErrorMessage(error));
console.error('Failed to delete model:', error);
}
}
-}));
\ No newline at end of file
+}));
diff --git a/src/types.ts b/src/types.ts
index 6a496ee..0fc38b1 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -41,6 +41,7 @@ export interface Position {
export interface NodeData {
node: ChatNode;
+ streamingResponse?: string | null;
onAddChild: (parentId: string) => void;
onEdit: (nodeId: string, content: string, type: 'user' | 'assistant' | 'system') => void;
onDelete: (nodeId: string) => void;
@@ -66,4 +67,4 @@ export interface FileExtractResult {
export interface NodePosition {
x: number;
y: number;
-}
\ No newline at end of file
+}
diff --git a/src/utils/exportUtils.ts b/src/utils/exportUtils.ts
index 5fad1ca..93202f6 100644
--- a/src/utils/exportUtils.ts
+++ b/src/utils/exportUtils.ts
@@ -12,7 +12,7 @@ export function exportToMindmap(session: Session): void {
const mindMapTree = buildMindMapTree(session);
// Convert to a format suitable for export (e.g., FreeMind, XMind, etc.)
- const xmlContent = convertToFreeMindXML(mindMapTree, session.title);
+ const xmlContent = convertToFreeMindXML(mindMapTree);
// Create a downloadable file
const blob = new Blob([xmlContent], { type: 'application/xml' });
@@ -106,12 +106,12 @@ function buildMindMapTree(session: Session): MindMapNode {
return rootNode;
}
-function convertToFreeMindXML(root: MindMapNode, title: string): string {
+function convertToFreeMindXML(root: MindMapNode): string {
const xmlHeader = '';
const mapStart = '';
- const buildNodeXML = (node: MindMapNode, isRoot: boolean = false): string => {
+ const buildNodeXML = (node: MindMapNode): string => {
const nodeStart = ``;
let content = nodeStart;
@@ -126,7 +126,7 @@ function convertToFreeMindXML(root: MindMapNode, title: string): string {
return content;
};
- const xml = `${xmlHeader}\n${mapStart}\n${buildNodeXML(root, true)}\n${mapEnd}`;
+ const xml = `${xmlHeader}\n${mapStart}\n${buildNodeXML(root)}\n${mapEnd}`;
return xml;
}
@@ -138,8 +138,3 @@ function escapeXml(text: string): string {
.replace(/"/g, '"')
.replace(/'/g, ''');
}
-
-function truncateText(text: string, maxLength: number): string {
- if (text.length <= maxLength) return text;
- return text.substring(0, maxLength) + '...';
-}
\ No newline at end of file
diff --git a/src/utils/fileUtils.ts b/src/utils/fileUtils.ts
index 8e26bcd..9ce26f0 100644
--- a/src/utils/fileUtils.ts
+++ b/src/utils/fileUtils.ts
@@ -7,15 +7,11 @@ export async function extractTextFromFiles(files: File[]): Promise {
reader.onload = (e) => {
resolve(e.target?.result as string || '');
};
- reader.onerror = (e) => {
+ reader.onerror = () => {
reject(new Error('Failed to read text file'));
};
reader.readAsText(file);
});
}
-
-async function extractTextFromPdf(file: File): Promise {
- throw new Error('PDF text extraction is not implemented in this browser environment.');
-
- // In a real implementation, this would use a PDF.js or similar library
- // Example pseudo-code:
- // const pdfData = await readFileAsArrayBuffer(file);
- // const pdf = await pdfjs.getDocument(pdfData).promise;
- // let text = '';
- // for (let i = 1; i <= pdf.numPages; i++) {
- // const page = await pdf.getPage(i);
- // const content = await page.getTextContent();
- // text += content.items.map(item => item.str).join(' ') + '\n';
- // }
- // return text;
-}
-
-async function extractTextFromDocx(file: File): Promise {
- throw new Error('DOCX text extraction is not implemented in this browser environment.');
-
- // In a real implementation, this would use mammoth.js or similar library
- // Example pseudo-code:
- // const docxData = await readFileAsArrayBuffer(file);
- // const result = await mammoth.extractRawText({ arrayBuffer: docxData });
- // return result.value;
-}
-
-async function readFileAsArrayBuffer(file: File): Promise {
- return new Promise((resolve, reject) => {
- const reader = new FileReader();
- reader.onload = (e) => {
- resolve(e.target?.result as ArrayBuffer);
- };
- reader.onerror = () => {
- reject(new Error('Failed to read file'));
- };
- reader.readAsArrayBuffer(file);
- });
-}
\ No newline at end of file
diff --git a/todo.md b/todo.md
index 28460a3..73bda15 100644
--- a/todo.md
+++ b/todo.md
@@ -1,3 +1,6 @@
-1. 输出状态下reactflow区域频繁闪烁，无法编辑文本框中内容
-2. 不支持思考模型
-3.
\ No newline at end of file
+# TreeAI Roadmap and Known Issues
+
+- [ ] Reduce React Flow canvas flicker while a response is streaming so text fields remain comfortable to edit.
+- [ ] Add an explicit compatibility layer for reasoning models and provider-specific thinking streams.
+- [ ] Add automated tests for branch context assembly, persistence, streaming parsing, import, and export.
+- [ ] Split the production bundle to reduce the initial download size.
+
+