wip

johnstcn · johnstcn · commit 3a5932c621b5 · 2023-11-17T09:10:02.000Z
diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -1565,9 +1565,10 @@ export const getInsightsTemplate = async (
   return response.data;
 };
 
-export const getHealth = async () => {
+export const getHealth = async (forced: boolean = false) => {
+  const params = new URLSearchParams({ forced: forced.toString() });
   const response = await axios.get<TypesGen.HealthcheckReport>(
-    "/api/v2/debug/health",
+    `/api/v2/debug/health?${params}`,
   );
   return response.data;
 };
diff --git a/site/src/api/queries/deployment.ts b/site/src/api/queries/deployment.ts
@@ -24,7 +24,7 @@ export const deploymentStats = () => {
 export const health = () => {
   return {
     queryKey: ["deployment", "health"],
-    queryFn: API.getHealth,
+    queryFn: () => API.getHealth(false),
   };
 };
 
diff --git a/site/src/pages/HealthPage/HealthPage.tsx b/site/src/pages/HealthPage/HealthPage.tsx
@@ -1,6 +1,6 @@
 import { type Interpolation, type Theme } from "@emotion/react";
 import Box from "@mui/material/Box";
-import { useQuery } from "react-query";
+import { useQuery, useMutation } from "react-query";
 import { getHealth } from "api/api";
 import { Loader } from "components/Loader/Loader";
 import { useTab } from "hooks";
@@ -19,6 +19,9 @@ import {
 import { Stats, StatsItem } from "components/Stats/Stats";
 import { createDayString } from "utils/createDayString";
 import { DashboardFullPage } from "components/Dashboard/DashboardLayout";
+import { LoadingButton } from "@mui/lab";
+import ReplayIcon from "@mui/icons-material/Replay";
+import { FC } from "react";
 
 const sections = {
   derp: "DERP",
@@ -32,8 +35,9 @@ export default function HealthPage() {
   const { data: healthStatus } = useQuery({
     queryKey: ["health"],
     queryFn: () => getHealth(),
-    refetchInterval: 120_000,
+    refetchInterval: 30_000,
   });
+  const mutation = useMutation({})
 
   return (
     <>
@@ -103,6 +107,12 @@ export function HealthPageView({
             value={healthStatus.coder_version}
           />
         </Stats>
+        <RefreshButton
+          loading={false}
+          handleAction={() => {
+            console.log("refresh");
+          }}
+        />
       </FullWidthPageHeader>
       <Box
         sx={{
@@ -237,3 +247,25 @@ const styles = {
     },
   },
 } satisfies Record<string, Interpolation<Theme>>;
+
+interface HealthcheckAction {
+  handleAction: () => void;
+  loading: boolean;
+}
+
+export const RefreshButton: FC<HealthcheckAction> = ({
+  handleAction,
+  loading,
+}) => {
+  return (
+    <LoadingButton
+      loading={loading}
+      loadingPosition="start"
+      data-testid="healthcheck-refresh-button"
+      startIcon={<ReplayIcon />}
+      onClick={handleAction}
+    >
+      {loading ? <>Refreshing&hellip;</> : <>Refresh</>}
+    </LoadingButton>
+  );
+};
