T
TanStack•3y ago
automatic-azure

Freeze sorting on a column

Hi, I've defined an initial sort for one column in a multisorting table, and I'd like to always keep that column sorted no matter what other columns the user selects (so all other columns are effectively a "secondary" sort). I can get the initial state: 
  const [sorting, setSorting] = useState([
    {
      id: 'high_priority',
      desc: true
    }
  ]);
  const [sorting, setSorting] = useState([
    {
      id: 'high_priority',
      desc: true
    }
  ]);
to get the high_priority column sorted correctly, but then when the user clicks another column this is forgotten. I tried a custom hook, but I can't figure out how to deal with the updaterFn that's passed to the hook in setSorting. I've been over the docs, but I honestly don't know what the best way to proceed is. Can anyone help me out?
1 Reply
automatic-azure
automatic-azureOP•3y ago
Update: 🤦‍♂️ I managed to sort it when I finally found this Github issue: 
    onSortingChange: (sortingUpdater) => { 
      let newSortVal = sortingUpdater(sorting); 
      setSorting([initialSortState, ...newSortVal]); 
    },
 
    onSortingChange: (sortingUpdater) => { 
      let newSortVal = sortingUpdater(sorting); 
      setSorting([initialSortState, ...newSortVal]); 
    },
where initialSortState = { id:'high_priority', desc: true}.
GitHub
How do you get the value from onSortingChange, or even `onStateCh...
I am attempting to pass functions to a component so I can add them to useTableInstance, but I seem to be missing something here: // Table.tsx export interface TableProps { data: OrderRow[]; onSortC...

Did you find this page helpful?