Need alternative to removed onTableInstanceChange prop

[skempisty]

I saw this was discussed last year in #23. Seems like onTableInstanceChange would be exactly what I need, but now I can't figure out a proper way to handle this case without it -

I have to display the "shown rows count" and the "total rows count" like this outside of the table like this.

I have access to the tableInstanceRef of course, but that's no good for syncing with data outside the table. For instance when I change the amount of rows to show, that new row count can be found in the ref, but I have no way to know when to rerender the component based on that change.

Fyi here is how I'm getting the values to display:
shownRowCount = tableRef?.current?.getPaginationRowModel()?.rows?.length
totalRowCount = tableRef?.current?.getFilteredRowModel()?.rows?.length

Been digging around for a while now - if there's any alternative solution I'd love to give it a try!

[skempisty]

I found a way to get what I need. Github won't let me simply delete this discussion so I'll share what I did.

I used an 'external' pagination state like

const [pagination, setPagination] = useState({
  pageIndex: 0,
  pageSize: 10,
});

attached it to my MaterialReactTable like

<MaterialReactTable
  data={accessList ?? []}
  columns={columns}
  overrideState={{
    pagination,
  }}
  onPaginationChange={setPagination}
/>

and listen to the pagination value changes with useEffect

useEffect(() => {
  const updatedShownRowCount = tableRef?.current?.getPaginationRowModel()?.rows?.length ?? 0;
  const updatedTotalRowCount = tableRef?.current?.getFilteredRowModel()?.rows?.length ?? 0;
  
  setShownRowCount(updatedShownRowCount);
  setTotalRowCount(updatedTotalRowCount);
}, [pagination.pageIndex, pagination.pageSize]);

[KevinVandy]

That's not a workaround. That's the recommended way to do it throughou the docs.