From 852c80dc59d2d8bbaff86366499340ce77b13a70 Mon Sep 17 00:00:00 2001 From: Andrew Mavdryk Date: Sat, 11 Jan 2025 12:00:57 +0200 Subject: [PATCH] Fix [Functions, Artifacts, Jobs] Unexpected redirection (#3003) --- src/common/Pagination/Pagination.js | 7 +++---- src/components/Datasets/DatasetsView.js | 8 +------- .../Details/DetailsHeader/DetailsHeader.js | 4 ++-- src/components/Documents/DocumentsView.js | 8 +------- src/components/Files/FilesView.js | 5 +---- src/components/FunctionsPage/FunctionsView.js | 8 ++------ src/components/ModelsPage/Models/ModelsView.js | 5 +---- src/components/Workflow/Workflow.js | 7 +++---- src/elements/JobsTable/JobsTable.js | 12 +++++------- src/utils/jobs.util.js | 5 ++--- src/utils/link-helper.util.js | 12 +++++++++--- 11 files changed, 30 insertions(+), 51 deletions(-) diff --git a/src/common/Pagination/Pagination.js b/src/common/Pagination/Pagination.js index 04a7c71f9..d745d4685 100644 --- 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 { useLocation, useNavigate, useSearchParams } from 'react-router-dom' +import { useNavigate, useSearchParams } from 'react-router-dom' import { max, min } from 'lodash' import { RoundedIcon } from 'igz-controls/components' @@ -56,7 +56,6 @@ const Pagination = ({ 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( @@ -85,9 +84,9 @@ const Pagination = ({ const handlePageChange = useCallback(() => { if (closeParamName) { - navigate(getCloseDetailsLink(closeParamName, location, true), { replace: true }) + navigate(getCloseDetailsLink(closeParamName, true), { replace: true }) } - }, [closeParamName, navigate, location]) + }, [closeParamName, navigate]) const paginationItems = useMemo(() => { if (!paginationConfig[FE_PAGE]) return [] diff --git a/src/components/Datasets/DatasetsView.js b/src/components/Datasets/DatasetsView.js index 7f07a5547..f5d69abf0 100644 --- a/src/components/Datasets/DatasetsView.js +++ b/src/components/Datasets/DatasetsView.js @@ -20,7 +20,6 @@ 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' @@ -74,8 +73,6 @@ const DatasetsView = React.forwardRef( }, { datasetsRef } ) => { - const location = useLocation() - return ( <>
@@ -133,10 +130,7 @@ const DatasetsView = React.forwardRef( applyDetailsChangesCallback={applyDetailsChangesCallback} detailsFormInitialValues={detailsFormInitialValues} getCloseDetailsLink={() => - getCloseDetailsLink( - isAllVersions ? ALL_VERSIONS_PATH : DATASETS_TAB, - location - ) + getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : DATASETS_TAB) } handleCancel={() => setSelectedDatasetMin({})} pageData={pageData} diff --git a/src/components/Details/DetailsHeader/DetailsHeader.js b/src/components/Details/DetailsHeader/DetailsHeader.js index 2551638b7..d3cd533e3 100644 --- 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, location) + ? getCloseDetailsLink(selectedItem.name) : 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, location) + ? getCloseDetailsLink(selectedItem.name) : getDefaultCloseDetailsLink(params, pageData.page, tab) } onClick={handleCancelClick} diff --git a/src/components/Documents/DocumentsView.js b/src/components/Documents/DocumentsView.js index 6bbf53999..4707395d3 100644 --- a/src/components/Documents/DocumentsView.js +++ b/src/components/Documents/DocumentsView.js @@ -20,7 +20,6 @@ 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' @@ -69,8 +68,6 @@ const DocumentsView = React.forwardRef( }, { documentsRef } ) => { - const location = useLocation() - return ( <>
@@ -120,10 +117,7 @@ const DocumentsView = React.forwardRef( applyDetailsChangesCallback={applyDetailsChangesCallback} detailsFormInitialValues={detailsFormInitialValues} getCloseDetailsLink={() => - getCloseDetailsLink( - isAllVersions ? ALL_VERSIONS_PATH : DOCUMENTS_TAB, - location - ) + getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : DOCUMENTS_TAB) } handleCancel={() => setSelectedDocumentMin({})} pageData={pageData} diff --git a/src/components/Files/FilesView.js b/src/components/Files/FilesView.js index 26753b922..6697815b4 100644 --- a/src/components/Files/FilesView.js +++ b/src/components/Files/FilesView.js @@ -20,7 +20,6 @@ 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,8 +72,6 @@ const FilesView = React.forwardRef( }, { filesRef } ) => { - const location = useLocation() - return ( <>
@@ -132,7 +129,7 @@ const FilesView = React.forwardRef( applyDetailsChangesCallback={applyDetailsChangesCallback} detailsFormInitialValues={detailsFormInitialValues} getCloseDetailsLink={() => - getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FILES_TAB, location) + getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FILES_TAB) } handleCancel={() => setSelectedFileMin({})} pageData={pageData} diff --git a/src/components/FunctionsPage/FunctionsView.js b/src/components/FunctionsPage/FunctionsView.js index 79e384eb2..3a78300fc 100644 --- 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 { useLocation, useParams } from 'react-router-dom' +import { useParams } from 'react-router-dom' import PropTypes from 'prop-types' import ActionBar from '../ActionBar/ActionBar' @@ -74,7 +74,6 @@ const FunctionsView = ({ tableContent }) => { const params = useParams() - const location = useLocation() return ( <> @@ -132,10 +131,7 @@ const FunctionsView = ({ - getCloseDetailsLink( - isAllVersions ? ALL_VERSIONS_PATH : FUNCTIONS_PAGE_PATH, - location - ) + getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : FUNCTIONS_PAGE_PATH) } handleCancel={handleCancel} pageData={pageData} diff --git a/src/components/ModelsPage/Models/ModelsView.js b/src/components/ModelsPage/Models/ModelsView.js index 211c8e680..6194b6e9c 100644 --- a/src/components/ModelsPage/Models/ModelsView.js +++ b/src/components/ModelsPage/Models/ModelsView.js @@ -20,7 +20,6 @@ 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,8 +72,6 @@ const ModelsView = React.forwardRef( }, { modelsRef } ) => { - const location = useLocation() - return ( <>
@@ -141,7 +138,7 @@ const ModelsView = React.forwardRef( applyDetailsChangesCallback={applyDetailsChangesCallback} detailsFormInitialValues={detailsFormInitialValues} getCloseDetailsLink={() => - getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : MODELS_TAB, location) + getCloseDetailsLink(isAllVersions ? ALL_VERSIONS_PATH : MODELS_TAB) } handleCancel={() => setSelectedModelMin({})} pageData={pageData} diff --git a/src/components/Workflow/Workflow.js b/src/components/Workflow/Workflow.js index 36b246985..a7cee12c2 100644 --- 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 { useLocation, useNavigate, useParams } from 'react-router-dom' +import { useNavigate, useParams } from 'react-router-dom' import Details from '../Details/Details' import MlReactFlow from '../../common/ReactFlow/MlReactFlow' @@ -88,7 +88,6 @@ const Workflow = ({ const params = useParams() const navigate = useNavigate() const { isStagingMode } = useMode() - const location = useLocation() const graphViewClassNames = classnames( 'graph-view', @@ -264,7 +263,7 @@ const Workflow = ({
getCloseDetailsLink(params.workflowId, location)} + getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId)} handleCancel={handleCancel} pageData={pageData} retryRequest={refreshJobs} @@ -276,7 +275,7 @@ const Workflow = ({ ) : (
getCloseDetailsLink(params.workflowId, location)} + getCloseDetailsLink={() => getCloseDetailsLink(params.workflowId)} handleCancel={handleCancel} hideActionsMenu pageData={pageData} diff --git a/src/elements/JobsTable/JobsTable.js b/src/elements/JobsTable/JobsTable.js index ed47ef4eb..a5d5aa204 100644 --- a/src/elements/JobsTable/JobsTable.js +++ b/src/elements/JobsTable/JobsTable.js @@ -219,11 +219,11 @@ const JobsTable = React.forwardRef( (job, isDeleteAll) => { handleDeleteJob(isDeleteAll, job, refreshJobs, filters, dispatch).then(() => { if (params.jobName) { - navigate(getCloseDetailsLink(params.jobName, location, true)) + navigate(getCloseDetailsLink(params.jobName, true)) } }) }, - [refreshJobs, filters, dispatch, params.jobName, navigate, location] + [refreshJobs, filters, dispatch, params.jobName, navigate] ) const handleConfirmDeleteJob = useCallback( @@ -320,8 +320,7 @@ const JobsTable = React.forwardRef( setSelectedJob, modifyAndSelectRun, searchParams, - paginationConfigJobsRef, - location + paginationConfigJobsRef ) }, [ searchParams, @@ -332,8 +331,7 @@ const JobsTable = React.forwardRef( params.jobName, params.projectName, setSelectedJob, - modifyAndSelectRun, - location + modifyAndSelectRun ]) return ( @@ -355,7 +353,7 @@ const JobsTable = React.forwardRef( <>
getCloseDetailsLink(params.jobName, location)} + getCloseDetailsLink={() => getCloseDetailsLink(params.jobName)} handleCancel={() => setSelectedJob({})} pageData={pageData} retryRequest={handleRefreshWithFilters} diff --git a/src/utils/jobs.util.js b/src/utils/jobs.util.js index d59979599..ed1ecdd8e 100644 --- a/src/utils/jobs.util.js +++ b/src/utils/jobs.util.js @@ -55,8 +55,7 @@ export const checkForSelectedJob = debounce( setSelectedJob, modifyAndSelectRun, searchParams, - paginationConfigJobsRef, - location + paginationConfigJobsRef ) => { if (jobId) { const searchBePage = parseInt(searchParams.get(BE_PAGE)) @@ -68,7 +67,7 @@ export const checkForSelectedJob = debounce( }) if (!selectedPaginatedJob) { - navigate(getCloseDetailsLink(jobName, location, true), { replace: true }) + navigate(getCloseDetailsLink(jobName, 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 index f749b63fe..8e83bf893 100644 --- a/src/utils/link-helper.util.js +++ b/src/utils/link-helper.util.js @@ -41,11 +41,17 @@ export const generateUrlFromRouterPath = link => { return new URL(link, window.location.origin).toString() } -export const getCloseDetailsLink = (paramName, location, ignoreOrigin) => { +export const getCloseDetailsLink = (paramName, ignoreOrigin) => { + let pathname = window.location.pathname + + if (ignoreOrigin && pathname.startsWith(process.env.PUBLIC_URL)) { + pathname = pathname.slice(process.env.PUBLIC_URL.length) + } + const link = - location.pathname + pathname .split('/') - .splice(0, location.pathname.split('/').lastIndexOf(paramName) + 1) + .splice(0, pathname.split('/').lastIndexOf(paramName) + 1) .join('/') + window.location.search return ignoreOrigin ? link : generateUrlFromRouterPath(link)