refresh button on monitor
1 changed file+45−22
web-ui/src/pages/Monitor.tsxmodified+45−22View file
@@ -24,29 +24,26 @@ export default function Monitor() {
2424 const [error, setError] = useState<string | null>(null);
2525 const [loading, setLoading] = useState(true);
2626
27- useEffect(() => {
28- const fetchStatus = async () => {
29- try {
30- const response = await axios.get(
31- "https://tempory.net/f/memobin/benchmark_status/current.json",
32- );
33- setStatus(response.data);
34- setError(null);
35- } catch (error) {
36- const message =
37- error instanceof Error ? error.message : "Failed to fetch status";
38- setError(message);
39- console.error("Error fetching benchmark status:", error);
40- } finally {
41- setLoading(false);
42- }
43- };
27+ const fetchStatus = async () => {
28+ setLoading(true);
29+ try {
30+ const response = await axios.get(
31+ "https://tempory.net/f/memobin/benchmark_status/current.json",
32+ );
33+ setStatus(response.data);
34+ setError(null);
35+ } catch (error) {
36+ const message =
37+ error instanceof Error ? error.message : "Failed to fetch status";
38+ setError(message);
39+ console.error("Error fetching benchmark status:", error);
40+ } finally {
41+ setLoading(false);
42+ }
43+ };
4444
45- // Fetch immediately and then every 30 seconds
45+ useEffect(() => {
4646 fetchStatus();
47- const interval = setInterval(fetchStatus, 30000);
48-
49- return () => clearInterval(interval);
5047 }, []);
5148
5249 if (loading) {
@@ -70,7 +67,33 @@ export default function Monitor() {
7067
7168 return (
7269 <div style={{ padding: "20px" }}>
73- <h1>Benchmark Progress</h1>
70+ <div
71+ style={{
72+ display: "flex",
73+ alignItems: "center",
74+ gap: "20px",
75+ marginBottom: "20px",
76+ }}
77+ >
78+ <h1 style={{ margin: 0 }}>Benchmark Progress</h1>
79+ <button
80+ onClick={fetchStatus}
81+ style={{
82+ padding: "8px 16px",
83+ backgroundColor: "#4CAF50",
84+ color: "white",
85+ border: "none",
86+ borderRadius: "4px",
87+ cursor: "pointer",
88+ display: "flex",
89+ alignItems: "center",
90+ gap: "8px",
91+ }}
92+ disabled={loading}
93+ >
94+ {loading ? "Refreshing..." : "Refresh"}
95+ </button>
96+ </div>
7497
7598 <div style={{ marginBottom: "20px" }}>
7699 <h2>Current Status</h2>