import './App.css';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';

// Pages
import MultiUploadPage from './Components/Pages/MultiUploadPage';
import SlideshowPage from './Components/Pages/SlideshowPage';
import GroupsOverviewPage from './Components/Pages/GroupsOverviewPage';
import ModerationGroupsPage from './Components/Pages/ModerationGroupsPage';
import ModerationGroupImagesPage from './Components/Pages/ModerationGroupImagesPage';
import PublicGroupImagesPage from './Components/Pages/PublicGroupImagesPage';
import FZF from './Components/Pages/404Page.js'

function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" exact element={<MultiUploadPage />} />
        <Route path="/slideshow" element={<SlideshowPage />} />
  <Route path="/groups/:groupId" element={<PublicGroupImagesPage />} />
  <Route path="/groups" element={<GroupsOverviewPage />} />
    <Route path="/moderation" exact element={<ModerationGroupsPage />} />
    <Route path="/moderation/groups/:groupId" element={<ModerationGroupImagesPage />} />
        <Route path="*" element={<FZF />} />
      </Routes>
    </Router>
  );
}

export default App;