[fix](trx-frontend-http): stop Tools lighting up on every refresh

navigateToTab marked the Tools button by asking whether the destination
tab was displayed, which is the right question at the wrong moment: the
first route navigation runs while the card is still behind the loading
state, where every tab computes to display:none.  Refreshing or deep
linking to any page therefore lit Tools alongside the real destination,
and nothing re-evaluated it once the page appeared.

Membership of the Tools menu answers the same question without needing
anything laid out, and still reads the grouping ui-core installs rather
than a second copy of it.

The smoke fixture now serves the SPA shell for route paths the way the
server's per-tab index handlers do, so a deep link no longer 404s and
the case is testable at all; two of them are asserted.

Signed-off-by: Stan Grams <sjg@haxx.space>

src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/app.js

@@ -5604,7 +5604,10 @@ function navigateToTab(name, options = {}) {
   document.querySelectorAll(".tab-bar .tab").forEach((t) => t.classList.remove("active"));
   btn.classList.add("active");
   const toolsBtn = document.getElementById("mobile-more-btn");
-  if (toolsBtn) toolsBtn.classList.toggle("active", getComputedStyle(btn).display === "none");
+  if (toolsBtn) {
+    const inToolsMenu = !!document.querySelector(`#mobile-more-menu [data-navigate-tab="${name}"]`);
+    toolsBtn.classList.toggle("active", inToolsMenu);
+  }
   window.trxUi?.syncSelectedTab(document.querySelector(".tab-bar-nav"), btn);
   document.querySelectorAll(".tab-panel").forEach((p) => p.style.display = "none");
   const panel = document.getElementById(`tab-${name}`);

src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/map-core.js

@@ -1647,18 +1647,13 @@ var mapWindow = window;
       return;
     }
     const mapRect = mapContainer.getBoundingClientRect();
-    const width = mapContainer.clientWidth || mapRect.width;
     const footer = document.querySelector(".footer");
-    let bottom = mapIsFullscreen() && stage ? stage.getBoundingClientRect().bottom : window.innerHeight;
-    if (!mapIsFullscreen() && footer) {
+    let bottom = window.innerHeight;
+    if (footer) {
       const fr = footer.getBoundingClientRect();
-      if (fr.top > mapRect.top + 50) bottom = fr.top;
+      if (fr.top > mapRect.top + 50) bottom = Math.min(fr.top, bottom);
     }
-    const available = Math.max(0, Math.floor(bottom - mapRect.top - 8));
-    const widthDriven = width > 0 ? Math.floor(width / 1.55) : available;
-    const viewportCap = mapIsFullscreen() ? Math.floor(window.innerHeight * 0.9) : Math.floor(window.innerHeight * 0.75);
-    const minHeight = Math.min(260, available);
-    const target = Math.max(minHeight, Math.min(available, viewportCap, widthDriven));
+    const target = Math.max(0, Math.floor(bottom - mapRect.top - 8));
     mapContainer.style.height = `${target}px`;
     if (aprsMap) aprsMap.invalidateSize();
   }

src/trx-client/trx-frontend/trx-frontend-http/frontend/src/app.ts

@@ -4618,10 +4618,17 @@ function navigateToTab(name: TabName, options: { updateHistory?: boolean; replac
   btn.classList.add("active");
   // A destination the strip hides is reached through Tools, so mark that
   // button instead — otherwise the strip looks identical on all four of them.
-  // Derived from what is actually hidden rather than from a second copy of the
-  // grouping, which would drift from the one ui-core installs.
+  // Membership of the Tools menu is the test: it still reads from the grouping
+  // ui-core installs rather than a second copy of it, but unlike the tab's
+  // computed display it does not depend on anything being laid out. The first
+  // route navigation runs while the card is still behind the loading state,
+  // where every tab computes to display:none — which lit Tools up on every
+  // refresh of every page.
   const toolsBtn = document.getElementById("mobile-more-btn");
-  if (toolsBtn) toolsBtn.classList.toggle("active", getComputedStyle(btn).display === "none");
+  if (toolsBtn) {
+    const inToolsMenu = !!document.querySelector(`#mobile-more-menu [data-navigate-tab="${name}"]`);
+    toolsBtn.classList.toggle("active", inToolsMenu);
+  }
   window.trxUi?.syncSelectedTab(document.querySelector(".tab-bar-nav"), btn);
   document.querySelectorAll<HTMLElement>(".tab-panel").forEach((p) => p.style.display = "none");
   const panel = document.getElementById(`tab-${name}`);

src/trx-client/trx-frontend/trx-frontend-http/frontend/src/map-core.ts

@@ -1980,23 +1980,21 @@ const mapWindow = window as unknown as MapWindow;
       if (aprsMap) aprsMap.invalidateSize();
       return;
     }
+    // Everything below is the windowed path — the fullscreen branch returned.
+    // The map tab is a whole page, so the stage fills the column down to the
+    // footer.  Capping it at a fraction of the viewport, or at a width-derived
+    // aspect ratio, left a dead band under the map that grew with the window
+    // (and on narrow screens made the map barely a third of the page).
     const mapRect = mapContainer.getBoundingClientRect();
-    const width = mapContainer.clientWidth || mapRect.width;
     const footer = document.querySelector(".footer");
-    let bottom = mapIsFullscreen() && stage
-      ? stage.getBoundingClientRect().bottom
-      : window.innerHeight;
-    if (!mapIsFullscreen() && footer) {
+    let bottom = window.innerHeight;
+    if (footer) {
       const fr = footer.getBoundingClientRect();
-      if (fr.top > mapRect.top + 50) bottom = fr.top;
+      // Clamped to the viewport: once the column is tall enough to push the
+      // footer below the fold, growing into it would push it further still.
+      if (fr.top > mapRect.top + 50) bottom = Math.min(fr.top, bottom);
     }
-    const available = Math.max(0, Math.floor(bottom - mapRect.top - 8));
-    const widthDriven = width > 0 ? Math.floor(width / 1.55) : available;
-    const viewportCap = mapIsFullscreen()
-      ? Math.floor(window.innerHeight * 0.9)
-      : Math.floor(window.innerHeight * 0.75);
-    const minHeight = Math.min(260, available);
-    const target = Math.max(minHeight, Math.min(available, viewportCap, widthDriven));
+    const target = Math.max(0, Math.floor(bottom - mapRect.top - 8));
     mapContainer.style.height = `${target}px`;
     if (aprsMap) aprsMap.invalidateSize();
   }

src/trx-client/trx-frontend/trx-frontend-http/frontend/tests/browser-smoke.mjs

@@ -124,7 +124,9 @@ const contentTypes = new Map([
 ]);
 
 function assetPath(urlPath) {
-  if (urlPath === "/") return path.join(webDir, "index.html");
+  // Every tab route has its own index handler on the server (see api/assets.rs),
+  // so a deep link or a refresh serves the SPA shell, not a 404.
+  if (!path.extname(urlPath)) return path.join(webDir, "index.html");
   if (urlPath.startsWith("/vendor/")) return path.join(webDir, urlPath);
   const generated = path.join(generatedDir, path.basename(urlPath));
   if (urlPath.endsWith(".js")) return generated;
@@ -237,11 +239,18 @@ try {
       right: Math.round(rect.right),
       viewport: document.documentElement.clientWidth,
       sideways: document.documentElement.scrollWidth > document.documentElement.clientWidth + 1,
+      gapToFooter: Math.round(document.querySelector(".footer").getBoundingClientRect().top - rect.bottom),
+      pageScrolls: document.documentElement.scrollHeight > document.documentElement.clientHeight + 1,
     };
   });
   assert.equal(stage.left, 0, `map stage starts at ${stage.left}px, not the viewport edge`);
   assert.equal(stage.right, stage.viewport, `map stage ends at ${stage.right}px, not ${stage.viewport}px`);
   assert.equal(stage.sideways, false, "full-bleed map makes the page scroll sideways");
+  // ...and fills the column down to the footer. Capping the height at a
+  // fraction of the viewport left a dead band that grew with the window.
+  assert.ok(stage.gapToFooter <= 16,
+    `${stage.gapToFooter}px of dead space between the map and the footer`);
+  assert.equal(stage.pageScrolls, false, "the map grew past the viewport");
 
   await page.locator('.tab[data-tab="main"]').click();
   assert.equal(new URL(page.url()).pathname, "/");
@@ -258,6 +267,24 @@ try {
   assert.equal(new URL(page.url()).pathname, "/");
   assert.deepEqual(runtimeErrors, []);
 
+  // Refreshing or deep-linking must mark the destination, not Tools. The first
+  // route navigation runs while the card is still behind the loading state, so
+  // a test that asked whether the tab was displayed saw "none" for every tab
+  // and lit Tools up on every refresh of every page.
+  for (const [route, tab, toolsLit] of [["/map", "map", false], ["/about", "about", true]]) {
+    await page.goto(`http://127.0.0.1:${address.port}${route}`, { waitUntil: "domcontentloaded" });
+    await page.locator(`#tab-${tab}`).waitFor({ state: "visible" });
+    const marked = await page.evaluate(() => ({
+      actives: [...document.querySelectorAll(".tab-bar .tab.active")].map((t) => t.dataset.tab || t.id),
+      tools: document.getElementById("mobile-more-btn").classList.contains("active"),
+    }));
+    assert.ok(marked.actives.includes(tab), `${route} marks ${JSON.stringify(marked.actives)}`);
+    assert.equal(marked.tools, toolsLit, `${route}: Tools active is ${marked.tools}`);
+  }
+  await page.goto(`http://127.0.0.1:${address.port}/`, { waitUntil: "domcontentloaded" });
+  await page.locator("#tab-main").waitFor({ state: "visible" });
+  assert.deepEqual(runtimeErrors, []);
+
   // --- Layout regressions -------------------------------------------------
   // Every fault below shipped at some point while the rest of this file
   // passed, because nothing here looked at geometry: a header whose height