From b0017273506d428efd9f8de47505c2c0b7cc11dc Mon Sep 17 00:00:00 2001 From: Dipanshu Gupta Date: Fri, 22 Nov 2024 19:58:14 +0530 Subject: [PATCH] Update global pipelines page and link it to the global pipeline runs page --- .../cypress/pages/pipelines/pipelinesTable.ts | 4 ++ .../mocked/pipelines/pipelinesList.cy.ts | 38 +++++++++++++++++++ .../pipeline/PipelineDetailsActions.tsx | 13 ++----- .../pipelines/content/tables/columns.ts | 6 +++ .../PipelineVersionTableRow.tsx | 36 +++++++++--------- frontend/src/routes/pipelines/runs.ts | 10 +++++ 6 files changed, 79 insertions(+), 28 deletions(-) diff --git a/frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelinesTable.ts b/frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelinesTable.ts index cb1760db53..89d7b223be 100644 --- a/frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelinesTable.ts +++ b/frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelinesTable.ts @@ -34,6 +34,10 @@ class PipelineVersionsTableRow extends TableRow { findPipelineVersionLink() { return this.find().findByTestId(`table-row-title`).find('a'); } + + findPipelineVersionViewRunLink() { + return this.find().findByTestId('runs-route-link'); + } } export enum PipelineSort { diff --git a/frontend/src/__tests__/cypress/cypress/tests/mocked/pipelines/pipelinesList.cy.ts b/frontend/src/__tests__/cypress/cypress/tests/mocked/pipelines/pipelinesList.cy.ts index 49f247d976..6a2c41a964 100644 --- a/frontend/src/__tests__/cypress/cypress/tests/mocked/pipelines/pipelinesList.cy.ts +++ b/frontend/src/__tests__/cypress/cypress/tests/mocked/pipelines/pipelinesList.cy.ts @@ -220,6 +220,44 @@ describe('PipelinesList', () => { `/pipelines/${projectName}/${initialMockPipeline.pipeline_id}/${initialMockPipelineVersion.pipeline_version_id}/schedules/create`, ); }); + + it('navigates to "Runs" page from pipeline version row', () => { + initIntercepts(); + projectDetails.visitSection(projectName, 'pipelines-projects'); + + pipelinesTable.find(); + const pipelineRow = pipelinesTable.getRowById(initialMockPipeline.pipeline_id); + pipelineRow.findExpandButton().click(); + + pipelineRow + .getPipelineVersionRowById(initialMockPipelineVersion.pipeline_version_id) + .findPipelineVersionViewRunLink() + .click(); + + cy.url().should( + 'include', + `/pipelineRuns/${projectName}/runs/active?pipeline_version=${initialMockPipelineVersion.pipeline_id}`, + ); + }); + + it('navigates to "Schedules" tab on run page from pipeline version row', () => { + initIntercepts(); + projectDetails.visitSection(projectName, 'pipelines-projects'); + + pipelinesTable.find(); + const pipelineRow = pipelinesTable.getRowById(initialMockPipeline.pipeline_id); + pipelineRow.findExpandButton().click(); + + pipelineRow + .getPipelineVersionRowById(initialMockPipelineVersion.pipeline_version_id) + .findKebabAction('View schedules') + .click(); + + cy.url().should( + 'include', + `/pipelineRuns/${projectName}/schedules?pipeline_version=${initialMockPipelineVersion.pipeline_id}`, + ); + }); }); const pipelineTableSetup = () => { diff --git a/frontend/src/concepts/pipelines/content/pipelinesDetails/pipeline/PipelineDetailsActions.tsx b/frontend/src/concepts/pipelines/content/pipelinesDetails/pipeline/PipelineDetailsActions.tsx index ab08f48d98..15ec19b052 100644 --- a/frontend/src/concepts/pipelines/content/pipelinesDetails/pipeline/PipelineDetailsActions.tsx +++ b/frontend/src/concepts/pipelines/content/pipelinesDetails/pipeline/PipelineDetailsActions.tsx @@ -7,11 +7,11 @@ import { usePipelinesAPI } from '~/concepts/pipelines/context'; import PipelineVersionImportModal from '~/concepts/pipelines/content/import/PipelineVersionImportModal'; import { PipelineKF, PipelineVersionKF } from '~/concepts/pipelines/kfTypes'; import { + globalPipelineRecurringRunsVersionRoute, + globalPipelineRunsVersionRoute, pipelineVersionCreateRecurringRunRoute, pipelineVersionCreateRunRoute, pipelineVersionDetailsRoute, - pipelineVersionRecurringRunsRoute, - pipelineVersionRunsRoute, } from '~/routes'; import { getDashboardMainContainer } from '~/utilities/utils'; import { @@ -109,14 +109,10 @@ const PipelineDetailsActions: React.FC = ({ key="view-runs" onClick={() => navigate( - pipelineVersionRunsRoute( + globalPipelineRunsVersionRoute( namespace, - pipeline.pipeline_id, pipelineVersion.pipeline_version_id, ), - { - state: { lastVersion: pipelineVersion }, - }, ) } > @@ -126,9 +122,8 @@ const PipelineDetailsActions: React.FC = ({ key="view-schedules" onClick={() => navigate( - pipelineVersionRecurringRunsRoute( + globalPipelineRecurringRunsVersionRoute( namespace, - pipeline.pipeline_id, pipelineVersion.pipeline_version_id, ), ) diff --git a/frontend/src/concepts/pipelines/content/tables/columns.ts b/frontend/src/concepts/pipelines/content/tables/columns.ts index ff9ac84e40..eada6133c2 100644 --- a/frontend/src/concepts/pipelines/content/tables/columns.ts +++ b/frontend/src/concepts/pipelines/content/tables/columns.ts @@ -56,6 +56,12 @@ export const pipelineVersionColumns: SortableData[] = [ sortable: (a, b) => new Date(a.created_at).getTime() - new Date(b.created_at).getTime(), width: 20, }, + { + label: '', + sortable: false, + field: 'view_runs', + width: 20, + }, kebabTableColumn(), ]; diff --git a/frontend/src/concepts/pipelines/content/tables/pipelineVersion/PipelineVersionTableRow.tsx b/frontend/src/concepts/pipelines/content/tables/pipelineVersion/PipelineVersionTableRow.tsx index 5f989029b8..730ee63c2f 100644 --- a/frontend/src/concepts/pipelines/content/tables/pipelineVersion/PipelineVersionTableRow.tsx +++ b/frontend/src/concepts/pipelines/content/tables/pipelineVersion/PipelineVersionTableRow.tsx @@ -1,16 +1,17 @@ import * as React from 'react'; import { ActionsColumn, TableText, Td, Tr } from '@patternfly/react-table'; import { Link, useNavigate } from 'react-router-dom'; +import { Button } from '@patternfly/react-core'; import { PipelineKF, PipelineVersionKF } from '~/concepts/pipelines/kfTypes'; import { CheckboxTd, TableRowTitleDescription } from '~/components/table'; import { usePipelinesAPI } from '~/concepts/pipelines/context'; import PipelinesTableRowTime from '~/concepts/pipelines/content/tables/PipelinesTableRowTime'; import { + globalPipelineRecurringRunsVersionRoute, + globalPipelineRunsVersionRoute, pipelineVersionCreateRecurringRunRoute, pipelineVersionCreateRunRoute, pipelineVersionDetailsRoute, - pipelineVersionRecurringRunsRoute, - pipelineVersionRunsRoute, } from '~/routes'; import { isArgoWorkflow } from '~/concepts/pipelines/content/tables/utils'; import { @@ -70,6 +71,19 @@ const PipelineVersionTableRow: React.FC = ({ + + + = ({ { isSeparator: true, }, - { - title: 'View runs', - onClick: () => { - navigate( - pipelineVersionRunsRoute( - namespace, - pipeline.pipeline_id, - version.pipeline_version_id, - ), - ); - }, - }, { title: 'View schedules', onClick: () => { navigate( - pipelineVersionRecurringRunsRoute( - namespace, - pipeline.pipeline_id, - version.pipeline_version_id, - ), + globalPipelineRecurringRunsVersionRoute(namespace, version.pipeline_version_id), ); }, }, diff --git a/frontend/src/routes/pipelines/runs.ts b/frontend/src/routes/pipelines/runs.ts index 0d20e1d701..7b366edd68 100644 --- a/frontend/src/routes/pipelines/runs.ts +++ b/frontend/src/routes/pipelines/runs.ts @@ -131,12 +131,22 @@ export const pipelineRunsBaseRoute = (namespace?: string): string => export const globalPipelineRunsRoute = (namespace: string | undefined): string => `${pipelineRunsBaseRoute(namespace)}/runs`; +export const globalPipelineRunsVersionRoute = ( + namespace: string | undefined, + pipelineVersionId: string | undefined, +): string => `${globalPipelineRunsRoute(namespace)}/active?pipeline_version=${pipelineVersionId}`; + export const globalArchivedPipelineRunsRoute = (namespace: string | undefined): string => `${globalPipelineRunsRoute(namespace)}/archived`; export const globalPipelineRecurringRunsRoute = (namespace: string | undefined): string => `${pipelineRunsBaseRoute(namespace)}/schedules`; +export const globalPipelineRecurringRunsVersionRoute = ( + namespace: string | undefined, + pipelineVersionId: string | undefined, +): string => `${globalPipelineRecurringRunsRoute(namespace)}?pipeline_version=${pipelineVersionId}`; + export const globalPipelineRunDetailsRoute = (namespace: string, runId: string): string => `${globalPipelineRunsRoute(namespace)}/${runId}`;