administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-03-25 17:48:38 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

always render ProtectedRoute (handling undefined roles internally) and add Suspense fallback

Browse Source
This commit is contained in:
Josh Hawkins 2026-03-06 22:57:38 -06:00
parent 22056c3fc1
commit df59442cd0
2 changed files with 19 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
web/src/App.tsx
View File

@ -11,7 +11,6 @@ import { Redirect } from "./components/navigation/Redirect";
import { cn } from "./lib/utils"; import { cn } from "./lib/utils";
import { isPWA } from "./utils/isPWA"; import { isPWA } from "./utils/isPWA";
import ProtectedRoute from "@/components/auth/ProtectedRoute"; import ProtectedRoute from "@/components/auth/ProtectedRoute";
import { AuthProvider } from "@/context/auth-context";
import useSWR from "swr"; import useSWR from "swr";
import { FrigateConfig } from "./types/frigateConfig"; import { FrigateConfig } from "./types/frigateConfig";
import ActivityIndicator from "@/components/indicators/activity-indicator"; import ActivityIndicator from "@/components/indicators/activity-indicator";
@ -39,13 +38,11 @@ function App() {
return ( return (
<Providers> <Providers>
<AuthProvider> <BrowserRouter basename={window.baseUrl}>
<BrowserRouter basename={window.baseUrl}> <Wrapper>
<Wrapper> {config?.safe_mode ? <SafeAppView /> : <DefaultAppView />}
{config?.safe_mode ? <SafeAppView /> : <DefaultAppView />} </Wrapper>
</Wrapper> </BrowserRouter>
</BrowserRouter>
</AuthProvider>
</Providers> </Providers>
); );
} }
@ -85,17 +82,13 @@ function DefaultAppView() {
: "bottom-8 left-[52px]", : "bottom-8 left-[52px]",
)} )}
> >
<Suspense> <Suspense
fallback={
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
}
>
<Routes> <Routes>
<Route <Route element={<ProtectedRoute requiredRoles={mainRouteRoles} />}>
element={
mainRouteRoles ? (
<ProtectedRoute requiredRoles={mainRouteRoles} />
) : (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
)
}
>
<Route index element={<Live />} /> <Route index element={<Live />} />
<Route path="/review" element={<Events />} /> <Route path="/review" element={<Events />} />
<Route path="/explore" element={<Explore />} /> <Route path="/explore" element={<Explore />} />

9
web/src/components/auth/ProtectedRoute.tsx
View File

@ -10,7 +10,7 @@ import {
export default function ProtectedRoute({ export default function ProtectedRoute({
requiredRoles, requiredRoles,
}: { }: {
requiredRoles: string[]; requiredRoles?: string[];
}) { }) {
const { auth } = useContext(AuthContext); const { auth } = useContext(AuthContext);
@ -36,6 +36,13 @@ export default function ProtectedRoute({
); );
} }
// Wait for config to provide required roles
if (!requiredRoles) {
return (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
);
}
if (auth.isLoading) { if (auth.isLoading) {
return ( return (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" /> <ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />