From 5307b55353aa54522b8b5d8de3ede30c67162e26 Mon Sep 17 00:00:00 2001
From: Tatjana Dehler <tdehler@suse.com>
Date: Tue, 29 Jan 2019 16:18:45 +0100
Subject: [PATCH] mgr/dashboard: Group buttons together into one button menu

Group the two buttons 'Set Cluster-wide Flags' and 'Set Cluster-wide
Recovery Priority' together into one button menu.

Fixes: http://tracker.ceph.com/issues/37380
Signed-off-by: Tatjana Dehler <tdehler@suse.com>
---
 .../osd/osd-list/osd-list.component.html      | 46 ++++++++++++-------
 .../osd/osd-list/osd-list.component.scss      |  3 ++
 .../frontend/src/locale/messages.xlf          | 12 ++---
 .../mgr/dashboard/frontend/src/styles.scss    |  3 ++
 4 files changed, 41 insertions(+), 23 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
index dadc21beeddb..86f9afacba79 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
@@ -14,23 +14,35 @@
                           [tableActions]="tableActions">
         </cd-table-actions>
 
-        <button class="btn btn-sm btn-default btn-label tc_configureCluster"
-                type="button"
-                (click)="configureClusterAction()">
-          <i class="fa fa-fw fa-cog"
-             aria-hidden="true">
-          </i>
-          <ng-container i18n>Set Cluster-wide Flags</ng-container>
-        </button>
-
-        <button class="btn btn-sm btn-default btn-label tc_configureCluster"
-                type="button"
-                (click)="configureQosParamsAction()">
-          <i class="fa fa-fw fa-cog"
-             aria-hidden="true">
-          </i>
-          <ng-container i18n>Set Cluster-wide Recovery Priority</ng-container>
-        </button>
+        <div class="btn-group"
+             dropdown>
+          <button type="button"
+                  class="btn btn-sm btn-default btn-label tc_configureCluster"
+                  (click)="configureClusterAction()">
+            <i class="fa fa-fw fa-cog"
+               aria-hidden="true">
+            </i>
+            <ng-container i18n>Set Cluster-wide Flags</ng-container>
+          </button>
+          <button type="button"
+                  dropdownToggle
+                  class="btn btn-sm btn-default dropdown-toggle dropdown-toggle-split">
+            <span class="caret caret-black"></span>
+          </button>
+          <ul *dropdownMenu
+              class="dropdown-menu"
+              role="menu">
+            <li role="menuitem">
+              <a class="dropdown-item"
+                 (click)="configureQosParamsAction()">
+                <i class="fa fa-fw fa-cog"
+                   aria-hidden="true">
+                </i>
+                <ng-container i18n>Set Cluster-wide Recovery Priority</ng-container>
+              </a>
+            </li>
+          </ul>
+        </div>
       </div>
 
       <cd-osd-details cdTableDetail
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.scss
index e69de29bb2d1..d27309cfa7b9 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.scss
@@ -0,0 +1,3 @@
+.caret.caret-black {
+  color: #000000;
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf b/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
index 0e04fdf1bb2c..4ebdc40b581f 100644
--- a/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
+++ b/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
@@ -669,7 +669,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">59</context>
+          <context context-type="linenumber">71</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/pool/pool-list/pool-list.component.html</context>
@@ -1062,13 +1062,13 @@
         <source>Set Cluster-wide Flags</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">23</context>
+          <context context-type="linenumber">25</context>
         </context-group>
       </trans-unit><trans-unit id="9617df8e0504d997d0ff45b6c206a12becd13c37" datatype="html">
         <source>Set Cluster-wide Recovery Priority</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">32</context>
+          <context context-type="linenumber">41</context>
         </context-group>
       </trans-unit><trans-unit id="b49d7877d24112d4bdfce9256edf61a007fae888" datatype="html">
         <source>OSDs List</source>
@@ -1081,20 +1081,20 @@
   <x id="START_TAG_STRONG" ctype="x-strong" equiv-text="&lt;strong&gt;"/><x id="INTERPOLATION_1" equiv-text="{{ markActionDescription }}"/><x id="CLOSE_TAG_STRONG" ctype="x-strong" equiv-text="&lt;/strong&gt;"/> if you proceed.</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">69</context>
+          <context context-type="linenumber">81</context>
         </context-group>
       </trans-unit><trans-unit id="2d3a73f6440a7d896d74356fe0a725d731e71cbb" datatype="html">
         <source>The OSD is not safe to destroy!</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">78</context>
+          <context context-type="linenumber">90</context>
         </context-group>
       </trans-unit><trans-unit id="9d08116242443953ebbfe10bc2092e0a694b4adf" datatype="html">
         <source><x id="START_TAG_STRONG" ctype="x-strong" equiv-text="&lt;strong&gt;"/>OSD <x id="INTERPOLATION" equiv-text="{{ selection.first().id }}"/><x id="CLOSE_TAG_STRONG" ctype="x-strong" equiv-text="&lt;/strong&gt;"/> will be
   <x id="START_TAG_STRONG" ctype="x-strong" equiv-text="&lt;strong&gt;"/><x id="INTERPOLATION_1" equiv-text="{{ actionDescription }}"/><x id="CLOSE_TAG_STRONG" ctype="x-strong" equiv-text="&lt;/strong&gt;"/> if you proceed.</source>
         <context-group purpose="location">
           <context context-type="sourcefile">app/ceph/cluster/osd/osd-list/osd-list.component.html</context>
-          <context context-type="linenumber">80</context>
+          <context context-type="linenumber">92</context>
         </context-group>
       </trans-unit><trans-unit id="d2bcd3296d2850de762fb943060b7e086a893181" datatype="html">
         <source>Health</source>
diff --git a/src/pybind/mgr/dashboard/frontend/src/styles.scss b/src/pybind/mgr/dashboard/frontend/src/styles.scss
index 6e3f1bdab089..1e2a69ff0bb1 100644
--- a/src/pybind/mgr/dashboard/frontend/src/styles.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/styles.scss
@@ -155,6 +155,9 @@ button.btn.btn-label > i.fa {
   /** Add space between icon and text */
   padding-right: 5px;
 }
+.btn-toolbar .btn-group {
+  float: none;
+}
 
 /* Dropdown */
 .dropdown-menu {
-- 
2.47.3