Allow hiding cancel button in gr-dialog

With this change, the cancel button may be hidden from the footer of the
dialog by supplying an empty string as the cancel label.

Bug: Issue 9543
Change-Id: Ic9841424bd2bb28a92a488280e7e7bbd0c4aae54

polygerrit-ui/app/elements/shared/gr-dialog/gr-dialog.html

@@ -55,12 +55,17 @@ limitations under the License.
         flex-shrink: 0;
         justify-content: flex-end;
       }
+      .hidden {
+        display: none;
+      }
     </style>
     <div class="container" on-keydown="_handleKeydown">
       <header><slot name="header"></slot></header>
       <main><slot name="main"></slot></main>
       <footer>
-        <gr-button link on-tap="_handleCancelTap">[[cancelLabel]]</gr-button>
+        <gr-button id="cancel" class$="[[_computeCancelClass(cancelLabel)]]" link on-tap="_handleCancelTap">
+          [[cancelLabel]]
+        </gr-button>
         <gr-button id="confirm" link primary on-tap="_handleConfirm" disabled="[[disabled]]">
           [[confirmLabel]]
         </gr-button>

polygerrit-ui/app/elements/shared/gr-dialog/gr-dialog.js

@@ -37,6 +37,7 @@
         type: String,
         value: 'Confirm',
       },
+      // Supplying an empty cancel label will hide the button completely.
       cancelLabel: {
         type: String,
         value: 'Cancel',
@@ -74,5 +75,9 @@
     resetFocus() {
       this.$.confirm.focus();
     },
+
+    _computeCancelClass(cancelLabel) {
+      return cancelLabel.length ? '' : 'hidden';
+    },
   });
 })();

polygerrit-ui/app/elements/shared/gr-dialog/gr-dialog_test.html

@@ -79,5 +79,13 @@ limitations under the License.
       element.resetFocus();
       assert.isTrue(focusStub.calledOnce);
     });
+
+    test('empty cancel label hides cancel btn', () => {
+      assert.isFalse(isHidden(element.$.cancel));
+      element.cancelLabel = '';
+      flushAsynchronousOperations();
+
+      assert.isTrue(isHidden(element.$.cancel));
+    });
   });
 </script>