How to edit row selected state outside of the component?

[Buuntu]

I've been struggling on how to edit the selected row state outside of the component. I got a working demo up here: https://codesandbox.io/s/react-table-editable-example-cumyh?file=/src/App.js.

This works, the problem though is when you add custom filtering to this. Custom filtering sometimes gets rid of the selectedFlatRows array. For example, when a checked row is filtered out, that row object is no longer available to call toggleRowSelected().

I think there is probably an easier way but since there are no examples in the docs or discussion it's hard for me to figure it out without looking at the source code. If I get this working I'd love to submit a PR to add an example to the docs.

[Buuntu]

Also when trying to manually deselect a row from outside of the component using toggleRowSelected(), if the row is hidden due to a filter I get this error:

Cannot read property 'isSelected' of undefined

From the docs it looks like setGlobalFilter is what I want: https://react-table.tanstack.com/docs/api/useGlobalFilter#instance-properties. However if the filtering is more complex than just a search value it's not clear how to do this. For example, say I wanted a button that filters out every other row, something like:

  setGlobalFilter((data) => {
  if (filterOn) {
      return data.filter((column, idx) => {
        return idx % 2 === 0;
      });
    }
  });

I can set this at the useMemo level for the data but then I run into issues when selecting hidden rows as outlined in the comment above.

Here is a codesandbox of what I'm trying to achieve: https://codesandbox.io/s/react-table-editable-example-with-filter-my3p7?file=/src/App.js