import { ShieldHalf } from "lucide-react";
import { t } from "../../lib/i18n";
import PermissionChecker from "./components/PermissionChecker";

function AuthPage() {
  return (
    <div className="space-y-6">
      <div className="flex flex-wrap items-start justify-between gap-4">
        <div className="space-y-2">
          <h2 className="flex items-center gap-2 text-3xl font-semibold">
            <span className="flex h-10 w-10 items-center justify-center rounded-xl border border-primary/15 bg-primary/10 text-primary">
              <ShieldHalf size={20} />
            </span>
            <span>{t("ui.admin.auth_guard.title", "Auth Guard")}</span>
          </h2>
          <p className="text-sm text-muted-foreground">
            {t(
              "ui.admin.auth_guard.subtitle",
              "Verify admin privileges and ReBAC relationships against the policy engine.",
            )}
          </p>
        </div>
      </div>

      <PermissionChecker />
    </div>
  );
}

export default AuthPage;
