25 lines
870 B
JavaScript
25 lines
870 B
JavaScript
import Pagination from "react-bootstrap/Pagination";
|
|
|
|
const ListPagination = (props) => {
|
|
const { totalPages, page, setPage } = props;
|
|
|
|
const handlePaginationItemClick = (event) => {
|
|
const targetPage = Number(event.currentTarget.dataset.page);
|
|
if (!isNaN(targetPage)) {
|
|
setPage(targetPage);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Pagination className="justify-content-end">
|
|
{page !== 1 ? <Pagination.Prev data-page={page - 1} onClick={handlePaginationItemClick}/> : null}
|
|
{Array.from({ length: totalPages }, (v, i) => i + 1).map(n => (
|
|
<Pagination.Item key={`page${n}`} active={n === page} data-page={n} onClick={handlePaginationItemClick}>{n}</Pagination.Item>
|
|
))}
|
|
{page !== totalPages ? <Pagination.Next data-page={page + 1} onClick={handlePaginationItemClick}/> : null}
|
|
</Pagination>
|
|
);
|
|
};
|
|
|
|
export default ListPagination;
|