Show indicator when change parent is out of date

If the parent of the commit is no longer the tip of the target branch,
it becomes possible to rebase the change on that branch. With this
change, the change metadata section shows an out of date indicator next
to the abbreviated parent hash.

The indicator is only shown on non-merge changes for authenticated
users.

Bug: Issue 4655
Change-Id: I6cb4d280352bb37214b853760c6723597690010a
diff --git a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.html b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.html
index ca94356..514f3a9 100644
--- a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.html
+++ b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.html
@@ -28,6 +28,7 @@
 <link rel="import" href="../../shared/gr-editable-label/gr-editable-label.html">
 <link rel="import" href="../../shared/gr-label/gr-label.html">
 <link rel="import" href="../../shared/gr-linked-chip/gr-linked-chip.html">
+<link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 <link rel="import" href="../gr-commit-info/gr-commit-info.html">
 <link rel="import" href="../gr-reviewer-list/gr-reviewer-list.html">
@@ -135,6 +136,13 @@
       .parentList gr-commit-info {
         display: inline-block;
       }
+      #parentNotCurrentMessage {
+        display: none;
+      }
+      .parentList.notCurrent.nonMerge #parentNotCurrentMessage {
+        --arrow-color: red;
+        display: inline-block;
+      }
       @media screen and (max-width: 50em), screen and (min-width: 75em) {
         :host {
           display: table;
@@ -236,13 +244,18 @@
       <section>
         <span class="title">[[_computeParentsLabel(_currentParents)]]</span>
         <span class="value">
-          <ol class$="[[_computeParentListClass(_currentParents)]]">
+          <ol class$="[[_computeParentListClass(_currentParents, parentIsCurrent)]]">
             <template is="dom-repeat" items="[[_currentParents]]" as="parent">
               <li>
                 <gr-commit-info
                     change="[[change]]"
                     commit-info="[[parent]]"
                     server-config="[[serverConfig]]"></gr-commit-info>
+                <gr-tooltip-content
+                    id="parentNotCurrentMessage"
+                    has-tooltip
+                    show-icon
+                    title$="[[_notCurrentMessage]]"></gr-tooltip-content>
               </li>
             </template>
           </ol>
diff --git a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.js b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.js
index 92763ee..ddee577 100644
--- a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.js
+++ b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata.js
@@ -25,6 +25,8 @@
     CHERRY_PICK: 'Cherry Pick',
   };
 
+  const NOT_CURRENT_MESSAGE = 'Not current - rebase possible';
+
   Polymer({
     is: 'gr-change-metadata',
 
@@ -46,6 +48,12 @@
        * @type {{ note_db_enabled: string }}
        */
       serverConfig: Object,
+      parentIsCurrent: Boolean,
+      _notCurrentMessage: {
+        type: String,
+        value: NOT_CURRENT_MESSAGE,
+        readOnly: true,
+      },
       _topicReadOnly: {
         type: Boolean,
         computed: '_computeTopicReadOnly(mutable, change)',
@@ -425,8 +433,12 @@
       return parents.length > 1 ? 'Parents' : 'Parent';
     },
 
-    _computeParentListClass(parents) {
-      return parents.length > 1 ? 'parentList merge' : 'parentList';
+    _computeParentListClass(parents, parentIsCurrent) {
+      return [
+        'parentList',
+        parents.length > 1 ? 'merge' : 'nonMerge',
+        parentIsCurrent ? 'current' : 'notCurrent',
+      ].join(' ');
     },
   });
 })();
diff --git a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata_test.html b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata_test.html
index f6d020e..9ee09ea 100644
--- a/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata_test.html
+++ b/polygerrit-ui/app/elements/change/gr-change-metadata/gr-change-metadata_test.html
@@ -336,6 +336,18 @@
           'Parents');
     });
 
+    test('_computeParentListClass', () => {
+      const parent = {commit: 'abc123', subject: 'My parent commit'};
+      assert.equal(element._computeParentListClass([parent], true),
+          'parentList nonMerge current');
+      assert.equal(element._computeParentListClass([parent], false),
+          'parentList nonMerge notCurrent');
+      assert.equal(element._computeParentListClass([parent, parent], false),
+          'parentList merge notCurrent');
+      assert.equal(element._computeParentListClass([parent, parent], true),
+          'parentList merge current');
+    });
+
     test('_showAddTopic', () => {
       assert.isTrue(element._showAddTopic(null, false));
       assert.isTrue(element._showAddTopic({base: {topic: null}}, false));
diff --git a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html
index 7db2bc4..7e661c7 100644
--- a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html
+++ b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html
@@ -370,6 +370,7 @@
               server-config="[[_serverConfig]]"
               missing-labels="[[_missingLabels]]"
               mutable="[[_loggedIn]]"
+              parent-is-current="[[!_rebaseOriginallyEnabled]]"
               on-show-reply-dialog="_handleShowReplyDialog">
           </gr-change-metadata>
           <!-- Plugins insert content into following container.
diff --git a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js
index 9cf029b..fd9a490 100644
--- a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js
+++ b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js
@@ -224,6 +224,7 @@
         value: false,
         observer: '_updateToggleContainerClass',
       },
+      _rebaseOriginallyEnabled: Boolean,
     },
 
     behaviors: [
@@ -937,6 +938,7 @@
       if (revisionActions && revisionActions.rebase) {
         revisionActions.rebase.rebaseOnCurrent =
             !!revisionActions.rebase.enabled;
+        this._rebaseOriginallyEnabled = !!revisionActions.rebase.enabled;
         revisionActions.rebase.enabled = true;
       }
       return revisionActions;
diff --git a/polygerrit-ui/app/elements/shared/gr-tooltip-content/gr-tooltip-content.html b/polygerrit-ui/app/elements/shared/gr-tooltip-content/gr-tooltip-content.html
index e80cbe5..68db696 100644
--- a/polygerrit-ui/app/elements/shared/gr-tooltip-content/gr-tooltip-content.html
+++ b/polygerrit-ui/app/elements/shared/gr-tooltip-content/gr-tooltip-content.html
@@ -19,6 +19,11 @@
 
 <dom-module id="gr-tooltip-content">
   <template>
+    <style>
+      .arrow {
+        color: var(--arrow-color);
+      }
+    </style>
     <slot></slot><!--
  --><span class="arrow" hidden$="[[!showIcon]]">&#9432;</span>
   </template>