feat(web): 移除 Settings 按钮,在 Header 直接显示工作目录
- 移除 ConfigPanel 及其入口按钮 - 在 Chat 页面 Header 左侧显示当前工作目录 - 初始化时并行获取会话列表和工作目录
This commit is contained in:
@@ -8,7 +8,6 @@ import { useState, useEffect, useCallback } from 'react';
|
|||||||
import {
|
import {
|
||||||
Sidebar,
|
Sidebar,
|
||||||
FileBrowser,
|
FileBrowser,
|
||||||
ConfigPanel,
|
|
||||||
CommandPanel,
|
CommandPanel,
|
||||||
MCPPanel,
|
MCPPanel,
|
||||||
HooksPanel,
|
HooksPanel,
|
||||||
@@ -19,6 +18,7 @@ import {
|
|||||||
ThemeProvider,
|
ThemeProvider,
|
||||||
listSessions,
|
listSessions,
|
||||||
createSession,
|
createSession,
|
||||||
|
getWorkingDirectory,
|
||||||
type Session,
|
type Session,
|
||||||
} from '@ai-assistant/ui';
|
} from '@ai-assistant/ui';
|
||||||
import { ChatPage } from './pages/Chat';
|
import { ChatPage } from './pages/Chat';
|
||||||
@@ -27,7 +27,6 @@ export function App() {
|
|||||||
const [currentSessionId, setCurrentSessionId] = useState<string | null>(null);
|
const [currentSessionId, setCurrentSessionId] = useState<string | null>(null);
|
||||||
const [isInitializing, setIsInitializing] = useState(true);
|
const [isInitializing, setIsInitializing] = useState(true);
|
||||||
const [showFileBrowser, setShowFileBrowser] = useState(false);
|
const [showFileBrowser, setShowFileBrowser] = useState(false);
|
||||||
const [showConfig, setShowConfig] = useState(false);
|
|
||||||
const [showCommands, setShowCommands] = useState(false);
|
const [showCommands, setShowCommands] = useState(false);
|
||||||
const [showMCP, setShowMCP] = useState(false);
|
const [showMCP, setShowMCP] = useState(false);
|
||||||
const [showHooks, setShowHooks] = useState(false);
|
const [showHooks, setShowHooks] = useState(false);
|
||||||
@@ -35,14 +34,26 @@ export function App() {
|
|||||||
const [showCheckpoints, setShowCheckpoints] = useState(false);
|
const [showCheckpoints, setShowCheckpoints] = useState(false);
|
||||||
const [showProviders, setShowProviders] = useState(false);
|
const [showProviders, setShowProviders] = useState(false);
|
||||||
const [sessionTitleUpdate, setSessionTitleUpdate] = useState<{ sessionId: string; name: string } | null>(null);
|
const [sessionTitleUpdate, setSessionTitleUpdate] = useState<{ sessionId: string; name: string } | null>(null);
|
||||||
|
const [workingDirectory, setWorkingDirectory] = useState<string>('');
|
||||||
|
|
||||||
// 初始化:加载会话(只在首次启动时自动创建)
|
// 初始化:加载会话和工作目录
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const HAS_SESSIONS_KEY = 'ai-assistant-has-sessions';
|
const HAS_SESSIONS_KEY = 'ai-assistant-has-sessions';
|
||||||
|
|
||||||
async function init() {
|
async function init() {
|
||||||
try {
|
try {
|
||||||
const { data: sessions } = await listSessions();
|
// 并行获取会话和工作目录
|
||||||
|
const [sessionsResult, workdirResult] = await Promise.all([
|
||||||
|
listSessions(),
|
||||||
|
getWorkingDirectory().catch(() => null),
|
||||||
|
]);
|
||||||
|
|
||||||
|
const { data: sessions } = sessionsResult;
|
||||||
|
|
||||||
|
// 设置工作目录
|
||||||
|
if (workdirResult?.data?.workingDirectory) {
|
||||||
|
setWorkingDirectory(workdirResult.data.workingDirectory);
|
||||||
|
}
|
||||||
|
|
||||||
if (sessions.length > 0) {
|
if (sessions.length > 0) {
|
||||||
// 有会话,选择最近的
|
// 有会话,选择最近的
|
||||||
@@ -130,13 +141,13 @@ export function App() {
|
|||||||
responsive
|
responsive
|
||||||
showFileBrowser={showFileBrowser}
|
showFileBrowser={showFileBrowser}
|
||||||
onToggleFileBrowser={() => setShowFileBrowser(!showFileBrowser)}
|
onToggleFileBrowser={() => setShowFileBrowser(!showFileBrowser)}
|
||||||
onOpenConfig={() => setShowConfig(true)}
|
|
||||||
onOpenCommands={() => setShowCommands(true)}
|
onOpenCommands={() => setShowCommands(true)}
|
||||||
onOpenMCP={() => setShowMCP(true)}
|
onOpenMCP={() => setShowMCP(true)}
|
||||||
onOpenHooks={() => setShowHooks(true)}
|
onOpenHooks={() => setShowHooks(true)}
|
||||||
onOpenAgents={() => setShowAgents(true)}
|
onOpenAgents={() => setShowAgents(true)}
|
||||||
onOpenCheckpoints={() => setShowCheckpoints(true)}
|
onOpenCheckpoints={() => setShowCheckpoints(true)}
|
||||||
onOpenProviders={() => setShowProviders(true)}
|
onOpenProviders={() => setShowProviders(true)}
|
||||||
|
workingDirectory={workingDirectory}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<div className="flex-1 flex items-center justify-center h-full">
|
<div className="flex-1 flex items-center justify-center h-full">
|
||||||
@@ -182,9 +193,6 @@ export function App() {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 配置面板 */}
|
|
||||||
{showConfig && <ConfigPanel onClose={() => setShowConfig(false)} responsive />}
|
|
||||||
|
|
||||||
{/* 命令面板 */}
|
{/* 命令面板 */}
|
||||||
{showCommands && <CommandPanel onClose={() => setShowCommands(false)} responsive />}
|
{showCommands && <CommandPanel onClose={() => setShowCommands(false)} responsive />}
|
||||||
|
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { useEffect, useRef } from 'react';
|
import { useEffect, useRef } from 'react';
|
||||||
import { WifiOff, MessageSquare, Settings, FolderOpen, Terminal, Plug, Zap, Bot, History, Server } from 'lucide-react';
|
import { WifiOff, MessageSquare, FolderOpen, Terminal, Plug, Zap, Bot, History, Server, Folder } from 'lucide-react';
|
||||||
import { motion, AnimatePresence } from 'framer-motion';
|
import { motion, AnimatePresence } from 'framer-motion';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import {
|
import {
|
||||||
@@ -23,13 +23,14 @@ interface ChatPageProps {
|
|||||||
// 工具栏按钮
|
// 工具栏按钮
|
||||||
showFileBrowser?: boolean;
|
showFileBrowser?: boolean;
|
||||||
onToggleFileBrowser?: () => void;
|
onToggleFileBrowser?: () => void;
|
||||||
onOpenConfig?: () => void;
|
|
||||||
onOpenCommands?: () => void;
|
onOpenCommands?: () => void;
|
||||||
onOpenMCP?: () => void;
|
onOpenMCP?: () => void;
|
||||||
onOpenHooks?: () => void;
|
onOpenHooks?: () => void;
|
||||||
onOpenAgents?: () => void;
|
onOpenAgents?: () => void;
|
||||||
onOpenCheckpoints?: () => void;
|
onOpenCheckpoints?: () => void;
|
||||||
onOpenProviders?: () => void;
|
onOpenProviders?: () => void;
|
||||||
|
// Working Directory
|
||||||
|
workingDirectory?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function ChatPage({
|
export function ChatPage({
|
||||||
@@ -39,13 +40,13 @@ export function ChatPage({
|
|||||||
responsive = false,
|
responsive = false,
|
||||||
showFileBrowser,
|
showFileBrowser,
|
||||||
onToggleFileBrowser,
|
onToggleFileBrowser,
|
||||||
onOpenConfig,
|
|
||||||
onOpenCommands,
|
onOpenCommands,
|
||||||
onOpenMCP,
|
onOpenMCP,
|
||||||
onOpenHooks,
|
onOpenHooks,
|
||||||
onOpenAgents,
|
onOpenAgents,
|
||||||
onOpenCheckpoints,
|
onOpenCheckpoints,
|
||||||
onOpenProviders,
|
onOpenProviders,
|
||||||
|
workingDirectory,
|
||||||
}: ChatPageProps) {
|
}: ChatPageProps) {
|
||||||
const {
|
const {
|
||||||
messages,
|
messages,
|
||||||
@@ -152,8 +153,19 @@ export function ChatPage({
|
|||||||
<div className="flex-1 flex flex-col h-screen">
|
<div className="flex-1 flex flex-col h-screen">
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="flex items-center justify-between px-4 md:px-6 py-3 border-b border-line bg-surface-subtle">
|
<div className="flex items-center justify-between px-4 md:px-6 py-3 border-b border-line bg-surface-subtle">
|
||||||
<h1 className="text-lg font-medium text-fg">Chat</h1>
|
<div className="flex items-center gap-3 min-w-0">
|
||||||
<div className="flex items-center gap-3">
|
<h1 className="text-lg font-medium text-fg flex-shrink-0">Chat</h1>
|
||||||
|
{/* Working Directory */}
|
||||||
|
{workingDirectory && (
|
||||||
|
<div className="flex items-center gap-1.5 text-sm text-fg-muted min-w-0">
|
||||||
|
<Folder size={14} className="flex-shrink-0 text-fg-subtle" />
|
||||||
|
<span className="truncate font-mono text-xs" title={workingDirectory}>
|
||||||
|
{workingDirectory}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-3 flex-shrink-0">
|
||||||
{/* 上下文使用情况 - 紧凑模式 */}
|
{/* 上下文使用情况 - 紧凑模式 */}
|
||||||
{sessionId && (
|
{sessionId && (
|
||||||
<ContextUsage
|
<ContextUsage
|
||||||
@@ -168,7 +180,7 @@ export function ChatPage({
|
|||||||
<ConnectionStatus />
|
<ConnectionStatus />
|
||||||
|
|
||||||
{/* 工具栏按钮 */}
|
{/* 工具栏按钮 */}
|
||||||
{(onOpenConfig || onToggleFileBrowser || onOpenCommands || onOpenMCP || onOpenHooks || onOpenAgents || onOpenCheckpoints || onOpenProviders) && (
|
{(onToggleFileBrowser || onOpenCommands || onOpenMCP || onOpenHooks || onOpenAgents || onOpenCheckpoints || onOpenProviders) && (
|
||||||
<div className="flex items-center gap-1.5 border-l border-line-muted pl-3">
|
<div className="flex items-center gap-1.5 border-l border-line-muted pl-3">
|
||||||
{/* Checkpoints 按钮 */}
|
{/* Checkpoints 按钮 */}
|
||||||
{onOpenCheckpoints && (
|
{onOpenCheckpoints && (
|
||||||
@@ -248,19 +260,6 @@ export function ChatPage({
|
|||||||
</motion.button>
|
</motion.button>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* 配置按钮 */}
|
|
||||||
{onOpenConfig && (
|
|
||||||
<motion.button
|
|
||||||
whileHover={{ scale: 1.1 }}
|
|
||||||
whileTap={{ scale: 0.9 }}
|
|
||||||
onClick={onOpenConfig}
|
|
||||||
className="p-1.5 rounded-lg text-fg-muted hover:text-fg-secondary hover:bg-surface-muted transition-colors"
|
|
||||||
title="Settings"
|
|
||||||
>
|
|
||||||
<Settings size={20} />
|
|
||||||
</motion.button>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* 文件浏览器按钮 - 仅桌面端显示 */}
|
{/* 文件浏览器按钮 - 仅桌面端显示 */}
|
||||||
{onToggleFileBrowser && (
|
{onToggleFileBrowser && (
|
||||||
<motion.button
|
<motion.button
|
||||||
|
|||||||
Reference in New Issue
Block a user