import { Grid } from '@stash/ui'
import type { PosterItem } from '../../data/types'
import { PosterCard } from './PosterCard'

/** 海报网格：桌面 6 列，平板 4 列，手机 3 列 */
type PosterGridProps = {
  items: PosterItem[]
  variant?: 'home' | 'detail'
  /** 点击海报打开条目详情 */
  onOpen?: (itemId: string) => void
}

export function PosterGrid({ items, onOpen }: PosterGridProps) {
  return (
    <Grid columns={6} tabletColumns={4} mobileColumns={3} gap="md">
      {items.map((item) => (
        <PosterCard key={item.id} item={item} onOpen={onOpen} />
      ))}
    </Grid>
  )
}