import { Link } from "@tanstack/react-router";
import { ScanText } from "lucide-react";
import {
	SidebarGroup,
	SidebarGroupContent,
	SidebarGroupLabel,
	SidebarMenu,
	SidebarMenuButton,
	SidebarMenuItem,
	useSidebar,
} from "../ui/sidebar";

export default function MobileBar() {
	const { setOpen } = useSidebar();
	const items = [
		// {
		// 	title: "Update Instructions",
		// 	url: "/",
		// 	icon: ScrollText,
		// },
		{
			title: "Scan Log",
			url: "/",
			icon: ScanText,
		},
	];

	return (
		<SidebarGroup>
			<SidebarGroupLabel>Mobile</SidebarGroupLabel>
			<SidebarGroupContent>
				<SidebarMenu>
					{items.map((item) => (
						<SidebarMenuItem key={item.title}>
							<SidebarMenuButton asChild>
								<Link to={item.url} onClick={() => setOpen(false)}>
									<item.icon />
									<span>{item.title}</span>
								</Link>
							</SidebarMenuButton>
						</SidebarMenuItem>
					))}
				</SidebarMenu>
			</SidebarGroupContent>
		</SidebarGroup>
	);
}