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

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">🌗 Theme</button>
        <button onClick={logout} className="text-sm text-red-400">Logout</button>
      </aside>
      <main className="flex-1 p-6">
        <Outlet />
      </main>
    </div>
  );
}
