feat: kubernets service - display external hostname (#486)

api/http/models/kubernetes/services.go

@@ -36,7 +36,7 @@ type (
 
 	K8sServiceIngress struct {
 		IP       string `json:"IP"`
-		Host string `json:"Host"`
+		Hostname string `json:"Hostname"`
 	}
 
 	// K8sServiceDeleteRequests is a mapping of namespace names to a slice of

api/kubernetes/cli/service.go

@@ -82,7 +82,7 @@ func parseService(service corev1.Service) models.K8sServiceInfo {
 	for _, status := range service.Status.LoadBalancer.Ingress {
 		ingressStatus = append(ingressStatus, models.K8sServiceIngress{
 			IP:       status.IP,
-			Host: status.Hostname,
+			Hostname: status.Hostname,
 		})
 	}
 
@@ -130,7 +130,7 @@ func (kcl *KubeClient) convertToK8sService(info models.K8sServiceInfo) corev1.Se
 	for _, i := range info.IngressStatus {
 		service.Status.LoadBalancer.Ingress = append(
 			service.Status.LoadBalancer.Ingress,
-			corev1.LoadBalancerIngress{IP: i.IP, Hostname: i.Host},
+			corev1.LoadBalancerIngress{IP: i.IP, Hostname: i.Hostname},
 		)
 	}
 

app/react/kubernetes/services/ServicesView/ServicesDatatable/columns/externalHost.tsx

@@ -0,0 +1,38 @@
+import { CellContext } from '@tanstack/react-table';
+
+import { ServiceRowData } from '../types';
+
+import { columnHelper } from './helper';
+
+export const externalHost = columnHelper.accessor(
+  (row) => {
+    if (row.Type === 'ExternalName') {
+      return row.ExternalName || '-';
+    }
+
+    return (
+      row.IngressStatus?.map((status) => status.Hostname)
+        .filter(Boolean)
+        .join(' ,') || '-'
+    );
+  },
+  {
+    header: 'External Host',
+    id: 'externalHost',
+    cell: Cell,
+  }
+);
+
+function Cell({ row }: CellContext<ServiceRowData, string>) {
+  if (row.original.Type === 'ExternalName') {
+    return <div>{row.original.ExternalName || '-'}</div>;
+  }
+
+  return (
+    <div>
+      {row.original.IngressStatus?.map((status) => status.Hostname)
+        .filter(Boolean)
+        .join(' ,') || '-'}
+    </div>
+  );
+}

app/react/kubernetes/services/ServicesView/ServicesDatatable/columns/index.tsx

@@ -3,6 +3,7 @@ import { type } from './type';
 import { namespace } from './namespace';
 import { ports } from './ports';
 import { clusterIP } from './clusterIP';
+import { externalHost } from './externalHost';
 import { externalIP } from './externalIP';
 import { targetPorts } from './targetPorts';
 import { application } from './application';
@@ -16,6 +17,7 @@ export const columns = [
   ports,
   targetPorts,
   clusterIP,
+  externalHost,
   externalIP,
   created,
 ];