'use client';

import {  NavMain as GeneralMain,  NavMain as AdministrationMain, NavMain as StatisticsMain, } from '@/components/nav-main';
import { GeneralItems, AdministrationItems, StatisticsItems } from '@/constants/data';
import {
  Sidebar,
  SidebarContent,
  SidebarHeader,
  SidebarRail,
} from '@repo/shadcn/sidebar';
import { GalleryVerticalEnd } from 'lucide-react';
import * as React from 'react';
// import { NavItem } from '@/types';
import { useSession } from 'next-auth/react';


export const company = {
  name: 'Sistema para Productores',
  logo: GalleryVerticalEnd,
  plan: 'FONDEMI',
};



export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
  const { data: session } = useSession();
  const userRole = session?.user.role[0]?.rol ? session.user.role[0].rol :'';
  // console.log(AdministrationItems[0]?.role);
  
  return (
    <Sidebar collapsible="icon" {...props}>
      <SidebarHeader>
        <div className="flex gap-2 py-2 text-sidebar-accent-foreground">
          <div className="flex aspect-square size-8 items-center justify-center rounded-lg text-sidebar-primary-foreground">
            {/* <company.logo className="size-4" /> */}
            <img src="/logo.png" alt="" />
          </div>
          <div className="grid flex-1 text-left text-sm leading-tight">
            <span className="truncate font-semibold">{company.name}</span>
            <span className="truncate font-semibold text-xs">{company.plan}</span>
          </div>
        </div>
      </SidebarHeader>
      <SidebarContent>
        <GeneralMain titleGroup={'General'} items={GeneralItems} role={userRole}/>
        
        {StatisticsItems[0]?.role?.includes(userRole) &&
          <StatisticsMain titleGroup={'Estadisticas'} items={StatisticsItems} role={userRole}/>
        }
          
        {AdministrationItems[0]?.role?.includes(userRole) &&
          <AdministrationMain titleGroup={'Administracion'} items={AdministrationItems} role={userRole}/>
        }
        {/* <NavProjects projects={data.projects} /> */}
      </SidebarContent>
      <SidebarRail />
    </Sidebar>
  );
}