mobile fix #86
1 changed files with 15 additions and 13 deletions
|
|
@ -1,3 +1,4 @@
|
||||||
|
import { useState } from "react";
|
||||||
import { Link, Outlet, redirect } from "react-router";
|
import { Link, Outlet, redirect } from "react-router";
|
||||||
import { auth } from "~/lib/auth.server";
|
import { auth } from "~/lib/auth.server";
|
||||||
import type { Route } from "./+types/admin";
|
import type { Route } from "./+types/admin";
|
||||||
|
|
@ -44,59 +45,59 @@ export async function loader(args: Route.LoaderArgs) {
|
||||||
return { isAdmin };
|
return { isAdmin };
|
||||||
}
|
}
|
||||||
|
|
||||||
function AdminNavLinks() {
|
function AdminNavLinks({ onNavigate }: { onNavigate?: () => void }) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Button variant="ghost" className="w-full justify-start" asChild>
|
<Button variant="ghost" className="w-full justify-start" asChild onClick={onNavigate}>
|
||||||
<Link to="/admin">
|
<Link to="/admin">
|
||||||
<LayoutDashboard className="mr-2 h-4 w-4" />
|
<LayoutDashboard className="mr-2 h-4 w-4" />
|
||||||
Dashboard
|
Dashboard
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/leagues">
|
||||||
<Shield className="mr-2 h-4 w-4" />
|
<Shield className="mr-2 h-4 w-4" />
|
||||||
Leagues
|
Leagues
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/sports">
|
||||||
<Trophy className="mr-2 h-4 w-4" />
|
<Trophy className="mr-2 h-4 w-4" />
|
||||||
Sports
|
Sports
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/sports-seasons">
|
||||||
<Calendar className="mr-2 h-4 w-4" />
|
<Calendar className="mr-2 h-4 w-4" />
|
||||||
Sports Seasons
|
Sports Seasons
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/simulators">
|
||||||
<Activity className="mr-2 h-4 w-4" />
|
<Activity className="mr-2 h-4 w-4" />
|
||||||
Simulators
|
Simulators
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/tournaments">
|
||||||
<Award className="mr-2 h-4 w-4" />
|
<Award className="mr-2 h-4 w-4" />
|
||||||
Tournaments
|
Tournaments
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/templates">
|
||||||
<FolderKanban className="mr-2 h-4 w-4" />
|
<FolderKanban className="mr-2 h-4 w-4" />
|
||||||
Season Templates
|
Season Templates
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</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">
|
<Link to="/admin/users">
|
||||||
<Users className="mr-2 h-4 w-4" />
|
<Users className="mr-2 h-4 w-4" />
|
||||||
Users
|
Users
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<div className="border-t my-2" />
|
<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">
|
<Link to="/admin/data-sync">
|
||||||
<RefreshCw className="mr-2 h-4 w-4" />
|
<RefreshCw className="mr-2 h-4 w-4" />
|
||||||
Data Sync
|
Data Sync
|
||||||
|
|
@ -107,11 +108,12 @@ function AdminNavLinks() {
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function AdminLayout() {
|
export default function AdminLayout() {
|
||||||
|
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
|
||||||
return (
|
return (
|
||||||
<div className="flex min-h-screen">
|
<div className="flex min-h-screen">
|
||||||
{/* Mobile top bar */}
|
{/* 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">
|
<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>
|
<Sheet open={mobileMenuOpen} onOpenChange={setMobileMenuOpen}>
|
||||||
<SheetTrigger asChild>
|
<SheetTrigger asChild>
|
||||||
<Button variant="ghost" size="icon" className="shrink-0">
|
<Button variant="ghost" size="icon" className="shrink-0">
|
||||||
<Menu className="h-5 w-5" />
|
<Menu className="h-5 w-5" />
|
||||||
|
|
@ -123,7 +125,7 @@ export default function AdminLayout() {
|
||||||
<SheetTitle>Admin Panel</SheetTitle>
|
<SheetTitle>Admin Panel</SheetTitle>
|
||||||
</SheetHeader>
|
</SheetHeader>
|
||||||
<nav aria-label="Admin navigation" className="space-y-1 p-4">
|
<nav aria-label="Admin navigation" className="space-y-1 p-4">
|
||||||
<AdminNavLinks />
|
<AdminNavLinks onNavigate={() => setMobileMenuOpen(false)} />
|
||||||
</nav>
|
</nav>
|
||||||
</SheetContent>
|
</SheetContent>
|
||||||
</Sheet>
|
</Sheet>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue