From 4c52d16b7e9ec7c836747588aadd3ab1dde894a4 Mon Sep 17 00:00:00 2001
From: Maurice <mauriceboe@icloud.com>
Date: Sun, 6 Sep 2026 23:34:51 +0200
Subject: [PATCH] test(admin): follow the API keys card to the theme tokens

The three AdminPage cases located the card with closest('.bg-white'), which
returned null once the card became bg-surface-card, and within(null) reports
that a line later as "container is null". Anchor on .rounded-xl, the same way
the green AdminSettingsTab suite already does, and ask for the single Test
button rather than the first of several: weather left the card when it stopped
needing a key.

FE-ADMSET-031 asserted the Open-Meteo panel inside that card. The panel was
deliberately removed from the desktop tab - it needs no key and had nothing to
configure - so the case now pins what took its place, the TREK index heading
the card with the recommendation the Google key used to carry. The panel itself
still lives in the mobile section, where FE-MOB-ASET-019 asserts it.
---
 client/src/pages/AdminPage.test.tsx              | 12 ++++++------
 client/src/pages/admin/AdminSettingsTab.test.tsx | 10 +++++++---
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/client/src/pages/AdminPage.test.tsx b/client/src/pages/AdminPage.test.tsx
index 8c2fd0a5e..1feb33220 100644
--- a/client/src/pages/AdminPage.test.tsx
+++ b/client/src/pages/AdminPage.test.tsx
@@ -1091,7 +1091,7 @@ describe('AdminPage', () => {
 
       // Wait for the API Keys section to appear
       const apiKeysHeading = await screen.findByRole('heading', { name: /^api keys$/i });
-      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.bg-white');
+      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.rounded-xl');
 
       // Type in the maps key field (type="password" by default)
       const keyInputs = within(apiKeysCard!).getAllByPlaceholderText('Enter key...');
@@ -1122,7 +1122,7 @@ describe('AdminPage', () => {
       fireEvent.click(screen.getByRole('button', { name: /settings/i }));
 
       const apiKeysHeading = await screen.findByRole('heading', { name: /^api keys$/i });
-      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.bg-white');
+      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.rounded-xl');
 
       // The Unsplash key is the second 'Enter key...' input (after Maps).
       const keyInputs = within(apiKeysCard!).getAllByPlaceholderText('Enter key...');
@@ -1155,15 +1155,15 @@ describe('AdminPage', () => {
 
       // Wait for the API Keys section
       const apiKeysHeading = await screen.findByRole('heading', { name: /^api keys$/i });
-      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.bg-white');
+      const apiKeysCard = apiKeysHeading.closest<HTMLElement>('.rounded-xl');
 
       // Type a key value to enable the Test button
       const keyInputs = within(apiKeysCard!).getAllByPlaceholderText('Enter key...');
       fireEvent.change(keyInputs[0], { target: { value: 'test-maps-key' } });
 
-      // Click the validate (Test) button for maps key — first "Test" button in the card
-      const testBtns = within(apiKeysCard!).getAllByRole('button', { name: /^test$/i });
-      fireEvent.click(testBtns[0]);
+      // The maps key is the only one with a Test button now: weather left the card
+      // when it stopped needing a key at all.
+      fireEvent.click(within(apiKeysCard!).getByRole('button', { name: /^test$/i }));
 
       await waitFor(() => {
         // After validation, valid indicator appears (admin.keyValid = 'Connected')
diff --git a/client/src/pages/admin/AdminSettingsTab.test.tsx b/client/src/pages/admin/AdminSettingsTab.test.tsx
index 078c6487e..37ac6c575 100644
--- a/client/src/pages/admin/AdminSettingsTab.test.tsx
+++ b/client/src/pages/admin/AdminSettingsTab.test.tsx
@@ -374,11 +374,15 @@ describe('AdminSettingsTab', () => {
     expect(toggleFor('Place Enrichment')).toHaveAttribute('aria-label', 'Place Enrichment');
   });
 
-  it('FE-ADMSET-031: shows the Open-Meteo info block', () => {
+  it('FE-ADMSET-031: the API keys card leads with the TREK index and no weather panel', () => {
     renderTab();
 
-    expect(screen.getByText('Weather Data')).toBeInTheDocument();
-    expect(screen.getByText('16-day forecast')).toBeInTheDocument();
+    const keys = card('API Keys');
+    expect(within(keys).getByRole('img', { name: 'TREK Places API' })).toBeInTheDocument();
+    expect(within(keys).getByText('Recommended default')).toBeInTheDocument();
+    // Weather needs no key, so it left a card about keys. The panel itself lives
+    // on in the mobile section, where FE-MOB-ASET-019 asserts it.
+    expect(screen.queryByText('Weather Data')).not.toBeInTheDocument();
   });
 
   it('FE-ADMSET-032: the API keys save button calls handleSaveApiKeys', () => {