Label Filter for Kubernetes Deployment History Tab

cdcabrera · cdcabrera · commit 4cfded4ba65a · 2017-07-19T23:19:51.000-04:00
Implementation of label filter for Kubernetes deployment
history tab
diff --git a/app/scripts/controllers/deployment.js b/app/scripts/controllers/deployment.js
@@ -16,16 +16,21 @@ angular.module('openshiftConsole')
                         EnvironmentService,
                         HPAService,
                         ImageStreamResolver,
+                        LabelFilter,
+                        Logger,
                         ModalsService,
                         Navigate,
                         OwnerReferencesService,
-                        Logger,
                         ProjectsService,
                         StorageService) {
     var imageStreamImageRefByDockerReference = {}; // lets us determine if a particular container's docker image reference belongs to an imageStream
 
     $scope.projectName = $routeParams.project;
     $scope.name = $routeParams.deployment;
+    $scope.replicaSetsForDeployment = {};
+    $scope.unfilteredReplicaSetsForDeployment  = {};
+    $scope.labelSuggestions = {};
+    $scope.emptyMessage = "Loading...";
     $scope.forms = {};
     $scope.alerts = {};
     $scope.imagesByDockerReference = {};
@@ -185,10 +190,18 @@ angular.module('openshiftConsole')
               group: 'extensions',
               resource: 'replicasets'
             }, context, function(replicaSetData) {
+              $scope.emptyMessage = "No deployments to show";
+
               var replicaSets = replicaSetData.by('metadata.name');
               replicaSets = OwnerReferencesService.filterForController(replicaSets, deployment);
               $scope.inProgressDeployment = _.chain(replicaSets).filter('status.replicas').size() > 1;
-              $scope.replicaSetsForDeployment = DeploymentsService.sortByRevision(replicaSets);
+
+              $scope.unfilteredReplicaSetsForDeployment = DeploymentsService.sortByRevision(replicaSets);
+              $scope.replicaSetsForDeployment = LabelFilter.getLabelSelector().select($scope.unfilteredReplicaSetsForDeployment);
+
+              updateFilterWarning();
+              LabelFilter.addLabelSuggestionsFromResources($scope.unfilteredReplicaSetsForDeployment, $scope.labelSuggestions);
+              LabelFilter.setLabelSuggestions($scope.labelSuggestions);
             }));
           },
           // failure
@@ -260,6 +273,25 @@ angular.module('openshiftConsole')
           Logger.log("builds (subscribe)", $scope.builds);
         }));
 
+        function updateFilterWarning() {
+          if (!LabelFilter.getLabelSelector().isEmpty() && _.isEmpty($scope.replicaSetsForDeployment) && !_.isEmpty($scope.unfilteredReplicaSetsForDeployment)) {
+            $scope.alerts["filter-hiding-all"] = {
+              type: "warning",
+              details: "The active filters are hiding all rollout history."
+            };
+          }
+          else {
+            delete $scope.alerts["filter-hiding-all"];
+          }
+        }
+
+        LabelFilter.onActiveFiltersChanged(function(labelSelector) {
+          $scope.$evalAsync(function() {
+            $scope.replicaSetsForDeployment = labelSelector.select($scope.unfilteredReplicaSetsForDeployment);
+            updateFilterWarning();
+          });
+        });
+
         $scope.scale = function(replicas) {
           var showScalingError = function(result) {
             $scope.alerts = $scope.alerts || {};
diff --git a/app/views/browse/deployment.html b/app/views/browse/deployment.html
@@ -92,40 +92,48 @@ <h1 class="contains-actions">
               <uib-tabset>
                 <uib-tab active="selectedTab.history">
                   <uib-tab-heading>History</uib-tab-heading>
-                  <div ng-if="replicaSetsForDeployment | hashSize">
-                    <table class="table table-bordered table-hover table-mobile table-layout-fixed">
-                      <colgroup>
-                        <col class="col-sm-2">
-                        <col class="col-sm-4">
-                        <col class="col-sm-3">
-                        <col class="col-sm-3">
-                      </colgroup>
-                      <thead>
-                        <tr>
-                          <th>Version</th>
-                          <th>Name</th>
-                          <th>Replicas</th>
-                          <th>Created</th>
-                        </tr>
-                      </thead>
-                      <tbody>
-                        <tr ng-repeat="replicaSet in replicaSetsForDeployment">
-                          <td data-title="Version">
-                            #{{replicaSet | annotation : 'deployment.kubernetes.io/revision'}}
-                          </td>
-                          <td data-title="Name">
-                            <a ng-href="{{replicaSet | navigateResourceURL}}">{{replicaSet.metadata.name}}</a>
-                          </td>
-                          <td data-title="Replicas">
-                            <span ng-if="replicaSet.status.replicas !== replicaSet.spec.replicas">{{replicaSet.status.replicas}}/</span>{{replicaSet.spec.replicas}} replica<span ng-if="replicaSet.spec.replicas != 1">s</span>
-                          </td>
-                          <td data-title="Created">
-                            <span am-time-ago="replicaSet.metadata.creationTimestamp"></span>
-                          </td>
-                        </tr>
-                      </tbody>
-                    </table>
+                  <div class="table-filter-extension">
+                    <div class="data-toolbar">
+                      <div class="data-toolbar-filter">
+                        <project-filter></project-filter>
+                      </div>
+                    </div>
                   </div>
+                  <table class="table table-bordered table-hover table-mobile table-layout-fixed">
+                    <colgroup>
+                      <col class="col-sm-2">
+                      <col class="col-sm-4">
+                      <col class="col-sm-3">
+                      <col class="col-sm-3">
+                    </colgroup>
+                    <thead>
+                      <tr>
+                        <th>Version</th>
+                        <th>Name</th>
+                        <th>Replicas</th>
+                        <th>Created</th>
+                      </tr>
+                    </thead>
+                    <tbody ng-if="(replicaSetsForDeployment | size) == 0">
+                      <tr><td colspan="4"><em>{{emptyMessage}}</em></td></tr>
+                    </tbody>
+                    <tbody ng-if="(replicaSetsForDeployment | size) > 0">
+                      <tr ng-repeat="replicaSet in replicaSetsForDeployment">
+                        <td data-title="Version">
+                          #{{replicaSet | annotation : 'deployment.kubernetes.io/revision'}}
+                        </td>
+                        <td data-title="Name">
+                          <a ng-href="{{replicaSet | navigateResourceURL}}">{{replicaSet.metadata.name}}</a>
+                        </td>
+                        <td data-title="Replicas">
+                          <span ng-if="replicaSet.status.replicas !== replicaSet.spec.replicas">{{replicaSet.status.replicas}}/</span>{{replicaSet.spec.replicas}} replica<span ng-if="replicaSet.spec.replicas != 1">s</span>
+                        </td>
+                        <td data-title="Created">
+                          <span am-time-ago="replicaSet.metadata.creationTimestamp"></span>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
                 </uib-tab>
                 <uib-tab active="selectedTab.configuration">
                   <uib-tab-heading>Configuration</uib-tab-heading>
diff --git a/dist/scripts/scripts.js b/dist/scripts/scripts.js
@@ -5362,19 +5362,19 @@ a.deploymentConfigs = b.select(a.unfilteredDeploymentConfigs), a.replicationCont
 d.unwatchAll(n);
 });
 }));
-} ]), angular.module("openshiftConsole").controller("DeploymentController", [ "$scope", "$filter", "$routeParams", "DataService", "DeploymentsService", "EnvironmentService", "HPAService", "ImageStreamResolver", "ModalsService", "Navigate", "OwnerReferencesService", "Logger", "ProjectsService", "StorageService", function(a, b, c, d, e, f, g, h, i, j, k, l, m, n) {
-var o = {};
-a.projectName = c.project, a.name = c.deployment, a.forms = {}, a.alerts = {}, a.imagesByDockerReference = {}, a.breadcrumbs = [ {
+} ]), angular.module("openshiftConsole").controller("DeploymentController", [ "$scope", "$filter", "$routeParams", "DataService", "DeploymentsService", "EnvironmentService", "HPAService", "ImageStreamResolver", "LabelFilter", "Logger", "ModalsService", "Navigate", "OwnerReferencesService", "ProjectsService", "StorageService", function(a, b, c, d, e, f, g, h, i, j, k, l, m, n, o) {
+var p = {};
+a.projectName = c.project, a.name = c.deployment, a.replicaSetsForDeployment = {}, a.unfilteredReplicaSetsForDeployment = {}, a.labelSuggestions = {}, a.emptyMessage = "Loading...", a.forms = {}, a.alerts = {}, a.imagesByDockerReference = {}, a.breadcrumbs = [ {
 title:"Deployments",
 link:"project/" + c.project + "/browse/deployments"
 }, {
 title:c.deployment
-} ], a.healthCheckURL = j.healthCheckURL(c.project, "Deployment", c.deployment, "extensions");
-var p = !1, q = function(b, c) {
-if (!p) {
+} ], a.healthCheckURL = l.healthCheckURL(c.project, "Deployment", c.deployment, "extensions");
+var q = !1, r = function(b, c) {
+if (!q) {
 if (!a.forms.deploymentEnvVars || a.forms.deploymentEnvVars.$pristine) return void (a.updatedDeployment = f.copyAndNormalize(b));
 if (f.isEnvironmentEqual(b, c)) return void (a.updatedDeployment = f.mergeEdits(a.updatedDeployment, b));
-p = !0, a.alerts["env-conflict"] = {
+q = !0, a.alerts["env-conflict"] = {
 type:"warning",
 message:"The environment variables for the deployment have been updated in the background. Saving your changes may create a conflict or cause loss of data.",
 links:[ {
@@ -5385,31 +5385,37 @@ return a.clearEnvVarUpdates(), !0;
 } ]
 };
 }
-}, r = b("orderByDisplayName"), s = b("getErrorDetails"), t = function(b, c) {
+}, s = b("orderByDisplayName"), t = b("getErrorDetails"), u = function(b, c) {
 a.alerts["from-value-objects"] = {
 type:"error",
 message:b,
 details:c
 };
-}, u = [];
-m.get(c.project).then(_.spread(function(j, m) {
-a.project = j, a.projectContext = m;
-var v, w = {}, x = function() {
-g.getHPAWarnings(a.deployment, a.autoscalers, w, j).then(function(b) {
+}, v = [];
+n.get(c.project).then(_.spread(function(l, n) {
+function w() {
+i.getLabelSelector().isEmpty() || !_.isEmpty(a.replicaSetsForDeployment) || _.isEmpty(a.unfilteredReplicaSetsForDeployment) ? delete a.alerts["filter-hiding-all"] :a.alerts["filter-hiding-all"] = {
+type:"warning",
+details:"The active filters are hiding all rollout history."
+};
+}
+a.project = l, a.projectContext = n;
+var x, y = {}, z = function() {
+g.getHPAWarnings(a.deployment, a.autoscalers, y, l).then(function(b) {
 a.hpaWarnings = b;
 });
 };
 d.get({
 group:"extensions",
 resource:"deployments"
-}, c.deployment, m, {
+}, c.deployment, n, {
 errorNotification:!1
 }).then(function(g) {
-a.loaded = !0, a.deployment = g, x(), a.saveEnvVars = function() {
-f.compact(a.updatedDeployment), v = d.update({
+a.loaded = !0, a.deployment = g, z(), a.saveEnvVars = function() {
+f.compact(a.updatedDeployment), x = d.update({
 group:"extensions",
 resource:"deployments"
-}, c.deployment, a.updatedDeployment, m), v.then(function() {
+}, c.deployment, a.updatedDeployment, n), x.then(function() {
 a.alerts.saveEnvSuccess = {
 type:"success",
 message:c.deployment + " was updated."
@@ -5421,63 +5427,68 @@ message:c.deployment + " was not updated.",
 details:b("getErrorDetails")(d)
 };
 })["finally"](function() {
-v = null;
+x = null;
 });
 }, a.clearEnvVarUpdates = function() {
-a.updatedDeployment = f.copyAndNormalize(a.deployment), a.forms.deploymentEnvVars.$setPristine(), p = !1;
-}, u.push(d.watchObject({
+a.updatedDeployment = f.copyAndNormalize(a.deployment), a.forms.deploymentEnvVars.$setPristine(), q = !1;
+}, v.push(d.watchObject({
 group:"extensions",
 resource:"deployments"
-}, c.deployment, m, function(b, c) {
+}, c.deployment, n, function(b, c) {
 "DELETED" === c && (a.alerts.deleted = {
 type:"warning",
 message:"This deployment has been deleted."
 });
 var d = a.deployment;
-a.deployment = b, a.updatingPausedState = !1, x(), q(b, d), v ? v["finally"](function() {
-q(b, d);
-}) :q(b, d), h.fetchReferencedImageStreamImages([ b.spec.template ], a.imagesByDockerReference, o, m);
-})), u.push(d.watch({
+a.deployment = b, a.updatingPausedState = !1, z(), r(b, d), x ? x["finally"](function() {
+r(b, d);
+}) :r(b, d), h.fetchReferencedImageStreamImages([ b.spec.template ], a.imagesByDockerReference, p, n);
+})), v.push(d.watch({
 group:"extensions",
 resource:"replicasets"
-}, m, function(b) {
+}, n, function(b) {
+a.emptyMessage = "No deployments to show";
 var c = b.by("metadata.name");
-c = k.filterForController(c, g), a.inProgressDeployment = _.chain(c).filter("status.replicas").size() > 1, a.replicaSetsForDeployment = e.sortByRevision(c);
+c = m.filterForController(c, g), a.inProgressDeployment = _.chain(c).filter("status.replicas").size() > 1, a.unfilteredReplicaSetsForDeployment = e.sortByRevision(c), a.replicaSetsForDeployment = i.getLabelSelector().select(a.unfilteredReplicaSetsForDeployment), w(), i.addLabelSuggestionsFromResources(a.unfilteredReplicaSetsForDeployment, a.labelSuggestions), i.setLabelSuggestions(a.labelSuggestions);
 }));
 }, function(c) {
 a.loaded = !0, a.alerts.load = {
 type:"error",
 message:404 === c.status ? "This deployment can not be found, it may have been deleted." :"The deployment details could not be loaded.",
 details:b("getErrorDetails")(c)
 };
-}), d.list("limitranges", m).then(function(a) {
-w = a.by("metadata.name"), x();
+}), d.list("limitranges", n).then(function(a) {
+y = a.by("metadata.name"), z();
 });
-var y = [], z = [];
-a.valueFromObjects = [], d.list("configmaps", m, null, {
+var A = [], B = [];
+a.valueFromObjects = [], d.list("configmaps", n, null, {
 errorNotification:!1
 }).then(function(b) {
-y = r(b.by("metadata.name")), a.valueFromObjects = y.concat(z);
+A = s(b.by("metadata.name")), a.valueFromObjects = A.concat(B);
 }, function(a) {
-403 !== a.code && t("Could not load config maps", s(a));
-}), d.list("secrets", m, null, {
+403 !== a.code && u("Could not load config maps", t(a));
+}), d.list("secrets", n, null, {
 errorNotification:!1
 }).then(function(b) {
-z = r(b.by("metadata.name")), a.valueFromObjects = z.concat(y);
+B = s(b.by("metadata.name")), a.valueFromObjects = B.concat(A);
 }, function(a) {
-403 !== a.code && t("Could not load secrets", s(a));
-}), u.push(d.watch("imagestreams", m, function(b) {
+403 !== a.code && u("Could not load secrets", t(a));
+}), v.push(d.watch("imagestreams", n, function(b) {
 var c = b.by("metadata.name");
-h.buildDockerRefMapForImageStreams(c, o), a.deployment && h.fetchReferencedImageStreamImages([ a.deployment.spec.template ], a.imagesByDockerReference, o, m), l.log("imagestreams (subscribe)", a.imageStreams);
-})), u.push(d.watch({
+h.buildDockerRefMapForImageStreams(c, p), a.deployment && h.fetchReferencedImageStreamImages([ a.deployment.spec.template ], a.imagesByDockerReference, p, n), j.log("imagestreams (subscribe)", a.imageStreams);
+})), v.push(d.watch({
 group:"autoscaling",
 resource:"horizontalpodautoscalers",
 version:"v1"
-}, m, function(b) {
-a.autoscalers = g.filterHPA(b.by("metadata.name"), "Deployment", c.deployment), x();
-})), u.push(d.watch("builds", m, function(b) {
-a.builds = b.by("metadata.name"), l.log("builds (subscribe)", a.builds);
-})), a.scale = function(c) {
+}, n, function(b) {
+a.autoscalers = g.filterHPA(b.by("metadata.name"), "Deployment", c.deployment), z();
+})), v.push(d.watch("builds", n, function(b) {
+a.builds = b.by("metadata.name"), j.log("builds (subscribe)", a.builds);
+})), i.onActiveFiltersChanged(function(b) {
+a.$evalAsync(function() {
+a.replicaSetsForDeployment = b.select(a.unfilteredReplicaSetsForDeployment), w();
+});
+}), a.scale = function(c) {
 var d = function(c) {
 a.alerts = a.alerts || {}, a.alerts.scale = {
 type:"error",
@@ -5487,7 +5498,7 @@ details:b("getErrorDetails")(c)
 };
 e.scale(a.deployment, c).then(_.noop, d);
 }, a.setPaused = function(c) {
-a.updatingPausedState = !0, e.setPaused(a.deployment, c, m).then(_.noop, function(d) {
+a.updatingPausedState = !0, e.setPaused(a.deployment, c, n).then(_.noop, function(d) {
 a.updatingPausedState = !1, a.alerts = a.alerts || {}, a.alerts.scale = {
 type:"error",
 message:"An error occurred " + (c ? "pausing" :"resuming") + " the deployment.",
@@ -5497,18 +5508,18 @@ details:b("getErrorDetails")(d)
 }, a.removeVolume = function(b) {
 var c;
 c = _.get(a, "deployment.spec.paused") ? "This will remove the volume from the deployment." :"This will remove the volume from the deployment and start a new rollout.", b.persistentVolumeClaim ? c += " It will not delete the persistent volume claim." :b.secret ? c += " It will not delete the secret." :b.configMap && (c += " It will not delete the config map.");
-var d = i.confirm({
+var d = k.confirm({
 message:"Remove volume " + b.name + "?",
 details:c,
 okButtonText:"Remove",
 okButtonClass:"btn-danger",
 cancelButtonText:"Cancel"
 }), e = function() {
-n.removeVolume(a.deployment, b, m);
+o.removeVolume(a.deployment, b, n);
 };
 d.then(e);
 }, a.$on("$destroy", function() {
-d.unwatchAll(u);
+d.unwatchAll(v);
 });
 }));
 } ]), angular.module("openshiftConsole").controller("DeploymentConfigController", [ "$scope", "$filter", "$routeParams", "BreadcrumbsService", "DataService", "DeploymentsService", "EnvironmentService", "HPAService", "ImageStreamResolver", "ModalsService", "Navigate", "NotificationsService", "Logger", "ProjectsService", "StorageService", "LabelFilter", "labelNameFilter", function(a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q) {
diff --git a/dist/scripts/templates.js b/dist/scripts/templates.js
@@ -2719,7 +2719,13 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "<uib-tabset>\n" +
     "<uib-tab active=\"selectedTab.history\">\n" +
     "<uib-tab-heading>History</uib-tab-heading>\n" +
-    "<div ng-if=\"replicaSetsForDeployment | hashSize\">\n" +
+    "<div class=\"table-filter-extension\">\n" +
+    "<div class=\"data-toolbar\">\n" +
+    "<div class=\"data-toolbar-filter\">\n" +
+    "<project-filter></project-filter>\n" +
+    "</div>\n" +
+    "</div>\n" +
+    "</div>\n" +
     "<table class=\"table table-bordered table-hover table-mobile table-layout-fixed\">\n" +
     "<colgroup>\n" +
     "<col class=\"col-sm-2\">\n" +
@@ -2735,7 +2741,10 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "<th>Created</th>\n" +
     "</tr>\n" +
     "</thead>\n" +
-    "<tbody>\n" +
+    "<tbody ng-if=\"(replicaSetsForDeployment | size) == 0\">\n" +
+    "<tr><td colspan=\"4\"><em>{{emptyMessage}}</em></td></tr>\n" +
+    "</tbody>\n" +
+    "<tbody ng-if=\"(replicaSetsForDeployment | size) > 0\">\n" +
     "<tr ng-repeat=\"replicaSet in replicaSetsForDeployment\">\n" +
     "<td data-title=\"Version\">\n" +
     "#{{replicaSet | annotation : 'deployment.kubernetes.io/revision'}}\n" +
@@ -2752,7 +2761,6 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "</tr>\n" +
     "</tbody>\n" +
     "</table>\n" +
-    "</div>\n" +
     "</uib-tab>\n" +
     "<uib-tab active=\"selectedTab.configuration\">\n" +
     "<uib-tab-heading>Configuration</uib-tab-heading>\n" +
