commit bcf84d2ea42470147ee66e52de6ac3ea0ffe299f
author Dmitrii Filippov <dmfilippov@google.com> Wed Mar 18 15:31:59 2020 +0100
committer Ben Rohlfs <brohlfs@google.com> Wed Apr 15 15:35:58 2020 +0200
tree 81efe8751ef76441ac17056762ab1fe867b69124
parent 9fcb51999270361aa928e1ef7591e8cdfac247f9

Show reviewers next to each other

This affects only <gr-reviewer-list>, which is only used in
<gr-change-metadata>.

The goal is show more reviewers using the same amount of space. With the
new ability to show first names only two reviewers easily fit on one
row. So the metadata will consume less vertical space, or we can show
more reviewers using the same space.

Example screenshots:
Before: https://imgur.com/a/FmvUk6L
After: https://imgur.com/a/CHlM5vo

Change-Id: I23dd2080a7f0526f2d258f92c0bf8b6d356ea05b

polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.js

diff --git a/polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.js b/polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.js
index 129cb01..0fcf81d 100644
--- a/polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.js
+++ b/polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.js
@@ -44,6 +44,7 @@
   static get properties() {
     return {
       change: Object,
+      serverConfig: Object,
       disabled: {
         type: Boolean,
         value: false,
@@ -61,7 +62,6 @@
         type: Boolean,
         value: false,
       },
-      maxReviewersDisplayed: Number,
 
       _displayedReviewers: {
         type: Array,
@@ -92,7 +92,7 @@
 
   static get observers() {
     return [
-      '_reviewersChanged(change.reviewers.*, change.owner)',
+      '_reviewersChanged(change.reviewers.*, change.owner, serverConfig)',
     ];
   }
 
@@ -179,9 +179,9 @@
     return maxScores.join(', ');
   }
 
-  _reviewersChanged(changeRecord, owner) {
+  _reviewersChanged(changeRecord, owner, serverConfig) {
     // Polymer 2: check for undefined
-    if ([changeRecord, owner].some(arg => arg === undefined)) {
+    if ([changeRecord, owner, serverConfig].some(arg => arg === undefined)) {
       return;
     }
 
@@ -201,12 +201,13 @@
     this._reviewers = result
         .filter(reviewer => reviewer._account_id != owner._account_id);
 
+    const isFirstNameConfigured = serverConfig.accounts
+        && serverConfig.accounts.default_display_name === 'FIRST_NAME';
+    const maxReviewers = isFirstNameConfigured ? 6 : 3;
     // If there is one or two more than the max reviewers, don't show the
     // 'show more' button, because it takes up just as much space.
-    if (this.maxReviewersDisplayed &&
-        this._reviewers.length > this.maxReviewersDisplayed + 2) {
-      this._displayedReviewers =
-        this._reviewers.slice(0, this.maxReviewersDisplayed);
+    if (this._reviewers.length > maxReviewers + 2) {
+      this._displayedReviewers = this._reviewers.slice(0, maxReviewers);
     } else {
       this._displayedReviewers = this._reviewers;
     }