Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: support multi-type columns in flat run table #10066

Closed
wants to merge 2 commits into from
Closed

fix: support multi-type columns in flat run table #10066

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b9de7ed
fix: support multi-type in flat run table
keita-determined Oct 16, 2024
4e3c1c6
fix: adjust types
keita-determined Oct 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions webui/react/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion webui/react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
"fp-ts": "^2.16.5",
"fuse.js": "^7.0.0",
"hermes-parallel-coordinates": "^0.6.17",
"hew": "npm:@hpe.com/hew@^0.6.50",
"hew": "npm:@hpe.com/hew@^0.6.52",
"humanize-duration": "^3.28.0",
"immutable": "^4.3.0",
"io-ts": "^2.2.21",
Expand Down
13 changes: 6 additions & 7 deletions webui/react/src/components/Searches/columns.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,6 @@ export const getColumnDefs = ({
},
checkpointCount: {
id: 'checkpointCount',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
data: Number(record.experiment.checkpoints),
Expand All @@ -139,11 +138,11 @@ export const getColumnDefs = ({
}),
title: 'Checkpoints',
tooltip: () => undefined,
type: 'number',
width: columnWidths.checkpointCount,
},
checkpointSize: {
id: 'checkpointSize',
isNumerical: true,
renderer: (record: ExperimentWithTrial) =>
handleEmptyCell(record.experiment.checkpointSize, (data) => ({
allowOverlay: false,
Expand All @@ -153,6 +152,7 @@ export const getColumnDefs = ({
})),
title: 'Checkpoint Size',
tooltip: () => undefined,
type: 'number',
width: columnWidths.checkpointSize,
},
description: {
Expand All @@ -174,7 +174,6 @@ export const getColumnDefs = ({
},
duration: {
id: 'duration',
isNumerical: true,
renderer: (record: ExperimentWithTrial) =>
handleEmptyCell(record.experiment.duration, () => ({
allowOverlay: false,
Expand All @@ -184,6 +183,7 @@ export const getColumnDefs = ({
})),
title: 'Duration',
tooltip: () => undefined,
type: 'number',
width: columnWidths.duration,
},
externalExperimentId: {
Expand Down Expand Up @@ -297,7 +297,6 @@ export const getColumnDefs = ({
},
numTrials: {
id: 'numTrials',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
data: record.experiment.numTrials,
Expand All @@ -306,6 +305,7 @@ export const getColumnDefs = ({
}),
title: 'Runs',
tooltip: () => undefined,
type: 'number',
width: columnWidths.numTrials,
},
progress: {
Expand Down Expand Up @@ -335,7 +335,6 @@ export const getColumnDefs = ({
},
searcherMetric: {
id: 'searcherMetric',
isNumerical: false,
renderer: (record: ExperimentWithTrial) =>
handleEmptyCell(record.experiment.searcherMetric, (data) => ({
allowOverlay: false,
Expand All @@ -361,7 +360,6 @@ export const getColumnDefs = ({
},
startTime: {
id: 'startTime',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
copyData: getTimeInEnglish(new Date(record.experiment.startTime)),
Expand All @@ -370,6 +368,7 @@ export const getColumnDefs = ({
}),
title: 'Start Time',
tooltip: () => undefined,
type: 'number',
width: columnWidths.startTime,
},
state: {
Expand Down Expand Up @@ -440,7 +439,6 @@ export const getColumnDefs = ({
export const searcherMetricsValColumn = (columnWidth?: number): ColumnDef<ExperimentWithTrial> => {
return {
id: 'searcherMetricsVal',
isNumerical: true,
renderer: (record: ExperimentWithTrial) =>
handleEmptyCell(record.bestTrial?.searcherMetricsVal, (data) => ({
allowOverlay: false,
Expand All @@ -450,6 +448,7 @@ export const searcherMetricsValColumn = (columnWidth?: number): ColumnDef<Experi
})),
title: 'Searcher Metric Value',
tooltip: () => undefined,
type: 'number',
width: columnWidth ?? DEFAULT_COLUMN_WIDTH,
};
};
Expand Down
13 changes: 6 additions & 7 deletions webui/react/src/pages/F_ExpList/expListColumns.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,6 @@ export const getColumnDefs = ({
},
checkpointCount: {
id: 'checkpointCount',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
data: Number(record.experiment.checkpoints),
Expand All @@ -145,11 +144,11 @@ export const getColumnDefs = ({
}),
title: 'Checkpoints',
tooltip: () => undefined,
type: 'number',
width: columnWidths.checkpointCount ?? defaultColumnWidths.checkpointCount ?? MIN_COLUMN_WIDTH,
},
checkpointSize: {
id: 'checkpointSize',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
copyData: record.experiment.checkpointSize
Expand All @@ -160,6 +159,7 @@ export const getColumnDefs = ({
}),
title: 'Checkpoint Size',
tooltip: () => undefined,
type: 'number',
width: columnWidths.checkpointSize ?? defaultColumnWidths.checkpointSize ?? MIN_COLUMN_WIDTH,
},
description: {
Expand All @@ -176,7 +176,6 @@ export const getColumnDefs = ({
},
duration: {
id: 'duration',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
copyData: getDurationInEnglish(record.experiment),
Expand All @@ -185,6 +184,7 @@ export const getColumnDefs = ({
}),
title: 'Duration',
tooltip: () => undefined,
type: 'number',
width: columnWidths.duration ?? defaultColumnWidths.duration ?? MIN_COLUMN_WIDTH,
},
externalExperimentId: {
Expand Down Expand Up @@ -305,7 +305,6 @@ export const getColumnDefs = ({
},
numTrials: {
id: 'numTrials',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
data: record.experiment.numTrials,
Expand All @@ -314,6 +313,7 @@ export const getColumnDefs = ({
}),
title: 'Trials',
tooltip: () => undefined,
type: 'number',
width: columnWidths.numTrials ?? defaultColumnWidths.numTrials ?? MIN_COLUMN_WIDTH,
},
progress: {
Expand Down Expand Up @@ -346,7 +346,6 @@ export const getColumnDefs = ({
},
searcherMetric: {
id: 'searcherMetric',
isNumerical: false,
renderer: (record: ExperimentWithTrial) => {
const sMetric = record.experiment.searcherMetric ?? '';
return {
Expand Down Expand Up @@ -374,7 +373,6 @@ export const getColumnDefs = ({
},
startTime: {
id: 'startTime',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => ({
allowOverlay: false,
copyData: getTimeInEnglish(new Date(record.experiment.startTime)),
Expand All @@ -383,6 +381,7 @@ export const getColumnDefs = ({
}),
title: 'Start Time',
tooltip: () => undefined,
type: 'number',
width: columnWidths.startTime ?? defaultColumnWidths.startTime ?? MIN_COLUMN_WIDTH,
},
state: {
Expand Down Expand Up @@ -456,7 +455,6 @@ export const searcherMetricsValColumn = (
): ColumnDef<ExperimentWithTrial> => {
return {
id: 'searcherMetricsVal',
isNumerical: true,
renderer: (record: ExperimentWithTrial) => {
const sMetricValue = record.bestTrial?.searcherMetricsVal;

Expand All @@ -483,6 +481,7 @@ export const searcherMetricsValColumn = (
},
title: 'Searcher Metric Value',
tooltip: () => undefined,
type: 'number',
width: columnWidth ?? DEFAULT_COLUMN_WIDTH,
};
};
Expand Down
26 changes: 18 additions & 8 deletions webui/react/src/pages/FlatRuns/FlatRuns.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ import {
SelectionType as SelectionState,
} from 'types';
import handleError from 'utils/error';
import { COLUMN_SEPARATOR } from 'utils/flatRun';
import { eagerSubscribe } from 'utils/observable';
import { pluralizer } from 'utils/string';

Expand Down Expand Up @@ -320,7 +321,14 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
const projectColumnsMap: Loadable<Record<string, ProjectColumn>> = Loadable.map(
projectColumns,
(columns) => {
return columns.reduce((acc, col) => ({ ...acc, [col.column]: col }), {});
return columns.reduce(
(acc, col) => ({
...acc,
[`${col.type}${COLUMN_SEPARATOR}${col.column}`]: col,
[col.column]: col,
}),
{},
);
},
);
const columnDefs = getColumnDefs({
Expand Down Expand Up @@ -388,6 +396,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
default:
break;
}

const columnKey = `${currentColumn.type}${COLUMN_SEPARATOR}${currentColumn.column}`;
switch (currentColumn.type) {
case V1ColumnType.NUMBER: {
const heatmap = projectHeatmap
Expand All @@ -398,7 +408,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
settings.heatmapOn &&
!settings.heatmapSkipped.includes(currentColumn.column)
) {
columnDefs[currentColumn.column] = defaultNumberColumn(
columnDefs[columnKey] = defaultNumberColumn(
currentColumn.column,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[currentColumn.column] ??
Expand All @@ -411,7 +421,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
},
);
} else {
columnDefs[currentColumn.column] = defaultNumberColumn(
columnDefs[columnKey] = defaultNumberColumn(
currentColumn.column,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[currentColumn.column] ??
Expand All @@ -423,7 +433,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
break;
}
case V1ColumnType.DATE:
columnDefs[currentColumn.column] = defaultDateColumn(
columnDefs[columnKey] = defaultDateColumn(
currentColumn.column,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[currentColumn.column] ??
Expand All @@ -433,7 +443,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
);
break;
case V1ColumnType.ARRAY:
columnDefs[currentColumn.column] = defaultArrayColumn(
columnDefs[columnKey] = defaultArrayColumn(
currentColumn.column,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[currentColumn.column] ??
Expand All @@ -445,7 +455,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
case V1ColumnType.TEXT:
case V1ColumnType.UNSPECIFIED:
default:
columnDefs[currentColumn.column] = defaultTextColumn(
columnDefs[columnKey] = defaultTextColumn(
currentColumn.column,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[currentColumn.column] ??
Expand All @@ -459,7 +469,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
.getOrElse([])
.find((h) => h.metricsName === currentColumn.column);

columnDefs[currentColumn.column] = searcherMetricsValColumn(
columnDefs[columnKey] = searcherMetricsValColumn(
settings.columnWidths[currentColumn.column],
heatmap && settings.heatmapOn && !settings.heatmapSkipped.includes(currentColumn.column)
? {
Expand All @@ -469,7 +479,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
: undefined,
);
}
return columnDefs[currentColumn.column];
return columnDefs[columnKey];
})
.flatMap((col) => (col ? [col] : []));
return gridColumns;
Expand Down
Loading
Loading