import { deleteLeadAction, updateLeadStatusAction } from "@/app/admin/actions";
import { Button } from "@/components/ui/button";
import { getAdminLeadsData } from "@/lib/admin-data";

export default async function AdminLeadsPage() {
  const leads = await getAdminLeadsData();

  return (
    <div className="space-y-5">
      <h1 className="text-2xl font-bold text-navy-deep">Leads</h1>
      <div className="soft-card overflow-x-auto">
        <table className="w-full min-w-[900px] text-left text-sm">
          <thead className="bg-primary-soft"><tr><th className="px-4 py-3">Name</th><th>Phone</th><th>Email</th><th>Source</th><th>Subject</th><th>Status & Notes</th><th>Action</th></tr></thead>
          <tbody>
            {leads.length ? leads.map((lead: any) => (
              <tr className="border-t border-border" key={lead.id}>
                <td className="px-4 py-3 font-bold">{lead.fullName}</td><td>{lead.phone}</td><td>{lead.email}</td><td>{lead.source ?? "CONTACT_PAGE"}</td><td>{lead.subject}</td>
                <td><form action={updateLeadStatusAction} className="flex items-center gap-2"><input type="hidden" name="id" value={lead.id} /><select name="status" defaultValue={lead.status} className="w-28 rounded-lg border border-border px-2 py-1"><option>NEW</option><option>CONTACTED</option><option>QUALIFIED</option><option>CLOSED</option></select><input name="notes" defaultValue={lead.notes ?? ""} placeholder="Notes" className="rounded-lg border border-border px-2 py-1" /><Button size="sm" type="submit" variant="outline">Save</Button></form></td>
                <td>
                  <form action={deleteLeadAction}>
                    <input type="hidden" name="id" value={lead.id} />
                    <Button className="bg-red-600 text-white hover:bg-red-700" size="sm" type="submit">Delete</Button>
                  </form>
                </td>
              </tr>
            )) : <tr><td className="px-4 py-6 text-navy-muted" colSpan={7}>No leads yet. Contact form leads will appear here.</td></tr>}
          </tbody>
        </table>
      </div>
    </div>
  );
}