Merge pull request #129 from lokanandaprabhu/feature/OCPBUGS-33521

OCPBUGS-33521: Update sorting in pipeline, pipelineRun and TaskRun list pages

package.json

@@ -28,8 +28,8 @@
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
     "@cypress/webpack-preprocessor": "^5.15.5",
-    "@openshift-console/dynamic-plugin-sdk": "1.2.0",
-    "@openshift-console/dynamic-plugin-sdk-webpack": "1.1.0",
+    "@openshift-console/dynamic-plugin-sdk": "1.4.0",
+    "@openshift-console/dynamic-plugin-sdk-webpack": "1.1.1",
     "@openshift/dynamic-plugin-sdk": "^4.0.0",
     "@openshift/dynamic-plugin-sdk-extensions": "^1.3.0",
     "@openshift/dynamic-plugin-sdk-utils": "^4.1.0",

src/components/pipelineRuns-list/PipelineRunsList.tsx

@@ -1,10 +1,11 @@
+import * as React from 'react';
+import { SortByDirection } from '@patternfly/react-table';
 import {
   ListPageBody,
   ListPageFilter,
   VirtualizedTable,
   useListPageFilter,
 } from '@openshift-console/dynamic-plugin-sdk';
-import * as React from 'react';
 import usePipelineRunsColumns from './usePipelineRunsColumns';
 import { usePipelineRunsFilters } from './usePipelineRunsFilters';
 import { PipelineRunKind } from '../../types';
@@ -35,6 +36,13 @@ const PipelineRunsList: React.FC<PipelineRunsListProps> = ({
   namespace = namespace || ns;
   const columns = usePipelineRunsColumns(namespace, repositoryPLRs);
   const filters = usePipelineRunsFilters();
+  const sortColumnIndex = repositoryPLRs
+    ? !namespace
+      ? 6
+      : 5
+    : !namespace
+    ? 5
+    : 4;
 
   const [pipelineRuns, pipelineRunsLoaded, pipelineRunsLoadError] =
     useGetPipelineRuns(namespace, { name: PLRsForName, kind: PLRsForKind });
@@ -59,6 +67,7 @@ const PipelineRunsList: React.FC<PipelineRunsListProps> = ({
         hideNameLabelFilters={hideTextFilter}
       />
       <VirtualizedTable<PipelineRunKind>
+        key={sortColumnIndex}
         EmptyMsg={() => (
           <div
             className="pf-u-text-align-center virtualized-table-empty-msg"
@@ -76,6 +85,8 @@ const PipelineRunsList: React.FC<PipelineRunsListProps> = ({
         rowData={{
           repositoryPLRs,
         }}
+        sortColumnIndex={sortColumnIndex}
+        sortDirection={SortByDirection.desc}
       />
     </ListPageBody>
   );

src/components/pipelines-list/PipelinesList.tsx

@@ -1,3 +1,7 @@
+import * as React from 'react';
+import { useParams } from 'react-router-dom-v5-compat';
+import { useTranslation } from 'react-i18next';
+import { SortByDirection } from '@patternfly/react-table';
 import {
   K8sResourceCommon,
   ListPageBody,
@@ -7,15 +11,12 @@ import {
   useK8sWatchResource,
   useListPageFilter,
 } from '@openshift-console/dynamic-plugin-sdk';
-import * as React from 'react';
 import usePipelinesColumns from './usePipelinesColumns';
 import { usePipelinesFilters } from './usePipelinesFilters';
 import PipelineRow from './PipelineRow';
 import { useGetPipelineRuns } from '../hooks/useTektonResult';
 import { PipelineModel } from '../../models';
 import { PropPipelineData, augmentRunsToData } from '../utils/pipeline-augment';
-import { useParams } from 'react-router-dom-v5-compat';
-import { useTranslation } from 'react-i18next';
 
 type PipelineListProps = {
   namespace?: string;
@@ -31,6 +32,7 @@ const PipelinesList: React.FC<PipelineListProps> = ({
   namespace = namespace || ns;
   const columns = usePipelinesColumns(namespace);
   const filters = usePipelinesFilters();
+  const sortColumnIndex = !namespace ? 5 : 4;
   const [pipelines, pipelinesLoaded, pipelinesLoadError] = useK8sWatchResource<
     PropPipelineData[]
   >({
@@ -63,6 +65,7 @@ const PipelinesList: React.FC<PipelineListProps> = ({
         hideNameLabelFilters={hideTextFilter}
       />
       <VirtualizedTable<K8sResourceCommon>
+        key={sortColumnIndex}
         EmptyMsg={() => (
           <div
             className="pf-u-text-align-center virtualized-table-empty-msg"
@@ -77,6 +80,8 @@ const PipelinesList: React.FC<PipelineListProps> = ({
         loadError={pipelinesLoadError || pipelineRunsLoadError}
         Row={PipelineRow}
         unfilteredData={data}
+        sortColumnIndex={sortColumnIndex}
+        sortDirection={SortByDirection.desc}
       />
     </ListPageBody>
   );

src/components/pipelines-tasks/TaskRunsList.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom-v5-compat';
-import { sortable } from '@patternfly/react-table';
+import { SortByDirection, sortable } from '@patternfly/react-table';
 import {
   K8sResourceCommon,
   ListPageBody,
@@ -111,6 +111,7 @@ const TaskRunsList: React.FC<TaskRunsListPageProps> = ({
   const params = useParams();
   const { ns: namespace } = params;
   const ns = namespace === ALL_NAMESPACES_KEY ? '-' : namespace;
+  const sortColumnIndex = !namespace ? 6 : 5;
   const parentName = props?.obj?.metadata?.name;
   const [taskRuns, loaded, loadError] = useTaskRuns(ns, parentName);
   const [staticData, filteredData, onFilterChange] = useListPageFilter(
@@ -155,6 +156,7 @@ const TaskRunsList: React.FC<TaskRunsListPageProps> = ({
           hideNameLabelFilters={hideNameLabelFilters}
         />
         <VirtualizedTable
+          key={sortColumnIndex}
           columns={activeColumns.filter(
             (item) => !(item.id === 'pipeline' && !showPipelineColumn),
           )}
@@ -170,6 +172,8 @@ const TaskRunsList: React.FC<TaskRunsListPageProps> = ({
               </div>
             </div>
           )}
+          sortColumnIndex={sortColumnIndex}
+          sortDirection={SortByDirection.desc}
         />
       </ListPageBody>
     </>

yarn.lock

@@ -1703,10 +1703,10 @@
     mkdirp "^1.0.4"
     rimraf "^3.0.2"
 
-"@openshift-console/[email protected].0":
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/@openshift-console/dynamic-plugin-sdk-webpack/-/dynamic-plugin-sdk-webpack-1.1.0.tgz#d369c37b93cd0792960385728de5cd1f63c2187f"
-  integrity sha512-UukGhZOEGc5u22hoO3H0bP58r+Kw1gDFBe0EEJTkYkzYX6S0og5DNAVw/lzhwUorpbmy00B6cqWIuclmTo1+QA==
+"@openshift-console/[email protected].1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@openshift-console/dynamic-plugin-sdk-webpack/-/dynamic-plugin-sdk-webpack-1.1.1.tgz#349326366f84defa8c81baa8be411257d0b1e954"
+  integrity sha512-1m1iBpdj0HNWQIEFAhMlI5pmigyN5B/Eqcb2nGAI2n030hOOxAalxySO95dvEFa2hiyXMUt4z/Tyq4fDYKZ2nw==
   dependencies:
     "@openshift/dynamic-plugin-sdk-webpack" "^4.0.2"
     ajv "^6.12.3"
@@ -1719,10 +1719,10 @@
     semver "6.x"
     webpack "5.75.0"
 
-"@openshift-console/dynamic-plugin-sdk@1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@openshift-console/dynamic-plugin-sdk/-/dynamic-plugin-sdk-1.2.0.tgz#8cdc50240f1a171530ce0ddcd2a4f4006043eb1a"
-  integrity sha512-K/BqjyG0kSnPFtBlPQYlmcHa1xhozUX0ZaOB5S4vUN4x3hbvcJEeUy/l4RWMNH/+sW8ciuTaBlXCWTxTCfFAXg==
+"@openshift-console/dynamic-plugin-sdk@1.4.0":
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/@openshift-console/dynamic-plugin-sdk/-/dynamic-plugin-sdk-1.4.0.tgz#802c1225f22a6d59b16b5b47f0ff81f176f2db72"
+  integrity sha512-LcwNqG2ZzMKLiSQNpHBwAtzALQghUngILhdijndpIklSH0Dsqi05nhwAJPyuFrpwywZIj6BxE1tmaBzR5gUfcA==
   dependencies:
     classnames "2.x"
     immutable "3.x"