From 0f6fea01a43aedbb107aa961d0ccf00bb5f307be Mon Sep 17 00:00:00 2001 From: Thiago Dallacqua Date: Thu, 24 Oct 2024 15:27:14 -0300 Subject: [PATCH 1/3] fix: returned old changes --- .../react/src/components/ColumnPickerMenu.tsx | 20 +++++-------------- .../src/components/Searches/Searches.tsx | 1 - webui/react/src/utils/flatRun.ts | 5 ++--- 3 files changed, 7 insertions(+), 19 deletions(-) diff --git a/webui/react/src/components/ColumnPickerMenu.tsx b/webui/react/src/components/ColumnPickerMenu.tsx index 052a682e5dee..cf3ff2a2b76b 100644 --- a/webui/react/src/components/ColumnPickerMenu.tsx +++ b/webui/react/src/components/ColumnPickerMenu.tsx @@ -103,24 +103,16 @@ const ColumnPickerTab: React.FC = ({ }, [columnState, filteredColumns]); const handleShowHideAll = useCallback(() => { - const filteredColumnMap: Record = filteredColumns.reduce((acc, col) => { - if (col.location === V1LocationType.RUNMETADATA) - return { ...acc, [formatColumnKey(col)]: columnState.includes(formatColumnKey(col)) }; - - return { ...acc, [col.column]: columnState.includes(col.column) }; - }, {}); + const filteredColumnMap: Record = filteredColumns.reduce((acc, col) => ({ ...acc, [formatColumnKey(col)]: columnState.includes(formatColumnKey(col)) }), {}); const newColumns = allFilteredColumnsChecked ? columnState.filter((col) => !filteredColumnMap[col]) : [ ...new Set([ ...columnState, - ...filteredColumns.map((col) => { - if (col.location === V1LocationType.RUNMETADATA) return formatColumnKey(col); - return col.column; - }), + ...filteredColumns.map((col) => formatColumnKey(col)), ]), - ]; // TODO: check if that needs to be mapped with the metadata + ]; const pinnedCount = allFilteredColumnsChecked ? // If uncheck something pinned, reduce the pinnedColumnsCount newColumns.filter((col) => columnState.indexOf(col) < pinnedColumnsCount).length @@ -137,11 +129,9 @@ const ColumnPickerTab: React.FC = ({ const handleColumnChange = useCallback( (event: CheckboxChangeEvent) => { - const { id, checked } = event.target; - - if (id === undefined) return; + const { id: targetCol, checked } = event.target; - const targetCol = id; + if (targetCol === undefined) return; if (compare) { // pin or unpin column diff --git a/webui/react/src/components/Searches/Searches.tsx b/webui/react/src/components/Searches/Searches.tsx index aa7dc13d7dd7..254927b80b34 100644 --- a/webui/react/src/components/Searches/Searches.tsx +++ b/webui/react/src/components/Searches/Searches.tsx @@ -676,7 +676,6 @@ const Searches: React.FC = ({ project }) => { currentColumn.displayName || currentColumn.column, settings.columnWidths[currentColumn.column], dataPath, - undefined, ); break; } diff --git a/webui/react/src/utils/flatRun.ts b/webui/react/src/utils/flatRun.ts index 1275d9ec8e38..cbf0803ac87f 100644 --- a/webui/react/src/utils/flatRun.ts +++ b/webui/react/src/utils/flatRun.ts @@ -6,7 +6,7 @@ import { terminalRunStates, } from 'constants/states'; import { PermissionsHook } from 'hooks/usePermissions'; -import { V1ColumnType } from 'services/api-ts-sdk'; +import { V1ColumnType, V1LocationType } from 'services/api-ts-sdk'; import { FlatRun, FlatRunAction, ProjectColumn, RunState, SelectionType } from 'types'; import { combine } from './filterFormSet'; @@ -123,11 +123,10 @@ export const removeColumnTypePrefix = (columnName: V1ColumnType): string => { }; /// wanna know why this separator is used? see https://hpe-aiatscale.atlassian.net/browse/ET-785 -export const COLUMN_SEPARATOR = '␟'; export const METADATA_SEPARATOR = '\u241F' as const; // TODO: unify after merging PR 10052 export const formatColumnKey = (col: ProjectColumn, required = false): string => { - if (required || col.location === 'LOCATION_TYPE_RUN_METADATA') + if (required || col.location === V1LocationType.RUNMETADATA) return `${col.type}${METADATA_SEPARATOR}${col.column}`; return col.column; }; From e7d20161d0091b2e9246effe879286534f155c26 Mon Sep 17 00:00:00 2001 From: Thiago Dallacqua Date: Thu, 24 Oct 2024 15:31:39 -0300 Subject: [PATCH 2/3] chore: lint --- webui/react/src/components/ColumnPickerMenu.tsx | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/webui/react/src/components/ColumnPickerMenu.tsx b/webui/react/src/components/ColumnPickerMenu.tsx index cf3ff2a2b76b..ec0735cf07f4 100644 --- a/webui/react/src/components/ColumnPickerMenu.tsx +++ b/webui/react/src/components/ColumnPickerMenu.tsx @@ -103,16 +103,17 @@ const ColumnPickerTab: React.FC = ({ }, [columnState, filteredColumns]); const handleShowHideAll = useCallback(() => { - const filteredColumnMap: Record = filteredColumns.reduce((acc, col) => ({ ...acc, [formatColumnKey(col)]: columnState.includes(formatColumnKey(col)) }), {}); + const filteredColumnMap: Record = filteredColumns.reduce( + (acc, col) => ({ + ...acc, + [formatColumnKey(col)]: columnState.includes(formatColumnKey(col)), + }), + {}, + ); const newColumns = allFilteredColumnsChecked ? columnState.filter((col) => !filteredColumnMap[col]) - : [ - ...new Set([ - ...columnState, - ...filteredColumns.map((col) => formatColumnKey(col)), - ]), - ]; + : [...new Set([...columnState, ...filteredColumns.map((col) => formatColumnKey(col))])]; const pinnedCount = allFilteredColumnsChecked ? // If uncheck something pinned, reduce the pinnedColumnsCount newColumns.filter((col) => columnState.indexOf(col) < pinnedColumnsCount).length From 8edf01be0cb2cf7bde66c553ae7b54a757e3693d Mon Sep 17 00:00:00 2001 From: Thiago Dallacqua Date: Thu, 24 Oct 2024 16:22:39 -0300 Subject: [PATCH 3/3] refactor(webui): Update ColumnPickerMenu to use runColumns from FlatRuns (#1234) --- webui/react/src/components/ColumnPickerMenu.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/webui/react/src/components/ColumnPickerMenu.tsx b/webui/react/src/components/ColumnPickerMenu.tsx index ec0735cf07f4..b560e1ba8d1f 100644 --- a/webui/react/src/components/ColumnPickerMenu.tsx +++ b/webui/react/src/components/ColumnPickerMenu.tsx @@ -11,6 +11,7 @@ import { Loadable } from 'hew/utils/loadable'; import React, { ChangeEvent, useCallback, useMemo, useState } from 'react'; import { FixedSizeList as List } from 'react-window'; +import { runColumns } from 'pages/FlatRuns/columns'; import { V1ColumnType, V1LocationType } from 'services/api-ts-sdk'; import { ProjectColumn } from 'types'; import { ensureArray } from 'utils/data'; @@ -65,8 +66,6 @@ interface ColumnTabProps { onHeatmapSelectionRemove?: (id: string) => void; } -const KNOWN_BOOLEAN_COLUMNS = ['archived', 'isExpMultitrial', 'parentArchived']; - const ColumnPickerTab: React.FC = ({ columnState, compare, @@ -175,7 +174,7 @@ const ColumnPickerTab: React.FC = ({ ({ index, style }: { index: number; style: React.CSSProperties }) => { const col = filteredColumns[index]; const colType = - KNOWN_BOOLEAN_COLUMNS.includes(col.column) && col.type === V1ColumnType.UNSPECIFIED + (runColumns as readonly string[]).includes(col.column) && col.type === V1ColumnType.UNSPECIFIED ? 'BOOLEAN' : removeColumnTypePrefix(col.type); const getColDisplayName = (col: ProjectColumn) => {