T
TanStack•10mo ago
conscious-sapphire

Where to pin a row based on value

I have a requirement that all rows with a certain value are pinned to the top of the table. I'm using Row Pinning and it's all working great. However, I'm not sure where the best place to do the pinning is. I tried in the column definition's cell property, i.e. 
cell: ({ row }) => {
  if (
    row.original.status === 'Waiting for Approval' &&
    !row.getIsPinned()
  ) {
    row.pin('top');
  }

  return row.original.status;
}
cell: ({ row }) => {
  if (
    row.original.status === 'Waiting for Approval' &&
    !row.getIsPinned()
  ) {
    row.pin('top');
  }

  return row.original.status;
}
however, this is resulting in a bad setState error (my table state is held in a provider): 
Warning: Cannot update a component (`TableStateProvider`) while rendering a different component (`cell`). To locate the bad setState() call inside `cell`, follow the stack trace as described....
Warning: Cannot update a component (`TableStateProvider`) while rendering a different component (`cell`). To locate the bad setState() call inside `cell`, follow the stack trace as described....
So I'm wondering if there is a better place to do the pinning of the rows? Many thanks!
0 Replies
No replies yetBe the first to reply to this messageJoin

Did you find this page helpful?