diff --git a/frontend/src/js/component/wb-app.js b/frontend/src/js/component/wb-app.js
index 711b4e8..25f4857 100644
--- a/frontend/src/js/component/wb-app.js
+++ b/frontend/src/js/component/wb-app.js
@@ -2,12 +2,16 @@ import { h, Component } from 'preact';
import WBTabs from 'wb-tabs';
import WBTable from 'wb-table';
import WBPagination from 'wb-pagination';
+import WBProjectListing from 'wb-project-listing';
class WBApp extends Component {
render() {
return (
WBApp
+
+
alert(idx) } />
[
+ item['name'],
+ item['description'],
+ item['owner_uuid']
+ ]);
+ }
+
+ setActivePage(i) {
+ this.state.activePage = i;
let filters = [
- [ 'group_class', '=', 'project' ],
- [ 'owner_uuid', '=', this.props.ownerUuid ]
+ [ 'group_class', '=', 'project' ]
];
- let req = makeArvadosRequest(his.props.arvHost, this.props.arvToken,
- '/arvados/v1/groups?filters=' + encodeURIComponent(JSON.stringify(filters)))
+ if (this.props.ownerUuid !== null)
+ filters.push([ 'owner_uuid', '=', this.props.ownerUuid ]);
+ let prom = makeArvadosRequest(this.props.arvHost, this.props.arvToken,
+ '/arvados/v1/groups?filters=' + encodeURIComponent(JSON.stringify(filters)) +
+ '&limit=' + encodeURIComponent(this.props.itemsPerPage) +
+ '&offset=' + encodeURIComponent(this.props.itemsPerPage * i));
+ prom = prom.then(xhr =>
+ this.setState({
+ 'numPages': Math.ceil(xhr.response['items_available'] / xhr.response['limit']),
+ 'rows': this.prepareRows(xhr.response['items'])
+ }));
}
- render({ arvHost, arvToken, ownerUuid }) {
+ render({ arvHost, arvToken, ownerUuid }, { rows, numPages, activePage }) {
return (
- Project Listing
+
+
+ this.setActivePage(i) } />
+
);
}
}
+
+WBProjectListing.defaultProps = {
+ 'itemsPerPage': 100,
+ 'ownerUuid': null
+};
+
+export default WBProjectListing;
diff --git a/frontend/src/js/misc/make-arvados-request.js b/frontend/src/js/misc/make-arvados-request.js
index 59cc31e..dc12cc0 100644
--- a/frontend/src/js/misc/make-arvados-request.js
+++ b/frontend/src/js/misc/make-arvados-request.js
@@ -1,5 +1,5 @@
-makeArvadosRequest(arvHost, arvToken, endpoint, method='GET', data=null,
+function makeArvadosRequest(arvHost, arvToken, endpoint, method='GET', data=null,
contentType='application/json;charset=utf-8', responseType='json') {
let xhr = new XMLHttpRequest();
diff --git a/frontend/src/js/widget/wb-pagination.js b/frontend/src/js/widget/wb-pagination.js
index 3a7c1e3..9c2d091 100644
--- a/frontend/src/js/widget/wb-pagination.js
+++ b/frontend/src/js/widget/wb-pagination.js
@@ -6,16 +6,17 @@ class WBPagination extends Component {
let begActChnk = activePage - Math.floor(chunkSize / 2);
let endActChnk = activePage + Math.floor(chunkSize / 2) + 1;
- for (let i = begActChnk; i < endActChnk; i++)
+ for (let i = Math.max(0, begActChnk); i < Math.min(numPages, endActChnk); i++)
visible[i] = true;
- for (let i = 0; i < chunkSize; i++)
+ for (let i = 0; i < Math.min(numPages, chunkSize); i++)
visible[i] = true;
for (let i = Math.max(numPages - chunkSize, 0); i < numPages; i++)
visible[i] = true;
visible = Object.keys(visible).map(n => Number(n));
+ visible.sort();
let res = [];
let prev = 0;
@@ -27,7 +28,8 @@ class WBPagination extends Component {
));
- for (let i in visible) {
+ for (let idx in visible) {
+ let i = visible[idx];
if (i > prev + 1)
res.push((