import Link from "next/link";
import { requireUser } from "@/lib/auth/session";
import { executeGraphQL } from "@/lib/graphql/client";
import { PageHeader } from "@/components/layout/page-header";
import { Button } from "@/components/ui/button";
import { LeadsTable } from "../leads-table";
import type { Lead } from "@/lib/types";

type LeadRow = Lead & { source?: { name: string } | null };

const GET_ALLOCATED_LEADS_QUERY = `
  query GetAllocatedLeads($userId: UUID!) {
    lead_assignmentsCollection(filter: { user_id: { eq: $userId } }) {
      edges {
        node {
          leads {
            id
            full_name
            phone
            email
            country
            lead_status
            created_at
            lead_sources {
              name
            }
          }
        }
      }
    }
  }
`;

export default async function AllocatedLeadsPage() {
  const user = await requireUser();

  const { data, errors } = await executeGraphQL(GET_ALLOCATED_LEADS_QUERY, {
    userId: user.id,
  });

  if (errors) {
    console.error("GraphQL errors fetching allocated leads:", errors);
  }

  const rawEdges = data?.lead_assignmentsCollection?.edges ?? [];
  const leads: LeadRow[] = rawEdges
    .filter((edge: any) => edge.node?.leads)
    .map((edge: any) => {
      const l = edge.node.leads;
      return {
        ...l,
        source: l.lead_sources ? { name: l.lead_sources.name } : null,
      };
    });

  return (
    <div>
      <PageHeader
        title="Allocated Leads"
        breadcrumb="Home / Allocated Leads"
        action={
          <Button asChild>
            <Link href="/leads/new">Add Lead</Link>
          </Button>
        }
      />
      <LeadsTable leads={leads} />
    </div>
  );
}