mobile fix #86

Merged
chrisp merged 1 commit from claude/mobile-admin-menu-sections-oy0ue8 into main 2026-06-11 01:48:06 +00:00
Showing only changes of commit a507799b80 - Show all commits

View file

@ -1,3 +1,4 @@
import { useState } from "react";
import { Link, Outlet, redirect } from "react-router";
import { auth } from "~/lib/auth.server";
import type { Route } from "./+types/admin";
@ -44,59 +45,59 @@ export async function loader(args: Route.LoaderArgs) {
return { isAdmin };
}
function AdminNavLinks() {
function AdminNavLinks({ onNavigate }: { onNavigate?: () => void }) {
return (
<>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin">
<LayoutDashboard className="mr-2 h-4 w-4" />
Dashboard
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/leagues">
<Shield className="mr-2 h-4 w-4" />
Leagues
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/sports">
<Trophy className="mr-2 h-4 w-4" />
Sports
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/sports-seasons">
<Calendar className="mr-2 h-4 w-4" />
Sports Seasons
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/simulators">
<Activity className="mr-2 h-4 w-4" />
Simulators
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/tournaments">
<Award className="mr-2 h-4 w-4" />
Tournaments
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/templates">
<FolderKanban className="mr-2 h-4 w-4" />
Season Templates
</Link>
</Button>
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/users">
<Users className="mr-2 h-4 w-4" />
Users
</Link>
</Button>
<div className="border-t my-2" />
<Button variant="ghost" className="w-full justify-start" asChild>
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
<Link to="/admin/data-sync">
<RefreshCw className="mr-2 h-4 w-4" />
Data Sync
@ -107,11 +108,12 @@ function AdminNavLinks() {
}
export default function AdminLayout() {
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
return (
<div className="flex min-h-screen">
{/* Mobile top bar */}
<div className="md:hidden fixed top-0 left-0 right-0 z-10 flex h-14 items-center border-b px-4 gap-3 bg-muted/40">
<Sheet>
<div className="md:hidden fixed top-16 left-0 right-0 z-40 flex h-14 items-center border-b px-4 gap-3 bg-muted/40">
<Sheet open={mobileMenuOpen} onOpenChange={setMobileMenuOpen}>
<SheetTrigger asChild>
<Button variant="ghost" size="icon" className="shrink-0">
<Menu className="h-5 w-5" />
@ -123,7 +125,7 @@ export default function AdminLayout() {
<SheetTitle>Admin Panel</SheetTitle>
</SheetHeader>
<nav aria-label="Admin navigation" className="space-y-1 p-4">
<AdminNavLinks />
<AdminNavLinks onNavigate={() => setMobileMenuOpen(false)} />
</nav>
</SheetContent>
</Sheet>