fix: keep session when refresh fails on network error or 5xx (WealthLedger/frontend#97)

src/app/routes/RouteGuards.tsx

@@ -1,4 +1,7 @@
+import { Button, Container } from "@mantine/core";
+import { StateView } from "@wealthledger/ui";
 import { type FC, type PropsWithChildren, useState } from "react";
+import { useTranslation } from "react-i18next";
 import { Navigate, useLocation } from "react-router";
 
 import { useAuth } from "@/features/auth";
@@ -7,12 +10,26 @@ import { RouteSkeleton } from "./RouteFallback";
 
 const Protected: FC<PropsWithChildren> = (props) => {
 	const { children } = props;
-	const { ready, signedOut, user } = useAuth();
+	const { ready, retry, signedOut, unavailable, user } = useAuth();
+	const { t } = useTranslation();
 	const location = useLocation();
 	const [wasAuthenticated, setWasAuthenticated] = useState(false);
 	if (user && !wasAuthenticated) setWasAuthenticated(true);
 	if (!ready) return <RouteSkeleton variant="shell" />;
 
+	// The server was unreachable (e.g. mid-deploy), so the session is unproven, not gone.
+	if (!user && unavailable)
+		return (
+			<Container py="xl" size={560}>
+				<StateView
+					action={<Button onClick={retry}>{t("auth.retry")}</Button>}
+					error
+					text={t("auth.unavailableText")}
+					title={t("auth.unavailableTitle")}
+				/>
+			</Container>
+		);
+
 	const loginState = signedOut && wasAuthenticated
 		? undefined
 		: { returnTo: `${location.pathname}${location.search}` };