import { Printer, Tag } from "lucide-react";
import {
    SidebarGroup,
    SidebarGroupContent,
    SidebarGroupLabel,
    SidebarMenu,
    SidebarMenuButton,
    SidebarMenuItem,
} from "../../ui/sidebar";
import { hasPageAccess } from "@/utils/userAccess";
import { User } from "@/types/users";

export function ProductionSideBar({
    user,
    moduleID,
}: {
    user: User | null;
    moduleID: string;
}) {
    const url: string = window.location.host.split(":")[0];
    const items = [
        {
            title: "One Click Print",
            url: "/ocp",
            icon: Printer,
            role: ["viewer"],
            module: "ocp",
            active: true,
        },
        {
            title: "Rfid Readers",
            url: "/rfid",
            icon: Tag,
            role: ["viewer"],
            module: "production",
            active:
                url === "usday1vms006" || url === "localhost" ? true : false,
        },
    ];
    return (
        <SidebarGroup>
            <SidebarGroupLabel>Production</SidebarGroupLabel>
            <SidebarGroupContent>
                <SidebarMenu>
                    {items.map((item) => (
                        <SidebarMenuItem key={item.title}>
                            <>
                                {hasPageAccess(user, item.role, moduleID) &&
                                    item.active && (
                                        <SidebarMenuButton asChild>
                                            <a href={item.url}>
                                                <item.icon />
                                                <span>{item.title}</span>
                                            </a>
                                        </SidebarMenuButton>
                                    )}
                            </>
                        </SidebarMenuItem>
                    ))}
                </SidebarMenu>
            </SidebarGroupContent>
        </SidebarGroup>
    );
}
