'Why are react-table pagination and filter reset by changing its data?

I added 4 custom columns to my table columns list using its Cell property; each of them in each row contains a checkbox that changes a specific property of the table's data state; its data state structure is something like so:

export type dataType = {
    id: number;
    getAccess: boolean;
    insertAccess: boolean;
    editAccess: boolean;
    deleteAccess: boolean;
}[];

I don't want react-table pagination to reset to its first page when the table's data state is modified by the checkboxes (also about the table's filter).

Does anyone know about it?



Solution 1:[1]

I found the solution by adding autoResetPage: false and autoResetFilters: false to useTable hook like so

    const tableInstance = useTable({
        columns,
        data,
        autoResetPage: false,
        autoResetFilters: false
    }, usePagination)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1