Skip to content

Commit

Permalink
rebased
Browse files Browse the repository at this point in the history
  • Loading branch information
@thiagodallacqua-hpe
thiagodallacqua-hpe committed Oct 31, 2024
1 parent 998dcb9 commit cc011f4
Showing 1 changed file with 48 additions and 66 deletions.
114 changes: 48 additions & 66 deletions webui/react/src/pages/FlatRuns/FlatRuns.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ import Pagination from 'hew/Pagination';
import Row from 'hew/Row';
import { useToast } from 'hew/Toast';
import { Loadable, Loaded, NotLoaded } from 'hew/utils/loadable';
import { groupBy, keyBy, mapValues } from 'lodash';
import { useObservable } from 'micro-observables';
import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
import { v4 as uuidv4 } from 'uuid';
Expand Down Expand Up @@ -179,7 +178,6 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
const [runs, setRuns] = useState<Loadable<FlatRun>[]>(INITIAL_LOADING_RUNS);

const [sorts, setSorts] = useState<Sort[]>([EMPTY_SORT]);

const sortString = useMemo(() => makeSortString(sorts.filter(validSort.is)), [sorts]);
const loadableFormset = useObservable(formStore.formset);
const rootFilterChildren: Array<FormGroup | FormField> = Loadable.match(loadableFormset, {
Expand Down Expand Up @@ -239,24 +237,6 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
}
}, [projectId]);

// expand sorts to include types from metadata columns so the column ids match
const expandedSorts = useMemo(() => {
return projectColumns.match({
_: () => sorts,
Loaded(pc) {
const groupedColumns = groupBy(pc, (c) => c.column);
const columnToExpandedColumns = mapValues(groupedColumns, (cols) =>
cols.map((c) => formatColumnKey(c)),
);
return sorts
.filter(validSort.is)
.flatMap((sort) =>
columnToExpandedColumns[sort.column].map((ec) => ({ ...sort, column: ec })),
);
},
});
}, [sorts, projectColumns]);

const arrayTypeColumns = useMemo(() => {
const arrayTypeColumns = projectColumns
.getOrElse([])
Expand Down Expand Up @@ -312,11 +292,13 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
return [...STATIC_COLUMNS, ...settings.columns.slice(0, settings.pinnedColumnsCount)];
}, [settings.columns, settings.pinnedColumnsCount]);

const projectColumnsMap = useMemo(() => {
return projectColumns.map((columns) => keyBy(columns, formatColumnKey));
}, [projectColumns]);

const columns: ColumnDef<FlatRun>[] = useMemo(() => {
const projectColumnsMap: Loadable<Record<string, ProjectColumn>> = Loadable.map(
projectColumns,
(columns) => {
return columns.reduce((acc, col) => ({ ...acc, [formatColumnKey(col)]: col }), {});
},
);
const columnDefs = getColumnDefs({
appTheme,
columnWidths: settings.columnWidths,
Expand Down Expand Up @@ -397,8 +379,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
columnDefKey,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[columnDefKey] ??
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
dataPath,
{
max: heatmap.max,
Expand All @@ -410,8 +392,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
columnDefKey,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[columnDefKey] ??
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
dataPath,
undefined,
);
Expand All @@ -423,8 +405,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
columnDefKey,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[columnDefKey] ??
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
dataPath,
);
break;
Expand All @@ -433,8 +415,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
columnDefKey,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[columnDefKey] ??
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
dataPath,
);
break;
Expand All @@ -445,8 +427,8 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
columnDefKey,
currentColumn.displayName || currentColumn.column,
settings.columnWidths[columnDefKey] ??
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
defaultColumnWidths[columnDefKey as RunColumn] ??
MIN_COLUMN_WIDTH,
dataPath,
);
}
Expand All @@ -459,9 +441,9 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
settings.columnWidths[currentColumn.column],
heatmap && settings.heatmapOn && !settings.heatmapSkipped.includes(currentColumn.column)
? {
max: heatmap.max,
min: heatmap.min,
}
max: heatmap.max,
min: heatmap.min,
}
: undefined,
);
}
Expand All @@ -473,7 +455,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
appTheme,
columnsIfLoaded,
isDarkMode,
projectColumnsMap,
projectColumns,
projectHeatmap,
dataGridSelection.rows,
settings.columnWidths,
Expand Down Expand Up @@ -835,32 +817,32 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
? null
: !isPinned
? {
icon: <Icon decorative name="pin" />,
key: 'pin',
label: 'Pin column',
onClick: () => {
const newColumnsOrder = columnsIfLoaded.filter((c) => c !== columnId);
newColumnsOrder.splice(settings.pinnedColumnsCount, 0, columnId);
handleColumnsOrderChange(
newColumnsOrder,
Math.min(settings.pinnedColumnsCount + 1, columnsIfLoaded.length),
);
},
}
icon: <Icon decorative name="pin" />,
key: 'pin',
label: 'Pin column',
onClick: () => {
const newColumnsOrder = columnsIfLoaded.filter((c) => c !== columnId);
newColumnsOrder.splice(settings.pinnedColumnsCount, 0, columnId);
handleColumnsOrderChange(
newColumnsOrder,
Math.min(settings.pinnedColumnsCount + 1, columnsIfLoaded.length),
);
},
}
: {
disabled: settings.pinnedColumnsCount <= 1,
icon: <Icon decorative name="pin" />,
key: 'unpin',
label: 'Unpin column',
onClick: () => {
const newColumnsOrder = columnsIfLoaded.filter((c) => c !== columnId);
newColumnsOrder.splice(settings.pinnedColumnsCount - 1, 0, columnId);
handleColumnsOrderChange(
newColumnsOrder,
Math.max(settings.pinnedColumnsCount - 1, 0),
);
},
disabled: settings.pinnedColumnsCount <= 1,
icon: <Icon decorative name="pin" />,
key: 'unpin',
label: 'Unpin column',
onClick: () => {
const newColumnsOrder = columnsIfLoaded.filter((c) => c !== columnId);
newColumnsOrder.splice(settings.pinnedColumnsCount - 1, 0, columnId);
handleColumnsOrderChange(
newColumnsOrder,
Math.max(settings.pinnedColumnsCount - 1, 0),
);
},
},
{
icon: <Icon decorative name="eye-close" />,
key: 'hide',
Expand Down Expand Up @@ -889,9 +871,9 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
sortCount === 0
? []
: [
{ type: 'divider' as const },
...sortMenuItemsForColumn(column, sorts, handleSortChange),
];
{ type: 'divider' as const },
...sortMenuItemsForColumn(column, sorts, handleSortChange),
];
items.push(...sortMenuItems);
}

Expand Down Expand Up @@ -974,7 +956,7 @@ const FlatRuns: React.FC<Props> = ({ projectId, workspaceId, searchId }) => {
[
bannedFilterColumns,
bannedSortColumns,
projectColumnsMap,
projectColumns,
settings.pinnedColumnsCount,
settings.heatmapOn,
settings.heatmapSkipped,
Expand Down

0 comments on commit cc011f4

Please sign in to comment.