diff --git a/src/App.tsx b/src/App.tsx
index 8db237f..ed6acb4 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -9,7 +9,6 @@
import { ThemeProvider, CssBaseline } from '@mui/material';
import { useEffect } from 'react';
-import { Header } from '@renderer/components/layout/Header';
import { Sidebar } from '@renderer/components/layout/Sidebar';
import { DetailPanel } from '@renderer/components/layout/DetailPanel';
import { StatusBar } from '@renderer/components/layout/StatusBar';
@@ -55,7 +54,6 @@ export default function App(): React.JSX.Element {
className="h-screen w-screen flex flex-col overflow-hidden select-none"
style={{ background: muiTheme.palette.background.default, color: muiTheme.palette.text.primary }}
>
-
diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
deleted file mode 100644
index 4f4f6b8..0000000
--- a/src/components/layout/Header.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-/**
- * Header — 标题栏
- *
- * Logo + 会话标题 + 设置按钮。
- */
-
-import { Box, IconButton, Tooltip, Stack, Typography } from '@mui/material';
-import { Settings } from 'lucide-react';
-import { useUIStore } from '@renderer/stores/ui-store';
-import { useSessionStore } from '@renderer/stores/session-store';
-
-type WebkitCSS = React.CSSProperties & { WebkitAppRegion?: string };
-
-export function Header(): React.JSX.Element {
- const openSettings = useUIStore((s) => s.openSettings);
- const currentSessionId = useSessionStore((s) => s.currentSessionId);
- const sessions = useSessionStore((s) => s.sessions);
- const currentSession = sessions.find((s) => s.id === currentSessionId);
-
- return (
-
-
-
- MetonaAI
- {currentSession && (
- <>
- ·
- {currentSession.title}
- >
- )}
-
-
-
-
-
- );
-}
diff --git a/src/components/layout/StatusBar.tsx b/src/components/layout/StatusBar.tsx
index 8b22ae0..5c475bd 100644
--- a/src/components/layout/StatusBar.tsx
+++ b/src/components/layout/StatusBar.tsx
@@ -1,11 +1,13 @@
/**
* StatusBar — 底部状态栏
*
- * 显示 Agent 状态指示灯、Provider 名称、Token 统计、版本号。
+ * 完全使用 MUI 组件:Table 展示状态/Provider/Token,右侧设置按钮。
*/
-import { Box, Typography, Stack, Chip } from '@mui/material';
+import { Box, Typography, IconButton, Tooltip, Table, TableBody, TableRow, TableCell } from '@mui/material';
+import { Settings } from 'lucide-react';
import { useAgentStore } from '@renderer/stores/agent-store';
+import { useUIStore } from '@renderer/stores/ui-store';
import { AGENT_STATUS_COLORS, AGENT_STATUS_LABELS, PROVIDER_LABELS } from '@renderer/lib/constants';
import { formatTokens } from '@renderer/lib/formatters';
@@ -14,42 +16,63 @@ export function StatusBar(): React.JSX.Element {
const provider = useAgentStore((s) => s.provider);
const model = useAgentStore((s) => s.model);
const tokenUsage = useAgentStore((s) => s.tokenUsage);
+ const openSettings = useUIStore((s) => s.openSettings);
return (
-
-
-
-
- {AGENT_STATUS_LABELS[agentStatus]}
-
-
- |
-
- {PROVIDER_LABELS[provider] ?? provider} {model}
-
-
+ {/* 左侧:状态信息表格 */}
+
+
+
+
+
+
+
+ {AGENT_STATUS_LABELS[agentStatus]}
+
+
+
+ |
+
+ {PROVIDER_LABELS[provider] ?? provider} {model}
+
+ {tokenUsage.totalTokens > 0 && (
+ <>
+ |
+
+ {formatTokens(tokenUsage.inputTokens)}↓ {formatTokens(tokenUsage.outputTokens)}↑
+
+ >
+ )}
+
+
+
-
- {tokenUsage.totalTokens > 0 && (
-
- Tokens: {formatTokens(tokenUsage.inputTokens)}↓ {formatTokens(tokenUsage.outputTokens)}↑
-
- )}
- MetonaAI v0.1.0
-
+ {/* 右侧:版本 + 设置 */}
+
+ v0.1.0
+
+
+
+
+
+
);
}