import { IconCalendarWeek } from '@material-hu/icons/tabler';
import List from '@material-hu/mui/List';

import SidebarNavItem from '@material-hu/components/design-system/Sidebar/components/NavItem';

import { getItemIsActive } from 'src/components/dashboard/sidebar/utils';

import { vacationsRoutes } from '../../routes';

const PATH = vacationsRoutes.vacations();

type FemsaSidebarProps = {
  isActive?: boolean;
  title: string;
};

export const FemsaSidebar = ({ isActive, title }: FemsaSidebarProps) => {
  return (
    <List
      disablePadding
      sx={{
        '& > *:not(:last-child)': {
          mb: 0,
        },
      }}
    >
      <SidebarNavItem
        key={'timeOffPersonalSpace'}
        depth={0}
        title={title}
        icon={<IconCalendarWeek />}
        path={PATH}
        active={isActive ?? getItemIsActive(PATH)}
      />
    </List>
  );
};