PolyGerrit: Add "Mark as Reviewed" keyboard shortcut for change list

Changes that become marked as unreviewed can only be marked as reviewed
in the dashboard by clicking into the review, selecting the vertical
dropdown, and finally clicking "Mark reviewed".

For users with busy dashboards who would like to quickly mark changes
as reviewed, it becomes quite cumbersome to have to navigate into every
review they want to mark as reviewed. To improve their user experience,
they should be able to mark reviews quickly and easily from the changes
list in the dashboard without having to click into each individual
review.

Reviewers may come across reviews that they want to quickly mark as
read in various situations. One example is when the code owner rebases
with no new code changes, resulting in the review to be bolded on the
dashboard but unable to be quickly dismissed. Other situations are
discussed in the issue comments.

Feature: Issue 2390
Change-Id: I86664055f3315fb497e887c6702c24f483b5dff6
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list-item/gr-change-list-item.js b/polygerrit-ui/app/elements/change-list/gr-change-list-item/gr-change-list-item.js
index b73a237..3f5a402 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list-item/gr-change-list-item.js
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list-item/gr-change-list-item.js
@@ -39,6 +39,11 @@
         type: String,
         computed: '_computeChangeURL(change)',
       },
+      needsReview: {
+        type: Boolean,
+        reflectToAttribute: true,
+        computed: '_computeItemNeedsReview(change.reviewed)',
+      },
       statuses: {
         type: Array,
         computed: 'changeStatuses(change)',
@@ -62,6 +67,10 @@
       Gerrit.URLEncodingBehavior,
     ],
 
+    _computeItemNeedsReview(reviewed) {
+      return !reviewed;
+    },
+
     _computeChangeURL(change) {
       return Gerrit.Nav.getUrlForChange(change);
     },
@@ -188,5 +197,14 @@
         return 'XL';
       }
     },
+
+    toggleReviewed() {
+      const newVal = !this.change.reviewed;
+      this.set('change.reviewed', newVal);
+      this.dispatchEvent(new CustomEvent('toggle-reviewed', {
+        bubbles: true,
+        detail: {change: this.change, reviewed: newVal},
+      }));
+    },
   });
 })();
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.html b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.html
index fc00299..1fddc98 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.html
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.html
@@ -87,7 +87,8 @@
           preferences="[[preferences]]"
           selected-index="{{viewState.selectedChangeIndex}}"
           show-star="[[_loggedIn]]"
-          on-toggle-star="_handleToggleStar"></gr-change-list>
+          on-toggle-star="_handleToggleStar"
+          on-toggle-reviewed="_handleToggleReviewed"></gr-change-list>
       <nav class$="[[_computeNavClass(_loading)]]">
           Page [[_computePage(_offset, _changesPerPage)]]
           <a id="prevArrow"
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.js b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.js
index 9b099cd..d5ae7c1 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.js
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.js
@@ -268,5 +268,10 @@
       this.$.restAPI.saveChangeStarred(e.detail.change._number,
           e.detail.starred);
     },
+
+    _handleToggleReviewed(e) {
+      this.$.restAPI.saveChangeReviewed(e.detail.change._number,
+          e.detail.reviewed);
+    },
   });
 })();
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
index 33bc338..0bd57f6 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
@@ -112,7 +112,8 @@
       'n ]': '_handleNKey',
       'o': '_handleOKey',
       'p [': '_handlePKey',
-      'shift+r': '_handleRKey',
+      'r': '_handleRKey',
+      'shift+r': '_handleShiftRKey',
       's': '_handleSKey',
     },
 
@@ -282,6 +283,24 @@
     },
 
     _handleRKey(e) {
+      if (this.shouldSuppressKeyboardShortcut(e) ||
+          this.modifierPressed(e)) { return; }
+
+      e.preventDefault();
+      this._toggleReviewedForIndex(this.selectedIndex);
+    },
+
+    _toggleReviewedForIndex(index) {
+      const changeEls = this._getListItems();
+      if (index >= changeEls.length || !changeEls[index]) {
+        return;
+      }
+
+      const changeEl = changeEls[index];
+      changeEl.toggleReviewed();
+    },
+
+    _handleShiftRKey(e) {
       if (this.shouldSuppressKeyboardShortcut(e)) { return; }
 
       e.preventDefault();
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
index 39d7ab1..ec581b6 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
@@ -451,6 +451,14 @@
       MockInteractions.pressAndReleaseKeyOn(element, 13); // 'enter'
       assert.deepEqual(navStub.lastCall.args[0], {_number: 4},
           'Should navigate to /c/4/');
+
+      MockInteractions.pressAndReleaseKeyOn(element, 82); // 'r'
+      const change = element._changeForIndex(element.selectedIndex);
+      assert.equal(change.reviewed, true,
+          'Should mark change as reviewed');
+      MockInteractions.pressAndReleaseKeyOn(element, 82); // 'r'
+      assert.equal(change.reviewed, false,
+          'Should mark change as unreviewed');
     });
 
     test('highlight attribute is updated correctly', () => {
diff --git a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
index 1b21543..b18e8cd 100644
--- a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
+++ b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
@@ -61,7 +61,8 @@
           preferences="[[preferences]]"
           selected-index="{{viewState.selectedChangeIndex}}"
           sections="[[_results]]"
-          on-toggle-star="_handleToggleStar"></gr-change-list>
+          on-toggle-star="_handleToggleStar"
+          on-toggle-reviewed="_handleToggleReviewed"></gr-change-list>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
     <gr-reporting id="reporting"></gr-reporting>
diff --git a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
index 9cf76da..5977714 100644
--- a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
+++ b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
@@ -246,5 +246,10 @@
       this.$.restAPI.saveChangeStarred(e.detail.change._number,
           e.detail.starred);
     },
+
+    _handleToggleReviewed(e) {
+      this.$.restAPI.saveChangeReviewed(e.detail.change._number,
+          e.detail.reviewed);
+    },
   });
 })();