eui icon indicating copy to clipboard operation
eui copied to clipboard

[EuiBasicTable] Allow sorting by nested property

Open thompsongl opened this issue 3 years ago • 0 comments

Given a EuiBasicTable that displays items with nested properties:

interface ComplexItem {
  active: boolean;
  complex: {
    name: string;
  };
}

<EuiBasicTable<ComplexItem>
  items={[
    {
      active: true,
      complex: {
        name: 'Name',
      },
    },
  ]}
  columns={[
    {
      field: 'active',
      name: 'Is Active',
    },
    {
      field: 'complex.name',
      name: 'Name',
    },
  ]}
  sorting={{ sort: { field: 'complex.name', direction: 'asc' } }}
/>

Note that the sort field refers to the nested property complex.name. This works in runtime, but results in a type error because sort.field is defined as keyof ComplexName which does not allow for nested keys.

EuiInMemoryTable allows this type of nested property sorting. EuiBasicTable should also. EuiInMemoryTable uses a simpler type: https://github.com/elastic/eui/blob/fdd5323b9cfefb924b7115f0a695ff91b1aa6b35/src/services/sort/property_sort.ts#L17-L20 We should validate that string is acceptable or if we can infer all possible nested keys with a new type (preferably the latter and use in both components).

thompsongl avatar Mar 24 '22 14:03 thompsongl