From 025208e5e263f700acd13c0fc99ee3dca8ff6c6f Mon Sep 17 00:00:00 2001 From: rcourtman Date: Thu, 19 Mar 2026 23:23:30 +0000 Subject: [PATCH] Reduce resource drawer service headings --- .../internal/subsystems/unified-resources.md | 4 ++ .../Infrastructure/ResourceDetailDrawer.tsx | 9 ++-- .../ResourceDetailDrawer.history.test.tsx | 5 ++- ...esourceDetailDrawer.service-cards.test.tsx | 44 ++++++++++++++----- 4 files changed, 47 insertions(+), 15 deletions(-) diff --git a/docs/release-control/v6/internal/subsystems/unified-resources.md b/docs/release-control/v6/internal/subsystems/unified-resources.md index f096b722e..16e9fb18e 100644 --- a/docs/release-control/v6/internal/subsystems/unified-resources.md +++ b/docs/release-control/v6/internal/subsystems/unified-resources.md @@ -304,6 +304,10 @@ compact labels (`Docker runtime`, `Updates`, `Checked`, `Show actions`, `Check now`, `Update all`) and short queued/confirm feedback so action surfaces stay readable without turning the card into a paragraph of control copy. +The remaining PBS and PMG cards also stay neutral and resource-first now: +their headings read `PBS` and `PMG`, and the primary health row is `State` +instead of `Connection`, so service support blocks read like resource status +rather than branded sub-pages. Unsupported secondary tabs now also use the same terse availability notices (`PMG resources only.`, `Kubernetes clusters only.`, `Docker runtimes with Swarm only.`) instead of explanatory sentences, so mismatch fallback state diff --git a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx index 6476fa679..db58279dc 100644 --- a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx +++ b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx @@ -1145,6 +1145,7 @@ const DrawerContent: Component = (props) => { showLabel="Show service details" hideLabel="Hide service details" contentClass="mt-3 grid gap-3 md:grid-cols-2 lg:grid-cols-3" + dataTestId="resource-service-details-section" >
@@ -1339,7 +1340,7 @@ const DrawerContent: Component = (props) => {
- PBS Service + PBS
= (props) => {
- Connection + State {connection.label}
@@ -1428,7 +1429,7 @@ const DrawerContent: Component = (props) => {
- Mail Gateway + PMG
= (props) => {
- Connection + State {connection.label}
diff --git a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx index 41db6fdc9..ad97feb6a 100644 --- a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx +++ b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx @@ -372,7 +372,10 @@ describe('ResourceDetailDrawer change history section', () => { expect(screen.getByText('Service details')).toBeInTheDocument(); fireEvent.click(screen.getByRole('button', { name: 'Show service details' })); - expect(screen.getByText('PBS Service')).toBeInTheDocument(); + const serviceDetails = within(screen.getByTestId('resource-service-details-section')); + expect(serviceDetails.getByText('PBS')).toBeInTheDocument(); + expect(serviceDetails.queryByText('PBS Service')).toBeNull(); + expect(serviceDetails.queryByText('Connection')).toBeNull(); expect(screen.queryByText('Backup summary')).toBeNull(); expect(screen.queryByText('Job breakdown')).toBeNull(); expect(screen.queryByText('Show job detail')).toBeNull(); diff --git a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.service-cards.test.tsx b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.service-cards.test.tsx index 1ccc3273b..d29f9e856 100644 --- a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.service-cards.test.tsx +++ b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.service-cards.test.tsx @@ -1,5 +1,5 @@ import { describe, expect, it, vi } from 'vitest'; -import { fireEvent, render, waitFor } from '@solidjs/testing-library'; +import { fireEvent, render, within } from '@solidjs/testing-library'; import type { Resource } from '@/types/resource'; import { ResourceDetailDrawer } from '@/components/Infrastructure/ResourceDetailDrawer'; @@ -32,6 +32,26 @@ vi.mock('@/api/resources', () => ({ }, })); +vi.mock('@/api/ai', () => ({ + AIAPI: { + getResourceIntelligence: vi.fn().mockResolvedValue({ + resource_id: 'resource-1', + health: { + score: 92, + grade: 'A', + trend: 'stable', + factors: [], + prediction: 'Stable', + }, + recent_changes: [], + dependencies: [], + dependents: [], + correlations: [], + note_count: 0, + }), + }, +})); + const baseResource = (overrides: Partial): Resource => ({ id: 'resource-1', type: 'agent', @@ -66,7 +86,7 @@ describe('ResourceDetailDrawer service cards', () => { }, }); - const { getByText, getAllByText, getByRole, queryByText } = render(() => ( + const { getByText, getByRole, getByTestId, queryByText } = render(() => ( )); @@ -74,8 +94,11 @@ describe('ResourceDetailDrawer service cards', () => { expect(getByText('2 datastores · 3 jobs')).toBeInTheDocument(); expect(queryByText('PBS Service')).toBeNull(); fireEvent.click(getByRole('button', { name: 'Show service details' })); - expect(getByText('PBS Service')).toBeInTheDocument(); - expect(getAllByText('pbs-main.local').length).toBeGreaterThan(0); + const serviceDetails = within(getByTestId('resource-service-details-section')); + expect(serviceDetails.getByText('PBS')).toBeInTheDocument(); + expect(serviceDetails.queryByText('Connection')).toBeNull(); + expect(serviceDetails.getAllByText('State').length).toBeGreaterThan(0); + expect(serviceDetails.getAllByText('pbs-main.local').length).toBeGreaterThan(0); expect(queryByText('Backup summary')).toBeNull(); expect(queryByText('Job breakdown')).toBeNull(); expect(queryByText('Show job detail')).toBeNull(); @@ -89,7 +112,7 @@ describe('ResourceDetailDrawer service cards', () => { ); }); - it('renders PMG card with compact summary and queue/mail breakdown sections', async () => { + it('renders PMG card with compact summary and queue/mail breakdown sections', () => { const resource = baseResource({ id: 'pmg-1', type: 'pmg', @@ -113,7 +136,7 @@ describe('ResourceDetailDrawer service cards', () => { }, }); - const { getByText, getAllByText, getByRole, queryByText } = render(() => ( + const { getByText, getByRole, getByTestId, queryByText } = render(() => ( )); @@ -121,10 +144,11 @@ describe('ResourceDetailDrawer service cards', () => { expect(getByText('519 queue total · 16 backlog')).toBeInTheDocument(); expect(queryByText('Mail Gateway')).toBeNull(); fireEvent.click(getByRole('button', { name: 'Show service details' })); - await waitFor(() => { - expect(getByText('Mail Gateway')).toBeInTheDocument(); - }); - expect(getAllByText('pmg-main.local').length).toBeGreaterThan(0); + const serviceDetails = within(getByTestId('resource-service-details-section')); + expect(serviceDetails.getByText('PMG')).toBeInTheDocument(); + expect(serviceDetails.queryByText('Connection')).toBeNull(); + expect(serviceDetails.getAllByText('State').length).toBeGreaterThan(0); + expect(serviceDetails.getAllByText('pmg-main.local').length).toBeGreaterThan(0); expect(queryByText('Mail flow summary')).toBeNull(); expect(queryByText('Queue breakdown')).toBeNull(); expect(queryByText('Mail processing')).toBeNull();