Improve mobile responsiveness with hamburger menu and drawer sidebar

components/Sidebar.tsx

@@ -5,7 +5,7 @@ import Link from "next/link";
 import { usePathname } from "next/navigation";
 import LanguageSwitcher from "./LanguageSwitcher";
 
-export default function Sidebar({ dict, lang }: { dict: any; lang: string }) {
+export default function Sidebar({ dict, lang, onClose }: { dict: any; lang: string; onClose?: () => void }) {
   const { data: session } = useSession();
   const pathname = usePathname();
   const role = session?.user?.role ?? "";
@@ -61,6 +61,7 @@ export default function Sidebar({ dict, lang }: { dict: any; lang: string }) {
                   key={item.href}
                   href={item.href}
                   className={`nav-item ${pathname === item.href ? "active" : ""}`}
+                  onClick={onClose}
                 >
                   <item.icon />
                   {item.label}