import prisma from "@/lib/prisma";
import Link from "next/link";
import Image from "next/image";
import { photoUrl } from "@/lib/media";

export const metadata = {
  title: "Public Galleries",
  description: "Browse public photo galleries from verified escorts on AdultWorld.",
};

export const revalidate = 300; // ISR (Stage 4): was force-dynamic

export default async function GalleriesPage() {
  const galleries = await prisma.gallery.findMany({
    where: { private: false, user: { is: {} } },
    include: {
      user: { select: { id: true, id_aw: true, username: true, profile_photo: true } },
    },
    orderBy: { created_at: "desc" },
    take: 48,
  });

  return (
    <div className="space-y-6">
      <h1 className="text-2xl font-bold">Public Galleries</h1>

      <p className="text-text-muted">
        Explore photo galleries from verified escorts worldwide. Browse public collections featuring professional portraits, lifestyle shots, and artistic photography. Premium galleries with exclusive content are available via credits.
      </p>

      <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
        {galleries.map((gallery) => (
          <Link
            key={gallery.id}
            href={`/gallery/show/${gallery.id}`}
            className="bg-surface rounded-lg overflow-hidden hover:ring-1 hover:ring-primary transition-all group"
          >
            <div className="aspect-video bg-surface-light flex items-center justify-center relative">
              {gallery.cover ? (
                <Image
                  src={photoUrl(gallery.cover, gallery.user?.id_aw)}
                  alt={gallery.name ?? ""}
                  fill
                  sizes="(max-width:768px) 50vw, (max-width:1024px) 33vw, 25vw"
                  className="object-cover group-hover:scale-105 transition-transform"
                />
              ) : (
                <svg className="w-12 h-12 text-text-muted" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
                </svg>
              )}
            </div>
            <div className="p-3">
              <p className="font-semibold truncate">{gallery.name}</p>
              <div className="flex items-center justify-between mt-1">
                <p className="text-text-muted text-sm truncate">
                  {gallery.user?.username}
                </p>
                <p className="text-text-muted text-sm">
                  {gallery.credits > 0 ? `${gallery.credits} credits` : "Free"}
                </p>
              </div>
            </div>
          </Link>
        ))}
      </div>

      {galleries.length === 0 && (
        <div className="text-center py-16 text-text-muted">
          <p className="text-lg">No public galleries yet</p>
        </div>
      )}
    </div>
  );
}