Default sorted column in AnalyticalTable

[SvetoslavZ99]

Hello,

I am using AnalyticalTable component (v1) and have provided the "filterable" prop.

Everything is working as expected, when I click on one of the table columns, I can properly filter in asc or dsc order.

The thing is, I want my first column to be in asc order sorted when I load my page, and the icon to be visible, so the user can know that this is the default for this table. (in the images example taken from the docs, is the Name column)

Is there a way to set it up properly, maybe I am missing something while I create my table columns? I couldnt find an example in the documentation with pre-sorted column.

[Lukas742]

Hi @SvetoslavZ99

you can use the reactTableOptions.initialState object to achieve this.

      <AnalyticalTable
        {...otherProps}
        reactTableOptions={{
          initialState: {
            columnOrder: ['age', 'name'],
            filters: [{ id: 'age', value: '27' }],
            groupBy: ['age'],
            hiddenColumns: ['name'],
            selectedRowIds: { 2: true, 5: true, '18.3': true },
            sortBy: [
              {
                id: 'age',
                desc: true,
              },
            ], // <-- this is the option you can use
            expanded: {
              '18': true,
              '18.3': true,
            },
          },
        }}
      />

https://stackblitz.com/edit/ui5wcr-at-initial-state?file=src%2FApp.tsx,src%2FdataTree.json

[SvetoslavZ99]

Thanks a lot! That is pretty clean solution!