How to implement multi-column sorting with react-data-table-component

Question

I am using a react component called react-data-table-component: https://github.com/jbetancur/react-data-table-component. The component is quite nice and feature rich and I am enjoying it so far. However, the client has requested a new feature whereby they can sort multiple columns at once (with a primary, secondary, tertiary sort, etc...). I do not see any mention of this functionality in the documentation. There is the ability to have custom sort functions per column, and I was hoping someone had an idea on how to implement multi column sorting with a mixture of custom sorting functions and perhaps clever usage of state. Can anyone help point me in the right direction?

Answer 1

I believe I found an answer. I am keeping the row data in state so that the grid renders whenever the data changes. I am going to use the onSort callback to keep a list of columns that are being sorted in state. Then I will use a custom sort function along with a multi sort function https://github.com/chuvikovd/multi-column-sort to achieve the desired result.