Started implementing request ordering.

frontend/src/js/component/wb-collection-listing.js

@@ -13,6 +13,7 @@ class WBCollectionListing extends Component {
     super(...args);
     this.state.rows = [];
     this.state.numPages = 0;
+    this.state.orderStream = uuid.v4();
   }
 
   componentDidMount() {
@@ -65,7 +66,8 @@ class WBCollectionListing extends Component {
     let prom = makeArvadosRequest(arvHost, arvToken,
       '/arvados/v1/collections?filters=' + encodeURIComponent(JSON.stringify(filters)) +
       '&limit=' + encodeURIComponent(itemsPerPage) +
-      '&offset=' + encodeURIComponent(itemsPerPage * activePage));
+      '&offset=' + encodeURIComponent(itemsPerPage * activePage),
+      { 'orderStream': this.state.orderStream });
 
     let collections;
     let numPages
@@ -106,8 +108,14 @@ class WBCollectionListing extends Component {
     prom = prom.then(ownerLookup =>
       this.setState({
         'numPages': numPages,
-        'rows': this.prepareRows(collections, ownerLookup)
+        'rows': this.prepareRows(collections, ownerLookup),
+        'error': null
       }));
+
+    prom = prom.catch(() => this.setState({
+      'error': 'An error occured querying the Arvados API',
+      'rows': []
+    }));
   }
 
   componentWillReceiveProps(nextProps, nextState) {
@@ -115,9 +123,13 @@ class WBCollectionListing extends Component {
     this.fetchItems();
   }
 
-  render({ app, ownerUuid, activePage, getPageUrl }, { rows, numPages }) {
+  render({ app, ownerUuid, activePage, getPageUrl }, { rows, numPages, error }) {
     return (
       <div>
+        { error ? (<div class="alert alert-danger" role="alert">
+          { error }
+        </div>) : null }
+
         <WBTable columns={ [ 'Name', 'Description', 'Owner', 'File Count', 'Total Size', 'Actions' ] }
           rows={ rows } />
 

frontend/src/js/misc/make-arvados-request.js

@@ -1,3 +1,4 @@
+const requestOrdering = {};
 
 function makeArvadosRequest(arvHost, arvToken, endpoint, params={}) {
   const defaultParams = {
@@ -6,12 +7,22 @@ function makeArvadosRequest(arvHost, arvToken, endpoint, params={}) {
     'contentType': 'application/json;charset=utf-8',
     'responseType': 'json',
     'useSsl': true,
-    'requireToken': true
+    'requireToken': true,
+    'orderStream': null
   };
 
   Object.keys(defaultParams).map(k => (params[k] =
     (k in params ? params[k] : defaultParams[k])));
-  let { method, data, contentType, responseType, useSsl, requireToken } = params;
+  let { method, data, contentType, responseType, useSsl, requireToken, orderStream } = params;
+
+  let orderId;
+  if (orderStream) {
+    if (!(orderStream in requestOrdering))
+      requestOrdering[orderStream] = { 'counter': 0, 'started': [], 'completed': [] };
+    requestOrdering[orderStream].counter += 1;
+    orderId = requestOrdering[orderStream].counter;
+    requestOrdering[orderStream].started.push(orderId);
+  }
 
   if (!(arvHost && (arvToken || !requireToken)))
     return new Promise((accept, reject) => reject());