refactor: Decouple IrisGrid from Dh.Sort, use SortDescriptor instead (#2583)

- Decouple IrisGrid from Dh.Sort, delegate sort hydration to model to
allow plugins use own sort API
- Allow negative column indexes in IrisGrid, so plugins could sort and
filter on non-columns, such as ColumnBy sources

Author: vbabich

packages/dashboard-core-plugins/src/panels/IrisGridPanel.tsx

@@ -53,6 +53,7 @@ import {
   type RowDataMap,
   type AdvancedFilterOptions,
   type FormattingRule,
+  type SortDescriptor,
 } from '@deephaven/jsapi-utils';
 import Log from '@deephaven/log';
 import {
@@ -199,7 +200,7 @@ interface IrisGridPanelState {
   columnAlignmentMap: Map<string, CanvasTextAlign>;
   isFilterBarShown: boolean;
   quickFilters: ReadonlyQuickFilterMap;
-  sorts: readonly dh.Sort[];
+  sorts: readonly SortDescriptor[];
   userColumnWidths: ModelSizeMap;
   userRowHeights: ModelSizeMap;
   reverse: boolean;

packages/iris-grid/src/CommonTypes.tsx

@@ -1,4 +1,7 @@
-import { type AdvancedFilterOptions } from '@deephaven/jsapi-utils';
+import {
+  type AdvancedFilterOptions,
+  type SortDescriptor,
+} from '@deephaven/jsapi-utils';
 import { type GridRangeIndex, type ModelIndex } from '@deephaven/grid';
 import type { dh } from '@deephaven/jsapi-types';
 import { type Shortcut } from '@deephaven/components';
@@ -97,7 +100,7 @@ export interface IrisGridStateOverride extends Record<string, unknown> {
   loadingScrimProgress: number | null;
   advancedFilters: ReadonlyAdvancedFilterMap;
   quickFilters: ReadonlyQuickFilterMap;
-  sorts: readonly dh.Sort[];
+  sorts: readonly SortDescriptor[];
   reverse: boolean;
   rollupConfig: UIRollupConfig | undefined;
 }

packages/iris-grid/src/IrisGrid.tsx

@@ -77,6 +77,7 @@ import {
   type TableColumnFormat,
   type Settings,
   isSortDirection,
+  type SortDescriptor,
 } from '@deephaven/jsapi-utils';
 import {
   assertNotNull,
@@ -237,7 +238,7 @@ function isEmptyConfig({
   rollupConfig?: UIRollupConfig;
   searchFilter?: DhType.FilterCondition;
   selectDistinctColumns: readonly ColumnName[];
-  sorts: readonly DhType.Sort[];
+  sorts: readonly SortDescriptor[];
 }): boolean {
   return (
     advancedFilters.size === 0 &&
@@ -312,7 +313,7 @@ export interface IrisGridProps {
   /** @deprecated use `partitionConfig` instead */
   partitions?: (string | null)[];
   partitionConfig?: PartitionConfig;
-  sorts: readonly DhType.Sort[];
+  sorts: readonly SortDescriptor[];
 
   /** @deprecated use `reverse` instead */
   reverseType?: ReverseType;
@@ -396,7 +397,7 @@ export interface IrisGridState {
   shownAdvancedFilter: number | null;
   hoverAdvancedFilter: number | null;
 
-  sorts: readonly DhType.Sort[];
+  sorts: readonly SortDescriptor[];
   reverse: boolean;
   customColumns: readonly ColumnName[];
   selectDistinctColumns: readonly ColumnName[];
@@ -1421,7 +1422,7 @@ class IrisGrid extends Component<IrisGridProps, IrisGridState> {
       loadingScrimProgress: number | null,
       quickFilters: ReadonlyQuickFilterMap,
       advancedFilters: ReadonlyAdvancedFilterMap,
-      sorts: readonly DhType.Sort[],
+      sorts: readonly SortDescriptor[],
       reverse: boolean,
       rollupConfig: UIRollupConfig | undefined,
       isMenuShown: boolean
@@ -1602,6 +1603,11 @@ class IrisGrid extends Component<IrisGridProps, IrisGridState> {
     return '';
   }
 
+  /**
+   * Get the model column index for the provided visible index
+   * @param columnIndex Visible column index
+   * @returns Model column index, or null if not found
+   */
   getModelColumn(columnIndex: GridRangeIndex): ModelIndex | null | undefined {
     const { metrics } = this.state;
     assertNotNull(metrics);
@@ -1610,6 +1616,11 @@ class IrisGrid extends Component<IrisGridProps, IrisGridState> {
       return null;
     }
 
+    if (columnIndex != null && columnIndex < 0) {
+      // ColumnBy sources aren't movable, so just return the index directly
+      return columnIndex;
+    }
+
     return columnIndex != null ? modelColumns.get(columnIndex) : null;
   }
 
@@ -2842,7 +2853,7 @@ class IrisGrid extends Component<IrisGridProps, IrisGridState> {
     }
   }
 
-  updateSorts(sorts: readonly DhType.Sort[]): void {
+  updateSorts(sorts: readonly SortDescriptor[]): void {
     this.startLoading('Sorting...');
     this.setState({ sorts });
     this.grid?.forceUpdate();

packages/iris-grid/src/IrisGridModel.ts

@@ -13,7 +13,7 @@ import {
   type VisibleIndex,
 } from '@deephaven/grid';
 import type { dh as DhType } from '@deephaven/jsapi-types';
-import { type Formatter } from '@deephaven/jsapi-utils';
+import { type Formatter, type SortDescriptor } from '@deephaven/jsapi-utils';
 import {
   type ColumnName,
   type UITotalsTableConfig,
@@ -274,12 +274,12 @@ abstract class IrisGridModel<
   /**
    * @returns The sorts used on this model
    */
-  abstract get sort(): readonly DhType.Sort[];
+  abstract get sort(): readonly SortDescriptor[];
 
   /**
    * @param sort The sorts to use on this model
    */
-  abstract set sort(sort: readonly DhType.Sort[]);
+  abstract set sort(sort: readonly SortDescriptor[]);
 
   /**
   /**

packages/iris-grid/src/IrisGridModelUpdater.tsx

@@ -3,7 +3,7 @@
 import { useEffect, useMemo } from 'react';
 import type { dh } from '@deephaven/jsapi-types';
 import { type ModelIndex, type MoveOperation } from '@deephaven/grid';
-import { type Formatter } from '@deephaven/jsapi-utils';
+import { type SortDescriptor, type Formatter } from '@deephaven/jsapi-utils';
 import { EMPTY_ARRAY, EMPTY_MAP } from '@deephaven/utils';
 import { useOnChange } from '@deephaven/react-hooks';
 import IrisGridUtils from './IrisGridUtils';
@@ -29,7 +29,7 @@ interface IrisGridModelUpdaterProps {
   left: number | null;
   right: number | null;
   filter: readonly dh.FilterCondition[];
-  sorts: readonly dh.Sort[];
+  sorts: readonly SortDescriptor[];
   reverse?: boolean;
   customColumns: readonly ColumnName[];
   movedColumns: readonly MoveOperation[];

packages/iris-grid/src/IrisGridRenderer.ts

@@ -9,8 +9,7 @@ import {
   GridUtils,
   type VisibleIndex,
 } from '@deephaven/grid';
-import type { dh } from '@deephaven/jsapi-types';
-import { TableUtils } from '@deephaven/jsapi-utils';
+import { type SortDescriptor, TableUtils } from '@deephaven/jsapi-utils';
 import { assertNotNull, getOrThrow } from '@deephaven/utils';
 import {
   type AdvancedFilter,
@@ -52,7 +51,7 @@ export class IrisGridRenderer extends GridRenderer {
 
   protected dataBarCellRenderer = new IrisGridDataBarCellRenderer();
 
-  getSortIcon(sort: dh.Sort | null, size: number): Path2D | null {
+  getSortIcon(sort: SortDescriptor | null, size: number): Path2D | null {
     if (!sort) {
       return null;
     }

packages/iris-grid/src/IrisGridTableModelTemplate.ts

@@ -26,8 +26,10 @@ import {
   Formatter,
   FormatterUtils,
   DateUtils,
+  type SortDescriptor,
 } from '@deephaven/jsapi-utils';
 import IrisGridModel, { type DisplayColumn } from './IrisGridModel';
+
 import AggregationOperation from './sidebar/aggregations/AggregationOperation';
 import IrisGridUtils from './IrisGridUtils';
 import MissingKeyError from './MissingKeyError';
@@ -1251,13 +1253,13 @@ class IrisGridTableModelTemplate<
     );
   }
 
-  get sort(): DhType.Sort[] {
+  get sort(): readonly SortDescriptor[] {
     return this.table.sort;
   }
 
-  set sort(sort: DhType.Sort[]) {
+  set sort(sort: readonly SortDescriptor[]) {
     this.closeSubscription();
-    this.table.applySort(sort);
+    this.table.applySort(this.irisGridUtils.hydrateDhSort(this.columns, sort));
     this.applyViewport();
   }
 

packages/iris-grid/src/IrisGridTestUtils.ts

@@ -1,7 +1,8 @@
 import { type GridRangeIndex, type ModelSizeMap } from '@deephaven/grid';
-import { type dh as DhType } from '@deephaven/jsapi-types';
-import { Formatter } from '@deephaven/jsapi-utils';
+import type { dh as DhType } from '@deephaven/jsapi-types';
+import { Formatter, type SortDescriptor } from '@deephaven/jsapi-utils';
 import IrisGridProxyModel from './IrisGridProxyModel';
+import IrisGridUtils from './IrisGridUtils';
 
 class IrisGridTestUtils {
   static DEFAULT_TYPE = 'java.lang.String';
@@ -20,8 +21,11 @@ class IrisGridTestUtils {
 
   private dh: typeof DhType;
 
+  private irisGridUtils: IrisGridUtils;
+
   constructor(dh: typeof DhType) {
     this.dh = dh;
+    this.irisGridUtils = new IrisGridUtils(dh);
   }
 
   makeColumn(
@@ -72,9 +76,16 @@ class IrisGridTestUtils {
     return new (this.dh as any).FilterCondition();
   }
 
-  makeSort(): DhType.Sort {
+  makeSort(column: DhType.Column = this.makeColumn()): DhType.Sort {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    return new (this.dh as any).Sort();
+    return new (this.dh as any).Sort({ column });
+  }
+
+  hydrateSort(
+    sortDescriptor: readonly SortDescriptor[],
+    columns: DhType.Column[]
+  ): DhType.Sort[] {
+    return this.irisGridUtils.hydrateDhSort(columns, sortDescriptor);
   }
 
   makeTable({
@@ -85,7 +96,7 @@ class IrisGridTestUtils {
   }: {
     columns?: DhType.Column[];
     size?: number;
-    sort?: readonly DhType.Sort[];
+    sort?: readonly SortDescriptor[];
     layoutHints?: Partial<DhType.LayoutHints>;
   } = {}): DhType.Table {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any

packages/iris-grid/src/IrisGridUtils.test.ts

@@ -185,12 +185,16 @@ describe('sort exporting/importing', () => {
 
       expect(importedSort).toEqual([
         expect.objectContaining({
-          column: columns[3],
+          column: expect.objectContaining({
+            name: columns[3].name,
+          }),
           isAbs: false,
           direction: 'ASC',
         }),
         expect.objectContaining({
-          column: columns[7],
+          column: expect.objectContaining({
+            name: columns[7].name,
+          }),
           isAbs: true,
           direction: 'DESC',
         }),
@@ -375,6 +379,15 @@ describe('remove columns in moved columns', () => {
   });
 });
 
+describe('removeSortsInColumns', () => {
+  it('removes sort for the given column names', () => {
+    const table = makeTable();
+    const sort = [table.columns[2].sort(), table.columns[5].sort().desc()];
+    const newSort = IrisGridUtils.removeSortsInColumns(sort, ['name_2']);
+    expect(newSort).toEqual([table.columns[5].sort().desc()]);
+  });
+});
+
 describe('getPrevVisibleColumns', () => {
   const columns = irisGridTestUtils.makeColumns(5);
   it('returns [] for startIndex < 0', () => {