The problem is in behaviour of preinstalled logic of mui datatables Here is my options for table
count: ticket_count,
rowsPerPageOptions: [10, 50, 100, 200],
rowsPerPage: perPage,
page: pageNumber,
serverSide: true,
onRowSelectionChange: (currentRowSelected) => {
let ticket = data[currentRowSelected[0].dataIndex];
ticket
? dispatch(selectDataInTable(ticket))
: dispatch(selectDataInTable({}));
},
jumpToPage: true,
textLabels: {
body: {
noMatch: loadingTickets ? (
<LinearProgress />
) : (
'Sorry, there is no matching data to display'
),
},
},
onChangeRowsPerPage: (num) => {
dispatch(setPerPage(num));
dispatch(setPageNum(0));
dispatch(fetchTicketsAsync(accountId, 0, num, pickedCategory));
},
onChangePage: (num) => {
dispatch(
fetchTicketsAsync(accountId, num * perPage, perPage, pickedCategory)
);
dispatch(setPageNum(num));
},
onTableChange: (action, tableState) => {
switch (action) {
case 'search':
return setTimeout(() => {
searchData(tableState.searchText);
}, 200);
case 'filterChange':
if (tableState.filterList[8]) {
setPickedCategory(tableState.filterList[8][0]);
tableState.page = 0;
}
break;
default:
return;
}
},
};`
i.e when I am on page number 3 ( 3 times click on next arrow ) I have 15 rows per page. rows per page on 15. Then I try to change my rows per page to 25 and expect that I (as user) will see from 31 to 56. But it jumps on another condition. after changing rows per page. I have 2 cases of using this library. With server pagination and client pagination. But in both cases it works wrong. With server pagination I have query parameter &start={number} and I try to put there result of calculation NUMBER_OF_PAGE * ROWS_PER_PAGE. But it work only for changing page, and has same behaviour as I mentioned above when i thy to change rows per page