import { Routes, Route, Navigate } from 'react-router-dom'
import { Layout } from './components'
import { AdminLayout } from './components/admin'
import { GenlockeDetail, GenlockeList, Home, NewGenlocke, NewRun, RunList, RunEncounters, Stats } from './pages'
import {
  AdminGames,
  AdminGameDetail,
  AdminPokemon,
  AdminRouteDetail,
  AdminEvolutions,
  AdminRuns,
  AdminGenlockes,
  AdminGenlockeDetail,
} from './pages/admin'

function App() {
  return (
    <Routes>
      <Route path="/" element={<Layout />}>
        <Route index element={<Home />} />
        <Route path="runs" element={<RunList />} />
        <Route path="runs/new" element={<NewRun />} />
        <Route path="runs/:runId" element={<RunEncounters />} />
        <Route path="genlockes" element={<GenlockeList />} />
        <Route path="genlockes/new" element={<NewGenlocke />} />
        <Route path="genlockes/:genlockeId" element={<GenlockeDetail />} />
        <Route path="stats" element={<Stats />} />
        <Route path="runs/:runId/encounters" element={<Navigate to=".." relative="path" replace />} />
        <Route path="admin" element={<AdminLayout />}>
          <Route index element={<Navigate to="/admin/games" replace />} />
          <Route path="games" element={<AdminGames />} />
          <Route path="games/:gameId" element={<AdminGameDetail />} />
          <Route path="games/:gameId/routes/:routeId" element={<AdminRouteDetail />} />
          <Route path="pokemon" element={<AdminPokemon />} />
          <Route path="evolutions" element={<AdminEvolutions />} />
          <Route path="runs" element={<AdminRuns />} />
          <Route path="genlockes" element={<AdminGenlockes />} />
          <Route path="genlockes/:genlockeId" element={<AdminGenlockeDetail />} />
        </Route>
      </Route>
    </Routes>
  )
}

export default App
