import { Outlet, Link } from "react-router-dom";
import { useTheme } from "../theme/ThemeContext";

export default function AdminLayout() {
  const { toggle } = useTheme();

  return (
    <div className="flex min-h-screen">
      <aside className="w-64 bg-zinc-900 p-4 space-y-3">
        <h2 className="font-bold">Admin</h2>
        <Link to="/admin">Dashboard</Link>
        <Link to="/admin/users">Users</Link>
        <Link to="/admin/security">Security</Link>
        <Link to="/admin/anomalies">Anomalies</Link>

        <button onClick={toggle} className="text-sm mt-4">
          🌗 Toggle theme
        </button>
      </aside>

      <main className="flex-1 p-6">
        <Outlet />
      </main>
    </div>
  );
}