import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import Layout from './components/layout/Layout';
import Dashboard from './pages/Dashboard';
import Clubs from './pages/Clubs';
import Standings from './pages/Standings';
import Games from './pages/Games';
import LiveEditor from './pages/LiveEditor';
import LiveGames from './pages/LiveGames';

// Placeholder components for other pages
const Placeholder = ({ title }: { title: string }) => (
  <div className="p-20 text-center text-text-muted border border-dashed border-border rounded-2xl">
    <h2 className="text-2xl uppercase">{title}</h2>
    <p>Esta funcionalidade será implementada brevemente.</p>
  </div>
);

function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<Layout />}>
          <Route index element={<Dashboard />} />
          <Route path="games" element={<Games />} />
          <Route path="games/live" element={<LiveGames />} />
          <Route path="games/live-editor/:escalao/:jornada/:matchId" element={<LiveEditor />} />
          <Route path="standings" element={<Standings />} />
          <Route path="clubs" element={<Clubs />} />
          <Route path="players" element={<Placeholder title="Jogadores" />} />
          <Route path="scorers" element={<Placeholder title="Artilheiros" />} />
          <Route path="news" element={<Placeholder title="Notícias" />} />
          <Route path="settings" element={<Placeholder title="Definições" />} />
        </Route>
      </Routes>
    </Router>
  );
}

export default App;