Add resource versions display to node overview UI (#219)

aa1ex · web-flow · commit e02caee95482 · 2026-01-23T11:08:19.000+02:00
diff --git a/helm/charts/envoy-xds-controller/templates/ui/deployment.yaml b/helm/charts/envoy-xds-controller/templates/ui/deployment.yaml
@@ -45,7 +45,7 @@ spec:
       containers:
       - image: {{ .Values.ui.image.repository }}:{{ default .Chart.AppVersion .Values.ui.image.tag }}
         name: envoy-xds-controller-ui
-        imagePullPolicy: {{ .Values.image.pullPolicy }}
+        imagePullPolicy: {{ .Values.ui.image.pullPolicy }}
         {{- if .Values.ui.nginxConfigMap.enabled }}
         volumeMounts:
         - name: nginx-config
diff --git a/internal/xds/api/v1/handlers/overview.go b/internal/xds/api/v1/handlers/overview.go
@@ -44,6 +44,20 @@ func (h *handler) getOverview(ctx *gin.Context) {
 		return
 	}
 
+	// Get resource versions
+	versions, err := h.cache.GetVersions(nodeID)
+	if err != nil {
+		ctx.JSON(500, gin.H{"error": err.Error()})
+		return
+	}
+
+	resourceVersions := ResourceVersions{
+		Listeners: versions["listeners"],
+		Clusters:  versions["clusters"],
+		Routes:    versions["routes"],
+		Secrets:   versions["secrets"],
+	}
+
 	// Get all resources
 	listeners, err := h.cache.GetListeners(nodeID)
 	if err != nil {
@@ -70,10 +84,11 @@ func (h *handler) getOverview(ctx *gin.Context) {
 	summary := h.calculateSummary(endpoints, certificates)
 
 	response := &NodeOverviewResponse{
-		NodeID:       nodeID,
-		Summary:      summary,
-		Endpoints:    endpoints,
-		Certificates: certificates,
+		NodeID:           nodeID,
+		Summary:          summary,
+		ResourceVersions: resourceVersions,
+		Endpoints:        endpoints,
+		Certificates:     certificates,
 	}
 
 	// Cache the response
diff --git a/internal/xds/api/v1/handlers/overview_types.go b/internal/xds/api/v1/handlers/overview_types.go
@@ -3,10 +3,19 @@ package handlers
 // NodeOverviewResponse represents the complete overview of a node's configuration
 // in a human-readable format.
 type NodeOverviewResponse struct {
-	NodeID       string            `json:"nodeId"`
-	Summary      OverviewSummary   `json:"summary"`
-	Endpoints    []EndpointInfo    `json:"endpoints"`
-	Certificates []CertificateInfo `json:"certificates"`
+	NodeID           string            `json:"nodeId"`
+	Summary          OverviewSummary   `json:"summary"`
+	ResourceVersions ResourceVersions  `json:"resourceVersions"`
+	Endpoints        []EndpointInfo    `json:"endpoints"`
+	Certificates     []CertificateInfo `json:"certificates"`
+}
+
+// ResourceVersions contains xDS resource version strings for each resource type.
+type ResourceVersions struct {
+	Listeners string `json:"listeners"`
+	Clusters  string `json:"clusters"`
+	Routes    string `json:"routes"`
+	Secrets   string `json:"secrets"`
 }
 
 // OverviewSummary provides aggregate statistics for the node.
diff --git a/scripts/dev-update.sh b/scripts/dev-update.sh
@@ -61,10 +61,13 @@ helm upgrade exc \
     --reuse-values \
     --set image.repository="$IMG_REPO" \
     --set image.tag="$IMAGE_TAG" \
+    --set image.pullPolicy=Always \
     --set ui.image.repository="$UI_IMG_REPO" \
     --set ui.image.tag="$IMAGE_TAG" \
+    --set ui.image.pullPolicy=Always \
     --set initCert.image.repository="$INIT_CERT_IMG_REPO" \
     --set initCert.image.tag="$IMAGE_TAG" \
+    --set initCert.image.pullPolicy=Always \
     --namespace envoy-xds-controller \
     "$ROOT_DIR/helm/charts/envoy-xds-controller" \
     --timeout='5m' --wait
diff --git a/scripts/dev.sh b/scripts/dev.sh
@@ -125,10 +125,13 @@ helm install exc \
     --set 'watchNamespaces={default}' \
     --set image.repository="$IMG_REPO" \
     --set image.tag="$IMAGE_TAG" \
+    --set image.pullPolicy=Always \
     --set ui.image.repository="$UI_IMG_REPO" \
     --set ui.image.tag="$IMAGE_TAG" \
+    --set ui.image.pullPolicy=Always \
     --set initCert.image.repository="$INIT_CERT_IMG_REPO" \
     --set initCert.image.tag="$IMAGE_TAG" \
+    --set initCert.image.pullPolicy=Always \
     --namespace envoy-xds-controller \
     --create-namespace "$ROOT_DIR/helm/charts/envoy-xds-controller" \
     --timeout='5m' --wait
diff --git a/ui/src/common/types/overviewApiTypes.ts b/ui/src/common/types/overviewApiTypes.ts
@@ -1,10 +1,18 @@
 export interface NodeOverviewResponse {
 	nodeId: string
 	summary: OverviewSummary
+	resourceVersions: ResourceVersions
 	endpoints: EndpointInfo[]
 	certificates: CertificateInfo[]
 }
 
+export interface ResourceVersions {
+	listeners: string
+	clusters: string
+	routes: string
+	secrets: string
+}
+
 export interface OverviewSummary {
 	totalDomains: number
 	totalEndpoints: number
diff --git a/ui/src/components/resourceVersions/ResourceVersions.tsx b/ui/src/components/resourceVersions/ResourceVersions.tsx
@@ -0,0 +1,40 @@
+import { Box, Typography } from '@mui/material'
+import { ResourceVersions as ResourceVersionsType } from '../../common/types/overviewApiTypes'
+
+interface ResourceVersionsProps {
+	versions: ResourceVersionsType
+}
+
+export const ResourceVersions = ({ versions }: ResourceVersionsProps) => {
+	const items = [
+		{ label: 'Listeners', version: versions.listeners },
+		{ label: 'Clusters', version: versions.clusters },
+		{ label: 'Routes', version: versions.routes },
+		{ label: 'Secrets', version: versions.secrets }
+	]
+
+	return (
+		<Box sx={{ display: 'flex', alignItems: 'center', gap: 2, flexWrap: 'wrap' }}>
+			<Typography variant='body2' color='text.secondary'>
+				Versions:
+			</Typography>
+			{items.map((item, index) => (
+				<Box key={item.label} sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
+					<Typography variant='body2' color='text.secondary'>
+						{item.label}
+					</Typography>
+					<Typography variant='body2' sx={{ fontFamily: 'monospace', fontWeight: 600 }}>
+						{item.version}
+					</Typography>
+					{index < items.length - 1 && (
+						<Typography variant='body2' color='text.disabled' sx={{ ml: 1 }}>
+							|
+						</Typography>
+					)}
+				</Box>
+			))}
+		</Box>
+	)
+}
+
+export default ResourceVersions
diff --git a/ui/src/components/resourceVersions/index.ts b/ui/src/components/resourceVersions/index.ts
@@ -0,0 +1,2 @@
+export { ResourceVersions } from './ResourceVersions'
+export { default } from './ResourceVersions'
diff --git a/ui/src/pages/nodeOverview/NodeOverview.tsx b/ui/src/pages/nodeOverview/NodeOverview.tsx
@@ -5,6 +5,7 @@ import ArrowBackIcon from '@mui/icons-material/ArrowBack'
 import RefreshIcon from '@mui/icons-material/Refresh'
 import { useOverview } from '../../api/hooks/useOverview'
 import { OverviewSummary } from '../../components/overviewSummary'
+import { ResourceVersions } from '../../components/resourceVersions'
 import { EndpointsTable } from '../../components/endpointsTable'
 import { CertificatesTable } from '../../components/certificatesTable'
 import { CustomTabPanel } from '../../components/customTabPanel'
@@ -80,6 +81,11 @@ const NodeOverview = () => {
 				</IconButton>
 			</Box>
 
+			{/* Resource Versions */}
+			<Box sx={{ mb: 2 }}>
+				<ResourceVersions versions={overview.resourceVersions} />
+			</Box>
+
 			{/* Summary Cards */}
 			<OverviewSummary summary={overview.summary} />
 

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+export { ResourceVersions } from './ResourceVersions'`
	`2`	`+export { default } from './ResourceVersions'`