mlrun · ilan7empest · Dec 28, 2024 · Dec 27, 2024
diff --git a/src/common/Pagination/Pagination.js b/src/common/Pagination/Pagination.js
@@ -20,7 +20,7 @@ such restriction.
 import React, { useCallback, useMemo, useRef } from 'react'
 import PropTypes from 'prop-types'
 import classnames from 'classnames'
-import { useNavigate, useSearchParams } from 'react-router-dom'
+import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 import { max, min } from 'lodash'
 
 import { RoundedIcon } from 'igz-controls/components'
@@ -51,6 +51,7 @@ const Pagination = ({ closeParamName = '', paginationConfig }) => {
   const paginationPagesRef = useRef()
   const leftSideRef = useRef(0)
   const rightSideRef = useRef(0)
+  const location = useLocation()
 
   // Total pages are now calculated based on start and end pages
   const totalPagesCount = useMemo(
@@ -78,9 +79,9 @@ const Pagination = ({ closeParamName = '', paginationConfig }) => {
 
   const handlePageChange = useCallback(() => {
     if (closeParamName) {
-      navigate(getCloseDetailsLink(closeParamName, true), { replace: true })
+      navigate(getCloseDetailsLink(closeParamName, location, true), { replace: true })
     }
-  }, [navigate, closeParamName])
+  }, [closeParamName, navigate, location])
 
   const paginationItems = useMemo(() => {
     if (!paginationConfig[FE_PAGE]) return []

diff --git a/src/components/Datasets/DatasetsView.js b/src/components/Datasets/DatasetsView.js
@@ -20,6 +20,7 @@ such restriction.
 import React from 'react'
 import PropTypes from 'prop-types'
 import { isEmpty } from 'lodash'
+import { useLocation } from 'react-router-dom'
 
 import ActionBar from '../ActionBar/ActionBar'
 import ArtifactsFilters from '../ArtifactsActionBar/ArtifactsFilters'
@@ -73,6 +74,8 @@ const DatasetsView = React.forwardRef(
     },
     { datasetsRef }
   ) => {
+    const location = useLocation()
+
     return (
       <>
         <div className="content-wrapper" ref={datasetsRef}>
@@ -130,7 +133,10 @@ const DatasetsView = React.forwardRef(
                     applyDetailsChangesCallback={applyDetailsChangesCallback}
                     detailsFormInitialValues={detailsFormInitialValues}
                     getCloseDetailsLink={() =>
-                      getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : DATASETS_TAB)
+                      getCloseDetailsLink(
+                        isAllVersions ? ALL_VERSIONS_PATH : DATASETS_TAB,
+                        location
+                      )
                     }
                     handleCancel={() => setSelectedDatasetMin({})}
                     pageData={pageData}

diff --git a/src/components/Details/DetailsHeader/DetailsHeader.js b/src/components/Details/DetailsHeader/DetailsHeader.js
@@ -142,7 +142,7 @@ const DetailsHeader = ({
               className="item-header__back-btn"
               to={
                 getCloseDetailsLink
-                  ? getCloseDetailsLink(selectedItem.name)
+                  ? getCloseDetailsLink(selectedItem.name, location)
                   : generateUrlFromRouterPath(
                       window.location.pathname.split('/').slice(0, -2).join('/') +
                         window.location.search
@@ -334,7 +334,7 @@ const DetailsHeader = ({
                 data-testid="details-close-btn"
                 to={
                   getCloseDetailsLink
-                    ? getCloseDetailsLink(selectedItem.name)
+                    ? getCloseDetailsLink(selectedItem.name, location)
                     : getDefaultCloseDetailsLink(params, pageData.page, tab)
                 }
                 onClick={handleCancelClick}

diff --git a/src/components/Documents/DocumentsView.js b/src/components/Documents/DocumentsView.js
@@ -20,6 +20,7 @@ such restriction.
 import React from 'react'
 import PropTypes from 'prop-types'
 import { isEmpty } from 'lodash'
+import { useLocation } from 'react-router-dom'
 
 import Breadcrumbs from '../../common/Breadcrumbs/Breadcrumbs'
 import Loader from '../../common/Loader/Loader'
@@ -68,6 +69,8 @@ const DocumentsView = React.forwardRef(
     },
     { documentsRef }
   ) => {
+    const location = useLocation()
+
     return (
       <>
         <div className="content-wrapper" ref={documentsRef}>
@@ -117,7 +120,10 @@ const DocumentsView = React.forwardRef(
                     applyDetailsChangesCallback={applyDetailsChangesCallback}
                     detailsFormInitialValues={detailsFormInitialValues}
                     getCloseDetailsLink={() =>
-                      getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : DOCUMENTS_TAB)
+                      getCloseDetailsLink(
+                        isAllVersions ? ALL_VERSIONS_PATH : DOCUMENTS_TAB,
+                        location
+                      )
                     }
                     handleCancel={() => setSelectedDocumentMin({})}
                     pageData={pageData}

diff --git a/src/components/Files/FilesView.js b/src/components/Files/FilesView.js
@@ -20,6 +20,7 @@ such restriction.
 import React from 'react'
 import PropTypes from 'prop-types'
 import { isEmpty } from 'lodash'
+import { useLocation } from 'react-router-dom'
 
 import ActionBar from '../ActionBar/ActionBar'
 import ArtifactsFilters from '../ArtifactsActionBar/ArtifactsFilters'
@@ -72,6 +73,8 @@ const FilesView = React.forwardRef(
     },
     { filesRef }
   ) => {
+    const location = useLocation()
+
     return (
       <>
         <div className="content-wrapper" ref={filesRef}>
@@ -129,7 +132,7 @@ const FilesView = React.forwardRef(
                     applyDetailsChangesCallback={applyDetailsChangesCallback}
                     detailsFormInitialValues={detailsFormInitialValues}
                     getCloseDetailsLink={() =>
-                      getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FILES_TAB)
+                      getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FILES_TAB, location)
                     }
                     handleCancel={() => setSelectedFileMin({})}
                     pageData={pageData}

diff --git a/src/components/FunctionsPage/FunctionsView.js b/src/components/FunctionsPage/FunctionsView.js
@@ -18,7 +18,7 @@ under the Apache 2.0 license is conditioned upon your compliance with
 such restriction.
 */
 import React from 'react'
-import { useParams } from 'react-router-dom'
+import { useLocation, useParams } from 'react-router-dom'
 import PropTypes from 'prop-types'
 
 import ActionBar from '../ActionBar/ActionBar'
@@ -74,6 +74,7 @@ const FunctionsView = ({
   tableContent
 }) => {
   const params = useParams()
+  const location = useLocation()
 
   return (
     <>
@@ -131,7 +132,10 @@ const FunctionsView = ({
                 <Table
                   actionsMenu={actionsMenu}
                   getCloseDetailsLink={() =>
-                    getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FUNCTIONS_PAGE_PATH)
+                    getCloseDetailsLink(
+                      isAllVersions ? ALL_VERSIONS_PATH : FUNCTIONS_PAGE_PATH,
+                      location
+                    )
                   }
                   handleCancel={handleCancel}
                   pageData={pageData}

diff --git a/src/components/ModelsPage/Models/ModelsView.js b/src/components/ModelsPage/Models/ModelsView.js
@@ -20,6 +20,7 @@ such restriction.
 import React from 'react'
 import PropTypes from 'prop-types'
 import { isEmpty } from 'lodash'
+import { useLocation } from 'react-router-dom'
 
 import ActionBar from '../../ActionBar/ActionBar'
 import ArtifactsFilters from '../../ArtifactsActionBar/ArtifactsFilters'
@@ -72,6 +73,8 @@ const ModelsView = React.forwardRef(
     },
     { modelsRef }
   ) => {
+    const location = useLocation()
+
     return (
       <>
         <div className="models" ref={modelsRef}>
@@ -138,7 +141,7 @@ const ModelsView = React.forwardRef(
                   applyDetailsChangesCallback={applyDetailsChangesCallback}
                   detailsFormInitialValues={detailsFormInitialValues}
                   getCloseDetailsLink={() =>
-                    getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : MODELS_TAB)
+                    getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : MODELS_TAB, location)
                   }
                   handleCancel={() => setSelectedModelMin({})}
                   pageData={pageData}

diff --git a/src/components/Workflow/Workflow.js b/src/components/Workflow/Workflow.js
@@ -22,7 +22,7 @@ import { connect } from 'react-redux'
 import PropTypes from 'prop-types'
 import classnames from 'classnames'
 import { forEach, isEmpty } from 'lodash'
-import { useNavigate, useParams } from 'react-router-dom'
+import { useLocation, useNavigate, useParams } from 'react-router-dom'
 
 import Details from '../Details/Details'
 import MlReactFlow from '../../common/ReactFlow/MlReactFlow'
@@ -88,6 +88,7 @@ const Workflow = ({
   const params = useParams()
   const navigate = useNavigate()
   const { isStagingMode } = useMode()
+  const location = useLocation()
 
   const graphViewClassNames = classnames(
     'graph-view',
@@ -263,7 +264,7 @@ const Workflow = ({
               <Details
                 actionsMenu={actionsMenu}
                 detailsMenu={pageData.details.menu}
-                getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId)}
+                getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId, location)}
                 handleCancel={handleCancel}
                 pageData={pageData}
                 retryRequest={refreshJobs}
@@ -275,7 +276,7 @@ const Workflow = ({
         ) : (
           <Table
             actionsMenu={actionsMenu}
-            getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId)}
+            getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId, location)}
             handleCancel={handleCancel}
             hideActionsMenu
             pageData={pageData}

diff --git a/src/elements/JobsTable/JobsTable.js b/src/elements/JobsTable/JobsTable.js
@@ -218,11 +218,11 @@ const JobsTable = React.forwardRef(
       (job, isDeleteAll) => {
         handleDeleteJob(isDeleteAll, job, refreshJobs, filters, dispatch).then(() => {
           if (params.jobName) {
-            navigate(getCloseDetailsLink(params.jobName, true))
+            navigate(getCloseDetailsLink(params.jobName, location, true))
           }
         })
       },
-      [params.jobName, refreshJobs, filters, dispatch, navigate]
+      [refreshJobs, filters, dispatch, params.jobName, navigate, location]
     )
 
     const handleConfirmDeleteJob = useCallback(
@@ -319,7 +319,8 @@ const JobsTable = React.forwardRef(
         setSelectedJob,
         modifyAndSelectRun,
         searchParams,
-        paginationConfigJobsRef
+        paginationConfigJobsRef,
+        location
       )
     }, [
       searchParams,
@@ -330,7 +331,8 @@ const JobsTable = React.forwardRef(
       params.jobName,
       params.projectName,
       setSelectedJob,
-      modifyAndSelectRun
+      modifyAndSelectRun,
+      location
     ])
 
     return (
@@ -352,7 +354,7 @@ const JobsTable = React.forwardRef(
             <>
               <Table
                 actionsMenu={actionsMenu}
-                getCloseDetailsLink={() => getCloseDetailsLink(params.jobName)}
+                getCloseDetailsLink={() => getCloseDetailsLink(params.jobName, location)}
                 handleCancel={() => setSelectedJob({})}
                 pageData={pageData}
                 retryRequest={handleRefreshWithFilters}

diff --git a/src/utils/jobs.util.js b/src/utils/jobs.util.js
@@ -55,7 +55,8 @@ export const checkForSelectedJob = debounce(
     setSelectedJob,
     modifyAndSelectRun,
     searchParams,
-    paginationConfigJobsRef
+    paginationConfigJobsRef,
+    location
   ) => {
     if (jobId) {
       const searchBePage = parseInt(searchParams.get(BE_PAGE))
@@ -67,7 +68,7 @@ export const checkForSelectedJob = debounce(
         })
 
         if (!selectedPaginatedJob) {
-          navigate(getCloseDetailsLink(jobName, true), { replace: true })
+          navigate(getCloseDetailsLink(jobName, location, true), { replace: true })
         } else if (selectedPaginatedJob) {
           modifyAndSelectRun(cloneDeep(selectedPaginatedJob))
         }

diff --git a/src/utils/link-helper.util.js b/src/utils/link-helper.util.js
@@ -41,11 +41,11 @@ export const generateUrlFromRouterPath = link => {
   return new URL(link, window.location.origin).toString()
 }
 
-export const getCloseDetailsLink = (paramName, ignoreOrigin) => {
+export const getCloseDetailsLink = (paramName, location, ignoreOrigin) => {
   const link =
-    window.location.pathname
+    location.pathname
       .split('/')
-      .splice(0, window.location.pathname.split('/').lastIndexOf(paramName) + 1)
+      .splice(0, location.pathname.split('/').lastIndexOf(paramName) + 1)
       .join('/') + window.location.search
 
   return ignoreOrigin ? link : generateUrlFromRouterPath(link)