import { BrowserRouter, Route, Routes } from 'react-router-dom'
import AppShell from './components/AppShell'
import BreedersPage from './pages/BreedersPage'
import GerbilsPage from './pages/GerbilsPage'
import GerbilDetailPage from './pages/GerbilDetailPage'
import GerbilFormPage from './pages/GerbilFormPage'
import GenetikPage from './pages/GenetikPage'
import HomePage from './pages/HomePage'
import LittersPage from './pages/LittersPage'
import NotFoundPage from './pages/NotFoundPage'

export default function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route element={<AppShell />}>
          <Route index element={<HomePage />} />
          <Route path="rennmaeuse">
            <Route index element={<GerbilsPage />} />
            <Route path="neu" element={<GerbilFormPage />} />
            <Route path=":id" element={<GerbilDetailPage />} />
            <Route path=":id/bearbeiten" element={<GerbilFormPage />} />
          </Route>
          <Route path="wuerfe" element={<LittersPage />} />
          <Route path="zuechter" element={<BreedersPage />} />
          <Route path="genetik" element={<GenetikPage />} />
          <Route path="*" element={<NotFoundPage />} />
        </Route>
      </Routes>
    </BrowserRouter>
  )
}