Merge "Submit Requirements - render quick label info"
diff --git a/polygerrit-ui/app/elements/change/gr-submit-requirements/gr-submit-requirements.ts b/polygerrit-ui/app/elements/change/gr-submit-requirements/gr-submit-requirements.ts
index 21e8093..11dc9d9 100644
--- a/polygerrit-ui/app/elements/change/gr-submit-requirements/gr-submit-requirements.ts
+++ b/polygerrit-ui/app/elements/change/gr-submit-requirements/gr-submit-requirements.ts
@@ -21,6 +21,7 @@
 import {
   AccountInfo,
   isDetailedLabelInfo,
+  isQuickLabelInfo,
   LabelInfo,
   LabelNameToInfoMap,
   SubmitRequirementResultInfo,
@@ -225,18 +226,23 @@
 
   renderLabelVote(label: string, labels: LabelNameToInfoMap) {
     const labelInfo = labels[label];
-    if (!isDetailedLabelInfo(labelInfo)) return;
-    const uniqueApprovals = getAllUniqueApprovals(labelInfo);
-    return uniqueApprovals.map(
-      approvalInfo =>
-        html`<gr-vote-chip
-          .vote="${approvalInfo}"
-          .label="${labelInfo}"
-          .more="${(labelInfo.all ?? []).filter(
-            other => other.value === approvalInfo.value
-          ).length > 1}"
-        ></gr-vote-chip>`
-    );
+    if (isDetailedLabelInfo(labelInfo)) {
+      const uniqueApprovals = getAllUniqueApprovals(labelInfo);
+      return uniqueApprovals.map(
+        approvalInfo =>
+          html`<gr-vote-chip
+            .vote="${approvalInfo}"
+            .label="${labelInfo}"
+            .more="${(labelInfo.all ?? []).filter(
+              other => other.value === approvalInfo.value
+            ).length > 1}"
+          ></gr-vote-chip>`
+      );
+    } else if (isQuickLabelInfo(labelInfo)) {
+      return [html`<gr-vote-chip .label="${labelInfo}"></gr-vote-chip>`];
+    } else {
+      return html``;
+    }
   }
 
   renderChecks(requirement: SubmitRequirementResultInfo) {
@@ -364,19 +370,30 @@
   }
 
   override render() {
-    const uniqueApprovals = getAllUniqueApprovals(this.labelInfo);
+    if (!this.labelInfo) return;
     return html`
       <div class="container">
         <span class="label">${this.label}</span>
-        ${uniqueApprovals.map(
-          approvalInfo => html`<gr-vote-chip
-            .vote="${approvalInfo}"
-            .label="${this.labelInfo}"
-          ></gr-vote-chip>`
-        )}
+        ${this.renderVotes()}
       </div>
     `;
   }
+
+  private renderVotes() {
+    if (!this.labelInfo) return;
+    if (isDetailedLabelInfo(this.labelInfo)) {
+      return getAllUniqueApprovals(this.labelInfo).map(
+        approvalInfo => html`<gr-vote-chip
+          .vote="${approvalInfo}"
+          .label="${this.labelInfo}"
+        ></gr-vote-chip>`
+      );
+    } else if (isQuickLabelInfo(this.labelInfo)) {
+      return [html`<gr-vote-chip .label="${this.labelInfo}"></gr-vote-chip>`];
+    } else {
+      return html``;
+    }
+  }
 }
 
 declare global {
diff --git a/polygerrit-ui/app/elements/shared/gr-vote-chip/gr-vote-chip.ts b/polygerrit-ui/app/elements/shared/gr-vote-chip/gr-vote-chip.ts
index 3762d8d..9013088 100644
--- a/polygerrit-ui/app/elements/shared/gr-vote-chip/gr-vote-chip.ts
+++ b/polygerrit-ui/app/elements/shared/gr-vote-chip/gr-vote-chip.ts
@@ -16,7 +16,12 @@
  */
 import {LitElement, css, html} from 'lit';
 import {customElement, property} from 'lit/decorators';
-import {ApprovalInfo, LabelInfo} from '../../../api/rest-api';
+import {
+  ApprovalInfo,
+  isDetailedLabelInfo,
+  isQuickLabelInfo,
+  LabelInfo,
+} from '../../../api/rest-api';
 import {appContext} from '../../../services/app-context';
 import {KnownExperimentId} from '../../../services/flags/flags';
 import {
@@ -109,22 +114,51 @@
   override render() {
     if (!this.flagsService.isEnabled(KnownExperimentId.SUBMIT_REQUIREMENTS_UI))
       return;
-    if (!this.vote?.value) return;
-    const className = this.computeClass(this.vote.value, this.label);
+
+    const renderValue = this.renderValue();
+    if (!renderValue) return;
+
     return html`<span class="container">
-      <div class="vote-chip ${className} ${this.more ? 'more' : ''}">
-        ${valueString(this.vote.value)}
+      <div class="vote-chip ${this.computeClass()} ${this.more ? 'more' : ''}">
+        ${renderValue}
       </div>
       ${this.more
-        ? html`<div class="chip-angle ${className}">
-            ${valueString(this.vote.value)}
+        ? html`<div class="chip-angle ${this.computeClass()}">
+            ${renderValue}
           </div>`
         : ''}
     </span>`;
   }
 
-  computeClass(vote: number, label?: LabelInfo) {
-    const status = getLabelStatus(label, vote);
-    return classForLabelStatus(status);
+  private renderValue() {
+    if (!this.label) {
+      return '';
+    } else if (isDetailedLabelInfo(this.label)) {
+      if (this.vote?.value) {
+        return valueString(this.vote.value);
+      }
+    } else if (isQuickLabelInfo(this.label)) {
+      if (this.label.approved) {
+        return '👍️';
+      } else if (this.label.rejected) {
+        return '👎️';
+      }
+    }
+    return '';
+  }
+
+  private computeClass() {
+    if (!this.label) {
+      return '';
+    } else if (isDetailedLabelInfo(this.label)) {
+      if (this.vote?.value) {
+        const status = getLabelStatus(this.label, this.vote.value);
+        return classForLabelStatus(status);
+      }
+    } else if (isQuickLabelInfo(this.label)) {
+      const status = getLabelStatus(this.label);
+      return classForLabelStatus(status);
+    }
+    return '';
   }
 }
diff --git a/polygerrit-ui/app/utils/label-util.ts b/polygerrit-ui/app/utils/label-util.ts
index 884afd7..7c94892 100644
--- a/polygerrit-ui/app/utils/label-util.ts
+++ b/polygerrit-ui/app/utils/label-util.ts
@@ -70,17 +70,23 @@
   return max > -min ? max : min;
 }
 
-export function getLabelStatus(
-  label?: DetailedLabelInfo,
-  vote?: number
-): LabelStatus {
-  const value = vote ?? getRepresentativeValue(label);
-  const range = getVotingRangeOrDefault(label);
-  if (value < 0) {
-    return value === range.min ? LabelStatus.REJECTED : LabelStatus.DISLIKED;
+export function getLabelStatus(label?: LabelInfo, vote?: number): LabelStatus {
+  if (!label) return LabelStatus.NEUTRAL;
+  if (isDetailedLabelInfo(label)) {
+    const value = vote ?? getRepresentativeValue(label);
+    const range = getVotingRangeOrDefault(label);
+    if (value < 0) {
+      return value === range.min ? LabelStatus.REJECTED : LabelStatus.DISLIKED;
+    }
+    if (value > 0) {
+      return value === range.max
+        ? LabelStatus.APPROVED
+        : LabelStatus.RECOMMENDED;
+    }
   }
-  if (value > 0) {
-    return value === range.max ? LabelStatus.APPROVED : LabelStatus.RECOMMENDED;
+  if (isQuickLabelInfo(label)) {
+    if (label.approved) return LabelStatus.RECOMMENDED;
+    if (label.rejected) return LabelStatus.DISLIKED;
   }
   return LabelStatus.NEUTRAL;
 }
diff --git a/polygerrit-ui/app/utils/label-util_test.ts b/polygerrit-ui/app/utils/label-util_test.ts
index 196c5e9..ec27758 100644
--- a/polygerrit-ui/app/utils/label-util_test.ts
+++ b/polygerrit-ui/app/utils/label-util_test.ts
@@ -32,8 +32,10 @@
   AccountInfo,
   ApprovalInfo,
   DetailedLabelInfo,
+  QuickLabelInfo,
 } from '../types/common';
 import {
+  createAccountWithEmail,
   createSubmitRequirementExpressionInfo,
   createSubmitRequirementResultInfo,
 } from '../test/test-data-generators';
@@ -171,6 +173,15 @@
     assert.equal(getLabelStatus(labelInfo), LabelStatus.REJECTED);
   });
 
+  test('getLabelStatus - quicklabelinfo', () => {
+    let labelInfo: QuickLabelInfo = {};
+    assert.equal(getLabelStatus(labelInfo), LabelStatus.NEUTRAL);
+    labelInfo = {approved: createAccountWithEmail()};
+    assert.equal(getLabelStatus(labelInfo), LabelStatus.RECOMMENDED);
+    labelInfo = {rejected: createAccountWithEmail()};
+    assert.equal(getLabelStatus(labelInfo), LabelStatus.DISLIKED);
+  });
+
   test('getRepresentativeValue', () => {
     let labelInfo: DetailedLabelInfo = {all: []};
     assert.equal(getRepresentativeValue(labelInfo), 0);