[VBV-2139] [VBV-2176] Enhance navigation from Requests view

- Added navigation to Kubernetes/Deployments - Added navigation to PKS Clusters - In the old UI all requests that are not for docker components don't redirect on click and they don't have eye icon as well Change-Id: Ic297f304c514aadade1ff5da889fc5eb9b2cd48e Reviewed-on: https://bellevue-ci.eng.vmware.com:8080/42030 Closures-Verified: jenkins <[email protected]> Upgrade-Verified: jenkins <[email protected]> Bellevue-Verified: jenkins <[email protected]> PG-Verified: jenkins <[email protected]> Reviewed-by: Iveta Ilieva <[email protected]> CS-Verified: jenkins <[email protected]>
pnedunuri · Aug 17, 2018 · f33b1a2 · f33b1a2
1 parent 708697f
commit f33b1a2
Show file tree

Hide file tree

Showing 7 changed files with 70 additions and 24 deletions.
diff --git a/ui/app/src/js/components/requests/RequestsList.js b/ui/app/src/js/components/requests/RequestsList.js
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 VMware, Inc. All Rights Reserved.
+ * Copyright (c) 2016-2018 VMware, Inc. All Rights Reserved.
  *
  * This product is licensed to you under the Apache License, Version 2.0 (the "License").
  * You may not use this product except in compliance with the License.
@@ -129,10 +129,24 @@ var RequestsListVueComponent = Vue.extend({
             return utils.actionAllowed(window.routesRestrictions.DEPLOYMENTS);
         },
 
+        isKubernetesDeploymentOrCluster() {
+          if (!this.model.resourceLinks || this.model.resourceLinks.length === 0) {
+            return false;
+          }
+
+          let link = this.model.resourceLinks[0];
+          let isKubernetesDeployment = link.indexOf(links.KUBERNETES_DEPLOYMENTS) !== -1;
+          let isCluster = link.indexOf(links.CONTAINER_CLUSTERS) !== -1;
+
+          return isKubernetesDeployment || isCluster;
+        },
+
         redirect($e) {
           $e.preventDefault();
 
-          if (this.isRequestFinished(this.model) && this.isRedirectionAllowed()) {
+          if (this.isRequestFinished(this.model)
+            && this.isRedirectionAllowed()
+            && !this.isKubernetesDeploymentOrCluster()) {
 
             let isHostsRequest = false;
             let hostsQuery;

diff --git a/ui/app/src/js/components/requests/RequestsListItemVue.html b/ui/app/src/js/components/requests/RequestsListItemVue.html
@@ -1,5 +1,5 @@
 <!--
-  ~ Copyright (c) 2016 VMware, Inc. All Rights Reserved.
+  ~ Copyright (c) 2016-2018 VMware, Inc. All Rights Reserved.
   ~
   ~ This product is licensed to you under the Apache License, Version 2.0 (the "License").
   ~ You may not use this product except in compliance with the License.
@@ -36,7 +36,7 @@
           <div class="request-status-actions" v-if="isEnabled(model)">
             <div v-if="model.errorMessage" class="btn"
                  v-on:click="redirect($event)" :title="i18n('app.request.actions.details.show')"><i class="fa fa-warning"></i></div>
-            <div v-if="!model.errorMessage && isRedirectionAllowed()" class="btn"
+            <div v-if="!model.errorMessage && isRedirectionAllowed() && !isKubernetesDeploymentOrCluster()" class="btn"
                  v-on:click="redirect($event)" :title="i18n('app.request.actions.open')"><i class="fa fa-eye"></i></div>
             <div v-if="isRequestGraphEnabled" class="btn"
                  v-on:click="openRequestGraph($event)" :title="i18n('app.request.actions.details.show')"><i class="fa fa-bug"></i></div>

diff --git a/ui/app/src/js/core/links.js b/ui/app/src/js/core/links.js
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2016 VMware, Inc. All Rights Reserved.
+ * Copyright (c) 2016-2018 VMware, Inc. All Rights Reserved.
  *
  * This product is licensed to you under the Apache License, Version 2.0 (the "License").
  * You may not use this product except in compliance with the License.
@@ -52,6 +52,7 @@ var links = Immutable({
   KUBERNETES_ENTITIES: RESOURCES + '/kubernetes',
   KUBERNETES_DESC: RESOURCES + '/kubernetes-descriptions',
   KUBERNETES_DESC_CONTENT: RESOURCES + '/kubernetes-templates',
+  KUBERNETES_DEPLOYMENTS: RESOURCES + '/kubernetes-deployments',
   CONTAINER_DESCRIPTION_TO_KUBERNETES_DESCRIPTION_CONVERTER: RESOURCES +
       '/container-description-to-kubernetes-description-converter',
   FAVORITE_IMAGES: RESOURCES + '/favorite-images',

diff --git a/ui/ng-app/src/app/utils/constants.ts b/ui/ng-app/src/app/utils/constants.ts
@@ -67,7 +67,9 @@ export const Constants = {
                 compositeComponent: "composite-component",
                 container: "container",
                 network: "network",
-                volume: "volume"
+                volume: "volume",
+                kubernetesDeployments: "kubernetes-deployments",
+                kubernetesClusters: "kubernetes-clusters"
             }
         },
         eventLogs: {

diff --git a/ui/ng-app/src/app/views/requests/requests.component.html b/ui/ng-app/src/app/views/requests/requests.component.html
@@ -68,22 +68,34 @@
                     <clr-dg-cell>
                         <a *ngIf="request.eventLogLink" routerLink="../event-logs/{{getEventLogId(request)}}"
                            routerLinkActive="active">{{"requests.eventLogLink" | i18n}}</a>
-                        <a *ngIf="canNavigateTo('container',request)"
+                        <a *ngIf="canNavigateTo('container', request)"
                            allowNavigation [roles]="deploymentsRouteRestriction()"
-                           routerLink="{{deploymentsRouterLink('containers',request)}}"
+                           [routerLink]="['../containers']"
+                           [queryParams]="{$occurrence: 'any', documentId: getDocumentId(request)}"
                            routerLinkActive="active">{{"requests.containerLink" | i18n}}</a>
-                        <a *ngIf="canNavigateTo('composite-component',request)"
+                        <a *ngIf="canNavigateTo('composite-component', request)"
                            allowNavigation [roles]="deploymentsRouteRestriction()"
-                           routerLink="{{deploymentsRouterLink('applications',request)}}"
+                           [routerLink]="['../applications']"
+                           [queryParams]="{$occurrence: 'any', documentId: getDocumentId(request)}"
                            routerLinkActive="active">{{"requests.compositeComponentLink" | i18n}}</a>
-                        <a *ngIf="canNavigateTo('network',request)"
+                        <a *ngIf="canNavigateTo('network', request)"
                            allowNavigation [roles]="deploymentsRouteRestriction()"
-                           routerLink="{{deploymentsRouterLink('networks',request)}}"
+                           [routerLink]="['../networks']"
+                           [queryParams]="{$occurrence: 'any', documentId: getDocumentId(request)}"
                            routerLinkActive="active">{{"requests.containerNetworkLink" | i18n}}</a>
-                        <a *ngIf="canNavigateTo('volume',request)"
+                        <a *ngIf="canNavigateTo('volume', request)"
                            allowNavigation [roles]="deploymentsRouteRestriction()"
-                           routerLink="{{deploymentsRouterLink('volumes',request)}}"
+                           [routerLink]="['../volumes']"
+                           [queryParams]="{$occurrence: 'any', documentId: getDocumentId(request)}"
                            routerLinkActive="active">{{"requests.containerVolumeLink" | i18n}}</a>
+                        <a *ngIf="canNavigateTo('kubernetes-deployments', request)"
+                           [routerLink]="['../kubernetes/deployments']"
+                           [queryParams]="{$occurrence: 'all', any: getDocumentId(request)}"
+                           routerLinkActive="active">{{"requests.kubernetesDeploymentLink" | i18n}}</a>
+                        <a *ngIf="canNavigateTo('kubernetes-clusters', request)"
+                           [routerLink]="['../kubernetes/clusters']"
+                           [queryParams]="{$occurrence: 'all', any: request.name}"
+                           routerLinkActive="active">{{"requests.kubernetesClusterLink" | i18n}}</a>
                     </clr-dg-cell>
                 </clr-dg-row>
 

diff --git a/ui/ng-app/src/app/views/requests/requests.component.ts b/ui/ng-app/src/app/views/requests/requests.component.ts
@@ -166,6 +166,22 @@ export class RequestsComponent implements OnInit, OnDestroy {
         return request.resourceLinks.some(resourceLink => resourceLink.indexOf(Links.CONTAINER_VOLUMES) !== -1);
     }
 
+    isKubernetesDeployment(request: any) {
+        if (!request || !request.resourceLinks) {
+            return false;
+        }
+
+        return request.resourceLinks.some(resourceLink => resourceLink.indexOf(Links.DEPLOYMENTS) !== -1);
+    }
+
+    isCluster(request: any) {
+        if (!request || !request.resourceLinks) {
+            return false;
+        }
+
+        return request.resourceLinks.some(resourceLink => resourceLink.indexOf(Links.CLUSTERS) !== -1);
+    }
+
     canNavigateTo(direction: string, request: any) {
         if (request.eventLogLink || this.isRunning(request)) {
             return false;
@@ -180,16 +196,15 @@ export class RequestsComponent implements OnInit, OnDestroy {
                 return this.isContainerNetwork(request);
             case Constants.recentActivities.requests.navigation.volume:
                 return this.isContainerVolume(request);
+            case Constants.recentActivities.requests.navigation.kubernetesDeployments:
+                return this.isKubernetesDeployment(request);
+            case Constants.recentActivities.requests.navigation.kubernetesClusters:
+                return this.isCluster(request);
             default:
                 return false;
         }
     }
 
-    deploymentsRouterLink(deploymentsSubTab: string, request: string) {
-        let documentId = this.getDocumentId(request);
-        return `../${deploymentsSubTab}?$occurrence=any&documentId=${documentId}`;
-    }
-
     private listRequests(showLoadingIndicator?: boolean) {
         if (this.loadingPromise) {
             this.loadingPromise.cancel();

diff --git a/ui/ng-app/src/assets/i18n/admiral.en.json b/ui/ng-app/src/assets/i18n/admiral.en.json
@@ -531,13 +531,15 @@
     "columnPhase": "Phase",
     "columnRequest": "Request",
     "columnDetails": "Details",
-    "count": "Showing latest {{number}} requests",
+    "count": "Showing last {{number}} requests",
     "error": "Error",
     "eventLogLink": "Go to event log",
-    "containerLink": "Go to containers",
-    "compositeComponentLink": "Go to applications",
-    "containerNetworkLink": "Go to networks",
-    "containerVolumeLink": "Go to volumes",
+    "containerLink": "Go to container",
+    "compositeComponentLink": "Go to application",
+    "containerNetworkLink": "Go to network",
+    "containerVolumeLink": "Go to volume",
+    "kubernetesDeploymentLink": "Go to deployment",
+    "kubernetesClusterLink": "Go to PKS cluster",
     "deleteRequest": {
       "title": "Remove request",
       "description": "Confirm the removal of the selected requests. The operation cannot be undone."