Files
nuzlocke-tracker/frontend/src/components/admin/AdminLayout.tsx
Julian Tabel a81a17c485 Add genlocke admin panel with CRUD endpoints and UI
Backend: PATCH/DELETE genlocke, POST/DELETE legs with order
re-numbering. Frontend: admin list page with status filter,
detail page with inline editing, legs table, and stats display.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-09 10:51:47 +01:00

43 lines
1.4 KiB
TypeScript

import { NavLink, Outlet } from 'react-router-dom'
const navItems = [
{ to: '/admin/games', label: 'Games' },
{ to: '/admin/pokemon', label: 'Pokemon' },
{ to: '/admin/evolutions', label: 'Evolutions' },
{ to: '/admin/runs', label: 'Runs' },
{ to: '/admin/genlockes', label: 'Genlockes' },
]
export function AdminLayout() {
return (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<h1 className="text-2xl font-bold mb-6">Admin Panel</h1>
<div className="flex flex-col sm:flex-row gap-6 sm:gap-8">
<nav className="flex-shrink-0 sm:w-48">
<ul className="flex sm:flex-col gap-1 overflow-x-auto sm:overflow-visible">
{navItems.map((item) => (
<li key={item.to} className="flex-shrink-0">
<NavLink
to={item.to}
className={({ isActive }) =>
`block px-3 py-2 rounded-md text-sm font-medium whitespace-nowrap ${
isActive
? 'bg-blue-100 text-blue-700 dark:bg-blue-900 dark:text-blue-200'
: 'hover:bg-gray-100 dark:hover:bg-gray-700'
}`
}
>
{item.label}
</NavLink>
</li>
))}
</ul>
</nav>
<div className="flex-1 min-w-0">
<Outlet />
</div>
</div>
</div>
)
}