Reset an row selections on page load within material react table

Question

Using Material React Table V1 is there a prop perhaps within initialState to ensure that on page load of any table, ensure that no rows are selected.

I have something like this:

import { MaterialReactTable } from 'material-react-table';

      <MaterialReactTable
        key={refreshPage}
        columns={myTableColumns}
        data={myTableContent}
        enableColumnResizing
        enableFullScreenToggle={false}
        enableHiding={false}
        enablePinning={!isMobile}
        enableExpanding
        enableStickyHeader
        enableRowSelection
      />

I basically want to be able to reset any row selections whenever the table is loaded on page load.

I tried to look out for something like:

table.toggleAllRowsSelected(false) on page load but I don't have access to table

Answer 1

Use the initialState prop combined with a selectedRowIds property set to an empty object. This will effectively initialize the table with no rows selected.

import { MaterialReactTable } from 'material-react-table';

<MaterialReactTable
  key={refreshPage}
  columns={myTableColumns}
  data={myTableContent}
  initialState={{
    selectedRowIds: {}, // This will ensure no rows are selected initially
  }}
  enableColumnResizing
  enableFullScreenToggle={false}
  enableHiding={false}
  enablePinning={!isMobile}
  enableExpanding
  enableStickyHeader
  enableRowSelection
/>

Answer 2

Just in case anyone else comes across this issue/requirement using material-react-table V1, I managed to solve this as follows:

const [selection, setSelection] = useState({});

useEffect(() => {
    setSelection({});
}, [myId]);

<MaterialReactTable
  key={refreshPage}
  columns={myTableColumns}
  data={myTableContent}
  enableColumnResizing
  enableFullScreenToggle={false}
  enableHiding={false}
  enablePinning={!isMobile}
  enableExpanding
  enableStickyHeader
  enableRowSelection
  onRowSelectionChange={setSelection}
  state={{ selection }}
/>

The inclusion of onRowSelectionChange and state={{ selection }} solved my issue.

More info can be found here: State options