diff --git a/src/common/SimplePaginator.js b/src/common/SimplePaginator.js new file mode 100644 index 00000000..8683e303 --- /dev/null +++ b/src/common/SimplePaginator.js @@ -0,0 +1,30 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { Pagination, PaginationItem, PaginationLink } from 'reactstrap'; +import { rangeOf } from '../utils/utils'; + +const propTypes = { + pagesCount: PropTypes.number.isRequired, + currentPage: PropTypes.number.isRequired, + setCurrentPage: PropTypes.func.isRequired, +}; + +const SimplePaginator = ({ pagesCount, currentPage, setCurrentPage }) => ( + + + + + {rangeOf(pagesCount, (page) => ( + + {page} + + ))} + = pagesCount}> + + + +); + +SimplePaginator.propTypes = propTypes; + +export default SimplePaginator; diff --git a/src/visits/SortableBarGraph.js b/src/visits/SortableBarGraph.js index c51245f0..de96e655 100644 --- a/src/visits/SortableBarGraph.js +++ b/src/visits/SortableBarGraph.js @@ -1,10 +1,10 @@ import React from 'react'; import PropTypes from 'prop-types'; import { fromPairs, head, keys, pipe, prop, reverse, sortBy, splitEvery, toLower, toPairs, type } from 'ramda'; -import { Pagination, PaginationItem, PaginationLink } from 'reactstrap'; import SortingDropdown from '../utils/SortingDropdown'; import PaginationDropdown from '../utils/PaginationDropdown'; import { rangeOf, roundTen } from '../utils/utils'; +import SimplePaginator from '../common/SimplePaginator'; import GraphCard from './GraphCard'; const { max } = Math; @@ -66,22 +66,9 @@ export default class SortableBarGraph extends React.Component { renderPagination(pagesCount) { const { currentPage } = this.state; + const setCurrentPage = (currentPage) => () => this.setState({ currentPage }); - return ( - - - this.setState({ currentPage: currentPage - 1 })} /> - - {rangeOf(pagesCount, (page) => ( - - this.setState({ currentPage: page })}>{page} - - ))} - = pagesCount}> - this.setState({ currentPage: currentPage + 1 })} /> - - - ); + return ; } render() { diff --git a/test/visits/SortableBarGraph.test.js b/test/visits/SortableBarGraph.test.js index 6a49c720..e947d7f8 100644 --- a/test/visits/SortableBarGraph.test.js +++ b/test/visits/SortableBarGraph.test.js @@ -49,12 +49,10 @@ describe('', () => { assert = (sortName, sortDir, expectedKeys, expectedValues, done) => { dropdown.prop('onChange')(sortName, sortDir); setImmediate(() => { - const graphCard = wrapper.find(GraphCard); - const statsKeys = keys(graphCard.prop('stats')); - const statsValues = values(graphCard.prop('stats')); + const stats = wrapper.find(GraphCard).prop('stats'); - expect(statsKeys).toEqual(expectedKeys); - expect(statsValues).toEqual(expectedValues); + expect(keys(stats)).toEqual(expectedKeys); + expect(values(stats)).toEqual(expectedValues); done(); }); }; @@ -80,10 +78,9 @@ describe('', () => { assert = (itemsPerPage, expectedStats, done) => { dropdown.prop('setValue')(itemsPerPage); setImmediate(() => { - const graphCard = wrapper.find(GraphCard); - const statsKeys = keys(graphCard.prop('stats')); + const stats = wrapper.find(GraphCard).prop('stats'); - expect(statsKeys).toEqual(expectedStats); + expect(keys(stats)).toEqual(expectedStats); done(); }); };