Compare commits

...

2 Commits

Author SHA1 Message Date
Nicolas Mowen
463e93d36f Uppsercase model name 2026-01-09 08:51:57 -07:00
Josh Hawkins
495ee0161b prevent react Suspense crash during auth redirect
add redirect-check guards to stop rendering lazy routes while navigation is pending (fixes some users seeing React error #426 when auth expires)
2026-01-09 06:46:20 -06:00
3 changed files with 20 additions and 1 deletions

View File

@ -15,6 +15,7 @@ import { AuthProvider } from "@/context/auth-context";
import useSWR from "swr";
import { FrigateConfig } from "./types/frigateConfig";
import ActivityIndicator from "@/components/indicators/activity-indicator";
import { isRedirectingToLogin } from "@/api/auth-redirect";
const Live = lazy(() => import("@/pages/Live"));
const Events = lazy(() => import("@/pages/Events"));
@ -58,6 +59,16 @@ function DefaultAppView() {
? Object.keys(config.auth.roles)
: undefined;
// Show loading indicator during redirect to prevent React from attempting to render
// lazy components, which would cause error #426 (suspension during synchronous navigation)
if (isRedirectingToLogin()) {
return (
<div className="size-full overflow-hidden">
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
</div>
);
}
return (
<div className="size-full overflow-hidden">
{isDesktop && <Sidebar />}

View File

@ -28,6 +28,14 @@ export default function ProtectedRoute({
}
}, [auth.isLoading, auth.isAuthenticated, auth.user]);
// Show loading indicator during redirect to prevent React from attempting to render
// lazy components, which would cause error #426 (suspension during synchronous navigation)
if (isRedirectingToLogin()) {
return (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
);
}
if (auth.isLoading) {
return (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />

View File

@ -88,7 +88,7 @@ export default function ModelTrainingView({ model }: ModelTrainingViewProps) {
// title
useEffect(() => {
document.title = `${model.name} - ${t("documentTitle")}`;
document.title = `${model.name.toUpperCase()} - ${t("documentTitle")}`;
}, [model.name, t]);
// model state