diff --git a/packages/scorekeeper-status-ui/src/App.tsx b/packages/scorekeeper-status-ui/src/App.tsx index 51366e574..a0dc8dc8d 100644 --- a/packages/scorekeeper-status-ui/src/App.tsx +++ b/packages/scorekeeper-status-ui/src/App.tsx @@ -23,6 +23,7 @@ import HealthCheckBar from "./HealthCheckBar"; import { Identicon } from "@polkadot/react-identicon"; import EraStatsBar from "./EraStatsBar"; import { debounce } from "lodash"; +import { REFRESH_INTERVAL } from "./Constants"; interface Job { name: string; @@ -50,7 +51,7 @@ const App = () => { const [jobs, setJobs] = useState([]); const [isLoading, setIsLoading] = useState(false); const [hasError, setHasError] = useState(false); - const [refreshInterval, setRefreshInterval] = useState(500); // Default refresh interval + const [refreshInterval, setRefreshInterval] = useState(REFRESH_INTERVAL); // Default refresh interval const [nominators, setNominators] = useState([]); const fetchData = useCallback(async () => { @@ -66,17 +67,17 @@ const App = () => { })), ); setHasError(false); - setRefreshInterval(800); // Reset to faster refresh rate on success + setRefreshInterval(5000); // Reset to faster refresh rate on success } else { // Handle empty response console.log("Received empty response"); setHasError(true); - setRefreshInterval(5000); // Slow down the refresh rate + setRefreshInterval(REFRESH_INTERVAL); // Slow down the refresh rate } } catch (error) { console.error("Error fetching job data:", error); setHasError(true); - setRefreshInterval(5000); // Slow down the refresh rate on error + setRefreshInterval(REFRESH_INTERVAL); // Slow down the refresh rate on error // Provide more specific error handling if (error.response) { @@ -122,12 +123,12 @@ const App = () => { }, [currentEndpoint]); useEffect(() => { - const interval = setInterval(fetchData, 500); + const interval = setInterval(fetchData, REFRESH_INTERVAL); return () => clearInterval(interval); }, [fetchData]); useEffect(() => { - const interval = setInterval(fetchNominatorsData, 500); + const interval = setInterval(fetchNominatorsData, REFRESH_INTERVAL); return () => clearInterval(interval); }, [fetchNominatorsData]); diff --git a/packages/scorekeeper-status-ui/src/Constants.ts b/packages/scorekeeper-status-ui/src/Constants.ts new file mode 100644 index 000000000..d237de5a6 --- /dev/null +++ b/packages/scorekeeper-status-ui/src/Constants.ts @@ -0,0 +1 @@ +export const REFRESH_INTERVAL = 5000; diff --git a/packages/scorekeeper-status-ui/src/EraStatsBar.tsx b/packages/scorekeeper-status-ui/src/EraStatsBar.tsx index ff2f37f6e..cb1a1c551 100644 --- a/packages/scorekeeper-status-ui/src/EraStatsBar.tsx +++ b/packages/scorekeeper-status-ui/src/EraStatsBar.tsx @@ -7,6 +7,7 @@ import { FiServer, FiUserCheck, } from "react-icons/fi"; +import { REFRESH_INTERVAL } from "./Constants"; const EraStatsBar = ({ currentEndpoint }) => { const [eraStats, setEraStats] = useState({ @@ -29,7 +30,7 @@ const EraStatsBar = ({ currentEndpoint }) => { } }; - const interval = setInterval(fetchEraStats, 500); + const interval = setInterval(fetchEraStats, REFRESH_INTERVAL); return () => clearInterval(interval); }, [currentEndpoint]); diff --git a/packages/scorekeeper-status-ui/src/HealthCheckBar.tsx b/packages/scorekeeper-status-ui/src/HealthCheckBar.tsx index d7684c201..ebf443ba8 100644 --- a/packages/scorekeeper-status-ui/src/HealthCheckBar.tsx +++ b/packages/scorekeeper-status-ui/src/HealthCheckBar.tsx @@ -6,7 +6,8 @@ import { FiClock, FiInfo, FiWifi, -} from "react-icons/fi"; // Added FiClock for the uptime icon +} from "react-icons/fi"; +import { REFRESH_INTERVAL } from "./Constants"; // Added FiClock for the uptime icon const HealthCheckBar = ({ currentEndpoint }) => { const [healthData, setHealthData] = useState({ @@ -28,7 +29,7 @@ const HealthCheckBar = ({ currentEndpoint }) => { } }; - const interval = setInterval(fetchHealthData, 500); + const interval = setInterval(fetchHealthData, REFRESH_INTERVAL); return () => clearInterval(interval); }, [currentEndpoint]);