From 2d5c2779c31ae6db34ecdeccd3be730aea4e5c18 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Sat, 28 Mar 2020 17:25:12 +0100
Subject: [PATCH] Moved helper functions to render progressive paginators to a
 common place

---
 src/common/SimplePaginator.js       | 24 +-----------------------
 src/short-urls/Paginator.js         |  4 ++--
 src/utils/utils.js                  | 24 +++++++++++++++++++++++-
 test/common/SimplePaginator.test.js |  3 ++-
 4 files changed, 28 insertions(+), 27 deletions(-)

diff --git a/src/common/SimplePaginator.js b/src/common/SimplePaginator.js
index fcb890df..b9dbe44b 100644
--- a/src/common/SimplePaginator.js
+++ b/src/common/SimplePaginator.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Pagination, PaginationItem, PaginationLink } from 'reactstrap';
-import { range, max, min } from 'ramda';
+import { ELLIPSIS, progressivePagination } from '../utils/utils';
 import './SimplePaginator.scss';
 
 const propTypes = {
@@ -10,28 +10,6 @@ const propTypes = {
   setCurrentPage: PropTypes.func.isRequired,
 };
 
-export const ELLIPSIS = '...';
-
-export const progressivePagination = (currentPage, pageCount) => {
-  const delta = 2;
-  const pages = range(
-    max(delta, currentPage - delta),
-    min(pageCount - 1, currentPage + delta) + 1
-  );
-
-  if (currentPage - delta > delta) {
-    pages.unshift(ELLIPSIS);
-  }
-  if (currentPage + delta < pageCount - 1) {
-    pages.push(ELLIPSIS);
-  }
-
-  pages.unshift(1);
-  pages.push(pageCount);
-
-  return pages;
-};
-
 const SimplePaginator = ({ pagesCount, currentPage, setCurrentPage }) => {
   if (pagesCount < 2) {
     return null;
diff --git a/src/short-urls/Paginator.js b/src/short-urls/Paginator.js
index 2528770a..1d597e14 100644
--- a/src/short-urls/Paginator.js
+++ b/src/short-urls/Paginator.js
@@ -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 { ELLIPSIS, progressivePagination } from '../common/SimplePaginator';
+import { ELLIPSIS, progressivePagination } from '../utils/utils';
 
 const propTypes = {
   serverId: PropTypes.string.isRequired,
@@ -36,7 +36,7 @@ const Paginator = ({ paginator = {}, serverId }) => {
     ));
 
   return (
-    <Pagination listClassName="flex-wrap">
+    <Pagination listClassName="flex-wrap justify-content-center">
       <PaginationItem disabled={currentPage === 1}>
         <PaginationLink
           previous
diff --git a/src/utils/utils.js b/src/utils/utils.js
index 78d50daa..48ed8f2f 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -2,7 +2,7 @@ import L from 'leaflet';
 import marker2x from 'leaflet/dist/images/marker-icon-2x.png';
 import marker from 'leaflet/dist/images/marker-icon.png';
 import markerShadow from 'leaflet/dist/images/marker-shadow.png';
-import { range } from 'ramda';
+import { max, min, range } from 'ramda';
 import { useState } from 'react';
 
 const TEN_ROUNDING_NUMBER = 10;
@@ -65,3 +65,25 @@ export const useToggle = (initialValue = false) => {
 export const formatDate = (format = 'YYYY-MM-DD') => (date) => date && date.format ? date.format(format) : date;
 
 export const formatIsoDate = (date) => date && date.format ? date.format() : date;
+
+export const ELLIPSIS = '...';
+
+export const progressivePagination = (currentPage, pageCount) => {
+  const delta = 2;
+  const pages = range(
+    max(delta, currentPage - delta),
+    min(pageCount - 1, currentPage + delta) + 1,
+  );
+
+  if (currentPage - delta > delta) {
+    pages.unshift(ELLIPSIS);
+  }
+  if (currentPage + delta < pageCount - 1) {
+    pages.push(ELLIPSIS);
+  }
+
+  pages.unshift(1);
+  pages.push(pageCount);
+
+  return pages;
+};
diff --git a/test/common/SimplePaginator.test.js b/test/common/SimplePaginator.test.js
index a34aefdc..c3e5be68 100644
--- a/test/common/SimplePaginator.test.js
+++ b/test/common/SimplePaginator.test.js
@@ -2,7 +2,8 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import { identity } from 'ramda';
 import { PaginationItem } from 'reactstrap';
-import SimplePaginator, { ELLIPSIS } from '../../src/common/SimplePaginator';
+import SimplePaginator from '../../src/common/SimplePaginator';
+import { ELLIPSIS } from '../../src/utils/utils';
 
 describe('<SimplePaginator />', () => {
   let wrapper;