import React from 'react';
|
import { Button, Typography, Box, SvgIcon } from '@mui/material';
|
import { HotTub } from '@mui/icons-material';
|
import { useNavigate } from 'react-router-dom';
|
import MyCreateButton from './MyCreateButton';
|
import { useTranslate } from 'react-admin';
|
|
const NotFound = ({ children, onClick, btnMsg }) => {
|
const navigate = useNavigate();
|
const translate = useTranslate();
|
return (
|
<Box
|
display="flex"
|
flexDirection="column"
|
alignItems="center"
|
justifyContent="flex-start"
|
height="100vh"
|
pt={10}
|
>
|
<SvgIcon component={HotTub} sx={{ fontSize: '18em', mb: 2, opacity: .5 }} />
|
<Typography variant="h1" gutterBottom sx={{
|
fontWeight: 'bold',
|
fontSize: '2em',
|
opacity: .5,
|
mt: 2
|
}}>
|
{translate('create.empty.title')}
|
</Typography>
|
<Typography variant="subtitle1" gutterBottom sx={{
|
fontSize: '1em',
|
opacity: .5,
|
mt: 2
|
}}>
|
{translate('create.empty.desc')}
|
</Typography>
|
{children}
|
{!children && (
|
<Button
|
variant="contained"
|
color="primary"
|
onClick={onClick}
|
sx={{
|
fontSize: '1em',
|
mt: 2
|
}}
|
>
|
{btnMsg || translate('create.empty.button')}
|
</Button>
|
)}
|
</Box>
|
);
|
};
|
|
export default NotFound;
|
