import React, { Suspense } from 'react';
import FichesHorairesPageClient from '@/components/FichesHorairesPageClient';

interface RegionFichesHorairesPageProps {
  params: Promise<{
    region: string;
  }>;
}

export default async function RegionFichesHorairesPage({ params }: RegionFichesHorairesPageProps) {
  const { region } = await params;

  return (
    <Suspense fallback={
      <div className="min-h-screen bg-gray-50 flex items-center justify-center p-8">
        <div className="text-center space-y-3">
          <div className="w-10 h-10 border-4 border-[#006837] border-t-transparent rounded-full animate-spin mx-auto"></div>
          <p className="text-sm font-medium text-gray-700">Chargement des fiches horaires...</p>
        </div>
      </div>
    }>
      <FichesHorairesPageClient regionSlug={region} />
    </Suspense>
  );
}