import { Suspense } from "react";
import { getAllLeads } from "@/lib/lead-service";
import { LeadTable } from "@/components/admin/leads/LeadTable";
import { CreateLeadModal } from "@/components/admin/leads/LeadForm";

async function LeadsList() {
  const leads = await getAllLeads();

  return (
    <div className="space-y-6">
      <div className="flex justify-between items-center">
        <h1 className="text-3xl font-bold">Lead Pipeline</h1>
        <CreateLeadModal />
      </div>

      <Suspense fallback={<div className="animate-pulse">Loading...</div>}>
        <LeadTable leads={leads} />
      </Suspense>
    </div>
  );
}

export default function LeadsPage() {
  return <LeadsList />;
}
