Luncher/client/src/AppRoutes.tsx

import { Routes, Route } from "react-router-dom";
import { ProvideSettings } from "./context/settings";
import FlyingButterflies, { BUTTERFLY_PRESETS } from "./FlyingButterflies";
import "./FlyingButterflies.scss";
import { ToastContainer } from "react-toastify";
import { SocketContext, socket } from "./context/socket";
import StatsPage from "./pages/StatsPage";
import OrderGroupsPage from "./pages/OrderGroupsPage";
import SuggestionsPage from "./pages/SuggestionsPage";
import App from "./App";

export const STATS_URL = '/stats';
export const OBJEDNANI_URL = '/objednani';
export const NAVRHY_URL = '/navrhy';

export default function AppRoutes() {
    return (
        <Routes>
            <Route path={STATS_URL} element={<StatsPage />} />
            <Route path={NAVRHY_URL} element={
                <ProvideSettings>
                    <SuggestionsPage />
                </ProvideSettings>
            } />
            <Route path={OBJEDNANI_URL} element={
                <ProvideSettings>
                    <SocketContext.Provider value={socket}>
                        <OrderGroupsPage />
                        <ToastContainer />
                    </SocketContext.Provider>
                </ProvideSettings>
            } />
            <Route path="/" element={
                <ProvideSettings>
                    <SocketContext.Provider value={socket}>
                        <>
                            <FlyingButterflies numButterflies={BUTTERFLY_PRESETS.NORMAL} />
                            <App />
                        </>
                        <ToastContainer />
                    </SocketContext.Provider>
                </ProvideSettings>
            } />
        </Routes>
    );
}