Removed old failed hosts logic. Added logic to hide panels where more than two are present

awx/ui/client/legacy-styles/main-layout.less

@@ -93,6 +93,10 @@ body {
     margin-top: 20px;
 }
 
+.Panel-hidden {
+    display: none;
+}
+
 .btn{
     text-transform: uppercase;
 }

awx/ui/client/src/inventories/groups/groups.list.js

@@ -24,7 +24,6 @@ export default {
             iconOnly: true,
             awToolTip: "{{ group.hosts_status_tip }}",
             dataPlacement: "top",
-            ngClick: "showFailedHosts(group)",
             icon: "{{ 'fa icon-job-' + group.hosts_status_class }}",
             columnClass: 'status-column List-staticColumn--smallStatus'
         },

awx/ui/client/src/inventories/groups/list/groups-list.controller.js

@@ -183,15 +183,13 @@
         $scope.cancelUpdate = function (id) {
             GroupsCancelUpdate({ scope: $scope, id: id });
         };
+        
         $scope.viewUpdateStatus = function (id) {
             ViewUpdateStatus({
                 scope: $scope,
                 group_id: id
             });
         };
-        $scope.showFailedHosts = function() {
-            // TODO: implement
-        };
 
         $scope.copyMoveGroup = function(id){
             $state.go('inventories.edit.groups.copyMoveGroup', {group_id: id, groups: $stateParams.groups});

awx/ui/client/src/inventories/groups/nested-groups/nested-groups-list.controller.js

@@ -167,15 +167,14 @@
         $scope.cancelUpdate = function (id) {
             GroupsCancelUpdate({ scope: $scope, id: id });
         };
+        
         $scope.viewUpdateStatus = function (id) {
             ViewUpdateStatus({
                 scope: $scope,
                 group_id: id
             });
         };
-        $scope.showFailedHosts = function() {
+
-            // TODO: implement
-        };
         // $scope.$parent governed by InventoryManageController, for unified multiSelect options
         $scope.$on('multiSelectList.selectionChanged', (event, selection) => {
             $scope.$parent.groupsSelected = selection.length > 0 ? true : false;

awx/ui/client/src/inventories/groups/nested-groups/nested-groups.list.js

@@ -24,7 +24,6 @@ export default {
             iconOnly: true,
             awToolTip: "{{ nested_group.hosts_status_tip }}",
             dataPlacement: "top",
-            ngClick: "showFailedHosts(nested_group)",
             icon: "{{ 'fa icon-job-' + nested_group.hosts_status_class }}",
             columnClass: 'status-column List-staticColumn--smallStatus'
         },

awx/ui/client/src/inventories/inventories.partial.html

@@ -1,4 +1,5 @@
 <div class="tab-pane" id="inventories-panel">
+    <aw-limit-panels max-panels="2" panel-container="inventories-panel"></aw-limit-panels>
     <div ui-view="copyMove"></div>
     <div ui-view="adhocForm"></div>
     <div ui-view="hostForm"></div>

awx/ui/client/src/shared/limit-panels/limit-panels.directive.js

@@ -0,0 +1,30 @@
+export default ['$rootScope', function($rootScope) {
+    return {
+        restrict: 'E',
+        scope: {
+            maxPanels: '@',
+            panelContainer: '@'
+        },
+        link: function(scope) {
+
+            scope.maxPanels = parseInt(scope.maxPanels);
+
+            $rootScope.$on('$stateChangeSuccess', function() {
+                let panels = angular.element('#' + scope.panelContainer).find('.Panel');
+
+                if(panels.length > scope.maxPanels) {
+                    // hide the excess panels
+                    $(panels).each(function( index ) {
+                        if(index+1 > scope.maxPanels) {
+                            $(this).addClass('Panel-hidden');
+                        }
+                    });
+                }
+                else {
+                    // show all the panels
+                    $(panels).removeClass('Panel-hidden');
+                }
+            });
+        }
+    };
+}];

awx/ui/client/src/shared/limit-panels/main.js

@@ -0,0 +1,5 @@
+import directive from './limit-panels.directive';
+
+export default
+	angular.module('LimitPanelsModule', [])
+		.directive('awLimitPanels', directive);

awx/ui/client/src/shared/main.js

@@ -30,6 +30,7 @@ import PromptDialog from './prompt-dialog';
 import directives from './directives';
 import features from './features/main';
 import orgAdminLookup from './org-admin-lookup/main';
+import limitPanels from './limit-panels/main';
 import 'angular-duration-format';
 
 export default
@@ -57,6 +58,7 @@ angular.module('shared', [listGenerator.name,
         filters.name,
         features.name,
         orgAdminLookup.name,
+        limitPanels.name,
         require('angular-cookies'),
         'angular-duration-format'
     ])