import { TrashCard, type TrashCardImage } from "./TrashCard";

export function TrashGrid({ images }: { images: TrashCardImage[] }) {
  if (images.length === 0) return null;
  return (
    <div className="columns-2 sm:columns-3 md:columns-4 xl:columns-5 gap-4 [column-fill:_balance]">
      {images.map((img) => (
        <div key={img.id} className="mb-4">
          <TrashCard image={img} />
        </div>
      ))}
    </div>
  );
}