feat(ui): 创建共享 UI 组件包

将 web 和 desktop 的重复代码抽取到 @ai-assistant/ui 包:

- 添加可配置的 API 客户端 (configureApiClient)
- 迁移共享组件: ChatMessage, ChatInput, Sidebar, FileBrowser, ConfigPanel
- 迁移共享 hook: useChat
- 添加 responsive prop 支持响应式布局
- 更新 web/desktop 依赖并删除重复代码
This commit is contained in:
2025-12-12 15:52:53 +08:00
parent 563224fa73
commit 68ab6a2016
30 changed files with 711 additions and 1388 deletions
+16 -6
View File
@@ -5,11 +5,15 @@
*/
import { useState, useEffect, useCallback } from 'react';
import { Sidebar } from './components/Sidebar';
import {
Sidebar,
FileBrowser,
ConfigPanel,
listSessions,
createSession,
type Session,
} from '@ai-assistant/ui';
import { ChatPage } from './pages/Chat';
import { FileBrowser } from './components/FileBrowser';
import { ConfigPanel } from './components/ConfigPanel';
import { listSessions, createSession, type Session } from './api/client';
export function App() {
const [currentSessionId, setCurrentSessionId] = useState<string | null>(null);
@@ -76,6 +80,7 @@ export function App() {
currentSessionId={currentSessionId}
onSelectSession={handleSelectSession}
onCreateSession={handleCreateSession}
responsive
/>
{/* 工具栏按钮 - 移动端右移避开菜单按钮 */}
@@ -126,7 +131,12 @@ export function App() {
{/* 聊天区域 */}
<div className={`flex-1 min-w-0 ${showFileBrowser ? 'hidden md:block md:w-1/2' : 'w-full'}`}>
{currentSessionId ? (
<ChatPage key={currentSessionId} sessionId={currentSessionId} onSessionNotFound={handleSessionNotFound} />
<ChatPage
key={currentSessionId}
sessionId={currentSessionId}
onSessionNotFound={handleSessionNotFound}
responsive
/>
) : (
<div className="flex-1 flex items-center justify-center h-full">
<p className="text-gray-400">Select or create a session</p>
@@ -172,7 +182,7 @@ export function App() {
</div>
{/* 配置面板 */}
{showConfig && <ConfigPanel onClose={() => setShowConfig(false)} />}
{showConfig && <ConfigPanel onClose={() => setShowConfig(false)} responsive />}
{/* 移动端底部文件按钮 */}
<button