103 lines
2.7 KiB
TypeScript
103 lines
2.7 KiB
TypeScript
import { useState } from 'react';
|
||
import {
|
||
Container,
|
||
Typography,
|
||
Box,
|
||
Button,
|
||
IconButton,
|
||
Tooltip,
|
||
Chip,
|
||
Avatar,
|
||
Tabs,
|
||
Tab,
|
||
} from '@mui/material';
|
||
import { Add, Logout, Person, Lightbulb, Group } from '@mui/icons-material';
|
||
import { IdeasTable } from './components/IdeasTable';
|
||
import { IdeasFilters } from './components/IdeasFilters';
|
||
import { CreateIdeaModal } from './components/CreateIdeaModal';
|
||
import { TeamPage } from './components/TeamPage';
|
||
import { useIdeasStore } from './store/ideas';
|
||
import { useAuth } from './hooks/useAuth';
|
||
|
||
function App() {
|
||
const { setCreateModalOpen } = useIdeasStore();
|
||
const { user, logout } = useAuth();
|
||
const [tab, setTab] = useState(0);
|
||
|
||
return (
|
||
<Container maxWidth="xl" sx={{ py: 4 }}>
|
||
{/* Header */}
|
||
<Box
|
||
sx={{
|
||
mb: 3,
|
||
display: 'flex',
|
||
justifyContent: 'space-between',
|
||
alignItems: 'center',
|
||
}}
|
||
>
|
||
<Box>
|
||
<Typography variant="h4" component="h1">
|
||
Team Planner
|
||
</Typography>
|
||
<Typography variant="body1" color="text.secondary">
|
||
Управление бэклогом идей команды
|
||
</Typography>
|
||
</Box>
|
||
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
|
||
<Chip
|
||
avatar={
|
||
<Avatar sx={{ bgcolor: 'primary.main' }}>
|
||
<Person sx={{ fontSize: 16 }} />
|
||
</Avatar>
|
||
}
|
||
label={user?.name ?? 'Пользователь'}
|
||
variant="outlined"
|
||
/>
|
||
<Tooltip title="Выйти">
|
||
<IconButton onClick={logout} color="default" size="small">
|
||
<Logout />
|
||
</IconButton>
|
||
</Tooltip>
|
||
</Box>
|
||
</Box>
|
||
|
||
{/* Tabs */}
|
||
<Box sx={{ borderBottom: 1, borderColor: 'divider', mb: 3 }}>
|
||
<Tabs value={tab} onChange={(_, v: number) => setTab(v)}>
|
||
<Tab icon={<Lightbulb />} iconPosition="start" label="Идеи" />
|
||
<Tab icon={<Group />} iconPosition="start" label="Команда" />
|
||
</Tabs>
|
||
</Box>
|
||
|
||
{/* Content */}
|
||
{tab === 0 && (
|
||
<>
|
||
<Box
|
||
sx={{
|
||
display: 'flex',
|
||
justifyContent: 'space-between',
|
||
alignItems: 'center',
|
||
mb: 2,
|
||
}}
|
||
>
|
||
<IdeasFilters />
|
||
<Button
|
||
variant="contained"
|
||
startIcon={<Add />}
|
||
onClick={() => setCreateModalOpen(true)}
|
||
>
|
||
Новая идея
|
||
</Button>
|
||
</Box>
|
||
<IdeasTable />
|
||
<CreateIdeaModal />
|
||
</>
|
||
)}
|
||
|
||
{tab === 1 && <TeamPage />}
|
||
</Container>
|
||
);
|
||
}
|
||
|
||
export default App;
|