pagination not working properly in react boostrap table next

Question

I have implemented table with pagination using BootstrapTable from react-bootstrap-table and taking data from external API. Every time will receive 10 items. Therefore the pageSize is 10 but I get the totalPages variable from API which is let's say 5. Unfortunately, the table data is each time 10 so there is just one page

https://codesandbox.io/s/zealous-archimedes-tbcy9?file=/src/Tablepagination.js:732-923

for output purpose used sample products instead of external api

Answer 1

      const lastIndex = this.state.currentPage * this.state.detailsperpage;
      const firstIndex =  lastIndex - this.state.detailsperpage;
      const currentDetails = this.state.details.slice(firstIndex,lastIndex); 
      const totalpages = Math.ceil(this.state.details.length / this.state.detailsperpage)

set the state as currentpage = 1,detailsperpage = 10 and map currentDetails in jsx hope this helps..!!