"use client";

import { usePathname } from "next/navigation";
import type { ReactNode } from "react";
import { isAdminPage } from "../lib/user-view-policy";
import { setUserViewPreview, useUserViewState } from "../lib/viewMode";

export default function AdminViewGate({ children }: { children: ReactNode }) {
  const pathname = usePathname();
  const { enabled, ready } = useUserViewState();
  if (!isAdminPage(pathname)) return children;
  if (!ready)
    return (
      <main className="card" role="status">
        Checking view mode...
      </main>
    );
  if (!enabled) return children;

  return (
    <main className="card">
      <h1>Administrator tools are hidden</h1>
      <p>Configuration, user management and other admin tools are unavailable while previewing user view.</p>
      <p>Your account is unchanged. Exit the preview to return to this page.</p>
      <div className="config-inline-controls">
        <a href="/">Go to My Requests</a>
        <button type="button" onClick={() => setUserViewPreview(false)}>
          Exit user view
        </button>
      </div>
    </main>
  );
}