From ae0b9b1e30125a6311c31265362369370fea0d2a Mon Sep 17 00:00:00 2001
From: Ali <83188384+testA113@users.noreply.github.com>
Date: Thu, 6 Oct 2022 15:24:59 +1300
Subject: [PATCH] fix(ingress): ingress indicate missing services EE-4358
 (#7794)

---
 .../kube-services-item.html                   |  8 ++++
 .../kube-services/kube-services.html          |  2 +-
 .../IngressDatatable/IngressDataTable.tsx     |  9 ++--
 .../IngressDatatable/columns/ingressRules.tsx | 13 ++++--
 .../react/views/networks/ingresses/queries.ts | 42 ++++++++++++++++++-
 .../react/views/networks/ingresses/types.ts   |  1 +
 .../PageHeader/HeaderContainer.module.css     |  4 --
 7 files changed, 67 insertions(+), 12 deletions(-)

diff --git a/app/kubernetes/components/kube-services/kube-services-item/kube-services-item.html b/app/kubernetes/components/kube-services/kube-services-item/kube-services-item.html
index 3b3e4b1fa..e5c125e56 100644
--- a/app/kubernetes/components/kube-services/kube-services-item/kube-services-item.html
+++ b/app/kubernetes/components/kube-services/kube-services-item/kube-services-item.html
@@ -36,6 +36,8 @@
             placeholder="80"
             ng-min="1"
             ng-max="65535"
+            min="1"
+            max="65535"
             ng-change="$ctrl.servicePort($index)"
             required
             ng-disabled="$ctrl.originalIngresses.length === 0 || ($ctrl.serviceType === $ctrl.KubernetesApplicationPublishingTypes.LOAD_BALANCER && !$ctrl.loadbalancerEnabled)"
@@ -70,6 +72,8 @@
             placeholder="80"
             ng-min="1"
             ng-max="65535"
+            min="1"
+            max="65535"
             required
             ng-disabled="$ctrl.originalIngresses.length === 0 || ($ctrl.serviceType === $ctrl.KubernetesApplicationPublishingTypes.LOAD_BALANCER && !$ctrl.loadbalancerEnabled)"
             ng-change="$ctrl.onChangeServicePort()"
@@ -105,6 +109,8 @@
             placeholder="30080"
             ng-min="30000"
             ng-max="32767"
+            min="30000"
+            max="32767"
             required
             ng-change="$ctrl.onChangeNodePort()"
             data-cy="k8sAppCreate-nodeportPort_{{ $index }}"
@@ -139,6 +145,8 @@
             placeholder="80"
             ng-min="1"
             ng-max="65535"
+            min="1"
+            max="65535"
             required
             ng-disabled="$ctrl.serviceType === $ctrl.KubernetesApplicationPublishingTypes.LOAD_BALANCER && !$ctrl.loadbalancerEnabled"
             data-cy="k8sAppCreate-loadbalancerPort_{{ $index }}"
diff --git a/app/kubernetes/components/kube-services/kube-services.html b/app/kubernetes/components/kube-services/kube-services.html
index d579db1ea..3154f47ba 100644
--- a/app/kubernetes/components/kube-services/kube-services.html
+++ b/app/kubernetes/components/kube-services/kube-services.html
@@ -9,7 +9,7 @@
 </div>
 <div class="form-group">
   <div class="col-sm-12 form-inline">
-    <div class="col-sm-5" style="padding-left: 0px">
+    <div class="col-sm-6" style="padding-left: 0px">
       <select
         class="form-control"
         ng-model="$ctrl.state.selected"
diff --git a/app/kubernetes/react/views/networks/ingresses/IngressDatatable/IngressDataTable.tsx b/app/kubernetes/react/views/networks/ingresses/IngressDatatable/IngressDataTable.tsx
index 9b693e21c..738c432ef 100644
--- a/app/kubernetes/react/views/networks/ingresses/IngressDatatable/IngressDataTable.tsx
+++ b/app/kubernetes/react/views/networks/ingresses/IngressDatatable/IngressDataTable.tsx
@@ -29,7 +29,10 @@ export function IngressDataTable() {
   const environmentId = useEnvironmentId();
 
   const nsResult = useNamespaces(environmentId);
-  const result = useIngresses(environmentId, Object.keys(nsResult?.data || {}));
+  const ingressesQuery = useIngresses(
+    environmentId,
+    Object.keys(nsResult?.data || {})
+  );
 
   const settings = useStore();
 
@@ -40,11 +43,11 @@ export function IngressDataTable() {
 
   return (
     <Datatable
-      dataset={result.data || []}
+      dataset={ingressesQuery.data || []}
       storageKey="ingressClassesNameSpace"
       columns={columns}
       settingsStore={settings}
-      isLoading={result.isLoading}
+      isLoading={ingressesQuery.isLoading}
       emptyContentLabel="No supported ingresses found"
       titleOptions={{
         icon: 'svg-route',
diff --git a/app/kubernetes/react/views/networks/ingresses/IngressDatatable/columns/ingressRules.tsx b/app/kubernetes/react/views/networks/ingresses/IngressDatatable/columns/ingressRules.tsx
index b38436068..ec74fa342 100644
--- a/app/kubernetes/react/views/networks/ingresses/IngressDatatable/columns/ingressRules.tsx
+++ b/app/kubernetes/react/views/networks/ingresses/IngressDatatable/columns/ingressRules.tsx
@@ -1,6 +1,7 @@
 import { CellProps, Column } from 'react-table';
 
 import { Icon } from '@@/Icon';
+import { Badge } from '@@/Badge';
 
 import { Ingress, TLS, Path } from '../../types';
 
@@ -31,11 +32,17 @@ export const ingressRules: Column<Ingress> = {
       const isHttp = isHTTP(row.original.TLS || [], path.Host);
       return (
         <div key={`${path.Host}${path.Path}${path.ServiceName}:${path.Port}`}>
-          {link(path.Host, path.Path, isHttp)}
-          <span className="px-2">
+          <span className="flex px-2 flex-nowrap items-center gap-1">
+            {link(path.Host, path.Path, isHttp)}
             <Icon icon="arrow-right" feather />
+            {`${path.ServiceName}:${path.Port}`}
+            {!path.HasService && (
+              <Badge type="warn" className="ml-1 gap-1">
+                <Icon icon="alert-triangle" feather />
+                Service doesn&apos;t exist
+              </Badge>
+            )}
           </span>
-          {`${path.ServiceName}:${path.Port}`}
         </div>
       );
     });
diff --git a/app/kubernetes/react/views/networks/ingresses/queries.ts b/app/kubernetes/react/views/networks/ingresses/queries.ts
index 8b789c65e..a1ed77deb 100644
--- a/app/kubernetes/react/views/networks/ingresses/queries.ts
+++ b/app/kubernetes/react/views/networks/ingresses/queries.ts
@@ -7,6 +7,8 @@ import {
   withInvalidate,
 } from '@/react-tools/react-query';
 
+import { getServices } from '../services/service';
+
 import {
   getIngresses,
   getIngress,
@@ -65,11 +67,43 @@ export function useIngresses(
       'ingress',
     ],
     async () => {
-      const ingresses = await Promise.all(
+      const settledIngressesPromise = await Promise.allSettled(
         namespaces.map((namespace) => getIngresses(environmentId, namespace))
       );
+      const ingresses = settledIngressesPromise
+        .filter(isFulfilled)
+        ?.map((i) => i.value);
       // flatten the array and remove empty ingresses
       const filteredIngresses = ingresses.flat().filter((ing) => ing);
+
+      // get all services in only the namespaces that the ingresses are in to find missing services
+      const uniqueNamespacesWithIngress = [
+        ...new Set(filteredIngresses.map((ing) => ing?.Namespace)),
+      ];
+      const settledServicesPromise = await Promise.allSettled(
+        uniqueNamespacesWithIngress.map((ns) => getServices(environmentId, ns))
+      );
+      const services = settledServicesPromise
+        .filter(isFulfilled)
+        ?.map((s) => s.value)
+        .flat();
+
+      // check if each ingress path service has a service that still exists
+      filteredIngresses.forEach((ing, iIndex) => {
+        const servicesInNamespace = services?.filter(
+          (service) => service?.Namespace === ing?.Namespace
+        );
+        const serviceNamesInNamespace = servicesInNamespace?.map(
+          (service) => service.Name
+        );
+        ing.Paths.forEach((path, pIndex) => {
+          if (!serviceNamesInNamespace?.includes(path.ServiceName)) {
+            filteredIngresses[iIndex].Paths[pIndex].HasService = false;
+          } else {
+            filteredIngresses[iIndex].Paths[pIndex].HasService = true;
+          }
+        });
+      });
       return filteredIngresses;
     },
     {
@@ -156,3 +190,9 @@ export function useIngressControllers(
     }
   );
 }
+
+function isFulfilled<T>(
+  input: PromiseSettledResult<T>
+): input is PromiseFulfilledResult<T> {
+  return input.status === 'fulfilled';
+}
diff --git a/app/kubernetes/react/views/networks/ingresses/types.ts b/app/kubernetes/react/views/networks/ingresses/types.ts
index 7787eb73b..ac0ca30f6 100644
--- a/app/kubernetes/react/views/networks/ingresses/types.ts
+++ b/app/kubernetes/react/views/networks/ingresses/types.ts
@@ -14,6 +14,7 @@ export interface Path {
   Port: number;
   Path: string;
   PathType: string;
+  HasService?: boolean;
 }
 
 export interface TLS {
diff --git a/app/react/components/PageHeader/HeaderContainer.module.css b/app/react/components/PageHeader/HeaderContainer.module.css
index 6a23e673b..3503ba50a 100644
--- a/app/react/components/PageHeader/HeaderContainer.module.css
+++ b/app/react/components/PageHeader/HeaderContainer.module.css
@@ -6,10 +6,6 @@
   margin-bottom: 5px !important;
 }
 
-.header > div:last-child {
-  padding-right: 0;
-}
-
 .header .meta div {
   white-space: nowrap;
   overflow: hidden;