import { EventList } from '@/components/event-list';
import { Suspense } from 'react';

export default function EventsPage() {
  return (
    <div className="min-h-screen bg-gray-50 py-8">
      <div className="max-w-7xl mx-auto px-4">
        <div className="flex justify-between items-center mb-8">
          <h1 className="text-3xl font-bold">Events</h1>
          <a
            href="/events/create"
            className="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700"
          >
            Create Event
          </a>
        </div>
        <Suspense fallback={<div>Loading...</div>}>
          <EventList />
        </Suspense>
      </div>
    </div>
  );
}