diff --git a/client/src/Pages/StatusPage/Status/Components/HeaderStatusPageControls.tsx b/client/src/Pages/StatusPage/Status/Components/HeaderStatusPageControls.tsx index 2cc2395bb..ba3a5940d 100644 --- a/client/src/Pages/StatusPage/Status/Components/HeaderStatusPageControls.tsx +++ b/client/src/Pages/StatusPage/Status/Components/HeaderStatusPageControls.tsx @@ -8,7 +8,7 @@ import { Settings, ExternalLink } from "lucide-react"; import { useTheme } from "@mui/material"; import { useTranslation } from "react-i18next"; import { useNavigate } from "react-router-dom"; -import type { StatusPage } from "@/Types/StatusPage"; +import { PUBLIC_STATUS_PAGE_PREFIX, type StatusPage } from "@/Types/StatusPage"; interface HeaderStatusPageControlsProps { isAdmin: boolean; @@ -50,7 +50,7 @@ export const HeaderStatusPageControls = ({ { window.open( - `/status/public/${statusPage.url}`, + `${PUBLIC_STATUS_PAGE_PREFIX}/${statusPage.url}`, "_blank", "noopener,noreferrer" ); diff --git a/client/src/Pages/StatusPage/Status/index.tsx b/client/src/Pages/StatusPage/Status/index.tsx index 1f9cca9ee..a3a535ace 100644 --- a/client/src/Pages/StatusPage/Status/index.tsx +++ b/client/src/Pages/StatusPage/Status/index.tsx @@ -9,8 +9,13 @@ import { useIsAdmin } from "@/Hooks/useIsAdmin"; import { useLocation, useParams } from "react-router-dom"; import { useGet } from "@/Hooks/UseApi"; import type { Monitor } from "@/Types/Monitor"; -import type { StatusPage, StatusPageResponse, StatusPageTheme } from "@/Types/StatusPage"; import { resolveStatusPageTheme } from "@/Types/StatusPage"; +import { + PUBLIC_STATUS_PAGE_PREFIX, + type StatusPage, + type StatusPageResponse, + type StatusPageTheme, +} from "@/Types/StatusPage"; import { HeaderStatusPageControls } from "./Components/HeaderStatusPageControls"; import { StatusPageThemeProvider } from "./themes/StatusPageThemeProvider"; import { RefinedStatusPage } from "./themes/refined/RefinedStatusPage"; @@ -40,7 +45,8 @@ const StatusPageView = () => { const { url } = useParams(); const isAdmin = useIsAdmin(); const location = useLocation(); - const isPublic = location.pathname.startsWith("/status/public"); + + const isPublic = location.pathname.startsWith(PUBLIC_STATUS_PAGE_PREFIX); const apiUrl = url ? `/status-page/${url}?type=uptime&type=infrastructure` : null; @@ -105,8 +111,7 @@ const StatusPageView = () => { ); } - // Admin preview: wrap in a mock browser frame inside the admin shell. - const publicUrl = `${window.location.origin}/status/public/${statusPage.url}`; + const publicUrl = `${window.location.origin}${PUBLIC_STATUS_PAGE_PREFIX}/${statusPage.url}`; return ( { if (row.isPublished) { e.stopPropagation(); - const url = `/status/public/${row.url}`; + const url = `${PUBLIC_STATUS_PAGE_PREFIX}/${row.url}`; window.open(url, "_blank", "noopener,noreferrer"); } }; diff --git a/client/src/Types/StatusPage.ts b/client/src/Types/StatusPage.ts index 22b215ced..fe47821c5 100644 --- a/client/src/Types/StatusPage.ts +++ b/client/src/Types/StatusPage.ts @@ -38,6 +38,7 @@ export const resolveStatusPageThemeMode = ( value: string | null | undefined ): StatusPageThemeMode => STATUS_PAGE_THEME_MODES.find((m) => m === value) ?? DEFAULT_STATUS_PAGE_THEME_MODE; +export const PUBLIC_STATUS_PAGE_PREFIX = "/status/public"; export interface StatusPage { id: string;