Add a link to group page in groups section of settings

Change-Id: If1313fbfdfdaaa60c569c7602b3ae77e30b36234

polygerrit-ui/app/elements/settings/gr-group-list/gr-group-list.html

@@ -15,9 +15,10 @@ limitations under the License.
 -->
 
 <link rel="import" href="../../../bower_components/polymer/polymer.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
+<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
+<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 
 <dom-module id="gr-group-list">
   <template>
@@ -47,7 +48,11 @@ limitations under the License.
         <tbody>
           <template is="dom-repeat" items="[[_groups]]">
             <tr>
-              <td class="nameColumn">[[item.name]]</td>
+              <td class="nameColumn">
+                <a href$="[[_computeGroupPath(item)]]">
+                  [[item.name]]
+                </a>
+              </td>
               <td>[[item.description]]</td>
               <td class="visibleCell">[[_computeVisibleToAll(item)]]</td>
             </tr>

polygerrit-ui/app/elements/settings/gr-group-list/gr-group-list.js

@@ -32,5 +32,11 @@
     _computeVisibleToAll(group) {
       return group.options.visible_to_all ? 'Yes' : 'No';
     },
+
+    _computeGroupPath(group) {
+      if (!group || !group.id) { return; }
+
+      return Gerrit.Nav.getUrlForGroup(group.id);
+    },
   });
 })();

polygerrit-ui/app/elements/settings/gr-group-list/gr-group-list_test.html

@@ -33,10 +33,12 @@ limitations under the License.
 
 <script>
   suite('gr-group-list tests', () => {
+    let sandbox;
     let element;
     let groups;
 
     setup(done => {
+      sandbox = sinon.sandbox.create();
       groups = [{
         url: 'some url',
         options: {},
@@ -65,13 +67,15 @@ limitations under the License.
       element.loadData().then(() => { flush(done); });
     });
 
+    teardown(() => { sandbox.restore(); });
+
     test('renders', () => {
       const rows = Polymer.dom(element.root).querySelectorAll('tbody tr');
 
       assert.equal(rows.length, 3);
 
       const nameCells = rows.map(row =>
-        row.querySelectorAll('td')[0].textContent
+        row.querySelectorAll('td a')[0].textContent.trim()
       );
 
       assert.equal(nameCells[0], 'Group 1');
@@ -83,5 +87,23 @@ limitations under the License.
       assert.equal(element._computeVisibleToAll(groups[0]), 'No');
       assert.equal(element._computeVisibleToAll(groups[1]), 'Yes');
     });
+
+    test('_computeGroupPath', () => {
+      sandbox.stub(Gerrit.Nav, 'getUrlForGroup',
+          () => '/admin/groups/e2cd66f88a2db4d391ac068a92d987effbe872f5');
+
+      let group = {
+        id: 'e2cd66f88a2db4d391ac068a92d987effbe872f5',
+      };
+
+      assert.equal(element._computeGroupPath(group),
+          '/admin/groups/e2cd66f88a2db4d391ac068a92d987effbe872f5');
+
+      group = {
+        name: 'admin',
+      };
+
+      assert.isUndefined(element._computeGroupPath(group));
+    });
   });
 </script>