40 lines
843 B
JavaScript
40 lines
843 B
JavaScript
import Pagination from 'react-bootstrap/Pagination';
|
|
import Container from 'react-bootstrap/Container';
|
|
|
|
function Paginator({page, setPage, totalItems, itemsPerPage}) {
|
|
if (totalItems <= itemsPerPage) {
|
|
return null;
|
|
}
|
|
|
|
let active = page;
|
|
const lastPage = Math.ceil(totalItems / itemsPerPage);
|
|
let items = [];
|
|
for (let number = 1; number <= lastPage; number++) {
|
|
items.push(
|
|
<Pagination.Item
|
|
key={number}
|
|
active={number === active}
|
|
onClick={() => setPage(number)}
|
|
>
|
|
{number}
|
|
</Pagination.Item>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Pagination className="justify-content-center mt-4">
|
|
<Pagination.First
|
|
onClick={() => setPage(1)}
|
|
disabled={page === 1}
|
|
/>
|
|
{items}
|
|
<Pagination.Last
|
|
onClick={() => setPage(lastPage)}
|
|
disabled={page === lastPage}
|
|
/>
|
|
</Pagination>
|
|
);
|
|
}
|
|
|
|
export default Paginator;
|