From f62350fea093756450dce8cdee5de971e39dd41d Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Mon, 14 Jul 2025 16:26:34 -0700
Subject: [PATCH] add refresh button

---
 client/src/Hooks/logHooks.js                | 28 ++++++++++++---------
 client/src/Pages/Logs/Diagnostics/index.jsx | 14 +++++++++--
 2 files changed, 28 insertions(+), 14 deletions(-)

diff --git a/client/src/Hooks/logHooks.js b/client/src/Hooks/logHooks.js
index 4b8657cbf..b954efb4b 100644
--- a/client/src/Hooks/logHooks.js
+++ b/client/src/Hooks/logHooks.js
@@ -89,22 +89,26 @@ const useFetchDiagnostics = () => {
 	const [error, setError] = useState(undefined);
 	const [diagnostics, setDiagnostics] = useState(undefined);
 
+	const fetchDiagnostics = async () => {
+		try {
+			setIsLoading(true);
+			const response = await networkService.getDiagnostics();
+			setDiagnostics(response.data.data);
+		} catch (error) {
+			createToast({
+				body: error.message,
+			});
+			setError(error);
+		} finally {
+			setIsLoading(false);
+		}
+	};
+
 	useEffect(() => {
-		const fetchDiagnostics = async () => {
-			try {
-				setIsLoading(true);
-				const response = await networkService.getDiagnostics();
-				setDiagnostics(response.data.data);
-			} catch (error) {
-				setError(error);
-			} finally {
-				setIsLoading(false);
-			}
-		};
 		fetchDiagnostics();
 	}, []);
 
-	return [diagnostics, isLoading, error];
+	return [diagnostics, fetchDiagnostics, isLoading, error];
 };
 
 export { useFetchLogs, useFetchQueueData, useFlushQueue, useFetchDiagnostics };
diff --git a/client/src/Pages/Logs/Diagnostics/index.jsx b/client/src/Pages/Logs/Diagnostics/index.jsx
index e000c05bc..7c5d1f5a9 100644
--- a/client/src/Pages/Logs/Diagnostics/index.jsx
+++ b/client/src/Pages/Logs/Diagnostics/index.jsx
@@ -4,9 +4,9 @@ import Typography from "@mui/material/Typography";
 import Gauges from "./components/gauges";
 import Stats from "./components/stats";
 import Divider from "@mui/material/Divider";
+import Button from "@mui/material/Button";
 
 import { useTheme } from "@emotion/react";
-import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useFetchDiagnostics } from "../../../Hooks/logHooks";
 
@@ -16,7 +16,7 @@ const Diagnostics = () => {
 	// Hooks
 	const theme = useTheme();
 	const { t } = useTranslation();
-	const [diagnostics, isLoading, error] = useFetchDiagnostics();
+	const [diagnostics, fetchDiagnostics, isLoading, error] = useFetchDiagnostics();
 	// Setup
 	return (
 		<Stack gap={theme.spacing(4)}>
@@ -36,6 +36,16 @@ const Diagnostics = () => {
 					diagnostics={diagnostics}
 					isLoading={isLoading}
 				/>
+				<Box>
+					<Button
+						variant="contained"
+						color="accent"
+						onClick={fetchDiagnostics}
+						loading={isLoading}
+					>
+						Fetch Diagnostics
+					</Button>
+				</Box>
 			</Stack>
 		</Stack>
 	);