8000 add ability to set the current page via a prop passed to the table · leetcode/reactable@539dc92 · GitHub
[go: up one dir, main page]
Skip to content

Commit 539dc92

Browse files
samm0sssamm0ss
committed
add ability to set the current page via a prop passed to the table
1 parent 7bef66d commit 539dc92

File tree

5 files changed

+72
-4
lines changed

5 files changed

+72
-4
lines changed

‎build/reactable.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1016,7 +1016,7 @@ window.ReactDOM["default"] = window.ReactDOM;
10161016
_get(Object.getPrototypeOf(Table.prototype), 'constructor', this).call(this, props);
10171017

10181018
this.state = {
1019-
currentPage: 0,
1019+
currentPage: this.props.currentPage ? this.props.currentPage : 0,
10201020
currentSort: {
10211021
column: null,
10221022
direction: this.props.defaultSortDescending ? -1 : 1
@@ -1249,6 +1249,13 @@ window.ReactDOM["default"] = window.ReactDOM;
12491249
this.setState({ currentSort: this.getCurrentSort(sortBy) });
12501250
}
12511251
}
1252+
}, {
1253+
key: 'updateCurrentPage',
1254+
value: function updateCurrentPage(nextPage) {
1255+
if (nextPage !== this.state.currentPage) {
1256+
this.setState({ currentPage: nextPage });
1257+
}
1258+
}
12521259
}, {
12531260
key: 'componentWillMount',
12541261
value: function componentWillMount() {
@@ -1260,6 +1267,7 @@ window.ReactDOM["default"] = window.ReactDOM;
12601267
key: 'componentWillReceiveProps',
12611268
value: function componentWillReceiveProps(nextProps) {
12621269
this.initialize(nextProps);
1270+
this.updateCurrentPage(nextProps.currentPage);
12631271
this.updateCurrentSort(nextProps.sortBy);
12641272
this.sortByCurrentSort();
12651273
this.filterBy(nextProps.filterBy);

‎build/tests/reactable_test.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/reactable/table.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ var Table = (function (_React$Component) {
4545
_get(Object.getPrototypeOf(Table.prototype), 'constructor', this).call(this, props);
4646

4747
this.state = {
48-
currentPage: 0,
48+
currentPage: this.props.currentPage ? this.props.currentPage : 0,
4949
currentSort: {
5050
column: null,
5151
direction: this.props.defaultSortDescending ? -1 : 1
@@ -278,6 +278,13 @@ var Table = (function (_React$Component) {
278278
this.setState({ currentSort: this.getCurrentSort(sortBy) });
279279
}
280280
}
281+
}, {
282+
key: 'updateCurrentPage',
283+
value: function updateCurrentPage(nextPage) {
284+
if (nextPage !== this.state.currentPage) {
285+
this.setState({ currentPage: nextPage });
286+
}
287+
}
281288
}, {
282289
key: 'componentWillMount',
283290
value: function componentWillMount() {
@@ -289,6 +296,7 @@ var Table = (function (_React$Component) {
289296
key: 'componentWillReceiveProps',
290297
value: function componentWillReceiveProps(nextProps) {
291298
this.initialize(nextProps);
299+
this.updateCurrentPage(nextProps.currentPage);
292300
this.updateCurrentSort(nextProps.sortBy);
293301
this.sortByCurrentSort();
294302
this.filterBy(nextProps.filterBy);

‎src/reactable/table.jsx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export class Table extends React.Component {
1313
super(props);
1414

1515
this.state = {
16-
currentPage: 0,
16+
currentPage: this.props.currentPage ? this.props.currentPage : 0,
1717
currentSort: {
1818
column: null,
1919
direction: this.props.defaultSortDescending ? -1 : 1
@@ -239,6 +239,12 @@ export class Table extends React.Component {
239239
}
240240
}
241241

242+
updateCurrentPage(nextPage) {
243+
if (nextPage !== this.state.currentPage) {
244+
this.setState({ currentPage: nextPage});
245+
}
246+
}
247+
242248
componentWillMount() {
243249
this.initialize(this.props);
244250
this.sortByCurrentSort();
@@ -247,6 +253,7 @@ export class Table extends React.Component {
247253

248254
componentWillReceiveProps(nextProps) {
249255
this.initialize(nextProps);
256+
this.updateCurrentPage(nextProps.currentPage)
250257
this.updateCurrentSort(nextProps.sortBy);
251258
this.sortByCurrentSort();
252259
this.filterBy(nextProps.filterBy);

‎tests/reactable_test.jsx

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1055,6 +1055,51 @@ describe('Reactable', function() {
10551055
expect(currentPage).to.equal(2);
10561056
});
10571057
});
1058+
1059+
describe('update currentPage via a prop passed to table', function() {
1060+
before(function() {
1061+
1062+
var ParentComponent = React.createClass({
1063+
getInitialState: function() {
1064+
return {currentPage: 4}
1065+
},
1066+
1067+
render () {
1068+
return (
1069+
<Reactable.Table className="table" id="table" data={[
1070+
{'Name': 'Griffin Smith', 'Age': '18'},
1071+
{'Age': '23', 'Name': 'Lee Salminen'},
1072+
{'Age': '28', 'Position': 'Developer'},
1073+
{'Name': 'Griffin Smith', 'Age': '18'},
1074+
{'Age': '23', 'Name': 'Test Person'},
1075+
{'Name': 'Ian Zhang', 'Age': '28', 'Position': 'Developer'},
1076+
{'Name': 'Griffin Smith', 'Age': '18', 'Position': 'Software Developer'},
1077+
{'Age': '23', 'Name': 'Lee Salminen'},
1078+
{'Age': '28', 'Position': 'Developer'},
1079+
]} itemsPerPage={2} currentPage={this.state.currentPage} />
1080+
);
1081+
}
1082+
})
1083+
this.component = ReactDOM.render(React.createElement(ParentComponent), ReactableTestUtils.testNode());
1084+
});
1085+
1086+
after(ReactableTestUtils.resetTestEnvironment);
1087+
1088+
it('set default currentPage', function() {
1089+
let activePage = $('#table tbody.reactable-pagination ' +
1090+
'a.reactable-page-button.reactable-current-page');
1091+
expect(activePage.length).to.equal(1);
1092+
expect(activePage).to.have.text('5');
1093+
});
1094+
1095+
it('update currentPage using props', function() {
1096+
this.component.setState({currentPage: 2})
1097+
let activePage = $('#table tbody.reactable-pagination ' +
1098+
'a.reactable-page-button.reactable-current-page')
1099+
expect(activePage.length).to.equal(1);
1100+
expect(activePage).to.have.text('3');
1101+
});
1102+
});
10581103
});
10591104

10601105
describe('sorting', function(){

0 commit comments

Comments
 (0)
0