import { useState } from 'react';
import Navbar from './components/Navbar';
import Home from './components/Home';
import Spectacles from './components/Spectacles';
import Agenda from './components/Agenda';
import Ateliers from './components/Ateliers';
import Contact from './components/Contact';
import Footer from './components/Footer';

export default function App() {
  const [currentPage, setCurrentPage] = useState('home');

  const renderPage = () => {
    switch (currentPage) {
      case 'home':
        return <Home onNavigate={setCurrentPage} />;
      case 'spectacles':
        return <Spectacles />;
      case 'agenda':
        return <Agenda />;
      case 'ateliers':
        return <Ateliers />;
      case 'contact':
        return <Contact />;
      default:
        return <Home onNavigate={setCurrentPage} />;
    }
  };

  return (
    <div className="bg-cloud min-h-screen flex flex-col">
      <Navbar currentPage={currentPage} onNavigate={setCurrentPage} />
      
      <main className="flex-grow">
        {renderPage()}
      </main>

      <Footer />
    </div>
  );
}