TIFNJK_E41222887/resources/js/components/app-sidebar.tsx

94 lines
2.8 KiB
TypeScript

/* eslint-disable @typescript-eslint/no-explicit-any */
import { Link, usePage } from '@inertiajs/react';
import { LayoutGrid, Users, Briefcase, Building2, SquareUser, Wallet, CalendarClock } from 'lucide-react';
import { NavMain } from '@/components/nav-main';
import { NavUser } from '@/components/nav-user';
import {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
} from '@/components/ui/sidebar';
import { dashboard } from '@/routes';
import type { NavItem, SharedData } from '@/types';
import AppLogo from './app-logo';
export function AppSidebar() {
const { auth } = usePage<SharedData>().props;
const userRole = auth.user.role;
const mainNavItems: NavItem[] = [
{
title: 'Dashboard',
href: userRole === 'admin' ? '/dashboard' : '/employee/index',
icon: LayoutGrid,
},
...(userRole === 'admin' ? [
{
title: 'Manajemen Karyawan',
href: '/admin/employees',
icon: Users,
},
{
title: 'Manajemen Departemen',
href: '/admin/departments',
icon: Building2,
},
{
title: 'Manajemen Jabatan',
href: '/admin/positions',
icon: Briefcase,
},
{
title: 'Manajemen Absensi',
href: '/admin/attendance',
icon: CalendarClock,
},
{
title: 'Manajemen Gaji',
href: '/admin/payrolls',
icon: Wallet,
},
{
title: 'Manajemen Pengguna',
href: '/admin/users',
icon: SquareUser,
},
] : []),
...(userRole === 'employee' ? [
{
title: 'Absensi',
href: '/employee/attendances',
icon: CalendarClock,
},
] : []),
];
return (
<Sidebar collapsible="icon" variant="inset">
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton size="lg" asChild>
<Link href={dashboard()} prefetch>
<AppLogo />
</Link>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
<SidebarContent>
<NavMain items={mainNavItems} />
</SidebarContent>
<SidebarFooter>
<NavUser />
</SidebarFooter>
</Sidebar>
);
}