shlink-web-client/src/short-urls/Paginator.js

56 lines
1.4 KiB
JavaScript
Raw Normal View History

2018-06-17 19:13:55 +03:00
import React from 'react';
import { Link } from 'react-router-dom';
import { Pagination, PaginationItem, PaginationLink } from 'reactstrap';
import PropTypes from 'prop-types';
2018-08-26 00:45:03 +03:00
import { range } from 'ramda';
2018-06-17 19:13:55 +03:00
const propTypes = {
serverId: PropTypes.string.isRequired,
paginator: PropTypes.shape({
currentPage: PropTypes.number,
pagesCount: PropTypes.number,
}),
};
2018-06-17 19:13:55 +03:00
export default function Paginator({ paginator = {}, serverId }) {
const { currentPage, pagesCount = 0 } = paginator;
if (pagesCount <= 1) {
return null;
}
2018-08-26 00:45:03 +03:00
const renderPages = () =>
range(1, pagesCount + 1).map((i) => (
<PaginationItem key={i} active={currentPage === i}>
<PaginationLink
tag={Link}
to={`/server/${serverId}/list-short-urls/${i}`}
>
{i}
</PaginationLink>
</PaginationItem>
));
return (
<Pagination listClassName="flex-wrap">
<PaginationItem disabled={currentPage === 1}>
<PaginationLink
previous
tag={Link}
to={`/server/${serverId}/list-short-urls/${currentPage - 1}`}
/>
</PaginationItem>
{renderPages()}
<PaginationItem disabled={currentPage >= pagesCount}>
<PaginationLink
next
tag={Link}
to={`/server/${serverId}/list-short-urls/${currentPage + 1}`}
/>
</PaginationItem>
</Pagination>
);
2018-06-17 19:13:55 +03:00
}
Paginator.propTypes = propTypes;