import { Link, usePage } from '@inertiajs/react';
import {
    Building2,
    ClipboardList,
    LayoutGrid,
    Users,
    Scale,
    ShieldAlert,
    FileCheck2,
} from 'lucide-react';
import AppLogo from '@/components/app-logo';
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 } from '@/types';

const mainNavItems: NavItem[] = [
    {
        title: 'Visão geral',
        href: dashboard(),
        icon: LayoutGrid,
    },
    { title: 'Requisições', href: '/requisicoes', icon: ClipboardList },
    { title: 'Conflitos de interesses', href: '/conflitos', icon: ShieldAlert },
];

export function AppSidebar() {
    const { auth } = usePage().props;
    const purchasingItems = [
        'admin',
        'procurement',
        'finance',
        'department_head',
    ].includes(auth.user.purchasing_role ?? '')
        ? [
              ...mainNavItems,
              { title: 'Fornecedores', href: '/fornecedores', icon: Users },
              { title: 'Cotações', href: '/cotacoes', icon: Scale },
              { title: 'Ordens de compra', href: '/ordens', icon: FileCheck2 },
          ]
        : mainNavItems;
    const items =
        auth.user.purchasing_role === 'admin'
            ? [
                  ...purchasingItems,
                  {
                      title: 'Empresa e equipa',
                      href: '/empresa',
                      icon: Building2,
                  },
              ]
            : purchasingItems;
    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={items} />
            </SidebarContent>

            <SidebarFooter>
                <NavUser />
            </SidebarFooter>
        </Sidebar>
    );
}