import { useSessionStore } from "../../lib/store/sessionStore";
import { useModuleStore } from "../../lib/store/useModuleStore";
import { moduleActive } from "../../utils/moduleActive";
import { hasAccess } from "../../utils/userAccess";
import {
	Sidebar,
	SidebarContent,
	SidebarFooter,
	SidebarTrigger,
} from "../ui/sidebar";
import { AdminSideBar } from "./side-components/admin";
import { EomSideBar } from "./side-components/eom";
import { ForkliftSideBar } from "./side-components/forklift";
import { Header } from "./side-components/header";
import { LogisticsSideBar } from "./side-components/logistics";
import { ProductionSideBar } from "./side-components/production";
import { QualitySideBar } from "./side-components/quality";

export function AppSidebar() {
	const { user } = useSessionStore();
	const { modules } = useModuleStore();

	return (
		<Sidebar collapsible="icon">
			<SidebarContent>
				<Header />
				{moduleActive("production") && (
					<ProductionSideBar
						user={user}
						moduleID={
							modules.filter((n) => n.name === "production")[0]
								.module_id as string
						}
					/>
				)}
				{moduleActive("logistics") && hasAccess(user, "logistics") && (
					<LogisticsSideBar user={user} />
				)}
				{moduleActive("forklift") && hasAccess(user, "forklift") && (
					<ForkliftSideBar />
				)}
				{moduleActive("eom") && hasAccess(user, "eom") && <EomSideBar />}
				{moduleActive("quality") && hasAccess(user, "quality") && (
					<QualitySideBar />
				)}
				{moduleActive("admin") && hasAccess(user || [], "admin") && (
					<AdminSideBar />
				)}
			</SidebarContent>
			<SidebarFooter>
				<SidebarTrigger />
			</SidebarFooter>
		</Sidebar>
	);
}
