From 89fe848ecd9607fd372faac37219fcf97cacfca7 Mon Sep 17 00:00:00 2001 From: Pedro Date: Fri, 3 Aug 2018 17:23:16 +0100 Subject: [PATCH 01/10] Added flag to enable 1-indexed pagination structure. Amended documentation. --- README.md | 10 ++++++---- react_components/PaginationBoxView.js | 9 ++++++--- 2 files changed, 12 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 26646c57..f03d3bdb 100644 --- a/README.md +++ b/README.md @@ -74,6 +74,7 @@ Open your browser and go to [http://localhost:3000/](http://localhost:3000/) | `initialPage` | `Number` | The initial page selected. | | `forcePage` | `Number` | To override selected page with parent prop. | | `disableInitialCallback` | `boolean` | Disable `onPageChange` callback with initial page. Default: `false` | +| `oneIndexed` | `boolean` | Sets pagination selection to start with 1, instead of 0. Default: `false` | | `containerClassName` | `String` | The classname of the pagination container. | | `pageClassName` | `String` | The classname on tag `li` of each page element. | | `pageLinkClassName` | `String` | The classname on tag `a` of each page element. | @@ -91,10 +92,11 @@ Open your browser and go to [http://localhost:3000/](http://localhost:3000/) 1. [Submit an issue](https://github.com/AdeleD/react-paginate/issues) 2. Fork the repository 3. Create a dedicated branch (never ever work in `master`) -4. The first time, run command: `webpack` into the directory -5. Run `npm start` -6. Fix bugs or implement features -7. Always write tests +4. Run `npm install` +5. The first time, run command: `webpack` into the directory +6. Run `npm start` +7. Fix bugs or implement features +8. Always write tests Run tests: diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 245ac4e4..b5983383 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -28,7 +28,8 @@ export default class PaginationBoxView extends Component { previousLinkClassName : PropTypes.string, nextLinkClassName : PropTypes.string, disabledClassName : PropTypes.string, - breakClassName : PropTypes.string + breakClassName : PropTypes.string, + oneIndexed : PropTypes.bool }; static defaultProps = { @@ -42,7 +43,8 @@ export default class PaginationBoxView extends Component { nextLabel : "Next", breakLabel : "...", disabledClassName : "disabled", - disableInitialCallback: false + disableInitialCallback: false, + oneIndexed : false }; constructor(props) { @@ -88,6 +90,7 @@ export default class PaginationBoxView extends Component { }; handlePageSelected = (selected, evt) => { + const { oneIndexed } = this.props; evt.preventDefault ? evt.preventDefault() : (evt.returnValue = false); if (this.state.selected === selected) return; @@ -95,7 +98,7 @@ export default class PaginationBoxView extends Component { this.setState({selected: selected}); // Call the callback with the new selected item: - this.callCallback(selected); + this.callCallback(selected + (oneIndexed ? 1 : 0)); }; hrefBuilder(pageIndex) { From 1a8a30c36180df6886a6608dd1338c7d882e2710 Mon Sep 17 00:00:00 2001 From: Pedro Date: Fri, 3 Aug 2018 17:36:49 +0100 Subject: [PATCH 02/10] Fixing Jest tests. Added dist version of new flag --- dist/PaginationBoxView.js | 10 +++++++--- package.json | 2 ++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index 29b021c9..f3e75f7a 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -59,6 +59,8 @@ var PaginationBoxView = function (_Component) { }; _this.handlePageSelected = function (selected, evt) { + var oneIndexed = _this.props.oneIndexed; + evt.preventDefault ? evt.preventDefault() : evt.returnValue = false; if (_this.state.selected === selected) return; @@ -66,7 +68,7 @@ var PaginationBoxView = function (_Component) { _this.setState({ selected: selected }); // Call the callback with the new selected item: - _this.callCallback(selected); + _this.callCallback(selected + (oneIndexed ? 1 : 0)); }; _this.callCallback = function (selectedItem) { @@ -281,7 +283,8 @@ PaginationBoxView.propTypes = { previousLinkClassName: _propTypes2.default.string, nextLinkClassName: _propTypes2.default.string, disabledClassName: _propTypes2.default.string, - breakClassName: _propTypes2.default.string + breakClassName: _propTypes2.default.string, + oneIndexed: _propTypes2.default.bool }; PaginationBoxView.defaultProps = { pageCount: 10, @@ -294,7 +297,8 @@ PaginationBoxView.defaultProps = { nextLabel: "Next", breakLabel: "...", disabledClassName: "disabled", - disableInitialCallback: false + disableInitialCallback: false, + oneIndexed: false }; exports.default = PaginationBoxView; ; diff --git a/package.json b/package.json index dc7e41c5..6140e1e6 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,8 @@ "demo": "webpack --config demo/webpack.config.js --mode=development && node demo/data.js && node demo/server.js" }, "jest": { + "verbose": true, + "testURL": "http://localhost/", "transform": { ".*": "/node_modules/babel-jest" }, From 0da51e375e8885565492d5ba7bd5fbfa58a478b2 Mon Sep 17 00:00:00 2001 From: Pedro Date: Mon, 6 Aug 2018 12:23:00 +0100 Subject: [PATCH 03/10] Reviewing index usage on codebase --- react_components/PaginationBoxView.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index b5983383..381597a9 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -90,7 +90,6 @@ export default class PaginationBoxView extends Component { }; handlePageSelected = (selected, evt) => { - const { oneIndexed } = this.props; evt.preventDefault ? evt.preventDefault() : (evt.returnValue = false); if (this.state.selected === selected) return; @@ -98,7 +97,7 @@ export default class PaginationBoxView extends Component { this.setState({selected: selected}); // Call the callback with the new selected item: - this.callCallback(selected + (oneIndexed ? 1 : 0)); + this.callCallback(selected); }; hrefBuilder(pageIndex) { @@ -125,7 +124,8 @@ export default class PaginationBoxView extends Component { pageClassName, pageLinkClassName, activeClassName, - extraAriaContext + extraAriaContext, + oneIndexed } = this.props; return + page={oneIndexed ? index : index + 1} /> } pagination = () => { @@ -147,7 +147,8 @@ export default class PaginationBoxView extends Component { pageCount, marginPagesDisplayed, breakLabel, - breakClassName + breakClassName, + oneIndexed } = this.props; const { selected } = this.state; @@ -175,7 +176,7 @@ export default class PaginationBoxView extends Component { let index; let page; let breakView; - let createPageView = (index) => this.getPageElement(index); + let createPageView = (index) => this.getPageElement(oneIndexed ? index + 1 : index); for (index = 0; index < pageCount; index++) { @@ -199,7 +200,7 @@ export default class PaginationBoxView extends Component { if (breakLabel && items[items.length - 1] !== breakView) { breakView = ( From 53bb8db0ad5d9da04ca0295eeec1e92e26e74f5a Mon Sep 17 00:00:00 2001 From: Pedro Date: Mon, 6 Aug 2018 12:23:44 +0100 Subject: [PATCH 04/10] Adding compiled file --- dist/PaginationBoxView.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index f3e75f7a..8cedeb24 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -59,8 +59,6 @@ var PaginationBoxView = function (_Component) { }; _this.handlePageSelected = function (selected, evt) { - var oneIndexed = _this.props.oneIndexed; - evt.preventDefault ? evt.preventDefault() : evt.returnValue = false; if (_this.state.selected === selected) return; @@ -68,7 +66,7 @@ var PaginationBoxView = function (_Component) { _this.setState({ selected: selected }); // Call the callback with the new selected item: - _this.callCallback(selected + (oneIndexed ? 1 : 0)); + _this.callCallback(selected); }; _this.callCallback = function (selectedItem) { @@ -84,7 +82,8 @@ var PaginationBoxView = function (_Component) { pageCount = _this$props.pageCount, marginPagesDisplayed = _this$props.marginPagesDisplayed, breakLabel = _this$props.breakLabel, - breakClassName = _this$props.breakClassName; + breakClassName = _this$props.breakClassName, + oneIndexed = _this$props.oneIndexed; var selected = _this.state.selected; @@ -110,7 +109,7 @@ var PaginationBoxView = function (_Component) { var page = void 0; var breakView = void 0; var createPageView = function createPageView(index) { - return _this.getPageElement(index); + return _this.getPageElement(oneIndexed ? index + 1 : index); }; for (_index = 0; _index < pageCount; _index++) { @@ -134,7 +133,7 @@ var PaginationBoxView = function (_Component) { if (breakLabel && items[items.length - 1] !== breakView) { breakView = _react2.default.createElement(_BreakView2.default, { - key: _index, + key: oneIndexed ? _index + 1 : _index, breakLabel: breakLabel, breakClassName: breakClassName }); @@ -190,7 +189,8 @@ var PaginationBoxView = function (_Component) { pageClassName = _props3.pageClassName, pageLinkClassName = _props3.pageLinkClassName, activeClassName = _props3.activeClassName, - extraAriaContext = _props3.extraAriaContext; + extraAriaContext = _props3.extraAriaContext, + oneIndexed = _props3.oneIndexed; return _react2.default.createElement(_PageView2.default, { @@ -202,7 +202,7 @@ var PaginationBoxView = function (_Component) { activeClassName: activeClassName, extraAriaContext: extraAriaContext, href: this.hrefBuilder(index), - page: index + 1 }); + page: oneIndexed ? index : index + 1 }); } }, { key: 'render', From 024dbd731454074fc9a259762e74c8514ba08b90 Mon Sep 17 00:00:00 2001 From: Pedro Date: Mon, 6 Aug 2018 12:37:04 +0100 Subject: [PATCH 05/10] Handling prev next --- dist/PaginationBoxView.js | 30 +++++++++++++++------------ react_components/PaginationBoxView.js | 14 +++++++------ 2 files changed, 25 insertions(+), 19 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index 8cedeb24..fa77adf2 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -40,20 +40,23 @@ var PaginationBoxView = function (_Component) { _this.handlePreviousPage = function (evt) { var selected = _this.state.selected; + var oneIndexed = _this.props.oneIndexed; evt.preventDefault ? evt.preventDefault() : evt.returnValue = false; - if (selected > 0) { + if (selected > (oneIndexed ? 1 : 0)) { _this.handlePageSelected(selected - 1, evt); } }; _this.handleNextPage = function (evt) { var selected = _this.state.selected; - var pageCount = _this.props.pageCount; + var _this$props = _this.props, + pageCount = _this$props.pageCount, + oneIndexed = _this$props.oneIndexed; evt.preventDefault ? evt.preventDefault() : evt.returnValue = false; - if (selected < pageCount - 1) { + if (selected < pageCount - (oneIndexed ? 0 : 1)) { _this.handlePageSelected(selected + 1, evt); } }; @@ -77,13 +80,13 @@ var PaginationBoxView = function (_Component) { _this.pagination = function () { var items = []; - var _this$props = _this.props, - pageRangeDisplayed = _this$props.pageRangeDisplayed, - pageCount = _this$props.pageCount, - marginPagesDisplayed = _this$props.marginPagesDisplayed, - breakLabel = _this$props.breakLabel, - breakClassName = _this$props.breakClassName, - oneIndexed = _this$props.oneIndexed; + var _this$props2 = _this.props, + pageRangeDisplayed = _this$props2.pageRangeDisplayed, + pageCount = _this$props2.pageCount, + marginPagesDisplayed = _this$props2.marginPagesDisplayed, + breakLabel = _this$props2.breakLabel, + breakClassName = _this$props2.breakClassName, + oneIndexed = _this$props2.oneIndexed; var selected = _this.state.selected; @@ -216,12 +219,13 @@ var PaginationBoxView = function (_Component) { previousLinkClassName = _props4.previousLinkClassName, previousLabel = _props4.previousLabel, nextLinkClassName = _props4.nextLinkClassName, - nextLabel = _props4.nextLabel; + nextLabel = _props4.nextLabel, + oneIndexed = _props4.oneIndexed; var selected = this.state.selected; - var previousClasses = previousClassName + (selected === 0 ? ' ' + disabledClassName : ''); - var nextClasses = nextClassName + (selected === pageCount - 1 ? ' ' + disabledClassName : ''); + var previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ' ' + disabledClassName : ''); + var nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ' ' + disabledClassName : ''); return _react2.default.createElement( 'ul', diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 381597a9..fcc4cef7 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -73,18 +73,19 @@ export default class PaginationBoxView extends Component { handlePreviousPage = evt => { const { selected } = this.state; + const { oneIndexed } = this.props; evt.preventDefault ? evt.preventDefault() : (evt.returnValue = false); - if (selected > 0) { + if (selected > (oneIndexed ? 1 : 0)) { this.handlePageSelected(selected - 1, evt); } }; handleNextPage = evt => { const { selected } = this.state; - const { pageCount } = this.props; + const { pageCount, oneIndexed } = this.props; evt.preventDefault ? evt.preventDefault() : (evt.returnValue = false); - if (selected < pageCount - 1) { + if (selected < pageCount - (oneIndexed ? 0 : 1)) { this.handlePageSelected(selected + 1, evt); } }; @@ -223,13 +224,14 @@ export default class PaginationBoxView extends Component { previousLinkClassName, previousLabel, nextLinkClassName, - nextLabel + nextLabel, + oneIndexed } = this.props; const { selected } = this.state; - const previousClasses = previousClassName + (selected === 0 ? ` ${disabledClassName}` : ''); - const nextClasses = nextClassName + (selected === pageCount - 1 ? ` ${disabledClassName}` : ''); + const previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ` ${disabledClassName}` : ''); + const nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ` ${disabledClassName}` : ''); return (
    From ea11f95bcd8216cc4687d1469564270c03118f1a Mon Sep 17 00:00:00 2001 From: Pedro Date: Tue, 7 Aug 2018 17:28:49 +0100 Subject: [PATCH 06/10] Updating hrefBuilder to cater for oneIndexed flag --- dist/PaginationBoxView.js | 5 +++-- react_components/PaginationBoxView.js | 8 ++++++-- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index fa77adf2..55d43794 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -178,10 +178,11 @@ var PaginationBoxView = function (_Component) { value: function hrefBuilder(pageIndex) { var _props2 = this.props, hrefBuilder = _props2.hrefBuilder, - pageCount = _props2.pageCount; + pageCount = _props2.pageCount, + oneIndexed = _props2.oneIndexed; if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && pageIndex < pageCount) { - return hrefBuilder(pageIndex + 1); + return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1)); } } }, { diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index fcc4cef7..7b74e3b3 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -102,13 +102,17 @@ export default class PaginationBoxView extends Component { }; hrefBuilder(pageIndex) { - const { hrefBuilder, pageCount } = this.props; + const { + hrefBuilder, + pageCount, + oneIndexed + } = this.props; if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && pageIndex < pageCount ) { - return hrefBuilder(pageIndex + 1); + return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1)); } } From 40441b458865c4c9a6423b8d377306d66dd3fd1e Mon Sep 17 00:00:00 2001 From: Pedro Date: Tue, 21 Aug 2018 16:05:28 +0100 Subject: [PATCH 07/10] Fixing last item of pagination to have href --- dist/PaginationBoxView.js | 2 +- react_components/PaginationBoxView.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index 55d43794..f9267770 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -181,7 +181,7 @@ var PaginationBoxView = function (_Component) { pageCount = _props2.pageCount, oneIndexed = _props2.oneIndexed; - if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && pageIndex < pageCount) { + if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && pageIndex < pageCount + (oneIndexed ? 1 : 0)) { return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1)); } } diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 7b74e3b3..06d2ba8c 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -110,7 +110,7 @@ export default class PaginationBoxView extends Component { if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && - pageIndex < pageCount + pageIndex < pageCount + (oneIndexed ? 1 : 0) ) { return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1)); } From 3eb5a956672322e2cfd4e90e21ebf00d78558c83 Mon Sep 17 00:00:00 2001 From: Pedro Date: Wed, 2 Jan 2019 12:11:10 +0000 Subject: [PATCH 08/10] Preventing Previous and Next to have links when out of bounds --- dist/PaginationBoxView.js | 24 ++++++++--- react_components/PaginationBoxView.js | 58 +++++++++++++++++---------- 2 files changed, 56 insertions(+), 26 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index f9267770..768aca28 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -225,8 +225,11 @@ var PaginationBoxView = function (_Component) { var selected = this.state.selected; - var previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ' ' + disabledClassName : ''); - var nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ' ' + disabledClassName : ''); + var isFirstPage = selected === (oneIndexed ? 1 : 0); + var previousClasses = previousClassName + (isFirstPage ? ' ' + disabledClassName : ''); + + var isLastPage = selected === pageCount - (oneIndexed ? 0 : 1); + var nextClasses = nextClassName + (isLastPage ? ' ' + disabledClassName : ''); return _react2.default.createElement( 'ul', @@ -234,22 +237,28 @@ var PaginationBoxView = function (_Component) { _react2.default.createElement( 'li', { className: previousClasses }, - _react2.default.createElement( + !isFirstPage ? _react2.default.createElement( 'a', - { onClick: this.handlePreviousPage, + { + onClick: this.handlePreviousPage, className: previousLinkClassName, href: this.hrefBuilder(selected - 1), tabIndex: '0', role: 'button', onKeyPress: this.handlePreviousPage }, previousLabel + ) : _react2.default.createElement( + 'span', + { + className: previousLinkClassName }, + previousLabel ) ), this.pagination(), _react2.default.createElement( 'li', { className: nextClasses }, - _react2.default.createElement( + !isLastPage ? _react2.default.createElement( 'a', { onClick: this.handleNextPage, className: nextLinkClassName, @@ -258,6 +267,11 @@ var PaginationBoxView = function (_Component) { role: 'button', onKeyPress: this.handleNextPage }, nextLabel + ) : _react2.default.createElement( + 'span', + { + className: nextLinkClassName }, + nextLabel ) ) ); diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 06d2ba8c..28a964b6 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -52,8 +52,8 @@ export default class PaginationBoxView extends Component { this.state = { selected: props.initialPage ? props.initialPage : - props.forcePage ? props.forcePage : - 0 + props.forcePage ? props.forcePage : + 0 }; } @@ -118,7 +118,7 @@ export default class PaginationBoxView extends Component { callCallback = (selectedItem) => { if (typeof(this.props.onPageChange) !== "undefined" && - typeof(this.props.onPageChange) === "function") { + typeof(this.props.onPageChange) === "function") { this.props.onPageChange({selected: selectedItem}); } }; @@ -234,33 +234,49 @@ export default class PaginationBoxView extends Component { const { selected } = this.state; - const previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ` ${disabledClassName}` : ''); - const nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ` ${disabledClassName}` : ''); + const isFirstPage = selected === (oneIndexed ? 1 : 0); + const previousClasses = previousClassName + (isFirstPage ? ` ${disabledClassName}` : ''); + + const isLastPage = selected === pageCount - (oneIndexed ? 0 : 1); + const nextClasses = nextClassName + (isLastPage ? ` ${disabledClassName}` : ''); return ( ); From eb89c1e2092b2a950251d9bd5c284fef750df7cf Mon Sep 17 00:00:00 2001 From: Pedro Date: Wed, 2 Jan 2019 12:52:54 +0000 Subject: [PATCH 09/10] Actually, never mind --- dist/PaginationBoxView.js | 24 +++---------- react_components/PaginationBoxView.js | 52 ++++++++++----------------- 2 files changed, 23 insertions(+), 53 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index 768aca28..f9267770 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -225,11 +225,8 @@ var PaginationBoxView = function (_Component) { var selected = this.state.selected; - var isFirstPage = selected === (oneIndexed ? 1 : 0); - var previousClasses = previousClassName + (isFirstPage ? ' ' + disabledClassName : ''); - - var isLastPage = selected === pageCount - (oneIndexed ? 0 : 1); - var nextClasses = nextClassName + (isLastPage ? ' ' + disabledClassName : ''); + var previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ' ' + disabledClassName : ''); + var nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ' ' + disabledClassName : ''); return _react2.default.createElement( 'ul', @@ -237,28 +234,22 @@ var PaginationBoxView = function (_Component) { _react2.default.createElement( 'li', { className: previousClasses }, - !isFirstPage ? _react2.default.createElement( + _react2.default.createElement( 'a', - { - onClick: this.handlePreviousPage, + { onClick: this.handlePreviousPage, className: previousLinkClassName, href: this.hrefBuilder(selected - 1), tabIndex: '0', role: 'button', onKeyPress: this.handlePreviousPage }, previousLabel - ) : _react2.default.createElement( - 'span', - { - className: previousLinkClassName }, - previousLabel ) ), this.pagination(), _react2.default.createElement( 'li', { className: nextClasses }, - !isLastPage ? _react2.default.createElement( + _react2.default.createElement( 'a', { onClick: this.handleNextPage, className: nextLinkClassName, @@ -267,11 +258,6 @@ var PaginationBoxView = function (_Component) { role: 'button', onKeyPress: this.handleNextPage }, nextLabel - ) : _react2.default.createElement( - 'span', - { - className: nextLinkClassName }, - nextLabel ) ) ); diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 28a964b6..467a2d90 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -234,49 +234,33 @@ export default class PaginationBoxView extends Component { const { selected } = this.state; - const isFirstPage = selected === (oneIndexed ? 1 : 0); - const previousClasses = previousClassName + (isFirstPage ? ` ${disabledClassName}` : ''); - - const isLastPage = selected === pageCount - (oneIndexed ? 0 : 1); - const nextClasses = nextClassName + (isLastPage ? ` ${disabledClassName}` : ''); + const previousClasses = previousClassName + (selected === (oneIndexed ? 1 : 0) ? ` ${disabledClassName}` : ''); + const nextClasses = nextClassName + (selected === pageCount - (oneIndexed ? 0 : 1) ? ` ${disabledClassName}` : ''); return ( ); From 6b82f7c625f731af2cf51b42116a8480a06a646a Mon Sep 17 00:00:00 2001 From: Pedro Date: Mon, 29 Apr 2019 14:11:38 +0100 Subject: [PATCH 10/10] Fixing pagination previous where it wouldmake href for page 0 on oneIndexed --- dist/PaginationBoxView.js | 2 +- react_components/PaginationBoxView.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/dist/PaginationBoxView.js b/dist/PaginationBoxView.js index f9267770..df23daee 100755 --- a/dist/PaginationBoxView.js +++ b/dist/PaginationBoxView.js @@ -181,7 +181,7 @@ var PaginationBoxView = function (_Component) { pageCount = _props2.pageCount, oneIndexed = _props2.oneIndexed; - if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= 0 && pageIndex < pageCount + (oneIndexed ? 1 : 0)) { + if (hrefBuilder && pageIndex !== this.state.selected && pageIndex >= (oneIndexed ? 1 : 0) && pageIndex < pageCount + (oneIndexed ? 1 : 0)) { return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1)); } } diff --git a/react_components/PaginationBoxView.js b/react_components/PaginationBoxView.js index 467a2d90..d51b05a8 100755 --- a/react_components/PaginationBoxView.js +++ b/react_components/PaginationBoxView.js @@ -109,7 +109,7 @@ export default class PaginationBoxView extends Component { } = this.props; if (hrefBuilder && pageIndex !== this.state.selected && - pageIndex >= 0 && + pageIndex >= (oneIndexed ? 1 : 0) && pageIndex < pageCount + (oneIndexed ? 1 : 0) ) { return hrefBuilder(pageIndex + (oneIndexed ? 0 : 1));