AMBARI-8376. Alerts UI: Alert instances not showing up in Alert Definition details page

ambari-web/app/controllers/main/alerts/alert_instances_controller.js

@@ -53,7 +53,7 @@ App.MainAlertInstancesController = Em.Controller.extend({
           sender: this,
           data: {
             clusterName: App.router.get('clusterName'),
-            definitionName: this.get('sourceName')
+            definitionId: this.get('sourceName')
           },
           success: 'getAlertInstancesSuccessCallback',
           error: 'getAlertInstancesErrorCallback'

ambari-web/app/controllers/main/alerts/definition_details_controller.js

@@ -20,6 +20,11 @@ App.MainAlertDefinitionDetailsController = Em.Controller.extend({
 
   name: 'mainAlertDefinitionDetailsController',
 
+  alerts: function () {
+    return App.AlertInstance.find().toArray()
+      .filterProperty('definitionId', this.get('content.id'));
+  }.property('App.router.mainAlertInstancesController.isLoaded'),
+
   // stores object with editing form data (label, description, thresholds)
   editing: Em.Object.create({
     label: Em.Object.create({

ambari-web/app/mappers/alert_instances_mapper.js

@@ -22,7 +22,8 @@ App.alertInstanceMapper = App.QuickDataMapper.create({
   config : {
     id: 'Alert.id',
     label: 'Alert.label',
-    alert_definition_name: 'Alert.name',
+    definition_name: 'Alert.definition_name',
+    definition_id: 'Alert.definition_id',
     service_id: 'Alert.service_name',
     component_name: 'Alert.component_name',
     host_id: 'Alert.host_name',

ambari-web/app/models/alert_instance.js

@@ -22,7 +22,8 @@ var dateUtils = require('utils/date');
 App.AlertInstance = DS.Model.extend({
   id: DS.attr('number'),
   label: DS.attr('string'),
-  alertDefinitionName: DS.attr('string'),
+  definitionName: DS.attr('string'),
+  definitionId: DS.attr('number'),
   service: DS.belongsTo('App.Service'),
   componentName: DS.attr('string'),
   host: DS.belongsTo('App.Host'),

ambari-web/app/routes/main.js

@@ -271,12 +271,10 @@ module.exports = Em.Route.extend({
       alerts: Em.Route.extend({
         route: '/alerts',
         connectOutlets: function (router, context) {
-          router.get('mainHostDetailsController').connectOutlet('mainHostAlerts');
-        },
-        enter: function(router) {
           var hostName = router.get('mainHostDetailsController.content.hostName');
           router.get('mainAlertInstancesController').loadAlertInstancesByHost(hostName);
           router.set('mainAlertInstancesController.isUpdating', true);
+          router.get('mainHostDetailsController').connectOutlet('mainHostAlerts');
         },
         exit: function(router) {
           router.set('mainAlertInstancesController.isUpdating', false);
@@ -335,7 +333,12 @@ module.exports = Em.Route.extend({
     alertDetails: Em.Route.extend({
       route: '/:alert_id',
       connectOutlets: function (router, alert) {
+        router.get('mainAlertInstancesController').loadAlertInstancesByAlertDefinition(alert.get('id'));
+        router.set('mainAlertInstancesController.isUpdating', true);
         router.get('mainController').connectOutlet('mainAlertDefinitionDetails', alert);
+      },
+      exit: function(router) {
+        router.set('mainAlertInstancesController.isUpdating', false);
       }
     })
   }),

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

@@ -122,6 +122,9 @@
     </span>
     <hr>
     <div>
+
+      {{#if App.router.mainAlertInstancesController.isLoaded}}
+
       <table class="table table-bordered table-striped alerts-table" id="alert-instances-table">
         <thead>
         <tr>
@@ -137,7 +140,7 @@
           {{#each instance in view.pageContent}}
             <tr>
               <td class="first">{{instance.state}}</td>
-              <td><a {{action goToHostDetails instance.hostName target="view"}}>{{instance.hostName}}</a></td>
+              <td><a {{action goToHostDetails instance.hostName target="view"}}>{{instance.host.hostName}}</a></td>
               <td>{{instance.lastTriggered}}</td>
               <td>10</td>
               <td class="last">Admins</td>
@@ -152,6 +155,11 @@
         {{/if}}
         </tbody>
       </table>
+
+      {{else}}
+        <div class="spinner"></div>
+      {{/if}}
+
     </div>
   </div>
 </div>

ambari-web/app/templates/main/host/host_alerts.hbs

@@ -44,9 +44,7 @@
     {{#if view.pageContent}}
       {{#each alertInstance in view.pageContent}}
         <tr>
-          <td class="first">
-            <a href="#">{{alertInstance.label}}</a>
-          </td>
+          <td class="first">{{alertInstance.label}}</td>
           <td>{{{alertInstance.status}}}</td>
           <td>{{alertInstance.service.serviceName}}</td>
           <td>{{alertInstance.lastTriggered}}</td>

ambari-web/app/utils/ajax/ajax.js

@@ -365,7 +365,7 @@ var urls = {
     'mock': '/data/alerts/alert_instances.json'
   },
   'alerts.instances.by_definition': {
-    'real': '/clusters/{clusterName}/alerts?fields=*&Alert/name={definitionName}',
+    'real': '/clusters/{clusterName}/alerts?fields=*&Alert/definition_id={definitionId}',
     'mock': '/data/alerts/alert_instances.json'
   },
   'alerts.instances.by_host': {

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

@@ -21,6 +21,11 @@ var filters = require('views/common/filter_view');
 
 App.TableView = Em.View.extend(App.UserPref, {
 
+  init: function() {
+    this.set('filterConditions', []);
+    this._super();
+  },
+
   /**
    * Defines to show pagination or show all records
    * @type {Boolean}

ambari-web/app/views/main/alerts/definition_details_view.js

@@ -27,7 +27,6 @@ App.MainAlertDefinitionDetailsView = App.TableView.extend({
   },
 
   content: function () {
-    // todo: replace with this.get('controller.content.alerts') when this relationship will be provided
-    return App.AlertInstance.find().toArray();
-  }.property()
+    return this.get('controller.alerts');
+  }.property('controller.alerts.@each')
 });

ambari-web/test/controllers/main/alerts/alert_instances_controller_test.js

@@ -40,15 +40,15 @@ describe('App.MainAlertDefinitionActionsController', function () {
 
       it('should load by Host name', function () {
 
-        controller.loadAlertInstancesByHost();
+        controller.loadAlertInstancesByHost('host');
         console.log(App.ajax.send.args[0]);
         expect(App.ajax.send.args[0][0].name).to.equal('alerts.instances.by_host');
 
       });
 
-      it('should load by AlertDefinition name', function () {
+      it('should load by AlertDefinition id', function () {
 
-        controller.loadAlertInstancesByAlertDefinition();
+        controller.loadAlertInstancesByAlertDefinition('1');
         console.log(App.ajax.send.args[0]);
         expect(App.ajax.send.args[0][0].name).to.equal('alerts.instances.by_definition');
 

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

@@ -36,6 +36,15 @@ describe('App.TableView', function () {
     App.db.cleanUp();
   });
 
+  describe('#init', function() {
+
+    it('should set filterConditions on instance', function() {
+      var tableView = App.TableView.create();
+      expect(tableView.get('filterConditions') === App.TableView.prototype.filterConditions).to.be.false;
+    });
+
+  });
+
   describe('#updatePaging', function() {
 
     beforeEach(function() {