diff --git a/src/app/[orgId]/settings/resources/proxy/[niceId]/general/page.tsx b/src/app/[orgId]/settings/resources/proxy/[niceId]/general/page.tsx index 9589f6a2e..5f47e1938 100644 --- a/src/app/[orgId]/settings/resources/proxy/[niceId]/general/page.tsx +++ b/src/app/[orgId]/settings/resources/proxy/[niceId]/general/page.tsx @@ -62,6 +62,7 @@ import { GetResourceResponse } from "@server/routers/resource/getResource"; import type { ResourceContextType } from "@app/contexts/resourceContext"; import { usePaidStatus } from "@app/hooks/usePaidStatus"; import { tierMatrix } from "@server/lib/billing/tierMatrix"; +import UptimeBar from "@app/components/UptimeBar"; type MaintenanceSectionFormProps = { resource: GetResourceResponse; @@ -578,6 +579,19 @@ export default function GeneralForm() { return ( <> + + + Uptime + + Site availability over the last 90 days. + + + + {resource?.resourceId && ( + + )} + + diff --git a/src/app/[orgId]/settings/sites/[niceId]/general/page.tsx b/src/app/[orgId]/settings/sites/[niceId]/general/page.tsx index 93114c5b2..3527e41cb 100644 --- a/src/app/[orgId]/settings/sites/[niceId]/general/page.tsx +++ b/src/app/[orgId]/settings/sites/[niceId]/general/page.tsx @@ -113,6 +113,19 @@ export default function GeneralPage() { return ( + + + Uptime + + Site availability over the last 90 days. + + + + {site?.siteId && ( + + )} + + @@ -225,19 +238,6 @@ export default function GeneralPage() { - - - Uptime - - Site availability over the last 90 days. - - - - {site?.siteId && ( - - )} - - ); } diff --git a/src/components/ProxyResourcesTable.tsx b/src/components/ProxyResourcesTable.tsx index 2990445b0..119ba9cab 100644 --- a/src/components/ProxyResourcesTable.tsx +++ b/src/components/ProxyResourcesTable.tsx @@ -516,7 +516,7 @@ export default function ProxyResourcesTable({ }, { id: "statusHistory", - friendlyName: t("statusHistory"), + friendlyName: t("uptime30d"), header: () => {t("statusHistory")}, cell: ({ row }) => { const resourceRow = row.original; diff --git a/src/components/UptimeBar.tsx b/src/components/UptimeBar.tsx index d2f29b760..636d536e9 100644 --- a/src/components/UptimeBar.tsx +++ b/src/components/UptimeBar.tsx @@ -47,6 +47,7 @@ const barColorClass: Record = { type UptimeBarProps = { orgId?: string; siteId?: number; + resourceId?: number; healthCheckId?: number; days?: number; title?: string; @@ -56,6 +57,7 @@ type UptimeBarProps = { export default function UptimeBar({ orgId, siteId, + resourceId, healthCheckId, days = 90, title, @@ -71,11 +73,20 @@ export default function UptimeBar({ const hcQuery = useQuery({ ...orgQueries.healthCheckStatusHistory({ orgId: orgId ?? "", healthCheckId: healthCheckId ?? 0, days }), - enabled: healthCheckId != null && siteId == null, + enabled: healthCheckId != null && siteId == null && resourceId == null, meta: { api } }); - const { data, isLoading } = siteId != null ? siteQuery : hcQuery; + const resourceQuery = useQuery({ + ...orgQueries.resourceStatusHistory({ resourceId, days }), + enabled: resourceId != null && siteId == null && healthCheckId == null, + meta: { api } + }); + + const { data, isLoading } = + siteId != null ? siteQuery : + resourceId != null ? resourceQuery : + hcQuery; if (isLoading) { return ( diff --git a/src/lib/queries.ts b/src/lib/queries.ts index 7380bfd66..c4b0a4bce 100644 --- a/src/lib/queries.ts +++ b/src/lib/queries.ts @@ -323,6 +323,23 @@ export const orgQueries = { } }), + resourceStatusHistory: ({ + resourceId, + days = 90 + }: { + resourceId?: number; + days?: number; + }) => + queryOptions({ + queryKey: ["RESOURCE_STATUS_HISTORY", resourceId, days] as const, + queryFn: async ({ signal, meta }) => { + const res = await meta!.api.get< + AxiosResponse + >(`/resource/${resourceId}/status-history?days=${days}`, { signal }); + return res.data.data; + } + }), + healthCheckStatusHistory: ({ orgId, healthCheckId,