AMBARI-9429 Versions: hosts got out of sync and could not install version (UI part). (ababiichuk)

ambari-web/app/messages.js

@@ -1996,6 +1996,9 @@ Em.I18n.translations = {
   'hosts.host.stackVersions.status.out_of_sync': 'Out of Sync',
   'hosts.host.stackVersions.status.upgrading': 'Upgrading',
   'hosts.host.stackVersions.status.upgrade_failed': 'Upgrade Failed',
+  'hosts.host.stackVersions.outOfSync.tooltip': 'This version is Out of Sync on this host. Out of Sync can occur ' +
+    'the components on a host change after installing a version not in use. ' +
+    'Click Install to have Ambari install the packages for this version to get this host in sync.',
   'hosts.host.stackVersions.install.confirmation': 'You are about to install version <b>{0}</b> on this host.',
 
   'hosts.host.metrics.dataUnavailable':'Data Unavailable',

ambari-web/app/models/host_stack_version.js

@@ -47,6 +47,12 @@ App.HostStackVersion = DS.Model.extend({
     return this.get('status') === 'INSTALLING';
   }.property('status'),
 
+  /**
+   * @type {boolean}
+   */
+  isOutOfSync: function () {
+    return this.get('status') === 'OUT_OF_SYNC';
+  }.property('status'),
   /**
    * @type {string}
    */

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

@@ -44,6 +44,9 @@
               <a href="#" {{action showInstallProgress this target="view"}}><i class="icon-cog in_progress"></i>&nbsp;{{this.displayStatus}}</a>
             {{else}}
               {{this.displayStatus}}
+              {{#if this.isOutOfSync}}
+                {{view view.outOfSyncInfo}}
+              {{/if}}
             {{/if}}
           {{/if}}
         </td>

ambari-web/app/views/main/host/stack_versions_view.js

@@ -165,6 +165,17 @@ App.MainHostStackVersionsView = App.TableView.extend({
     App.router.get('mainAdminStackAndUpgradeController').showProgressPopup(event.context);
   },
 
+  outOfSyncInfo: Em.View.extend({
+    tagName: 'i',
+    classNames: ['icon-question-sign'],
+    didInsertElement: function() {
+      App.tooltip($(this.get('element')), {
+        placement: "top",
+        title: Em.I18n.t('hosts.host.stackVersions.outOfSync.tooltip')
+      });
+    }
+  }),
+
   /**
    * @type {Array}
    */