import { Server, Settings, User, type LucideIcon } from "lucide-react";
import { userAccess, type UserRoles } from "../../lib/authClient";
import {
    SidebarGroup,
    SidebarGroupContent,
    SidebarGroupLabel,
    SidebarMenu,
    SidebarMenuButton,
    SidebarMenuItem,
} from "../ui/sidebar";
import { Link } from "@tanstack/react-router";

type Items = {
    title: string;
    url: string;
    icon: LucideIcon;
    role: UserRoles["role"][];
    module: string;
    active: boolean;
};
export default function Admin() {
    const items: Items[] = [
        {
            title: "Users",
            url: "/lst/app/admin/users",
            icon: User,
            role: ["systemAdmin", "admin"],
            module: "admin",
            active: true,
        },
        {
            title: "Settings",
            url: "/lst/app/admin/settings",
            icon: Settings,
            role: ["systemAdmin", "admin"],
            module: "admin",
            active: true,
        },
        {
            title: "Servers",
            url: "/lst/app/admin/servers",
            icon: Server,
            role: ["systemAdmin", "admin"],
            module: "admin",
            active: true,
        },
    ];
    return (
        <SidebarGroup>
            <SidebarGroupLabel>Admin</SidebarGroupLabel>
            <SidebarGroupContent>
                <SidebarMenu>
                    {items.map((item) => (
                        <SidebarMenuItem key={item.title}>
                            <>
                                {userAccess(item.module, item.role) &&
                                    item.active && (
                                        <SidebarMenuButton asChild>
                                            <Link to={item.url}>
                                                <item.icon />
                                                <span>{item.title}</span>
                                            </Link>
                                        </SidebarMenuButton>
                                    )}
                            </>
                        </SidebarMenuItem>
                    ))}
                </SidebarMenu>
            </SidebarGroupContent>
        </SidebarGroup>
    );
}