diff --git a/react/src/components/dashboard/main/dashboard.scss b/react/src/components/dashboard/main/dashboard.scss index 0df5362..3309f01 100755 --- a/react/src/components/dashboard/main/dashboard.scss +++ b/react/src/components/dashboard/main/dashboard.scss @@ -165,4 +165,14 @@ font-family: FontAwesome; padding-left: 5px; content: "\f107"; +} + +.rt-tr.-padRow { + display: none; +} + +.ReactTable .-pagination, +.ReactTable .rt-thead.-header, +.ReactTable .rt-tfoot{ + box-shadow: none; } \ No newline at end of file diff --git a/react/src/components/dashboard/walletsData/walletsData.js b/react/src/components/dashboard/walletsData/walletsData.js index 30755a6..d311c4f 100644 --- a/react/src/components/dashboard/walletsData/walletsData.js +++ b/react/src/components/dashboard/walletsData/walletsData.js @@ -51,7 +51,9 @@ class WalletsData extends React.Component { currentStackLength: 0, totalStackLength: 0, useCache: true, - itemsListColumns: this.generateItemsListColumns() + itemsListColumns: this.generateItemsListColumns(), + pageSize: 20, + showPagination: false }; this.toggleBasiliskActionsMenu = this.toggleBasiliskActionsMenu.bind(this); @@ -317,7 +319,8 @@ class WalletsData extends React.Component { (this.state.itemsList && !this.state.itemsList.length) || (props.ActiveCoin.txhistory !== this.props.ActiveCoin.txhistory)) { this.setState(Object.assign({}, this.state, { - itemsList: sortByDate(this.props.ActiveCoin.txhistory), + itemsList: sortByDate(this.props.ActiveCoin.txhistory.slice(0, 30)), + showPagination: this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length >= this.state.pageSize })); } } @@ -360,19 +363,26 @@ class WalletsData extends React.Component { ); } - } else if (this.state.itemsList === 'no data') { + } else if (this.state.itemsList === 'no data' || this.state.itemsList.length == 0) { return ( { translate('INDEX.NO_DATA') } ); - } else if (this.state.itemsList && this.state.itemsList.length) { + } else if (this.state.itemsList) { return TxHistoryListRender.call(this); } return null; } + onPageSizeChange(pageSize, pageIndex) { + this.setState(Object.assign({}, this.state, { + pageSize: pageSize, + showPagination: this.state.itemsList && this.state.itemsList.length >= pageSize + })) + } + updateAddressSelection(address) { Store.dispatch(changeActiveAddress(address)); diff --git a/react/src/components/dashboard/walletsData/walletsData.render.js b/react/src/components/dashboard/walletsData/walletsData.render.js index 2570602..bb8fb44 100644 --- a/react/src/components/dashboard/walletsData/walletsData.render.js +++ b/react/src/components/dashboard/walletsData/walletsData.render.js @@ -150,12 +150,14 @@ export const TxHistoryListRender = function() { data={this.state.itemsList} columns={this.state.itemsListColumns} sortable={true} - filterable={true} className='-striped -highlight' PaginationComponent={TablePaginationRenderer} - showPaginationTop={true} nextText={translate('INDEX.NEXT_PAGE')} previousText={translate('INDEX.PREVIOUS_PAGE')} + showPaginationBottom={this.state.showPagination} + showPaginationTop={this.state.showPagination} + pageSize={this.pageSize} + onPageSizeChange={(pageSize, pageIndex) => this.onPageSizeChange(pageSize, pageIndex)} /> ); };