import { useContext } from 'react';
import { useHistory } from 'react-router';
import {
DrawerContainer,
CloseIcon,
DividerUnderListItem,
DividerUnderList,
DashboardIcon,
SupervisorAccountIcon,
LogoutIcon,
UserIcon,
MapIcon,
CarIcon,
TimerIcon,
ProfileIcon,
LoginIcon,
RegistrationIcon,
} from './styles';
import SwipeableDrawer from '@mui/material/SwipeableDrawer';
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import { IconButton } from '@mui/material';
import onClickRouting from '../../utils/onClickRouting';
import { roles } from '../../config/enums';
import { UserContext } from '../../context/UserContext';
import useLogoutUser from '../../hooks/useLogoutUser';
const AdminAndEmployeeContent = ({ user, setIsOpen, history, logoutUser }) => {
return (
<>
{
setIsOpen(false);
onClickRouting('/', history);
}}
>
{user.role === roles.admin ? (
<>
{
setIsOpen(false);
onClickRouting('/employees', history);
}}
>
>
) : null}
{
setIsOpen(false);
logoutUser();
}}
>
>
);
};
const NotAuthContent = ({ setIsOpen, history }) => {
return (
<>
{
setIsOpen(false);
onClickRouting('/', history);
}}
>
{
setIsOpen(false);
onClickRouting('/login', history);
}}
>
{
setIsOpen(false);
onClickRouting('/register', history);
}}
>
>
);
};
const UserAndGuestContent = ({ user, logoutUser, setIsOpen, history }) => {
const isGuest = user.role === roles.guest;
const mapUrl = isGuest ? '/' : '/maps';
return (
<>
{isGuest ? null : (
<>
{
setIsOpen(false);
onClickRouting('/', history);
}}
>
>
)}
{
setIsOpen(false);
onClickRouting(mapUrl, history);
}}
>
{
setIsOpen(false);
onClickRouting('/session', history);
}}
>
{
if (isGuest) return;
setIsOpen(false);
onClickRouting('/my-profile', history);
}}
>
{
setIsOpen(false);
logoutUser();
}}
>
>
);
};
const Sidedrawer = ({ isOpen, setIsOpen, isMobile }) => {
const { user } = useContext(UserContext);
const { logoutUser } = useLogoutUser();
const history = useHistory();
let content;
if (user) {
const props = {
user,
logoutUser,
setIsOpen,
history,
};
if (user.role === roles.admin || user.role === roles.employee) {
content = ;
} else {
content = ;
}
} else {
content = ;
}
return !isMobile ? null : (
setIsOpen(false)}
onOpen={() => setIsOpen(true)}
>
setIsOpen(false)}
style={{ marginLeft: '190px' }}
>
{content}
);
};
export default Sidedrawer;