diff --git a/web/frontend/src/components/Run/RunningStatus/AnalyticCharts/RunAnalyticCharts.js b/web/frontend/src/components/Run/RunningStatus/AnalyticCharts/RunAnalyticCharts.js index 8ed02bff..a19f87e5 100644 --- a/web/frontend/src/components/Run/RunningStatus/AnalyticCharts/RunAnalyticCharts.js +++ b/web/frontend/src/components/Run/RunningStatus/AnalyticCharts/RunAnalyticCharts.js @@ -44,7 +44,12 @@ const RunningTestAnalytics = ({ useEffect(() => { const interval = setInterval(async () => { // Checks is there any request that is made to API that should be finished before - if (autoRefresh && !isLoading && !isIntervalLoading) { + if ( + autoRefresh && + !isLoading && + !isIntervalLoading && + run.runStatus === runStatusModel.RUNNING + ) { setIsIntervalLoading(true); const metrics = await fetchMetrics(run.id, timeInterval); @@ -54,7 +59,14 @@ const RunningTestAnalytics = ({ }, updateChartsInterval); return () => clearInterval(interval); - }, [autoRefresh, isLoading, isIntervalLoading, run.id, timeInterval]); + }, [ + autoRefresh, + isLoading, + isIntervalLoading, + run.id, + timeInterval, + run.runStatus + ]); // Enable all tabs once Metrics are available useEffect(() => { diff --git a/web/frontend/src/components/Run/StatusMonitor/RunStatusMonitor.js b/web/frontend/src/components/Run/StatusMonitor/RunStatusMonitor.js index 472437ca..7a889131 100644 --- a/web/frontend/src/components/Run/StatusMonitor/RunStatusMonitor.js +++ b/web/frontend/src/components/Run/StatusMonitor/RunStatusMonitor.js @@ -4,19 +4,11 @@ import { fetchRunById } from "../../../lib/api/endpoints/run"; const RunStatusStepsMonitor = ({ runId, children }) => { const [isIntervalLoading, setIsIntervalLoading] = useState(false); - const [run, setRun] = useState(null); + const [run, setRun] = useState({ runStatus: "PENDING" }); const [isLoading, setIsLoading] = useState(true); const updateRunInterval = 5000; - const updateRunData = async (runIdToUpdate) => { - setIsIntervalLoading(true); - const runData = await fetchRunById(runIdToUpdate); - - setRun(runData); - setIsIntervalLoading(false); - }; - // The function is executed only first time to make page load const loadRunData = async (runIdToLoad) => { const runData = await fetchRunById(runIdToLoad); @@ -25,6 +17,24 @@ const RunStatusStepsMonitor = ({ runId, children }) => { setIsLoading(false); }; + const updateRunData = async (runIdToUpdate) => { + if ( + run?.runStatus === "PENDING" || + run?.runStatus === "CREATING" || + run?.runStatus === "RUNNING" + ) { + setIsIntervalLoading(true); + const runData = await fetchRunById(runIdToUpdate); + + setRun(runData); + setIsIntervalLoading(false); + } + }; + + useEffect(() => { + loadRunData(runId); + }, [runId]); + // Monitors runStatus to give real-time montoring about running test useEffect(() => { const interval = setInterval(() => { @@ -33,12 +43,9 @@ const RunStatusStepsMonitor = ({ runId, children }) => { }, updateRunInterval); return () => clearInterval(interval); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [runId, isIntervalLoading]); - useEffect(() => { - loadRunData(runId); - }, [runId]); - return children({ isLoading, run }); };