/* ═══════════════════════════════════════════════════════════════
   ROLE GUARD — src/pages/admin/RequireRole.tsx

   Sits inside RequireAuth, never instead of it: by the time this
   renders, the session question has already been answered. All
   this decides is whether the answer was good enough.

   Same caveat as RequireAuth — this hides the interface, not the
   data. /api/admin/panel/* is superadmin-only on the server, and
   that's the part that matters. Without it, a bookmarked URL and
   a disabled select would be the only thing between a viewer and
   the account list.

   Bounces to Home rather than showing a "denied" page. Someone
   who lands here has almost always followed a stale link, and a
   working page beats an explanation of one.
   ═══════════════════════════════════════════════════════════════ */

import { Navigate, Outlet } from "react-router-dom";
import { useAuth } from "../../lib/auth.tsx";
import { atLeast } from "../../lib/roles.ts";
import { ADMIN_HOME } from "./adminNav.js";

export default function RequireRole({ role = "superadmin" }) {
  const { user, loading } = useAuth();

  // RequireAuth is already showing its own placeholder above this.
  if (loading) return null;

  if (!user) return <Navigate to="/admin/login" replace />;
  if (!atLeast(user, role)) return <Navigate to={ADMIN_HOME} replace />;

  return <Outlet />;
}