import Link from "next/link";
import { requireUser } from "@/lib/auth/session";
import { myInquiries } from "@/lib/inquiries/service";
import { fmtDate } from "@/lib/format";
import { Empty } from "@/components/ui";
export const dynamic = "force-dynamic";
export default async function Messages() {
  const u = await requireUser(); const rows = await myInquiries(u.id);
  return (
    <div>
      <h1 className="text-2xl md:text-3xl font-extrabold tracking-tight mb-1">Messages</h1><p className="text-sm text-ink-2 mb-4">Demandes d'information, de visite et conversations liées à vos annonces ou à celles que vous avez contactées. Courriels et téléphones sont masqués automatiquement.</p>
      {rows.length === 0 ? <Empty title="Aucune conversation" hint="Contactez un annonceur depuis une fiche, ou attendez les demandes sur vos annonces." action={{ href: "/recherche", label: "Explorer" }} /> : (
        <ul className="tv-card divide-y divide-line">{rows.map((r) => (
          <li key={r.inq.id}><Link href={`/membre/messages/${r.inq.id}`} className="flex gap-3 p-3 hover:bg-surface-2">
            <span className="w-16 h-12 rounded-sm bg-surface-2 overflow-hidden shrink-0 relative">{r.cover && <img src={r.cover} alt="" className="absolute inset-0 w-full h-full object-cover" />}</span>
            <span className="min-w-0 flex-1"><span className="flex items-center gap-2"><span className="font-semibold truncate">{r.otherName ?? "Membre Toveli"}</span>{r.unread > 0 && <span className="tv-badge bg-brand text-white">{r.unread}</span>}<span className="tv-badge bg-surface-2 text-ink-3">{r.inq.category === "VISIT" ? "Visite" : r.inq.category === "OFFER" ? "Offre" : "Info"}</span>{r.inq.status !== "OPEN" && <span className="tv-badge bg-surface-2 text-ink-3">{r.inq.status === "ARCHIVED" ? "Archivée" : "Bloquée"}</span>}</span>
              <span className="block text-xs text-ink-2 truncate">{r.listingTitle ?? "Annonce"} · {r.city} · {r.listingType === "RENT" ? "location" : "vente"}{r.inq.recipientUserId === u.id ? " · mon annonce" : ""}</span>
              <span className="block text-xs text-ink-3 truncate mt-0.5">{r.lastBody}</span></span>
            <span className="text-[11px] text-ink-3 shrink-0">{fmtDate(r.inq.lastMessageAt.toISOString())}</span>
          </Link></li>))}</ul>
      )}
    </div>
  );
}