diff --git a/public/scripts/theme-init.js b/public/scripts/theme-init.js index 937d3d7ac1..9e8f9b04de 100644 --- a/public/scripts/theme-init.js +++ b/public/scripts/theme-init.js @@ -1,8 +1,8 @@ (() => { - let theme: string | null = null; + let theme = null; let defaultDark = false; - let navbarColor: string | null = null; - let navbarTextColor: string | null = null; + let navbarColor = null; + let navbarTextColor = null; try { theme = localStorage.getItem("theme"); const dd = document.querySelector('meta[name="theme-default-dark"]'); diff --git a/src/components/admin/admin-mobile-wrapper.tsx b/src/components/admin/admin-mobile-wrapper.tsx index ea93418c4d..369bbfe045 100644 --- a/src/components/admin/admin-mobile-wrapper.tsx +++ b/src/components/admin/admin-mobile-wrapper.tsx @@ -1,7 +1,23 @@ "use client"; import { Menu, X } from "lucide-react"; -import { type ReactNode, useEffect, useState } from "react"; +import { + createContext, + type ReactNode, + useCallback, + useContext, + useEffect, + useMemo, + useState, +} from "react"; + +const AdminMobileContext = createContext<{ close: () => void }>({ + close: () => {}, +}); + +export function useAdminMobile() { + return useContext(AdminMobileContext); +} export function AdminMobileWrapper({ sidebar, @@ -11,6 +27,8 @@ export function AdminMobileWrapper({ children: ReactNode; }) { const [open, setOpen] = useState(false); + const close = useCallback(() => setOpen(false), []); + const mobile = useMemo(() => ({ close }), [close]); useEffect(() => { if (!open) return; @@ -22,6 +40,7 @@ export function AdminMobileWrapper({ }, [open]); return ( +
{/* Mobile header */}
{children}
+
); } diff --git a/src/components/admin/admin-nav-link.tsx b/src/components/admin/admin-nav-link.tsx index 5687ecf9b7..f06b5acf3f 100644 --- a/src/components/admin/admin-nav-link.tsx +++ b/src/components/admin/admin-nav-link.tsx @@ -3,6 +3,7 @@ import Link from "next/link"; import { usePathname } from "next/navigation"; import type { ReactNode } from "react"; +import { useAdminMobile } from "@/components/admin/admin-mobile-wrapper"; /** * Sidebar link that highlights when its route is active. "/admin" matches @@ -19,6 +20,7 @@ export function AdminNavLink({ children: ReactNode; }) { const pathname = usePathname() ?? ""; + const { close } = useAdminMobile(); const active = href === "/admin" ? pathname === "/admin" @@ -27,6 +29,7 @@ export function AdminNavLink({ return (