'use client'

import {
  BookCopyIcon,
  CalendarClockIcon,
  // FileBadgeIcon,
  GraduationCap,
  LayoutDashboardIcon,
  ReceiptTextIcon,
  ShieldUserIcon,
  ShoppingCartIcon,
  // UploadIcon,
  UsersIcon
} from 'lucide-react'

import { NavMain } from '@/components/nav-main'
import { WorkspaceSwitcher } from '@/components/workspace-switcher'
import {
  Sidebar,
  SidebarContent,
  SidebarHeader,
  SidebarRail
} from '@repo/ui/components/ui/sidebar'

const data = {
  navMain: [
    {
      title: 'Visão geral',
      url: '/main',
      icon: LayoutDashboardIcon
    }
  ],
  navPayment: [
    {
      title: 'Resumo de cobranças',
      url: '/billing',
      icon: ReceiptTextIcon
    },
    {
      title: 'Histórico de pagamentos',
      url: '/payments',
      icon: ShoppingCartIcon
    }
  ],
  navUser: [
    {
      title: 'Colaboradores',
      url: '/users',
      icon: UsersIcon
    },
    {
      title: 'Gestores',
      url: '/admins',
      icon: ShieldUserIcon
    }
    // {
    //   title: 'Importações',
    //   url: '/batch',
    //   icon: UploadIcon
    // }
  ],
  navEnrollment: [
    {
      title: 'Matrículas',
      url: '/enrollments',
      icon: GraduationCap
    },
    // {
    //   title: 'Certificações',
    //   url: '/certs',
    //   icon: FileBadgeIcon
    // },
    {
      title: 'Agendamentos',
      url: '/scheduled',
      icon: CalendarClockIcon
    },
    {
      title: 'Catálogo de cursos',
      url: '/courses',
      icon: BookCopyIcon
    }
  ]
}

export function AppSidebar() {
  return (
    <Sidebar collapsible="icon">
      <SidebarRail title="Mostrar/ocultar barra lateral" />
      <SidebarHeader>
        <WorkspaceSwitcher />
      </SidebarHeader>
      <SidebarContent className="group-data-[state=expanded]:p-2">
        <NavMain data={data} />
      </SidebarContent>
    </Sidebar>
  )
}