"use client";

import React from "react";

import { Photo } from "@/types";

export default function ImageGallery({ photos }: { photos: Array<Photo> }) {
  if (photos.length === 0) return null;

  const handleImageClick = (photo: Photo) => {
    if (photo.isClickable && photo.url) {
      window.open(photo.url, "_blank", "noopener,noreferrer");
    }
  };

  return (
    <div className="boxed-content photoGrid">
      {photos.map((photo) => (
        <img
          key={photo.id}
          src={photo.image.url}
          alt={photo.image.name}
          onClick={() => handleImageClick(photo)}
        />
      ))}
    </div>
  );
}