"use client";

import { Suspense } from "react";
import { useSearchParams } from "next/navigation";
import { Header } from "@/components/layout/header";
import { AuditPanel } from "@/components/audit";

function AuditPageContent() {
  const searchParams = useSearchParams();

  // Extract filter params from URL
  const initialFilters = {
    subject: searchParams.get("subject") ?? "",
    agentId: searchParams.get("agent_id") ?? "",
    action: searchParams.get("action") ?? "",
  };

  // Only pass non-empty filters
  const hasFilters = Object.values(initialFilters).some((v) => v !== "");

  return <AuditPanel initialFilters={hasFilters ? initialFilters : undefined} />;
}

export default function AuditPage() {
  return (
    <>
      <Header title="Audit Trail" />
      <div className="p-6">
        <Suspense fallback={<div className="text-muted-foreground">Loading...</div>}>
          <AuditPageContent />
        </Suspense>
      </div>
    </>
  );
}
