fix: address Copilot review findings on PR #70

- handler.go: /bx clears the active-box cookie whenever the cookie is
  present, not only when it resolves to an enabled box. Otherwise a
  stale cookie (referencing a deleted/disabled box) survives and the
  first-login auto-select stays blocked because hasCookieSet remains
  true.
- base.templ: encodeGearsJSON now filters out disabled gears server-
  side, matching its own comment. Reduces payload and keeps the
  command palette catalog free of empty entries.
- bx/pages.templ: drop the duplicate <link rel=stylesheet> for
  datagrid.css — layouts.Base already includes it globally. Add
  aria-label="Filter boxes view" to #bx-view-filter so screen readers
  announce it unambiguously.
- shortcut-help.js: SHORTCUTS entries gain an explicit `join` field
  ("+" for chord, "then" for sequence, "/" for either-of). The old
  separator logic always emitted a single space regardless of
  intent — chords like Cmd+K rendered as "Cmd K". Also extend the Esc-
  overlay-exemption check to cover the narrow-viewport Filters sheet
  (.filters-open on #header-page-content) and the sidebar's right-
  click context menu — pressing Esc to close those used to fall
  through to history.back().

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: sarg3nt

gearbox/internal/framework/handler/handler.go

@@ -384,12 +384,17 @@ func (h *Handler) InjectIntegrationStatus(next http.Handler) http.Handler {
 			}
 		}
 		if r.URL.Path == "/bx" || r.URL.Path == "/bx/" {
-			// /bx is the all-boxes view — clear any sticky selection so the
-			// chip reads "All boxes" and the sidebar hides box-scoped gears.
-			if activeBox != nil {
+			// /bx is the all-boxes view — clear any sticky selection so
+			// the chip reads "All boxes" and the sidebar hides box-scoped
+			// gears. Clear whenever the cookie is present, not just when
+			// it resolved to an enabled box: otherwise a stale cookie
+			// (referencing a deleted/disabled box) survives indefinitely
+			// AND blocks the first-login auto-select branch below
+			// because hasCookieSet stays true.
+			if hasCookieSet {
 				clearActiveBoxCookie(w, r)
-				activeBox = nil
 			}
+			activeBox = nil
 		}
 		if activeBox != nil {
 			ctx = auth.SetSelectedBox(ctx, activeBox)

gearbox/internal/framework/templates/layouts/base.templ

@@ -94,6 +94,9 @@ func encodeGearsJSON(ctx context.Context) string {
 	integrations, ok := auth.GetGearOrderFromContext(ctx)
 	if ok {
 		for _, i := range integrations {
+			if !i.Enabled {
+				continue
+			}
 			if !canViewIntegration(ctx, i.Name) {
 				continue
 			}

gearbox/internal/gears/bx/pages.templ

@@ -37,7 +37,6 @@ type IndexPageData struct {
 
 templ IndexPage(d IndexPageData) {
 	@layouts.Base("Boxes", d.User, "/bx") {
-		<link rel="stylesheet" href="/static/css/components/datagrid.css"/>
 		<div class="px-6 py-6">
 			@pageHeader(d.Total)
 			if d.Total == 0 {
@@ -78,6 +77,7 @@ templ pageHeader(total int) {
 			</div>
 			<select
 				id="bx-view-filter"
+				aria-label="Filter boxes view"
 				class="datagrid-view-filter"
 				onchange="window.bxOnViewFilterChange && window.bxOnViewFilterChange(this.value)"
 			>

gearbox/static/js/common/shortcut-help.js

@@ -12,13 +12,17 @@
 (function () {
     'use strict';
 
+    // `join` controls the visual separator between kbd chips for
+    // multi-key shortcuts: '+' for a chord (press together), 'then' for
+    // a sequence (press in order), '/' for "either of these keys".
+    // Single-key rows leave `join` unset and render no separator.
     const SHORTCUTS = [
         { keys: ['?'],                    label: 'Show this help' },
-        { keys: ['Cmd/Ctrl', 'K'],        label: 'Open command palette' },
-        { keys: ['g', 'b'],               label: 'Switch box (palette)' },
+        { keys: ['Cmd/Ctrl', 'K'],        label: 'Open command palette',                              join: '+' },
+        { keys: ['g', 'b'],               label: 'Switch box (palette)',                              join: 'then' },
         { keys: ['/'],                    label: 'Focus the page search input' },
         { keys: ['Esc'],                  label: 'Close dialog · or blur input · or go back' },
-        { keys: ['↑', '↓'],               label: 'Navigate dialog items' },
+        { keys: ['↑', '↓'],               label: 'Navigate dialog items',                             join: '/' },
         { keys: ['↵'],                    label: 'Select highlighted item' },
         { keys: ['Tab'],                  label: 'Cycle focus within a dialog' },
         { keys: ['Ctrl+↵'],               label: 'In palette: switch box but keep palette open' },
@@ -42,11 +46,10 @@
             const keys = document.createElement('span');
             keys.className = 'flex items-center gap-1';
             s.keys.forEach(function (k, i) {
-                if (i > 0 && (s.keys.length > 1)) {
-                    // Inter-key separator: "+" for chord, " then " for sequence.
+                if (i > 0 && s.join) {
                     const sep = document.createElement('span');
-                    sep.className = 'text-[10px] text-white/40 px-0.5';
-                    sep.textContent = (k === '↓' || k === '↑' || /^[A-Z]$/.test(s.keys[0])) ? ' ' : ' ';
+                    sep.className = 'text-[10px] text-white/50 px-0.5';
+                    sep.textContent = s.join;
                     keys.appendChild(sep);
                 }
                 const kbd = document.createElement('kbd');
@@ -130,6 +133,19 @@
                 const el = document.getElementById(ids[i]);
                 if (el && !el.classList.contains('hidden')) return true;
             }
+            // Narrow-viewport Filters sheet popped out under the header
+            // (`.filters-open` on #header-page-content). Treat as an
+            // overlay so pressing Esc to close it doesn't fall through
+            // to history.back().
+            const headerContent = document.getElementById('header-page-content');
+            if (headerContent && headerContent.classList.contains('filters-open')) {
+                return true;
+            }
+            // Right-click "Reorder gears" context menu on the sidebar.
+            const ctxMenu = document.getElementById('sidebar-context-menu');
+            if (ctxMenu && !ctxMenu.classList.contains('hidden')) {
+                return true;
+            }
             return false;
         }
         function isBlurrableTarget(el) {