eui
eui copied to clipboard
[EuiBasicTable] Allow sorting by nested property
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).