import React from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import { AuthProvider } from './context/AuthContext';
import { ThemeProvider } from './context/ThemeContext';
import Snowflakes from './components/Snowflakes';
import Home from './pages/Home';
import CreateRoom from './pages/CreateRoom';
import JoinRoom from './pages/JoinRoom';
import RoomPage from './pages/RoomPage';
import GamePage from './pages/GamePage';
import LocalGame from './pages/LocalGame';
import './App.css';

function App() {
  return (
    <ThemeProvider>
      <AuthProvider>
        <Router>
          <>
            <Snowflakes />
            <Routes>
              <Route path="/" element={<Home />} />
              <Route path="/create-room" element={<CreateRoom />} />
              <Route path="/join-room" element={<JoinRoom />} />
              <Route path="/room/:roomCode" element={<RoomPage />} />
              <Route path="/game/:roomCode" element={<GamePage />} />
              <Route path="/local-game" element={<LocalGame />} />
            </Routes>
          </>
        </Router>
      </AuthProvider>
    </ThemeProvider>
  );
}

export default App;