ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature/update dependency react router dom to v6.x (#340)

Browse Source 
* Update dependency "react-router-dom" to v6.x

Update to v6.11.2

* Update dependency "react-router-dom" to v6.x - Replace "Switch" with "Routes"

* Update dependency "react-router-dom" to v6.x - Relative paths

* Update dependency "react-router-dom" to v6.x - Nested routes

* Update dependency "react-router-dom" to v6.x - Prevent route warnings

 - Route without an element causes a warning message.
 - Routes with non-matching Route causes a warning message.

* Update dependency "react-router-dom" to v6.x - Replace "useHistory" with "useNavigate"

* Update dependency "react-router-dom" to v6.x - Fix "Link" usage

* Update dependency "react-router-dom" to v6.x - Overwrite "useParams" and "useLocations" typing

For both functions it's the users fault if they are getting used incorrectly.
It's inconvenient to always have to make sure the params exist (useParam) or to cast the return object to a specific type (useLocation)

 - "useParams": Make generic type non-optional
 - "useLocation": Add generic type

* Update dependency "react-router-dom" to v6.x - Fix use-query-params provider
This commit is contained in:
schroda
2023-06-04 21:30:15 +02:00
committed by GitHub
parent fd5a1e240a
commit 4e8813b526
15 changed files with 114 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/App.tsx
View File

@@ -11,7 +11,7 @@ import CssBaseline from '@mui/material/CssBaseline';
import AppContext from 'components/context/AppContext';
import DefaultNavBar from 'components/navbar/DefaultNavBar';
import React from 'react';
import { Redirect, Route, Switch } from 'react-router-dom';
import { Navigate, Route, Routes } from 'react-router-dom';
import Browse from 'screens/Browse';
import DownloadQueue from 'screens/DownloadQueue';
import Extensions from 'screens/Extensions';
@@ -47,71 +47,41 @@ const App: React.FC = () => (
overflow: 'auto',
}}
>
<Switch>
<Routes>
{/* General Routes */}
<Route exact path="/" render={() => <Redirect to="/library" />} />
<Route path="/settings/about">
<About />
</Route>
<Route path="/settings/categories">
<Categories />
</Route>
<Route path="/settings/defaultReaderSettings">
<DefaultReaderSettings />
</Route>
<Route path="/settings/librarySettings">
<LibrarySettings />
</Route>
<Route path="/settings/backup">
<Backup />
</Route>
<Route path="/settings">
<Settings />
<Route path="/" element={<Navigate to="/library" />} />
<Route path="settings">
<Route index element={<Settings />} />
<Route path="about" element={<About />} />
<Route path="categories" element={<Categories />} />
<Route path="defaultReaderSettings" element={<DefaultReaderSettings />} />
<Route path="librarySettings" element={<LibrarySettings />} />
<Route path="backup" element={<Backup />} />
</Route>
{/* Manga Routes */}
<Route exact path="/sources/:sourceId">
<SourceMangas />
<Route path="sources">
<Route index element={<Sources />} />
<Route path=":sourceId" element={<SourceMangas />} />
<Route path=":sourceId/configure/" element={<SourceConfigure />} />
<Route path="all/search/" element={<SearchAll />} />
</Route>
<Route path="/sources/:sourceId/configure/">
<SourceConfigure />
<Route path="downloads" element={<DownloadQueue />} />
<Route path="manga/:id">
<Route path="chapter/:chapterNum" element={null} />
<Route index element={<Manga />} />
</Route>
<Route path="/sources/all/search/">
<SearchAll />
</Route>
<Route path="/downloads">
<DownloadQueue />
</Route>
<Route path="/manga/:mangaId/chapter/:chapterNum" />
<Route path="/manga/:id">
<Manga />
</Route>
<Route path="/library">
<Library />
</Route>
<Route path="/updates">
<Updates />
</Route>
<Route path="/sources">
<Sources />
</Route>
<Route path="/extensions">
<Extensions />
</Route>
<Route path="/browse">
<Browse />
</Route>
</Switch>
<Route path="library" element={<Library />} />
<Route path="updates" element={<Updates />} />
<Route path="extensions" element={<Extensions />} />
<Route path="browse" element={<Browse />} />
</Routes>
</Container>
<Switch>
<Route
path="/manga/:mangaId/chapter/:chapterIndex"
// passing a key re-mounts the reader
// when changing chapters
render={(props: any) => <Reader key={props.match.params.chapterIndex} />}
/>
</Switch>
<Routes>
<Route path="manga/:mangaId/chapter/:chapterIndex" element={<Reader />} />
<Route path="*" element={null} />
</Routes>
</AppContext>
);