mirror of
https://github.com/apricote/Listory.git
synced 2026-01-13 21:21:02 +00:00
chore(deps): upgrade to react-router v6
This commit is contained in:
parent
4996615f2b
commit
00f9f91191
10 changed files with 60 additions and 228 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import React from "react";
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import { Route, Routes } from "react-router-dom";
|
||||
import { Footer } from "./components/Footer";
|
||||
import { LoginFailure } from "./components/LoginFailure";
|
||||
import { LoginSuccess } from "./components/LoginSuccess";
|
||||
|
|
@ -26,21 +26,17 @@ export function App() {
|
|||
<NavBar />
|
||||
</header>
|
||||
<main className="mb-auto" /* mb-auto is for sticky footer */>
|
||||
<Switch>
|
||||
<Route path="/" exact />
|
||||
<Route path="/login/success" exact component={LoginSuccess} />
|
||||
<Route path="/login/failure" exact component={LoginFailure} />
|
||||
<Route path="/listens" exact component={RecentListens} />
|
||||
<Route path="/reports/listens" exact component={ReportListens} />
|
||||
<Route
|
||||
path="/reports/top-artists"
|
||||
exact
|
||||
component={ReportTopArtists}
|
||||
/>
|
||||
<Route path="/reports/top-albums" exact component={ReportTopAlbums} />
|
||||
<Route path="/reports/top-tracks" exact component={ReportTopTracks} />
|
||||
<Route path="/reports/top-genres" exact component={ReportTopGenres} />
|
||||
</Switch>
|
||||
<Routes>
|
||||
<Route path="/" />
|
||||
<Route path="/login/success" element={<LoginSuccess />} />
|
||||
<Route path="/login/failure" element={<LoginFailure />} />
|
||||
<Route path="/listens" element={<RecentListens />} />
|
||||
<Route path="/reports/listens" element={<ReportListens />} />
|
||||
<Route path="/reports/top-artists" element={<ReportTopArtists />} />
|
||||
<Route path="/reports/top-albums" element={<ReportTopAlbums />} />
|
||||
<Route path="/reports/top-tracks" element={<ReportTopTracks />} />
|
||||
<Route path="/reports/top-genres" element={<ReportTopGenres />} />
|
||||
</Routes>
|
||||
</main>
|
||||
<footer>
|
||||
<Footer />
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
|
||||
export const LoginSuccess: React.FC = () => {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { format, formatDistanceToNow } from "date-fns";
|
||||
import React, { useEffect, useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import { Listen } from "../api/entities/listen";
|
||||
import { useRecentListens } from "../hooks/use-api";
|
||||
import { useAuth } from "../hooks/use-auth";
|
||||
|
|
@ -27,7 +27,7 @@ export const RecentListens: React.FC = () => {
|
|||
}, [totalPages, paginationMeta]);
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { format, getTime } from "date-fns";
|
||||
import React, { useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import {
|
||||
Area,
|
||||
AreaChart,
|
||||
|
|
@ -22,8 +22,9 @@ import { ReportTimeOptions } from "./ReportTimeOptions";
|
|||
export const ReportListens: React.FC = () => {
|
||||
const { user } = useAuth();
|
||||
|
||||
const [timeFrame, setTimeFrame] =
|
||||
useState<"day" | "week" | "month" | "year">("day");
|
||||
const [timeFrame, setTimeFrame] = useState<"day" | "week" | "month" | "year">(
|
||||
"day"
|
||||
);
|
||||
|
||||
const [timeOptions, setTimeOptions] = useState<TimeOptions>({
|
||||
timePreset: TimePreset.LAST_7_DAYS,
|
||||
|
|
@ -41,7 +42,7 @@ export const ReportListens: React.FC = () => {
|
|||
const reportHasItems = !isLoading && report.length !== 0;
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import { Album } from "../api/entities/album";
|
||||
import { TimeOptions } from "../api/entities/time-options";
|
||||
import { TimePreset } from "../api/entities/time-preset.enum";
|
||||
|
|
@ -31,7 +31,7 @@ export const ReportTopAlbums: React.FC = () => {
|
|||
const maxCount = getMaxCount(topAlbums);
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import { TimeOptions } from "../api/entities/time-options";
|
||||
import { TimePreset } from "../api/entities/time-preset.enum";
|
||||
import { useTopArtists } from "../hooks/use-api";
|
||||
|
|
@ -30,7 +30,7 @@ export const ReportTopArtists: React.FC = () => {
|
|||
const maxCount = getMaxCount(topArtists);
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import { Artist } from "../api/entities/artist";
|
||||
import { Genre } from "../api/entities/genre";
|
||||
import { TimeOptions } from "../api/entities/time-options";
|
||||
|
|
@ -33,7 +33,7 @@ export const ReportTopGenres: React.FC = () => {
|
|||
const reportHasItems = !isLoading && topGenres.length !== 0;
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
const maxCount = getMaxCount(topGenres);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useMemo, useState } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import { TimeOptions } from "../api/entities/time-options";
|
||||
import { TimePreset } from "../api/entities/time-preset.enum";
|
||||
import { Track } from "../api/entities/track";
|
||||
|
|
@ -30,7 +30,7 @@ export const ReportTopTracks: React.FC = () => {
|
|||
const reportHasItems = !isLoading && topTracks.length !== 0;
|
||||
|
||||
if (!user) {
|
||||
return <Redirect to="/" />;
|
||||
return <Navigate to="/" replace />;
|
||||
}
|
||||
|
||||
const maxCount = getMaxCount(topTracks);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue