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:
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user