forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-06-01 01:56:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Used progressive pagination for the short URLs list

Browse Source
This commit is contained in:
Alejandro Celaya
2020-03-28 17:19:33 +01:00
parent ea5ec63a22
commit 06db4f6556
3 changed files with 28 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/short-urls/Paginator.js
View File

@@ -2,7 +2,7 @@ import React from 'react';
import { Link } from 'react-router-dom';
import { Pagination, PaginationItem, PaginationLink } from 'reactstrap';
import PropTypes from 'prop-types';
import { rangeOf } from '../utils/utils';
import { ELLIPSIS, progressivePagination } from '../common/SimplePaginator';
const propTypes = {
serverId: PropTypes.string.isRequired,
@@ -12,7 +12,7 @@ const propTypes = {
}),
};
export default function Paginator({ paginator = {}, serverId }) {
const Paginator = ({ paginator = {}, serverId }) => {
const { currentPage, pagesCount = 0 } = paginator;
if (pagesCount <= 1) {
@@ -20,8 +20,12 @@ export default function Paginator({ paginator = {}, serverId }) {
}
const renderPages = () =>
rangeOf(pagesCount, (pageNumber) => (
<PaginationItem key={pageNumber} active={currentPage === pageNumber}>
progressivePagination(currentPage, pagesCount).map((pageNumber, index) => (
<PaginationItem
key={pageNumber !== ELLIPSIS ? pageNumber : `${pageNumber}_${index}`}
active={currentPage === pageNumber}
disabled={pageNumber === ELLIPSIS}
>
<PaginationLink
tag={Link}
to={`/server/${serverId}/list-short-urls/${pageNumber}`}
@@ -50,6 +54,8 @@ export default function Paginator({ paginator = {}, serverId }) {
</PaginationItem>
</Pagination>
);
}
};
Paginator.propTypes = propTypes;
export default Paginator;