frontend/containers/DashboardEmpty/index.tsx (view raw)
1import {useRouter} from 'next/router';
2import { styled } from '@mui/material/styles';
3import Container from '@mui/material/Container';
4import Card from '@mui/material/Card';
5import CardActions from '@mui/material/CardActions';
6import CardContent from '@mui/material/CardContent';
7import Typography from '@mui/material/Typography';
8import Button from '@mui/material/Button';
9import {useTranslation} from 'react-i18next';
10
11const PREFIX = 'DashboardEmpty';
12
13const classes = {
14 container: `${PREFIX}-container`
15};
16
17const StyledContainer = styled(Container)((
18 {
19 theme
20 }
21) => ({
22 [`&.${classes.container}`]: {
23 paddingTop: theme.spacing(8),
24 }
25}));
26
27const DashboardEmpty = () => {
28 const {t} = useTranslation();
29 const router = useRouter();
30
31
32 return (
33 <StyledContainer maxWidth="sm" className={classes.container}>
34 <Card>
35 <CardContent>
36 <Typography gutterBottom variant="h5" component="h1">
37 {t('dashboard.noEvent.title')}
38 </Typography>
39 <Typography
40 variant="body1"
41 gutterBottom
42 dangerouslySetInnerHTML={{
43 __html: t('dashboard.noEvent.text_html'),
44 }}
45 />
46 </CardContent>
47 <CardActions>
48 <Button
49 onClick={() => router.push('/')}
50 variant="contained"
51 color="primary"
52 >
53 {t('dashboard.noEvent.create_event')}
54 </Button>
55 </CardActions>
56 </Card>
57 </StyledContainer>
58 );
59};
60
61export default DashboardEmpty;