Fix [Feature store] features request not cancelled on FV creation (ml…

…run#2573)
ilan7empest · Jul 8, 2024 · 3dbd346 · 3dbd346
1 parent ae3e4f1
commit 3dbd346
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 24 deletions.
diff --git a/src/components/AddToFeatureVectorPage/AddToFeatureVectorPage.js b/src/components/AddToFeatureVectorPage/AddToFeatureVectorPage.js
@@ -30,13 +30,16 @@ import {
   GROUP_BY_NAME,
   GROUP_BY_NONE,
   TAG_FILTER_ALL_ITEMS,
-  REQUEST_CANCELED
+  REQUEST_CANCELED,
+  LARGE_REQUEST_CANCELED,
+  CANCEL_REQUEST_TIMEOUT
 } from '../../constants'
 import featureStoreActions from '../../actions/featureStore'
 import { FORBIDDEN_ERROR_STATUS_CODE } from 'igz-controls/constants'
 import { createFeaturesRowData } from '../../utils/createFeatureStoreContent'
 import { filters } from './addToFeatureVectorPage.util'
 import { getFeatureIdentifier } from '../../utils/getUniqueIdentifier'
+import { handleFeaturesResponse } from '../FeatureStore/Features/features.util'
 import { isEveryObjectValueEmpty } from '../../utils/isEveryObjectValueEmpty'
 import { setFilters } from '../../reducers/filtersReducer'
 import { setNotification } from '../../reducers/notificationReducer'
@@ -59,6 +62,7 @@ const AddToFeatureVectorPage = ({
 }) => {
   const [content, setContent] = useState([])
   const [selectedRowData, setSelectedRowData] = useState({})
+  const [largeRequestErrorMessage, setLargeRequestErrorMessage] = useState('')
   const [convertedYaml, toggleConvertedYaml] = useYaml('')
   const addToFeatureVectorPageRef = useRef(null)
   const abortControllerRef = useRef(new AbortController())
@@ -141,17 +145,24 @@ const AddToFeatureVectorPage = ({
     async filters => {
       abortControllerRef.current = new AbortController()
 
+      const cancelRequestTimeout = setTimeout(() => {
+        abortControllerRef.current.abort(LARGE_REQUEST_CANCELED)
+      }, CANCEL_REQUEST_TIMEOUT)
+
       const config = {
         signal: abortControllerRef.current.signal
       }
 
-      fetchFeatures(filters.project, filters, config).then(result => {
-        if (result) {
-          setContent(result)
-        }
-
-        return result
-      })
+      fetchFeatures(filters.project, filters, config)
+        .then(features => {
+          return handleFeaturesResponse(
+            features,
+            setContent,
+            abortControllerRef,
+            setLargeRequestErrorMessage
+          )
+        })
+        .finally(() => clearTimeout(cancelRequestTimeout))
     },
     [fetchFeatures]
   )
@@ -283,6 +294,7 @@ const AddToFeatureVectorPage = ({
       fetchData={fetchData}
       filtersStore={filtersStore}
       handleExpandRow={handleExpandRow}
+      largeRequestErrorMessage={largeRequestErrorMessage}
       pageData={pageData}
       ref={addToFeatureVectorPageRef}
       selectedRowData={selectedRowData}

diff --git a/src/components/AddToFeatureVectorPage/AddToFeatureVectorView.js b/src/components/AddToFeatureVectorPage/AddToFeatureVectorView.js
@@ -43,6 +43,7 @@ const AddToFeatureVectorView = React.forwardRef(
       fetchData,
       filtersStore,
       handleExpandRow,
+      largeRequestErrorMessage,
       pageData,
       selectedRowData,
       tableContent,
@@ -73,7 +74,7 @@ const AddToFeatureVectorView = React.forwardRef(
                 message={getNoDataMessage(
                   filtersStore,
                   filters,
-                  null,
+                  largeRequestErrorMessage,
                   FEATURE_STORE_PAGE,
                   ADD_TO_FEATURE_VECTOR_TAB
                 )}
@@ -122,6 +123,7 @@ AddToFeatureVectorView.propTypes = {
   fetchData: PropTypes.func.isRequired,
   filtersStore: PropTypes.object.isRequired,
   handleExpandRow: PropTypes.func.isRequired,
+  largeRequestErrorMessage: PropTypes.string.isRequired,
   pageData: PropTypes.object.isRequired,
   selectedRowData: PropTypes.object.isRequired,
   tableContent: PropTypes.arrayOf(PropTypes.object).isRequired,

diff --git a/src/components/FeatureStore/Features/Features.js b/src/components/FeatureStore/Features/Features.js
@@ -38,11 +38,10 @@ import {
   TAG_FILTER_ALL_ITEMS
 } from '../../../constants'
 import { createFeaturesRowData } from '../../../utils/createFeatureStoreContent'
-import { featuresActionCreator, featuresFilters } from './features.util'
+import { featuresActionCreator, featuresFilters, handleFeaturesResponse } from './features.util'
 import { getFeatureIdentifier } from '../../../utils/getUniqueIdentifier'
 import { getFilterTagOptions, setFilters } from '../../../reducers/filtersReducer'
 import { setTablePanelOpen } from '../../../reducers/tableReducer'
-import { showLargeResponsePopUp } from '../../../httpClient'
 import { useGetTagOptions } from '../../../hooks/useGetTagOptions.hook'
 import { useGroupContent } from '../../../hooks/groupContent.hook'
 import { useVirtualization } from '../../../hooks/useVirtualization.hook'
@@ -127,18 +126,12 @@ const Features = ({
               return nextValue.value ? prevValue.concat(nextValue.value) : prevValue
             }, [])
 
-            if (
-              features.length > 10000 ||
-              abortControllerRef.current?.signal?.reason === LARGE_REQUEST_CANCELED
-            ) {
-              showLargeResponsePopUp(setLargeRequestErrorMessage)
-              setFeatures([])
-            } else {
-              setFeatures(features)
-              setLargeRequestErrorMessage('')
-
-              return features
-            }
+            return handleFeaturesResponse(
+              features,
+              setFeatures,
+              abortControllerRef,
+              setLargeRequestErrorMessage
+            )
           }
 
           return result

diff --git a/src/components/FeatureStore/Features/features.util.js b/src/components/FeatureStore/Features/features.util.js
@@ -17,15 +17,36 @@ illegal under applicable law, and the grant of the foregoing license
 under the Apache 2.0 license is conditioned upon your compliance with
 such restriction.
 */
-import { LABELS_FILTER, NAME_FILTER, TAG_FILTER } from '../../../constants'
 import featureStoreActions from '../../../actions/featureStore'
+import { LABELS_FILTER, LARGE_REQUEST_CANCELED, NAME_FILTER, TAG_FILTER } from '../../../constants'
+import { showLargeResponsePopUp } from '../../../httpClient'
 
 export const featuresFilters = [
   { type: TAG_FILTER, label: 'Version Tag:' },
   { type: NAME_FILTER, label: 'Name:' },
   { type: LABELS_FILTER, label: 'Labels:' }
 ]
 
+export const handleFeaturesResponse = (
+  features,
+  setFeatures,
+  abortControllerRef,
+  setLargeRequestErrorMessage
+) => {
+  if (
+    features?.length > 10000 ||
+    abortControllerRef.current?.signal?.reason === LARGE_REQUEST_CANCELED
+  ) {
+    showLargeResponsePopUp(setLargeRequestErrorMessage)
+    setFeatures([])
+  } else if (features) {
+    setFeatures(features)
+    setLargeRequestErrorMessage('')
+  }
+
+  return features
+}
+
 export const featuresActionCreator = {
   fetchEntity: featureStoreActions.fetchEntity,
   fetchFeature: featureStoreActions.fetchFeature,