Project-Image-Uploader/frontend/src/App.js
matthias.lotz 5ba463427b feat(frontend): upgrade react-router-dom 5→6 (Phase 3)
- Update package.json: react-router-dom ^5.2.0→^6.28.0
- Migrate App.js: Switch→Routes, component→element props, path="*" for 404
- Migrate 5 pages: useHistory→useNavigate, history.push()→navigate()
  - GroupsOverviewPage.js (4x navigate)
  - ModerationGroupsPage.js (1x navigate)
  - ModerationGroupImagesPage.js (2x navigate)
  - PublicGroupImagesPage.js (import updated)
  - SlideshowPage.js (4x navigate + keyboard handler)
- Regenerate package-lock.json with react-router v6

 Tested: Production build 254.46 KB gzip (+1.17 KB)
 Manual test: Navigation, moderation routing, slideshow ESC - all working

Phase 3 complete: Modern react-router v6 with improved routing API.
2025-10-28 22:59:59 +01:00

29 lines
1.1 KiB
JavaScript

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;