embarklabs
/
embark
mirror of https://github.com/embarklabs/embark.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

start pagination at the end

This commit is contained in:
Jonathan Rainville 2018-10-24 13:53:11 -04:00
parent a1b18b74f8
commit 8bdc8d41d4
2 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
embark-ui/src/components/Pagination.js
View File

@ -5,13 +5,16 @@ import PropTypes from 'prop-types';
const NB_PAGES_MAX = 8; const NB_PAGES_MAX = 8;
const Pages = ({currentPage, numberOfPages, changePage}) => { const Pages = ({currentPage, numberOfPages, changePage}) => {
let i = currentPage - NB_PAGES_MAX / 2; let max = currentPage + NB_PAGES_MAX / 2;
if (max >= numberOfPages) {
max = numberOfPages;
}
let i = max - NB_PAGES_MAX;
if (i < 1) { if (i < 1) {
i = 1; i = 1;
} }
let max = i + NB_PAGES_MAX - 1; if (max - i < NB_PAGES_MAX) {
if (max > numberOfPages) { max += NB_PAGES_MAX - max + 1;
max = numberOfPages;
} }
const pageNumbers = []; const pageNumbers = [];
for (i; i <= max; i++) { for (i; i <= max; i++) {

5
embark-ui/src/containers/BlocksContainer.js
View File

@ -13,7 +13,7 @@ class BlocksContainer extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {currentPage: 1}; this.state = {currentPage: 0};
} }
componentDidMount() { componentDidMount() {
@ -50,7 +50,8 @@ class BlocksContainer extends Component {
<React.Fragment> <React.Fragment>
<DataWrapper shouldRender={this.props.blocks.length > 0} {...this.props} render={({blocks}) => ( <DataWrapper shouldRender={this.props.blocks.length > 0} {...this.props} render={({blocks}) => (
<Blocks blocks={blocks} numberOfPages={this.getNumberOfPages()} <Blocks blocks={blocks} numberOfPages={this.getNumberOfPages()}
changePage={(newPage) => this.changePage(newPage)} currentPage={this.state.currentPage} /> changePage={(newPage) => this.changePage(newPage)}
currentPage={this.state.currentPage || this.getNumberOfPages()} />
)} /> )} />
</React.Fragment> </React.Fragment>
); );