[DataGrid] Enhance comparator signature to support advanced use cases (…

…#7406)

Co-authored-by: Cee Chen <[email protected]>

changelogs/upcoming/7406.md

@@ -0,0 +1 @@
+- Updated `EuiDataGridSchemaDetector`'s comparator arguments to include entry indexes

src/components/datagrid/data_grid_types.ts

@@ -100,9 +100,14 @@ export interface EuiDataGridSchemaDetector {
    */
   detector: (value: string) => number;
   /**
-   * A custom comparator function when performing in-memory sorting on this data type, takes `(a: string, b: string, direction: 'asc' | 'desc) => -1 | 0 | 1`
-   */
-  comparator?: (a: string, b: string, direction: 'asc' | 'desc') => -1 | 0 | 1;
+   * A custom comparator function when performing in-memory sorting on this data type, takes `(a: string, b: string, direction: 'asc' | 'desc', indexes: {aIndex: number, bIndex: number}) => -1 | 0 | 1`
+   */
+  comparator?: (
+    a: string,
+    b: string,
+    direction: 'asc' | 'desc',
+    indexes: { aIndex: number; bIndex: number }
+  ) => -1 | 0 | 1;
   /**
    * The icon used to visually represent this data type. Accepts any `EuiIcon IconType`.
    */

src/components/datagrid/utils/sorting.test.ts

@@ -0,0 +1,59 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { renderHook } from '@testing-library/react';
+import { useSorting, type useSortingArgs } from './sorting';
+
+function getDefaultArgs(): useSortingArgs {
+  return {
+    sorting: {
+      columns: [{ id: '1', direction: 'asc' }],
+      onSort: jest.fn(),
+    },
+    schema: { '1': { columnType: 'number' } },
+    schemaDetectors: [],
+    startRow: 0,
+    inMemoryValues: { '0': { '1': '0' }, '1': { '1': '1' } },
+    inMemory: { level: 'sorting' },
+  };
+}
+
+function testUseSorting(args: useSortingArgs) {
+  return renderHook(() => useSorting(args)).result.current;
+}
+
+describe('useSorting', () => {
+  it('returns null if no sorting object is provided', () => {
+    expect(
+      testUseSorting({ ...getDefaultArgs(), schema: {}, inMemoryValues: {} })
+        .sortedRowMap
+    ).toEqual([]);
+  });
+
+  it('should pass all arguments to custom comparator fn', () => {
+    const customComparator = jest.fn();
+    testUseSorting({
+      ...getDefaultArgs(),
+      schemaDetectors: [
+        {
+          type: 'number',
+          detector: () => 1,
+          comparator: customComparator,
+          icon: 'empty',
+          sortTextAsc: 'ASC',
+          sortTextDesc: 'DESC',
+        },
+      ],
+    });
+
+    expect(customComparator).toHaveBeenCalledWith('1', '0', 'asc', {
+      aIndex: 1,
+      bIndex: 0,
+    });
+  });
+});

src/components/datagrid/utils/sorting.ts

@@ -24,21 +24,23 @@ export const DataGridSortingContext =
     getCorrectRowIndex: (number) => number,
   });
 
+export type useSortingArgs = {
+  sorting?: EuiDataGridSorting;
+  inMemory?: EuiDataGridInMemory;
+  inMemoryValues: EuiDataGridInMemoryValues;
+  schema: EuiDataGridSchema;
+  schemaDetectors: EuiDataGridSchemaDetector[];
+  startRow: number;
+};
+
 export const useSorting = ({
   sorting,
   inMemory,
   inMemoryValues,
   schema,
   schemaDetectors,
   startRow,
-}: {
-  sorting?: EuiDataGridSorting;
-  inMemory?: EuiDataGridInMemory;
-  inMemoryValues: EuiDataGridInMemoryValues;
-  schema: EuiDataGridSchema;
-  schemaDetectors: EuiDataGridSchemaDetector[];
-  startRow: number;
-}) => {
+}: useSortingArgs) => {
   const sortingColumns = sorting?.columns;
 
   const sortedRowMap = useMemo(() => {
@@ -80,7 +82,10 @@ export const useSorting = ({
             }
           }
 
-          const result = comparator(aValue, bValue, column.direction);
+          const result = comparator(aValue, bValue, column.direction, {
+            aIndex: a.index,
+            bIndex: b.index,
+          });
           // only return if the columns are unequal, otherwise allow the next sort-by column to run
           if (result !== 0) return result;
         }