From cd03c8b44d6552bd41a7ab232fdd68850baa630d Mon Sep 17 00:00:00 2001 From: rcourtman Date: Tue, 4 Aug 2026 18:59:31 +0100 Subject: [PATCH] fix(ui): clarify compact Kubernetes tables Contract-Neutral: Responsive Kubernetes table presentation and browser coverage only; no subsystem contract changes --- frontend-modern/browser-verification.json | 44 ++++++++----------- .../Infrastructure/ResourceDetailDrawer.tsx | 2 + .../kubernetes/KubernetesDeploymentsTable.tsx | 8 +++- .../KubernetesDeploymentsTable.test.tsx | 3 ++ 4 files changed, 30 insertions(+), 27 deletions(-) diff --git a/frontend-modern/browser-verification.json b/frontend-modern/browser-verification.json index ebf5f99c2..d8512031f 100644 --- a/frontend-modern/browser-verification.json +++ b/frontend-modern/browser-verification.json @@ -1,43 +1,37 @@ { "version": 1, - "base_sha": "207779529bf9dcbf3168529b03b19d270a332171", - "verified_at": "2026-08-04T17:30:39Z", + "base_sha": "8d0b53245fdcfc1b90060289b5a92de3cd011810", + "verified_at": "2026-08-04T17:59:01Z", "result": "passed", "changed_paths": [ - "frontend-modern/src/features/standalone/AgentsMachinesTable.tsx", - "frontend-modern/src/index.css" + "frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx", + "frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx" ], "content_sha256": { - "frontend-modern/src/features/standalone/AgentsMachinesTable.tsx": "36495918506ee371af8dbaa8cba57556573deb24bb8687f7eae3ef8f1d2ebc02", - "frontend-modern/src/index.css": "f54fadadbe33afa3c74c8c272c5d82a099c9176bba0e4df93b9d2f6e53026a39" + "frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx": "0686cbc5576f24f2d1ec7fa6a73040c4409598d2cb8864977103fcecc15be6bb", + "frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx": "fcd177f88a6969aa3aa1c0549f789c69afca077168193dfad0455c034b95dd0d" }, "routes": [ - "/standalone/machines", - "/proxmox/overview", - "/proxmox/storage?tab=disks&source=proxmox-all", - "/settings/system-updates", - "/settings/support/reporting", - "/settings/infrastructure/agent-doctor", - "/settings/monitoring/availability" + "/kubernetes/workloads", + "/kubernetes/overview", + "/proxmox/ceph", + "/proxmox/storage" ], "viewports": [ { "width": 375, "height": 900 }, { "width": 768, "height": 900 }, - { "width": 1024, "height": 900 }, - { "width": 1440, "height": 900 } + { "width": 1440, "height": 1000 } ], "states": [ - "Rendered the Machines table with its default columns and with the user-selected IP column at phone and wide desktop sizes", - "Verified that a selected primary IP remains in the compact machine identity subtitle while the dedicated column is container-hidden", - "Verified that the selected sortable IP column appears once the actual machine table pane reaches 80rem at a 1440px viewport", - "Rendered Proxmox overview workload and node drawers, workload history, and physical-disk history details at 375px", - "Rendered update, reporting, agent-doctor, and availability settings surfaces at phone, tablet, and desktop widths" + "Rendered the Kubernetes deployments inventory and an expanded deployment drawer at phone width", + "Rendered the expanded Kubernetes cluster drawer on its Overview, Namespaces, and Deployments tabs at phone width", + "Rendered an expanded Ceph cluster with Pools and Services tables at phone, tablet, and desktop widths", + "Rendered an expanded Proxmox ZFS storage pool with trend, configuration, and pool details at phone, tablet, and desktop widths" ], "interactions": [ - "Opened Filters, View preferences, and Columns on Machines; enabled IP, resized from 375px to 1440px, then reset the saved preference", - "Confirmed the Machines table and page have equal client and scroll widths at 375px and 1440px after the IP-column change", - "Pinned IP in the Proxmox workload column picker at 375px and confirmed the requested column appears with deliberate table-only scrolling before reset", - "Expanded a Proxmox workload, switched to its History tab, expanded a Proxmox node, and expanded a physical disk without page overflow", - "Inspected final mobile pixels for the compact Machines table and the expanded Proxmox node drawer" + "Expanded checkout-api and verified that the deployment table retained its primary readiness and age information without document or table overflow", + "Expanded Production EU, switched between Namespaces and Deployments, and verified all four resource-detail tabs remain fully visible in the 298px drawer tablist", + "Confirmed the Kubernetes namespace and deployment drawer tables each fit their 296px containers and that deployment readiness reads current/desired", + "Expanded Mock Cluster Ceph and west-c-service-pool, inspected final mobile pixels, and confirmed equal client and scroll widths at 375px, 768px, and 1440px" ] } diff --git a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx index c3dcc3dbe..79e5d9246 100644 --- a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx +++ b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx @@ -155,6 +155,8 @@ const DrawerContent: Component = (props) => { diff --git a/frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx b/frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx index e0728d252..5dd747471 100644 --- a/frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx +++ b/frontend-modern/src/features/kubernetes/KubernetesDeploymentsTable.tsx @@ -8,6 +8,7 @@ import { PlatformSortableTableHead, PlatformTableNumberValue, PlatformTableRelativeTimeValue, + PlatformResponsiveTableLabel, PlatformTableToolbar, PlatformTableEmptyState, createPlatformTableFilterState, @@ -214,7 +215,7 @@ export const KubernetesDeploymentsTable: Component<{ sortKey="ready" class="md:w-[7%]" > - Ready + - Available + + + /{deployment.kubernetes?.desiredReplicas ?? 0} + { expect(screen.getByText('Desired')).toBeInTheDocument(); expect(screen.getByText('Updated')).toBeInTheDocument(); expect(screen.getByText('Ready')).toBeInTheDocument(); + expect(screen.getByText('Rdy')).toBeInTheDocument(); expect(screen.getByText('Available')).toBeInTheDocument(); + expect(screen.getByText('Avail')).toBeInTheDocument(); // observedGeneration is deliberately not a column: the raw number is // unactionable without the spec generation beside it. expect(screen.queryByText('Observed')).toBeNull(); @@ -78,6 +80,7 @@ describe('KubernetesDeploymentsTable', () => { expect(screen.getByText('4')).toBeInTheDocument(); expect(screen.getByText('3')).toBeInTheDocument(); expect(screen.getAllByText('2')).toHaveLength(2); + expect(document.querySelector('.k8s-deployment-ready-total')).toHaveTextContent('/4'); expect(screen.queryByText('12')).toBeNull(); expect(screen.getByText('2h ago')).toBeInTheDocument(); expect(