import Link from "next/link";
import { prisma } from "@/lib/prisma";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import { PageHeader } from "@/components/ui/page-header";
import { EmptyState } from "@/components/ui/empty-state";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import { Plus, Users, Search, Mail, Phone } from "lucide-react";
import { ClientSearch } from "@/components/modules/clients/ClientSearch";

export const dynamic = "force-dynamic";

interface PageProps {
  searchParams: { q?: string };
}

export default async function ClientsPage({ searchParams }: PageProps) {
  const q = searchParams.q?.trim() || "";

  const clients = await prisma.client.findMany({
    where: q
      ? {
          OR: [
            { nom_complet: { contains: q } },
            { telephone: { contains: q } },
            { email: { contains: q } },
            { numero_identite: { contains: q } },
          ],
        }
      : undefined,
    include: { _count: { select: { reservations: true } } },
    orderBy: { created_at: "desc" },
    take: 100,
  });

  return (
    <div className="space-y-4">
      <PageHeader
        title="Clients"
        description={`${clients.length} client${clients.length > 1 ? "s" : ""} ${q ? "trouvé(s)" : "enregistré(s)"}`}
        action={
          <Button asChild variant="accent">
            <Link href="/clients/nouveau">
              <Plus className="w-4 h-4" />
              Nouveau client
            </Link>
          </Button>
        }
      />

      <ClientSearch defaultValue={q} />

      {clients.length === 0 ? (
        <EmptyState
          icon={q ? <Search className="w-8 h-8" /> : <Users className="w-8 h-8" />}
          title={q ? "Aucun client trouvé" : "Aucun client"}
          description={
            q
              ? `Aucun résultat pour "${q}"`
              : "Ajoutez votre premier client pour commencer."
          }
          actionLabel="Ajouter un client"
          actionHref="/clients/nouveau"
        />
      ) : (
        <Card>
          <CardContent className="p-0">
            <Table>
              <TableHeader>
                <TableRow>
                  <TableHead>Nom</TableHead>
                  <TableHead>Contact</TableHead>
                  <TableHead>Pays</TableHead>
                  <TableHead>N° identité</TableHead>
                  <TableHead className="text-right">Séjours</TableHead>
                </TableRow>
              </TableHeader>
              <TableBody>
                {clients.map((c) => (
                  <TableRow key={c.id}>
                    <TableCell>
                      <Link
                        href={`/clients/${c.id}`}
                        className="font-medium hover:underline"
                      >
                        {c.nom_complet}
                      </Link>
                    </TableCell>
                    <TableCell>
                      <div className="space-y-0.5 text-xs">
                        {c.email && (
                          <div className="flex items-center gap-1 text-muted-foreground">
                            <Mail className="w-3 h-3" /> {c.email}
                          </div>
                        )}
                        {c.telephone && (
                          <div className="flex items-center gap-1 text-muted-foreground">
                            <Phone className="w-3 h-3" /> {c.telephone}
                          </div>
                        )}
                      </div>
                    </TableCell>
                    <TableCell>{c.pays}</TableCell>
                    <TableCell className="text-xs">{c.numero_identite || "—"}</TableCell>
                    <TableCell className="text-right font-semibold">
                      {c._count.reservations}
                    </TableCell>
                  </TableRow>
                ))}
              </TableBody>
            </Table>
          </CardContent>
        </Card>
      )}
    </div>
  );
}