import React from 'react'
import ArtworkGalleryGrid from './ArtworkGalleryGrid'

export default function ArtworkRelated({ related }) {
  if (!Array.isArray(related) || related.length === 0) return null

  return (
    <section className="mt-12">
      <h2 className="text-lg font-semibold text-white">Related Artworks</h2>

      <ArtworkGalleryGrid
        items={related.slice(0, 8)}
        compact
        className="mt-5 xl:grid-cols-4"
      />
    </section>
  )
}