diff --git a/frontend/src/js/component/wb-project-listing.js b/frontend/src/js/component/wb-project-listing.js index 0f6013d..cb107d1 100644 --- a/frontend/src/js/component/wb-project-listing.js +++ b/frontend/src/js/component/wb-project-listing.js @@ -1,4 +1,5 @@ import { h, Component } from 'preact'; +import { route } from 'preact-router'; import makeArvadosRequest from 'make-arvados-request'; import WBTable from 'wb-table'; import WBPagination from 'wb-pagination'; @@ -9,17 +10,19 @@ class WBProjectListing extends Component { super(...args); this.state.rows = []; this.state.numPages = 0; - this.state.activePage = 0; } componentDidMount() { - this.setActivePage(0); + this.fetchItems(); } prepareRows(items) { return items.map(item => [ (
-
{ item['name'] }
+
+ { e.preventDefault(); route('/browse/' + item['uuid']) }}>{ item['name'] } +
{ item['uuid'] }
), item['description'], @@ -27,8 +30,8 @@ class WBProjectListing extends Component { ]); } - setActivePage(i) { - this.state.activePage = i; + fetchItems() { + let i = this.props.activePage; let filters = [ [ 'group_class', '=', 'project' ] ]; @@ -45,14 +48,20 @@ class WBProjectListing extends Component { })); } - render({ arvHost, arvToken, ownerUuid }, { rows, numPages, activePage }) { + componentWillReceiveProps(nextProps, nextState) { + // this.setState({ 'rows': [] }); // .rows = []; + this.props = nextProps; + this.fetchItems(); + } + + render({ arvHost, arvToken, ownerUuid, activePage, onPageChanged }, { rows, numPages }) { return (
this.setActivePage(i) } /> + onPageChanged={ i => onPageChanged(i) } />
); } diff --git a/frontend/src/js/page/wb-app.js b/frontend/src/js/page/wb-app.js index c0674b8..54f305e 100644 --- a/frontend/src/js/page/wb-app.js +++ b/frontend/src/js/page/wb-app.js @@ -30,7 +30,7 @@ class WBApp extends Component { - + ); } diff --git a/frontend/src/js/page/wb-browse.js b/frontend/src/js/page/wb-browse.js index 3ad52c7..f14e59b 100644 --- a/frontend/src/js/page/wb-browse.js +++ b/frontend/src/js/page/wb-browse.js @@ -1,10 +1,11 @@ import { h, Component } from 'preact'; +import { route } from 'preact-router'; import WBNavbar from 'wb-navbar'; import WBProjectListing from 'wb-project-listing'; import WBInlineSearch from 'wb-inline-search'; class WBBrowse extends Component { - render({ ownerUuid, appCallbacks }) { + render({ ownerUuid, activePage, appCallbacks }) { return (
+ itemsPerPage="5" + activePage={ Number(activePage || 0) } + onPageChanged={ i => route('/browse/' + (ownerUuid || '') + '/' + i)} />
); }