import "./App.css";
import { ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { BrowserRouter as Router, Routes, Route, Link } from "react-router-dom";
import StartPage from "./pages/StartPage";
import Details from "./pages/Details";
import Questions from "./pages/Questions";
import HearingTest from "./pages/HearingTest";
import Player from "./pages/Player";
import TestGraph from "./pages/TestGraph";
import StartTest from "./pages/StartTest";
import VoicePlayer from "./pages/VoicePlayer";

// 62d8fb0eb194356cd49bbc37
function App() {
  return (
    <Router basename="iframe">
      <div>
        <ToastContainer />

        <div style={{ padding: "10px" }}>
          <Routes>
            <Route path="/:id" exact element={<StartPage />} />
            <Route path="/:id/player" exact element={<Player />} />
            <Route path="/:id/voicePlayer" exact element={<VoicePlayer />} />
            <Route path="/:id/detailscreen" exact element={<Details />} />
            <Route path="/:id/hearingTest" exact element={<HearingTest />} />
            <Route path="/:id/startTest" exact element={<StartTest />} />
            <Route path="/:id/questions" exact element={<Questions />} />
            <Route path="/:id/testGraph" exact element={<TestGraph />} />
          </Routes>
        </div>
      </div>
    </Router>
    // <div className="App">
    //   <p>Hello</p>
    // </div>
  );
}

export default App;
