Files
reservas/resources/js/components/app-sidebar.tsx

121 lines
3.3 KiB
TypeScript

import { Link, usePage } from '@inertiajs/react';
import {
Bell,
CalendarDays,
CalendarRange,
LayoutGrid,
ListChecks,
PackageSearch,
PackageCheck,
PlusCircle,
ServerCog,
ShieldCheck,
} from 'lucide-react';
import AppLogo from '@/components/app-logo';
import { NavFooter } from '@/components/nav-footer';
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 type { NavItem } from '@/types';
const mainNavItems: NavItem[] = [
{
title: 'Dashboard',
href: '/dashboard',
icon: LayoutGrid,
},
{ title: 'Equipamentos', href: '/equipamentos', icon: PackageSearch },
{ title: 'Nova requisição', href: '/requisicoes/nova', icon: PlusCircle },
{
title: 'As minhas requisições',
href: '/requisicoes',
icon: CalendarDays,
},
{
title: 'O meu calendário',
href: '/requisicoes/calendario',
icon: CalendarRange,
},
{ title: 'Notificações', href: '/notificacoes', icon: Bell },
];
const footerNavItems: NavItem[] = [
{
title: 'Privacidade e condições',
href: '#',
icon: ShieldCheck,
},
];
export function AppSidebar() {
const { can, unreadNotifications } = usePage().props;
const userNavItems = mainNavItems.map((item) =>
item.href === '/notificacoes' && unreadNotifications > 0
? { ...item, title: `Notificações (${unreadNotifications})` }
: item,
);
const roleNavItems = can.approveReservations
? [
...userNavItems,
{
title: 'Aprovações',
href: '/aprovacoes',
icon: ListChecks,
},
]
: userNavItems;
const operationalNavItems = can.operateInventory
? [
...roleNavItems,
{
title: 'Operações',
href: '/operacoes',
icon: PackageCheck,
},
]
: roleNavItems;
const visibleNavItems = can.administer
? [
...operationalNavItems,
{
title: 'Integração Snipe-IT',
href: '/administracao/snipe-it',
icon: ServerCog,
},
]
: operationalNavItems;
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={visibleNavItems} />
</SidebarContent>
<SidebarFooter>
<NavFooter items={footerNavItems} className="mt-auto" />
<NavUser />
</SidebarFooter>
</Sidebar>
);
}