import { IconFileInvoice } from '@material-hu/icons/tabler';

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

import usePermissions from 'src/hooks/usePermissions';
import { payrollMobilityAdoRoutes } from 'src/pages/dashboard/payrollMobilityAdo/routes';
import { ROUTE_PERMISSIONS } from 'src/utils/permissions';

import itemsConfig from '../constants';
import { type SidebarItemProps } from '../types';
import { getItemIsActive } from '../utils';

const { key } = itemsConfig.payrollMobilityAdo;

const PATH = payrollMobilityAdoRoutes.home();

const NavPayrollMobilityAdoItem = (props: SidebarItemProps) => {
  const { isCollapsed, onClick, isActive: isActiveProp } = props;
  const { hasAny } = usePermissions(ROUTE_PERMISSIONS.PAYROLL_MOBILITY_ADO);
  const isActive = isActiveProp ?? getItemIsActive(PATH);

  if (!hasAny) return null;

  return (
    <SidebarNavItem
      key={key}
      depth={0}
      title="Nóminas"
      icon={<IconFileInvoice />}
      path={PATH}
      isCollapsed={isCollapsed}
      onClick={onClick}
      active={isActive}
    />
  );
};

export default NavPayrollMobilityAdoItem;