WEBUI-159: check missing items on nuxeo-data-grid and fetch them

nuxeo · Dec 29, 2020 · 354e578 · 354e578
1 parent f2c443f
commit 354e578
Showing 1 changed file with 21 additions and 0 deletions.
diff --git a/nuxeo-data-grid/nuxeo-data-grid.html b/nuxeo-data-grid/nuxeo-data-grid.html
@@ -18,6 +18,7 @@
 <link rel="import" href="../../iron-list/iron-list.html">
 <link rel="import" href="../../iron-resizable-behavior/iron-resizable-behavior.html">
 <link rel="import" href="../../iron-scroll-threshold/iron-scroll-threshold.html">
+<link rel="import" href="../../iron-resizable-behavior/iron-resizable-behavior.html">
 <link rel="import" href="../../nuxeo-elements/nuxeo-element.html">
 <link rel="import" href="../../polymer/lib/elements/dom-if.html">
 <link rel="import" href="../../polymer/lib/elements/dom-repeat.html">
@@ -212,6 +213,26 @@
           };
         }
 
+        static get observers() {
+          return ['_fetchMissingItems(loading)'];
+        }
+
+        ready() {
+          super.ready();
+          this.addEventListener('iron-resize', this._fetchMissingItems);
+        }
+
+        // WEBUI-159: Check if there are more items in viewport than the ones set by the provider and load them.
+        _fetchMissingItems() {
+          if (!this.loading && this.$.list.lastVisibleIndex && this._pageSize) {
+            Polymer.Async.idlePeriod.run(() => {
+              if (this.$.list.lastVisibleIndex > this._pageSize) {
+                this._fetchRange(this._pageSize, this.$.list.lastVisibleIndex);
+              }
+            });
+          }
+        }
+
         _removeFilter(e) {
           this.dispatchEvent(new CustomEvent('column-filter-changed', {
             composed: true,