From 92697b11c5a8d0ac9932bd907e4fbdda17c8f6aa Mon Sep 17 00:00:00 2001 From: Stan Grams Date: Mon, 3 Aug 2026 00:23:17 +0200 Subject: [PATCH] [feat](trx-frontend-http): mark Tools active for its destinations Grouping Statistics, Recorder, Settings and About behind Tools left the tab strip looking identical on all four: the destination's own button carries the active class, but the strip hides that button, so nothing was marked. The page titles named the page without saying how you got there. Mark the Tools button when the active destination is one the strip hides. That state is read from the button's computed display rather than from a second copy of the grouping, so the two cannot drift: whatever ui-core puts in the menu lights up Tools, and a destination promoted back into the strip stops doing so with no further change. Tools already carries the tab class, so the existing active styling applies unchanged. Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_01GdyUjuXejCEfiub675z6cz Signed-off-by: Stan Grams --- .../trx-frontend-http/assets/web/generated/app.js | 2 ++ .../trx-frontend/trx-frontend-http/frontend/src/app.ts | 6 ++++++ 2 files changed, 8 insertions(+) diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/app.js b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/app.js index 820471f7..e3ccf263 100644 --- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/app.js +++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/generated/app.js @@ -5592,6 +5592,8 @@ function navigateToTab(name, options = {}) { _activeTab = name; 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"); 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}`); diff --git a/src/trx-client/trx-frontend/trx-frontend-http/frontend/src/app.ts b/src/trx-client/trx-frontend/trx-frontend-http/frontend/src/app.ts index 1ee99d46..2d04143a 100644 --- a/src/trx-client/trx-frontend/trx-frontend-http/frontend/src/app.ts +++ b/src/trx-client/trx-frontend/trx-frontend-http/frontend/src/app.ts @@ -4600,6 +4600,12 @@ function navigateToTab(name: TabName, options: { updateHistory?: boolean; replac _activeTab = name; document.querySelectorAll(".tab-bar .tab").forEach((t) => t.classList.remove("active")); 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. + const toolsBtn = document.getElementById("mobile-more-btn"); + if (toolsBtn) toolsBtn.classList.toggle("active", getComputedStyle(btn).display === "none"); 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}`);