Fix [Jobs and Workflows] auto refresh requests are sent regardless of…

… previous request status (#2546)
mlrun · Jun 23, 2024 · 5ae8ee1 · 5ae8ee1
1 parent ad0be1a
commit 5ae8ee1
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 29 deletions.
diff --git a/src/components/FilterMenu/FilterMenu.js b/src/components/FilterMenu/FilterMenu.js
@@ -62,17 +62,18 @@ import detailsActions from '../../actions/details'
 import './filterMenu.scss'
 
 const FilterMenu = ({
-  actionButton,
-  cancelRequest,
-  enableAutoRefresh,
-  expand,
+  actionButton = null,
+  autoRefreshIsEnabled = false,
+  autoRefreshIsStopped = false,
+  cancelRequest = () => {},
+  expand = false,
   filters,
-  handleExpandAll,
-  hidden,
+  handleExpandAll = () => {},
+  hidden = false,
   onChange,
   page,
-  tab,
-  withoutExpandButton
+  tab = '',
+  withoutExpandButton = false
 }) => {
   const [labels, setLabels] = useState('')
   const [name, setName] = useState('')
@@ -334,13 +335,16 @@ const FilterMenu = ({
   }, [params.pageTab, params.projectName, page, dispatch])
 
   useEffect(() => {
-    if (enableAutoRefresh && autoRefresh === AUTO_REFRESH_ID && !hidden) {
+    if (autoRefreshIsEnabled && autoRefresh === AUTO_REFRESH_ID && !hidden) {
       const intervalId = setInterval(() => {
-        applyChanges(filtersStore, true)
+        if (!autoRefreshIsStopped) {
+          applyChanges(filtersStore, true)
+        }
       }, 30000)
+
       return () => clearInterval(intervalId)
     }
-  }, [autoRefresh, hidden, enableAutoRefresh, filtersStore, applyChanges])
+  }, [autoRefresh, hidden, autoRefreshIsEnabled, filtersStore, applyChanges, autoRefreshIsStopped])
 
   const getFilterTemplate = useCallback(
     filter => {
@@ -495,7 +499,7 @@ const FilterMenu = ({
         ))}
 
         <div className="actions">
-          {enableAutoRefresh && (
+          {autoRefreshIsEnabled && (
             <CheckBox
               key={AUTO_REFRESH_ID}
               item={{ label: AUTO_REFRESH, id: AUTO_REFRESH_ID }}
@@ -525,23 +529,11 @@ const FilterMenu = ({
   )
 }
 
-FilterMenu.defaultProps = {
-  actionButton: null,
-  cancelRequest: () => {},
-  changes: {},
-  enableAutoRefresh: false,
-  expand: false,
-  handleExpandAll: () => {},
-  hidden: false,
-  tab: '',
-  withoutExpandButton: false
-}
-
 FilterMenu.propTypes = {
   actionButton: PropTypes.shape({}),
+  autoRefreshIsEnabled: PropTypes.bool,
+  autoRefreshIsStopped: PropTypes.bool,
   cancelRequest: PropTypes.func,
-  changes: PropTypes.shape({}),
-  enableAutoRefresh: PropTypes.bool,
   expand: PropTypes.bool,
   filters: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   handleExpandAll: PropTypes.func,

diff --git a/src/components/Jobs/MonitorJobs/MonitorJobs.js b/src/components/Jobs/MonitorJobs/MonitorJobs.js
@@ -47,12 +47,13 @@ const MonitorJobs = ({ fetchAllJobRuns, fetchJobs }) => {
   const [dataIsLoaded, setDataIsLoaded] = useState(false)
   const appStore = useSelector(store => store.appStore)
   const filtersStore = useSelector(store => store.filtersStore)
+  const jobsStore = useSelector(store => store.jobsStore)
   const [largeRequestErrorMessage, setLargeRequestErrorMessage] = useState('')
   const params = useParams()
   const dispatch = useDispatch()
   const { isStagingMode } = useMode()
   const abortJobRef = useRef(null)
-  const { handleMonitoring } = React.useContext(JobsContext)
+  const { handleMonitoring, jobWizardIsOpened } = React.useContext(JobsContext)
   const abortControllerRef = useRef(new AbortController())
 
   const filters = useMemo(() => {
@@ -247,13 +248,15 @@ const MonitorJobs = ({ fetchAllJobRuns, fetchJobs }) => {
               disabled: !appStore.frontendSpec.jobs_dashboard_url,
               onClick: () => handleMonitoring()
             }}
+            autoRefreshIsEnabled
+            autoRefreshIsStopped={jobWizardIsOpened || jobsStore.loading}
             filters={filters}
             hidden={Boolean(params.jobId)}
             onChange={refreshJobs}
             page={JOBS_PAGE}
+
             tab={MONITOR_JOBS_TAB}
             withoutExpandButton
-            enableAutoRefresh
           />
         </div>
       </div>

diff --git a/tests/mockServer/mock.js b/tests/mockServer/mock.js
@@ -71,7 +71,7 @@ import nuclioAPIGateways from './data/nuclioAPIGateways.json'
 import nuclioStreams from './data/nuclioStreams.json'
 import { updateRuns } from './dateSynchronization.js'
 
-//updating values in files with synthetic data 
+//updating values in files with synthetic data
 updateRuns(runs)
 
 // Here we are configuring express to use body-parser as middle-ware.