MetonaTeam/metona-ai-desktop
2
0
Fork 0
Code Issues 51 Pull Requests Actions Packages Projects Releases 8 Wiki Activity

refactor: Sidebar 搜索框从手写 InputBase+Stack 改为 MUI TextField

Browse Source
This commit is contained in:
thzxx
2026-06-27 22:46:19 +08:00
parent 2cf6422169
commit 354d13105f
1 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/layout/Sidebar.tsx
+13 -5
View File
@@ -5,7 +5,7 @@
*/ */
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { Box, Typography, Button, IconButton, InputBase, Stack, Collapse, List, ListItemButton, ListItemIcon, ListItemText, Badge, Divider, Dialog, DialogTitle, DialogContent, DialogActions, TextField } from '@mui/material'; import { Box, Typography, Button, IconButton, TextField, Stack, Collapse, List, ListItemButton, ListItemIcon, ListItemText, Badge, Divider, Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
import Fuse from 'fuse.js'; import Fuse from 'fuse.js';
import { Plus, Search, MessageSquare, Pin, Wrench, Database, ChevronDown, ChevronRight, Trash2 } from 'lucide-react'; import { Plus, Search, MessageSquare, Pin, Wrench, Database, ChevronDown, ChevronRight, Trash2 } from 'lucide-react';
import { useSessionStore, type Session } from '@renderer/stores/session-store'; import { useSessionStore, type Session } from '@renderer/stores/session-store';
@@ -55,10 +55,18 @@ export function Sidebar(): React.JSX.Element {
<Plus size={14} style={{ marginRight: 8 }} /> 新建会话 <Plus size={14} style={{ marginRight: 8 }} /> 新建会话
</Button> </Button>
<Stack direction="row" alignItems="center" spacing={1} sx={{ px: 1.5, py: 0.75, borderRadius: 1.5, mb: 1.5, bgcolor: 'secondary.main', border: '1px solid', borderColor: 'divider' }}> <TextField
<Search size={12} style={{ color: '#8b8fa7', flexShrink: 0 }} /> size="small"
<InputBase value={searchQuery} onChange={(e) => setSearchQuery(e.target.value)} placeholder="搜索会话..." sx={{ flex: 1, fontSize: 12 }} /> value={searchQuery}
</Stack> onChange={(e) => setSearchQuery(e.target.value)}
placeholder="搜索会话..."
slotProps={{
input: {
startAdornment: <Search size={14} style={{ color: '#8b8fa7', marginRight: 8 }} />,
},
}}
sx={{ mb: 1.5, '& .MuiOutlinedInput-root': { fontSize: 12, borderRadius: 1.5 } }}
/>
<Box sx={{ flex: 1, overflowY: 'auto' }}> <Box sx={{ flex: 1, overflowY: 'auto' }}>
{filteredSessions.length === 0 ? ( {filteredSessions.length === 0 ? (