diff --git a/vinvoor/src/App.tsx b/vinvoor/src/App.tsx index c574d4d..d8b3b94 100644 --- a/vinvoor/src/App.tsx +++ b/vinvoor/src/App.tsx @@ -8,7 +8,7 @@ import { UserContext } from "./providers/UserProvider"; import { WelcomePage } from "./WelcomePage"; export const App = () => { - const { user, loading } = useContext(UserContext); + const { user, loading, error } = useContext(UserContext); const outlet = useOutlet(); @@ -16,7 +16,7 @@ export const App = () => { <> - + {user !== undefined ? ( outlet !== null ? ( diff --git a/vinvoor/src/cards/Cards.tsx b/vinvoor/src/cards/Cards.tsx index a912ce2..4bc0495 100644 --- a/vinvoor/src/cards/Cards.tsx +++ b/vinvoor/src/cards/Cards.tsx @@ -4,10 +4,10 @@ import { CardsEmpty } from "./CardsEmpty"; import { CardsTable } from "./CardsTable"; export const Cards = () => { - const { data: cards, isLoading } = useCards(); + const { data: cards, isLoading, isError } = useCards(); return ( - + {cards?.length ? : } ); diff --git a/vinvoor/src/components/LoadingSkeleton.tsx b/vinvoor/src/components/LoadingSkeleton.tsx index 69cec1c..cffe374 100644 --- a/vinvoor/src/components/LoadingSkeleton.tsx +++ b/vinvoor/src/components/LoadingSkeleton.tsx @@ -2,14 +2,19 @@ import { Skeleton, SkeletonProps } from "@mui/material"; import { FC, ReactNode } from "react"; interface LoadingSkeletonProps extends SkeletonProps { - loading: boolean; + isLoading: boolean; + isError: boolean; children: ReactNode; } export const LoadingSkeleton: FC = ({ - loading, + isLoading, + isError, children, ...props }) => { - return loading ? : children; + if (isError) + throw new Error("Error fetching data. Unable to reach the server"); + + return isLoading ? : <>{children}; }; diff --git a/vinvoor/src/hooks/useCard.ts b/vinvoor/src/hooks/useCard.ts index 6606f19..be621e1 100644 --- a/vinvoor/src/hooks/useCard.ts +++ b/vinvoor/src/hooks/useCard.ts @@ -8,6 +8,7 @@ export const useCards = () => useQuery({ queryKey: ["cards"], queryFn: () => getApi(ENDPOINT, convertCardJSON), + retry: 1, }); export const usePatchCards = () => { diff --git a/vinvoor/src/hooks/useDays.ts b/vinvoor/src/hooks/useDays.ts index 1653378..9df3290 100644 --- a/vinvoor/src/hooks/useDays.ts +++ b/vinvoor/src/hooks/useDays.ts @@ -8,6 +8,7 @@ export const useDays = () => useQuery({ queryKey: ["days"], queryFn: () => getApi(ENDPOINT, convertDayJSON), + retry: 1, }); export const useDeleteDay = () => { diff --git a/vinvoor/src/hooks/useLeaderboard.ts b/vinvoor/src/hooks/useLeaderboard.ts index 5571e36..5301b0f 100644 --- a/vinvoor/src/hooks/useLeaderboard.ts +++ b/vinvoor/src/hooks/useLeaderboard.ts @@ -16,4 +16,5 @@ export const useLeaderboardItems = () => ENDPOINT, convertLeaderboardItemJSON, ), + retry: 1, }); diff --git a/vinvoor/src/hooks/useScan.ts b/vinvoor/src/hooks/useScan.ts index 066d747..24ca8b7 100644 --- a/vinvoor/src/hooks/useScan.ts +++ b/vinvoor/src/hooks/useScan.ts @@ -8,4 +8,5 @@ export const useScans = () => useQuery({ queryKey: ["scans"], queryFn: () => getApi(ENDPOINT, convertScanJSON), + retry: 1, }); diff --git a/vinvoor/src/hooks/useSettings.ts b/vinvoor/src/hooks/useSettings.ts index c66c502..d621d49 100644 --- a/vinvoor/src/hooks/useSettings.ts +++ b/vinvoor/src/hooks/useSettings.ts @@ -8,6 +8,7 @@ export const useSettings = () => useQuery({ queryKey: ["settings"], queryFn: () => getApi(ENDPOINT, converSettingsJSON), + retry: 1, }); export const usePatchSettings = () => { diff --git a/vinvoor/src/leaderboard/Leaderboard.tsx b/vinvoor/src/leaderboard/Leaderboard.tsx index ba25402..2419c31 100644 --- a/vinvoor/src/leaderboard/Leaderboard.tsx +++ b/vinvoor/src/leaderboard/Leaderboard.tsx @@ -5,10 +5,10 @@ import { LeaderboardTableToolbar } from "./LeaderboardTableToolbar"; import { useLeaderboardItems } from "../hooks/useLeaderboard"; export const Leaderboard = () => { - const { isLoading } = useLeaderboardItems(); + const { isLoading, isError } = useLeaderboardItems(); return ( - + diff --git a/vinvoor/src/overview/Overview.tsx b/vinvoor/src/overview/Overview.tsx index c67f9d5..3f4ce28 100644 --- a/vinvoor/src/overview/Overview.tsx +++ b/vinvoor/src/overview/Overview.tsx @@ -12,7 +12,7 @@ import { Streak } from "./streak/Streak"; import { useScans } from "../hooks/useScan"; export const Overview = () => { - const { data: scans, isLoading } = useScans(); + const { data: scans, isLoading, isError } = useScans(); const [checked, setChecked] = useState(false); const daysRef = useRef(null); const [paperHeight, setPaperHeight] = useState(0); @@ -27,7 +27,7 @@ export const Overview = () => { }); return ( - + {scans?.length ? ( diff --git a/vinvoor/src/providers/UserProvider.tsx b/vinvoor/src/providers/UserProvider.tsx index 1f2e312..93fc6d6 100644 --- a/vinvoor/src/providers/UserProvider.tsx +++ b/vinvoor/src/providers/UserProvider.tsx @@ -2,7 +2,7 @@ import Cookies from "js-cookie"; import { createContext, FC, ReactNode, useEffect, useState } from "react"; import { Optional } from "../types/general"; import { User } from "../types/user"; -import { getApi } from "../util/fetch"; +import { getApi, isResponseNot200Error } from "../util/fetch"; interface UserProviderProps { children: ReactNode; @@ -10,16 +10,12 @@ interface UserProviderProps { interface UserContextProps { user?: User; - invalidateUser: (error: Error) => void; loading: boolean; error?: Error; } const defaultUserContextProps: UserContextProps = { user: undefined, - invalidateUser: () => { - // No operation, placeholder function - }, loading: true, error: undefined, }; @@ -33,17 +29,11 @@ export const UserProvider: FC = ({ children }) => { const [loading, setLoading] = useState(true); const [error, setError] = useState>(undefined); - const invalidateUser = (error?: Error) => { - setUser(undefined); - setError(error); - }; - useEffect(() => { const sessionId = Cookies.get("session_id"); if (!sessionId) { setLoading(false); - setError(new Error("No session ID")); return; } @@ -53,7 +43,7 @@ export const UserProvider: FC = ({ children }) => { .catch(error => { Cookies.remove("session_id"); setUser(undefined); - setError(error as Error); + if (!isResponseNot200Error(error)) setError(error as Error); }) .finally(() => { setLoading(false); @@ -61,7 +51,7 @@ export const UserProvider: FC = ({ children }) => { }, []); return ( - + {children} ); diff --git a/vinvoor/src/scans/Scans.tsx b/vinvoor/src/scans/Scans.tsx index c784be0..e580d35 100644 --- a/vinvoor/src/scans/Scans.tsx +++ b/vinvoor/src/scans/Scans.tsx @@ -6,11 +6,14 @@ import { useScans } from "../hooks/useScan"; import { useCards } from "../hooks/useCard"; export const Scans = () => { - const { isLoading: isLoadingScans } = useScans(); - const { isLoading: isLoadingCards } = useCards(); + const { isLoading: isLoadingScans, isError: isErrorScans } = useScans(); + const { isLoading: isLoadingCards, isError: isErrorCards } = useCards(); return ( - + diff --git a/vinvoor/src/settings/SettingsOverview.tsx b/vinvoor/src/settings/SettingsOverview.tsx index a50de0b..110143e 100644 --- a/vinvoor/src/settings/SettingsOverview.tsx +++ b/vinvoor/src/settings/SettingsOverview.tsx @@ -3,10 +3,10 @@ import { useSettings } from "../hooks/useSettings"; import { Settings } from "./Settings"; export const SettingsOverview = () => { - const { isLoading } = useSettings(); + const { isLoading, isError } = useSettings(); return ( - + ); diff --git a/vinvoor/src/settings/admin/days/Days.tsx b/vinvoor/src/settings/admin/days/Days.tsx index 3c7bdcd..704bc6c 100644 --- a/vinvoor/src/settings/admin/days/Days.tsx +++ b/vinvoor/src/settings/admin/days/Days.tsx @@ -5,10 +5,10 @@ import { DaysTable } from "./DaysTable"; import { useDays } from "../../../hooks/useDays"; export const Days = () => { - const { isLoading } = useDays(); + const { isLoading, isError } = useDays(); return ( - +