AMBARI-8393. Alerts UI: Summary Page. Create Alert groups dropdown (onechiporenko)

ambari-web/app/controllers/global/update_controller.js

@@ -128,10 +128,10 @@ App.UpdateController = Em.Controller.extend({
       App.updater.run(this, 'updateComponentsState', 'isWorking', App.componentsUpdateInterval);
       App.updater.run(this, 'graphsUpdate', 'isWorking');
       App.updater.run(this, 'updateComponentConfig', 'isWorking');
-      App.updater.run(this, 'updateAlertDefinitions', 'isWorking', App.alertDefinitionsUpdateInterval);
       if (App.get('supports.alerts')) {
-        App.updater.run(this, 'updateAlertDefinitionSummary', 'isWorking', App.alertDefinitionsUpdateInterval);
         App.updater.run(this, 'updateAlertGroups', 'isWorking', App.alertGroupsUpdateInterval);
+        App.updater.run(this, 'updateAlertDefinitions', 'isWorking', App.alertDefinitionsUpdateInterval);
+        App.updater.run(this, 'updateAlertDefinitionSummary', 'isWorking', App.alertDefinitionsUpdateInterval);
       }
     }
   }.observes('isWorking'),

ambari-web/app/styles/alerts.less

@@ -37,6 +37,12 @@
   color: @health-status-yellow;
 }
 
+.groups-filter {
+  .ui-icon-circle-close {
+    display: none;
+  }
+}
+
 .alerts-table {
 
   margin-top: 10px;

ambari-web/app/templates/main/alerts.hbs

@@ -16,6 +16,10 @@
 * limitations under the License.
 }}
 
+<div class="pull-left advanced-header-table groups-filter">
+  {{view view.alertGroupFilterView}}
+</div>
+
 <div class="pull-right">
   {{view App.MainAlertDefinitionActionsView controllerBinding="App.router.mainAlertDefinitionActionsController"}}
 </div>
@@ -30,7 +34,7 @@
         {{view view.parentView.statusSort}}
         {{view view.parentView.serviceSort}}
         {{view view.parentView.lastTriggeredSort}}
-      <th><span class="icon-off"></span></th>
+        <th><span class="icon-off"></span></th>
       {{/view}}
     <tr class="filter-row">
       <th class="first">{{view view.nameFilterView}}</th>

ambari-web/app/views/common/filter_view.js

@@ -549,7 +549,7 @@ module.exports = {
             }
             return true;
           });
-        }
+        };
         break;
       case 'multiple':
         return function (origin, compareValue) {
@@ -612,6 +612,11 @@ module.exports = {
           return !!origin[compareValue] && origin[compareValue] > 0;
         };
         break;
+      case 'alert_group':
+        return function (origin, compareValue) {
+          return origin.mapProperty('id').contains(compareValue);
+        };
+        break;
       case 'string':
       default:
         return function (origin, compareValue) {

ambari-web/app/views/main/alert_definitions_view.js

@@ -36,7 +36,7 @@ App.MainAlertDefinitionsView = App.TableView.extend({
     return this.get('content.length');
   }.property('content.length'),
 
-  colPropAssoc: ['', 'label', 'summary', 'service.serviceName', 'lastTriggered'],
+  colPropAssoc: ['', 'label', 'summary', 'service.serviceName', 'lastTriggered', 'groups'],
 
   sortView: sort.wrapperView,
 
@@ -202,6 +202,55 @@ App.MainAlertDefinitionsView = App.TableView.extend({
     }
   }),
 
+  alertGroupFilterView: filters.createSelectView({
+
+    column: 5,
+
+    fieldType: 'filter-input-width',
+
+    content: [],
+
+    didInsertElement: function() {
+      this._super();
+      this.updateContent();
+    },
+
+    /**
+     * Update list of <code>App.AlertGroup</code> used in the filter
+     * @method updateContent
+     */
+    updateContent: function() {
+      var content = this.get('content');
+      var newContent = [
+        {
+          value: '',
+          label: Em.I18n.t('common.all') + ' (' + this.get('parentView.controller.content.length') + ')'
+        }
+      ].concat(App.AlertGroup.find().map(function (group) {
+        return {
+          value: group.get('id'),
+          label: group.get('displayNameDefinitions')
+        };
+      }));
+      newContent.forEach(function(contentItem) {
+        var c = content.findProperty('value', contentItem.value);
+        if (!c) {
+          content.pushObject(contentItem);
+        }
+      });
+      content.mapProperty('value').forEach(function(v) {
+        if (!newContent.someProperty('value', v)) {
+          content = content.without(content.findProperty('value', v));
+        }
+      });
+      this.propertyDidChange('content');
+    }.observes('App.router.clusterController.isLoaded', 'controller.mapperTimestamp'),
+
+    onChangeValue: function () {
+      this.get('parentView').updateFilter(this.get('column'), this.get('value'), 'alert_group');
+    }
+  }),
+
   /**
    * Filtered number of all content number information displayed on the page footer bar
    * @returns {String}

ambari-web/test/views/common/filter_view_test.js

@@ -508,4 +508,32 @@ describe('filters.getFilterByType', function () {
 
   });
 
+  describe('alert_group', function () {
+
+    var filter = filters.getFilterByType('alert_group');
+
+    Em.A([
+        {
+          origin: [{id: 1}, {id: 2}, {id: 3}],
+          compareValue: 1,
+          e: true
+        },
+        {
+          origin: [],
+          compareValue: 1,
+          e: false
+        },
+        {
+          origin: [{id: 2}, {id: 3}],
+          compareValue: 1,
+          e: false
+        }
+      ]).forEach(function(test, i) {
+        it('test #' + (i + 1), function() {
+          expect(filter(test.origin, test.compareValue)).to.equal(test.e);
+        });
+      });
+
+  });
+
 });