PolyGerrit: Use gr-list-view on gr-plugin-list

Since https://gerrit-review.googlesource.com/#/c/gerrit/+/116330/ it's now possible to use filters and pagination. Change-Id: I19c9fed9acbece95fe78e0b8fc9983a8a819c2b7
2017-07-28 14:28:44 +00:00
parent 65356df2c0
commit 9b173094e4
6 changed files with 203 additions and 39 deletions
--- a/polygerrit-ui/app/elements/admin/gr-admin-view/gr-admin-view.html
+++ b/polygerrit-ui/app/elements/admin/gr-admin-view/gr-admin-view.html
@@ -87,7 +87,7 @@ limitations under the License.
    </template>
    <template is="dom-if" if="[[_showPluginList]]" restamp="true">
      <main class="table">
-        <gr-plugin-list class="table"></gr-plugin-list>
+        <gr-plugin-list class="table" params="[[params]]"></gr-plugin-list>
      </main>
    </template>
    <template is="dom-if" if="[[_showProjectDetailList]]" restamp="true">
--- a/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list.html
+++ b/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list.html
@@ -18,33 +18,42 @@ limitations under the License.
 <link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
 <link rel="import" href="../../../styles/gr-table-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">
+<link rel="import" href="../../shared/gr-list-view/gr-list-view.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">

 <dom-module id="gr-plugin-list">
  <template>
    <style include="shared-styles"></style>
    <style include="gr-table-styles"></style>
-    <table id="list" class="genericList">
-      <tr class="headerRow">
-        <th class="name topHeader">Plugin Name</th>
-        <th class="version topHeader">Version</th>
-        <th class="status topHeader">Status</th>
-      </tr>
-      <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
-        <td>Loading...</td>
-      </tr>
-      <tbody class$="[[computeLoadingClass(_loading)]]">
-        <template is="dom-repeat" items="[[_plugins]]">
-          <tr class="table">
-            <td class="name">
-              <a href$="[[_computePluginUrl(item.index_url)]]">[[item.id]]</a>
-            </td>
-            <td class="version">[[item.version]]</td>
-            <td class="status">[[_status(item)]]</td>
-          </tr>
-        </template>
-      </tbody>
-    </table>
+    <gr-list-view
+        filter="[[_filter]]"
+        items-per-page="[[_pluginsPerPage]]"
+        items="[[_plugins]]"
+        loading="[[_loading]]"
+        offset="[[_offset]]"
+        path="[[_path]]">
+      <table id="list" class="genericList">
+        <tr class="headerRow">
+          <th class="name topHeader">Plugin Name</th>
+          <th class="version topHeader">Version</th>
+          <th class="status topHeader">Status</th>
+        </tr>
+        <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+          <td>Loading...</td>
+        </tr>
+        <tbody class$="[[computeLoadingClass(_loading)]]">
+          <template is="dom-repeat" items="[[_shownPlugins]]">
+            <tr class="table">
+              <td class="name">
+                <a href$="[[_computePluginUrl(item.index_url)]]">[[item.id]]</a>
+              </td>
+              <td class="version">[[item.version]]</td>
+              <td class="status">[[_status(item)]]</td>
+            </tr>
+          </template>
+        </tbody>
+      </table>
+    </gr-list-view>
    <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
  </template>
  <script src="gr-plugin-list.js"></script>
--- a/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list.js
+++ b/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list.js
@@ -18,23 +18,61 @@
    is: 'gr-plugin-list',

    properties: {
+      /**
+       * URL params passed from the router.
+       */
+      params: {
+        type: Object,
+        observer: '_paramsChanged',
+      },
+      /**
+       * Offset of currently visible query results.
+       */
+      _offset: Number,
+      _path: {
+        type: String,
+        readOnly: true,
+        value: '/admin/plugins',
+      },
      _plugins: Array,
+      /**
+       * Because  we request one more than the pluginsPerPage, _shownPlugins
+       * maybe one less than _plugins.
+       * */
+      _shownPlugins: {
+        type: Array,
+        computed: 'computeShownItems(_plugins)',
+      },
+      _pluginsPerPage: {
+        type: Number,
+        value: 25,
+      },
      _loading: {
        type: Boolean,
        value: true,
      },
+      _filter: String,
    },

    behaviors: [
      Gerrit.ListViewBehavior,
    ],

-    ready() {
-      this._getPlugins();
+    attached() {
+      this.fire('title-change', {title: 'Plugin List'});
    },

-    _getPlugins() {
-      return this.$.restAPI.getPlugins()
+    _paramsChanged(params) {
+      this._loading = true;
+      this._filter = this.getFilterValue(params);
+      this._offset = this.getOffsetValue(params);
+
+      return this._getPlugins(this._filter, this._pluginsPerPage,
+          this._offset);
+    },
+
+    _getPlugins(filter, pluginsPerPage, offset) {
+      return this.$.restAPI.getPlugins(filter, pluginsPerPage, offset)
          .then(plugins => {
            if (!plugins) {
              this._plugins = [];
--- a/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list_test.html
+++ b/polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list_test.html
@@ -33,7 +33,7 @@ limitations under the License.
 </test-fixture>

 <script>
-  let counter = 0;
+  let counter;
  const pluginGenerator = () => {
    return {
      id: `test${++counter}`,
@@ -47,26 +47,93 @@ limitations under the License.
    let element;
    let plugins;
    let sandbox;
+    let value;

    setup(() => {
      sandbox = sinon.sandbox.create();
-      plugins = _.times(26, pluginGenerator);
-      stub('gr-rest-api-interface', {
-        getPlugins() { return Promise.resolve(plugins); },
-      });
      element = fixture('basic');
+      counter = 0;
    });

    teardown(() => {
      sandbox.restore();
    });

-    test('_plugins item is formatted correctly', () => {
-      return element._getPlugins().then(() => {
-        assert.equal(element._plugins[2].id, 'test3');
-        assert.equal(element._plugins[2].index_url, 'plugins/test3/');
-        assert.equal(element._plugins[2].version, '3.0-SNAPSHOT');
-        assert.equal(element._plugins[2].disabled, false);
+    suite('list with plugins', () => {
+      setup(done => {
+        plugins = _.times(26, pluginGenerator);
+
+        stub('gr-rest-api-interface', {
+          getPlugins(num, offset) {
+            return Promise.resolve(plugins);
+          },
+        });
+
+        element._paramsChanged(value).then(() => { flush(done); });
+      });
+
+      test('plugin in the list is formatted correctly', done => {
+        flush(() => {
+          assert.equal(element._plugins[2].id, 'test3');
+          assert.equal(element._plugins[2].index_url, 'plugins/test3/');
+          assert.equal(element._plugins[2].version, '3.0-SNAPSHOT');
+          assert.equal(element._plugins[2].disabled, false);
+          done();
+        });
+      });
+
+      test('_shownPlugins', () => {
+        assert.equal(element._shownPlugins.length, 25);
+      });
+    });
+
+    suite('list with less then 26 plugins', () => {
+      setup(done => {
+        plugins = _.times(25, pluginGenerator);
+
+        stub('gr-rest-api-interface', {
+          getPlugins(num, offset) {
+            return Promise.resolve(plugins);
+          },
+        });
+
+        element._paramsChanged(value).then(() => { flush(done); });
+      });
+
+      test('_shownPlugins', () => {
+        assert.equal(element._shownPlugins.length, 25);
+      });
+    });
+
+    suite('filter', () => {
+      test('_paramsChanged', done => {
+        sandbox.stub(element.$.restAPI, 'getPlugins', () => {
+          return Promise.resolve(plugins);
+        });
+        const value = {
+          filter: 'test',
+          offset: 25,
+        };
+        element._paramsChanged(value).then(() => {
+          assert.isTrue(element.$.restAPI.getPlugins.lastCall
+              .calledWithExactly('test', 25, 25));
+          done();
+        });
+      });
+    });
+
+    suite('loading', () => {
+      test('correct contents are displayed', () => {
+        assert.isTrue(element._loading);
+        assert.equal(element.computeLoadingClass(element._loading), 'loading');
+        assert.equal(getComputedStyle(element.$.loading).display, 'block');
+
+        element._loading = false;
+        element._plugins = _.times(25, pluginGenerator);
+
+        flushAsynchronousOperations();
+        assert.equal(element.computeLoadingClass(element._loading), '');
+        assert.equal(getComputedStyle(element.$.loading).display, 'none');
      });
    });
  });
--- a/polygerrit-ui/app/elements/core/gr-router/gr-router.js
+++ b/polygerrit-ui/app/elements/core/gr-router/gr-router.js
@@ -283,6 +283,51 @@
      };
    });

+    // Matches /admin/plugins[,<offset>][/].
+    page(/^\/admin\/plugins(,(\d+))?(\/)?$/, loadUser, data => {
+      restAPI.getLoggedIn().then(loggedIn => {
+        if (loggedIn) {
+          app.params = {
+            view: Gerrit.Nav.View.ADMIN,
+            adminView: 'gr-plugin-list',
+            offset: data.params[1] || 0,
+            filter: null,
+          };
+        } else {
+          redirectToLogin(data.canonicalPath);
+        }
+      });
+    });
+
+    page('/admin/plugins/q/filter::filter,:offset', loadUser, data => {
+      restAPI.getLoggedIn().then(loggedIn => {
+        if (loggedIn) {
+          app.params = {
+            view: Gerrit.Nav.View.ADMIN,
+            adminView: 'gr-plugin-list',
+            offset: data.params.offset,
+            filter: data.params.filter,
+          };
+        } else {
+          redirectToLogin(data.canonicalPath);
+        }
+      });
+    });
+
+    page('/admin/plugins/q/filter::filter', loadUser, data => {
+      restAPI.getLoggedIn().then(loggedIn => {
+        if (loggedIn) {
+          app.params = {
+            view: Gerrit.Nav.View.ADMIN,
+            adminView: 'gr-plugin-list',
+            filter: data.params.filter || null,
+          };
+        } else {
+          redirectToLogin(data.canonicalPath);
+        }
+      });
+    });
+
    page(/^\/admin\/plugins(\/)?$/, loadUser, data => {
      restAPI.getLoggedIn().then(loggedIn => {
        if (loggedIn) {
--- a/polygerrit-ui/app/elements/shared/gr-rest-api-interface/gr-rest-api-interface.js
+++ b/polygerrit-ui/app/elements/shared/gr-rest-api-interface/gr-rest-api-interface.js
@@ -675,8 +675,13 @@
      );
    },

-    getPlugins() {
-      return this._fetchSharedCacheURL('/plugins/?all');
+    getPlugins(filter, pluginsPerPage, opt_offset) {
+      const offset = opt_offset || 0;
+
+      return this.fetchJSON(
+          `/plugins/?all&n=${pluginsPerPage + 1}&S=${offset}` +
+          this._computeFilter(filter)
+      );
    },

    getSuggestedGroups(inputVal, opt_n, opt_errFn, opt_ctx) {