import type { EventInfo } from './types';
import { EventCardView } from './event-card.view';

export function EventGridView({ events, assembleFooter }: { events: EventInfo[]; assembleFooter: (event: EventInfo) => React.ReactNode }) {
  return (
    <div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-4">
      {events.map(event => (
        <EventCardView key={event.eventId} eventInfo={event} actionFooter={assembleFooter(event)} />
      ))}
    </div>
  );
}