load all available group pages

src/groups/list.js

@@ -21,8 +21,21 @@ export default class GroupList {
     this.ctrl = new DatalistController('groups', {}, ['name']);
     this.data = [];
 
-    this.ctrl.getPageData(1).then((data) => {
-      this.data = data;
+    this.ctrl.getPageData(1).then((firstPage) => {
+      const pages = { 1: firstPage };
+      // now fetch all the missing pages
+      console.log(this.ctrl.totalPages);
+      Array.from(new Array(this.ctrl.totalPages - 1), (x, i) => i + 2).forEach((pageNum) => {
+        this.ctrl.getPageData(pageNum).then((newPage) => {
+          pages[pageNum] = newPage;
+          // collect all the so-far loaded pages in order (sorted keys)
+          // and flatten them into 1 array
+          this.data = [].concat(...Object.keys(pages).sort().map(key => pages[key]));
+          m.redraw();
+        });
+      });
+      // see above
+      this.data = [].concat(...Object.keys(pages).sort().map(key => pages[key]));
       m.redraw();
     });
   }

src/listcontroller.js

@@ -23,6 +23,8 @@ export default class DatalistController {
       this.refresh();
       m.redraw();
     }, 100);
+    // keep track of the total number of pages
+    this.totalPages = null;
   }
 
   refresh() {
@@ -46,6 +48,8 @@ export default class DatalistController {
 
     return new Promise((resolve) => {
       this.handler.get(query).then((data) => {
+        // update total number of pages
+        this.totalPages = Math.ceil(data._meta.total / 10);
         // If onlineSearch is false, we filter the page-results at the client
         // because the API would not understand the search pattern, e.g. for
         // embedded keys like user.firstname