Tenant options instead of free text

ManageIQ · Mar 16, 2017 · 54af124 · 54af124
1 parent 98f912d
commit 54af124
Show file tree

Hide file tree

Showing 9 changed files with 90 additions and 34 deletions.
diff --git a/app/assets/javascripts/controllers/live_metrics/ad_hoc_metrics_controller.js b/app/assets/javascripts/controllers/live_metrics/ad_hoc_metrics_controller.js
@@ -1,13 +1,24 @@
 /* global miqHttpInject */
-
-  ManageIQ.angular.app.controller('adHocMetricsController', ['$http', '$window', 'miqService',
-    'metricsUtilsFactory', 'metricsHttpFactory', 'metricsConfigFactory', 'metricsParseUrlFactory',
-    function($http, $window, miqService, metricsUtilsFactory, metricsHttpFactory, metricsConfigFactory, metricsParseUrlFactory) {
-
+ManageIQ.angular.app.controller('adHocMetricsController', ['$http', '$window', 'miqService',
+  'metricsUtilsFactory', 'metricsHttpFactory', 'metricsConfigFactory', 'metricsParseUrlFactory',
+  function($http, $window, miqService, metricsUtilsFactory, metricsHttpFactory, metricsConfigFactory, metricsParseUrlFactory) {
     var dash = this;
     var utils = metricsUtilsFactory(dash);
     var httpUtils = metricsHttpFactory(dash, $http, utils, miqService);
 
+    dash.refreshList = httpUtils.refreshList;
+    dash.refreshGraph = httpUtils.refreshGraph;
+
+    var pageSetup = function() {
+      // try to parse config variables from page url
+      // and set page config variables
+      metricsParseUrlFactory(dash, $window);
+      metricsConfigFactory(dash);
+
+      // load tenants
+      httpUtils.getTenants();
+    }
+
     var initialization = function() {
       dash.tenantChanged = false;
       dash.filterChanged = true;
@@ -38,7 +49,8 @@
         actionsConfig: dash.actionsConfig
       };
 
-      dash.url = '/container_dashboard/data' + dash.providerId  + '/?live=true&tenant=' + dash.tenant;
+      var _tenant = dash.tenant.value || dash.DEFAULT_TENANT;
+      dash.url = '/container_dashboard/data' + dash.providerId  + '/?live=true&tenant=' + _tenant;
 
       httpUtils.getMetricTags();
     }
@@ -108,15 +120,10 @@
       initialization();
     };
 
-    dash.getTenants = httpUtils.getTenants;
-    dash.refreshList = httpUtils.refreshList;
-    dash.refreshGraph = httpUtils.refreshGraph;
-
-    // try to parse config variables from page url
-    // and set page config variables
-    metricsParseUrlFactory(dash, $window);
-    metricsConfigFactory(dash);
+    // one time initialization of page elemants
+    pageSetup();
 
     // initialize page elemants
     initialization();
-  }]);
+  }
+]);
diff --git a/app/assets/javascripts/controllers/live_metrics/util/metrics-config-factory.js b/app/assets/javascripts/controllers/live_metrics/util/metrics-config-factory.js
@@ -9,6 +9,9 @@ angular.module('miq.util').factory('metricsConfigFactory', function() {
       }
     };
 
+    dash.DEFAULT_TENANT = "_system";
+    dash.tenant = {value: null};
+
     dash.actionsConfig = {
       actionsInclude: true
     };

diff --git a/app/assets/javascripts/controllers/live_metrics/util/metrics-http-factory.js b/app/assets/javascripts/controllers/live_metrics/util/metrics-http-factory.js
@@ -71,13 +71,21 @@ angular.module('miq.util').factory('metricsHttpFactory', function() {
           miqService.handleFailure(error); });
     };
 
-    var getTenants = function(include) {
-      return $http.get(dash.url + "&query=get_tenants&limit=7&include=" + include).then(function(response) {
+    var getTenants = function() {
+      var url = '/container_dashboard/data' + dash.providerId  + '/?live=true&query=get_tenants';
+
+      return $http.get(url).then(function(response) {
         if (utils.checkResponse(response) === false) {
-          return [];
+          dash.tenantList = [];
+          dash.tenant = {value: null};
         }
 
-        return response.data.tenants;
+        dash.tenantList = response.data.tenants;
+        dash.tenantList.forEach(function callback(obj, i) {
+          if (obj.value === dash.DEFAULT_TENANT) {
+            dash.tenant = dash.tenantList[i];
+          }
+        });
       });
     }
 

diff --git a/app/assets/javascripts/controllers/live_metrics/util/metrics-parse-url-factroy.js b/app/assets/javascripts/controllers/live_metrics/util/metrics-parse-url-factroy.js
@@ -5,7 +5,7 @@ angular.module('miq.util').factory('metricsParseUrlFactory', function() {
     dash.providerId = '/' + (/^\/[^\/]+\/([r\d]+)$/.exec(pathname)[1]);
 
     // TODO: get this values from GET/POST values ?
-    dash.tenant = '_system';
+    dash.tenantList = [];
     dash.minBucketDurationInSecondes = 20 * 60;
     dash.max_metrics = 1000;
   };

diff --git a/app/assets/stylesheets/metrics.scss b/app/assets/stylesheets/metrics.scss
@@ -19,11 +19,28 @@
     }
   }
 
+  .timeline-stepper {
+    margin-left: 5px;
+  }
+
+  .ad-hoc-tenant, .filters-selector, .tenants-selector {
+    .btn {
+      margin-left: 0px;
+    }
+
+    .dropdown-menu.open {
+      margin-top: -11px;
+    }
+  }
+
   .list-view-container, .line-chart, .blank-slate-pf {
     margin-bottom: 0;
     min-height: calc(100vh - 362px);
-    margin-left: 20px;
-    margin-right: 20px;
+
+    .list-group-item {
+      padding-top: 0px;
+      padding-bottom: 0px;
+    }
   }
 
   .list-view-container {

diff --git a/app/services/hawkular_proxy_service.rb b/app/services/hawkular_proxy_service.rb
@@ -1,6 +1,15 @@
 class HawkularProxyService
   include UiServiceMixin
 
+  TENANT_LABEL_MAX_LEN = 25
+  TENANT_LABEL_SPECIAL_CASES = {
+    "_system"         => "System",
+    "_ops"            => "Operations",
+    "default"         => "Default",
+    "admin"           => "Admin",
+    "openshift-infra" => "OpenShift Infra"
+  }.freeze
+
   def initialize(provider_id, controller)
     @provider_id = provider_id
     @controller = controller
@@ -92,16 +101,20 @@ def tenants(limit)
     tenants = @cli.hawkular_client.http_get('/tenants')
 
     if @params['include'].blank?
-      tenants.map! { |x| x["id"] }
+      tenants.map! { |x| {:label => labelize(x["id"]), :value => x["id"]} }
     else
-      tenants.map! { |x| x["id"] if x["id"].include?(@params['include']) }
+      tenants.map! { |x| {:label => labelize(x["id"]), :value => x["id"]} if x["id"].include?(@params['include']) }
     end
 
     tenants.compact[0..limit]
   end
 
   private
 
+  def labelize(id)
+    TENANT_LABEL_SPECIAL_CASES.fetch(id, id.truncate(TENANT_LABEL_MAX_LEN))
+  end
+
   def _metric_definitions(tags, type)
     if type.blank?
       @cli.hawkular_client.counters.query(tags).compact +

diff --git a/app/views/ems_container/ad_hoc/_list_view_form.html.haml b/app/views/ems_container/ad_hoc/_list_view_form.html.haml
@@ -5,17 +5,15 @@
                             "ng-click"    => "dash.refreshTenant()"}
       = _("Set Tenant")
 
-    %input.form-control{"id"                  => "ad-hoc-tenant",
-                        "type"                => "text",
-                        "ng-model"            => "dash.tenant",
-                        "placeholder"         => _("Choose Tenants"),
-                        "typeahead"           => "tenenat for tenenat in dash.getTenants($viewValue)",
-                        "typeahead-loading"   => "dash.loadingTenants",
-                        "ng-change"           => "dash.tenantChanged = true",
-                        "typeahead-on-select" => "dash.refreshTenant()",
-                        "typeahead-wait-ms"   => 500}
+    %select.selectpicker.tenants-selector{"pf-select"        => "",
+                                          "id"               => "tenant-slector",
+                                          "ng-options"       => "o.label for o in dash.tenantList",
+                                          "ng-model"         => "dash.tenant",
+                                          "ng-change"        => "dash.tenantChanged = true",
+                                          "data-live-search" => "true",
+                                          "data-actions-box" => "true"}
 
-.ad-hoc-toolbar{"pf-toolbar" => "", "config" => "dash.toolbarConfig"}
+.ad-hoc-toolbar.filters-selector{"pf-toolbar" => "", "config" => "dash.toolbarConfig"}
   %actions
     %button.btn.btn-default{"type"        => "button",
                             "ng-click"    => "dash.doAddFilter()",

diff --git a/...ascripts/controllers/container_live_dashboard/container_live_dashboard_controller_spec.js b/...ascripts/controllers/container_live_dashboard/container_live_dashboard_controller_spec.js
@@ -1,6 +1,7 @@
 describe('adHocMetricsController', function() {
   var $scope, $controller, $httpBackend, pfViewUtils;
   var mock_data = getJSONFixture('container_live_dashboard_response.json');
+  var mock_tenants_data = getJSONFixture('container_live_dashboard_tenant_response.json');
   var mock_metrics_data = getJSONFixture('container_live_dashboard_metrics_response.json');
   var mock_data1_data = getJSONFixture('container_live_dashboard_data1_response.json');
   var mock_data2_data = getJSONFixture('container_live_dashboard_data2_response.json');
@@ -16,6 +17,7 @@ describe('adHocMetricsController', function() {
 
   beforeEach(inject(function(_$httpBackend_, $rootScope, _$controller_) {
     $httpBackend = _$httpBackend_;
+    $httpBackend.when('GET','/container_dashboard/data/42/?live=true&query=get_tenants').respond(mock_tenants_data);
     $httpBackend.when('GET','/container_dashboard/data/42/?live=true&tenant=_system&query=metric_tags&limit=250').respond(mock_data);
     $httpBackend.when('GET','/container_dashboard/data/42/?live=true&tenant=_system&limit=1000&query=metric_definitions&tags={}').respond(mock_metrics_data);
     $httpBackend.when('GET','/container_dashboard/data/42/?live=true&type=gauge&tenant=_system&query=get_data&metric_id=hello1&limit=5&order=DESC').respond(mock_data1_data);

diff --git a/spec/javascripts/fixtures/json/container_live_dashboard_tenant_response.json b/spec/javascripts/fixtures/json/container_live_dashboard_tenant_response.json
@@ -0,0 +1,8 @@
+{
+  "tenants":
+    [
+      {"label": "System", "value": "_system"},
+      {"label": "Operations", "value": "_ops"},
+      {"label": "Default", "value": "default"}
+    ]
+}