diff --git a/client/src/Pages/StatusPage/Status/index.tsx b/client/src/Pages/StatusPage/Status/index.tsx index 3c0408628..ae5b3d8ed 100644 --- a/client/src/Pages/StatusPage/Status/index.tsx +++ b/client/src/Pages/StatusPage/Status/index.tsx @@ -1,6 +1,6 @@ import { BasePage, BaseFallback } from "@/Components/design-elements"; import Typography from "@mui/material/Typography"; -import { Link } from "react-router-dom"; +import { Link, useSearchParams } from "react-router-dom"; import Stack from "@mui/material/Stack"; import Box from "@mui/material/Box"; @@ -9,7 +9,12 @@ import { useTranslation } from "react-i18next"; import { useIsAdmin } from "@/Hooks/useIsAdmin"; import { useLocation, useParams } from "react-router-dom"; import { useGet } from "@/Hooks/UseApi"; -import { resolveStatusPageTheme } from "@/Types/StatusPage"; +import { + isStatusPageRange, + resolveStatusPageTheme, + STATUS_PAGE_RANGES, + type StatusPageRange, +} from "@/Types/StatusPage"; import { PUBLIC_STATUS_PAGE_PREFIX, type StatusPageResponse, @@ -80,21 +85,26 @@ const StatusPageView = () => { const { url } = useParams(); const isAdmin = useIsAdmin(); const location = useLocation(); + const [searchParams, setSearchParams] = useSearchParams(); const onCustomDomainHost = isCustomDomainHost(); const isPublic = onCustomDomainHost || location.pathname.startsWith(PUBLIC_STATUS_PAGE_PREFIX); + const rawRange = searchParams.get("range"); + const range = isStatusPageRange(rawRange) ? rawRange : "latest"; + const apiUrl = buildStatusPageApiPath({ url, useCustomDomain: onCustomDomainHost, + range, }); const { data, isLoading, error } = useGet( apiUrl, {}, { - refreshInterval: 10000, + refreshInterval: range === "latest" ? 10000 : 60000, } ); diff --git a/client/src/Types/StatusPage.ts b/client/src/Types/StatusPage.ts index a69a3c737..89dd44782 100644 --- a/client/src/Types/StatusPage.ts +++ b/client/src/Types/StatusPage.ts @@ -32,6 +32,9 @@ export const STATUS_PAGE_RANGE_DAYS: Record< number > = { "30d": 30, "60d": 60, "90d": 90 }; +export const isStatusPageRange = (value: string | null): value is StatusPageRange => + STATUS_PAGE_RANGES.some((range) => range === value); + export const resolveStatusPageTheme = ( value: string | null | undefined ): StatusPageTheme =>