Skip to content

fix(ui): make the auto-hidden topbar reachable without a mouse - #160

Draft
justraman wants to merge 6 commits into
mainfrom
rs/fix-92
Draft

fix(ui): make the auto-hidden topbar reachable without a mouse#160
justraman wants to merge 6 commits into
mainfrom
rs/fix-92

Conversation

@justraman

@justraman justraman commented Aug 12, 2026

Copy link
Copy Markdown
Contributor

Description

Fixes: #91
Once a verified desktop session logged in, the topbar slid away after 5s and the
only way back was hovering a 6px invisible strip at the top of the viewport.
Keyboard-only users lost home, settings, permissions and login for the rest of
the session, with no route back.
Two smaller problems in the same code path:

Changes

Auto-hide moves out of main.ts into packages/ui/src/topbar-autohide.ts, where
it can be unit tested. main.ts keeps only the auth/shield wiring
(armTopbarAutoHide on login, pinTopbarVisible on logout).

Keyboard access:

  • Document-level focusin reveals the bar when focus lands in #topbar or any
    surface it owns (user, settings, permissions popovers, pairing modal). The
    hidden bar keeps its tab stops on purpose, so tabbing into it is the reveal.
  • Alt+Shift+T toggles the bar. Revealing moves focus to the first control,
    hiding hands focus back to the app frame so it never parks off-screen.
    Advertised via aria-keyshortcuts while armed. Matched on event.code
    (with a key fallback) because macOS turns Option+Shift+T into a dead key.
  • An open popover or modal, or focus inside the bar, defers the hide instead of
    pulling the controls away mid-interaction.
  • #topbar gains role="banner" so it is reachable by landmark navigation.

@github-actions

Copy link
Copy Markdown
Contributor

⚡ Performance Report

⚠️ No baseline found on main. This PR's results are recorded but cannot be compared.
Merge to main to establish a baseline.

@github-actions

github-actions Bot commented Aug 12, 2026

Copy link
Copy Markdown
Contributor

Bundle Size Report

Chunks over 500 KB:

File Raw Brotli Gzip
host/assets/paseo.smol-DboPaEh1.json 1.84 MB 941.7 KB 1019.4 KB
host/assets/paseo-people-next.smol.json 3.36 MB 1.68 MB 1.82 MB
host/assets/previewnet.smol.json 547.1 KB 92.2 KB 101.2 KB
host/assets/smoldot.js 3.05 MB 2.27 MB (-5 B) 2.28 MB
host/assets/smoldot_worker.js 3.02 MB 2.26 MB 2.27 MB
host/assets/wasm/web/truapi_server_bg.wasm 7.06 MB 5.25 MB 5.52 MB
Total 19.88 MB (+9.3 KB) 12.80 MB (+2.3 KB) (-36%) 13.34 MB (+2.6 KB)
All files
File Raw Brotli Gzip
host/.well-known/apple-app-site-association 1.0 KB 1.0 KB 1.0 KB
host/.well-known/assetlinks.json 2.1 KB 343 B 427 B
host/assets/bridge.js 69.5 KB 19.0 KB (-26 B) 21.9 KB (-3 B)
host/assets/browser.js 22.9 KB 7.5 KB (-16 B) 8.6 KB
host/assets/client.js 100.1 KB 29.5 KB (+77 B) 32.4 KB (-1 B)
host/assets/dist.js 39.0 KB 12.8 KB (-5 B) 14.5 KB
host/assets/dotli-debug-bus.js 710 B 710 B 710 B
host/assets/get-sync-provider.js 2.8 KB 1.1 KB (-1 B) 1.2 KB
host/assets/hex.js 154 B 154 B 154 B
host/assets/index.css 47.4 KB (+326 B) 7.4 KB (+63 B) 8.3 KB (+51 B)
host/assets/index.js 201.9 KB (+2.4 KB) 50.4 KB (+676 B) 60.1 KB (+763 B)
host/assets/manifest.js 22.6 KB 7.2 KB (+4 B) 8.0 KB (-2 B)
host/assets/panel.js 76.2 KB 20.5 KB (-31 B) 23.2 KB (-4 B)
host/assets/paseo.smol-DboPaEh1.json 1.84 MB 941.7 KB 1019.4 KB
host/assets/paseo-people-next.smol.json 3.36 MB 1.68 MB 1.82 MB
host/assets/paseo.smol.json 23.4 KB 5.4 KB 6.2 KB
host/assets/previewnet.smol.json 547.1 KB 92.2 KB 101.2 KB
host/assets/resolve.js 156 B 156 B 156 B
host/assets/rpc-resolve.js 2.5 KB 1.0 KB (-1 B) 1.2 KB (-2 B)
host/assets/smoldot.js 3.05 MB 2.27 MB (-5 B) 2.28 MB
host/assets/smoldot_worker.js 3.02 MB 2.26 MB 2.27 MB
host/assets/spans.js 2.6 KB 1.1 KB 1.3 KB
host/assets/src.js 1.8 KB 846 B (-9 B) 946 B
host/assets/styles.css 15.3 KB 3.3 KB 3.8 KB
host/assets/wasm/web/README.md 11.9 KB 11.9 KB 11.9 KB
host/assets/wasm/web/package.json 371 B 371 B 371 B
host/assets/wasm/web/truapi_server.d.ts 8.1 KB 8.1 KB 8.1 KB
host/assets/wasm/web/truapi_server.js 38.2 KB 6.6 KB 7.6 KB
host/assets/wasm/web/truapi_server_bg.wasm 7.06 MB 5.25 MB 5.52 MB
host/assets/wasm/web/truapi_server_bg.wasm.d.ts 3.0 KB 3.0 KB 3.0 KB
host/assets/web.js 13.3 KB 3.6 KB (-5 B) 4.0 KB
host/assets/worker-runtime.js 6.4 KB (+6.3 KB) 1.7 KB (+1.5 KB) 1.8 KB (+1.7 KB)
host/assets/worker-runtime.js 106 B 106 B 106 B
host/assets/ws.js 23.1 KB 7.5 KB (-7 B) 8.2 KB (-1 B)
host/dotli.png 11.5 KB 11.5 KB 11.5 KB
host/favicon.svg 1.8 KB 1.8 KB 1.8 KB
host/host-sw.js 2.7 KB 1.1 KB (+6 B) 1.2 KB (-12 B)
host/icon-192.png 12.5 KB 12.5 KB 12.5 KB
host/icon-512.png 42.8 KB 42.8 KB 42.8 KB
host/index.html 24.0 KB (+46 B) 4.7 KB (+16 B) 5.7 KB (+19 B)
host/manifest.webmanifest 441 B 441 B 441 B
host/workbox.js 14.8 KB 4.6 KB 5.1 KB
sandbox/app-sw.js 9.7 KB 3.2 KB (+3 B) 3.6 KB (-1 B)
sandbox/assets/bitswap-bridge.js 840 B 840 B 840 B
sandbox/assets/fetch.js 3.4 KB 1.2 KB (-1 B) 1.4 KB (-1 B)
sandbox/assets/index.css 47.4 KB (+326 B) 7.4 KB (+63 B) 8.3 KB (+51 B)
sandbox/assets/index.js 120.4 KB 34.3 KB (-12 B) 40.4 KB (+1 B)
sandbox/favicon.svg 1.8 KB 1.8 KB 1.8 KB
sandbox/index.html 1.7 KB 580 B 787 B (+1 B)
Total 19.88 MB (+9.3 KB) 12.80 MB (+2.3 KB) (-36%) 13.34 MB (+2.6 KB)

Commit: f27c614

@github-actions

Copy link
Copy Markdown
Contributor

⚠️ E2E Product suite skipped — Nova signing bot is unavailable.

This is a Nova-side outage and not a dot.li test failure. Re-run
from the Actions tab once the bot recovers.

Logs: https://github.com/paritytech/dotli-community/actions/runs/31593345203

@github-actions

github-actions Bot commented Aug 14, 2026

Copy link
Copy Markdown
Contributor

E2E Product suite failed on 3cf496f85496cbf52cf96dd1f353e91ac71ecddf — 38 passed, 7 failed, 17 skipped.

Failed tests:

  • Get Product Account
  • Product Signer
  • Product Account Alias
  • All Allowances
  • As a product user, I can navigate within the current product
  • Query Balance
  • Sign Raw Message

Logs: https://github.com/paritytech/dotli-community/actions/runs/32022016269
Artifacts: e2e-product-results (uploaded above) — open the failed test's trace.zip with npx playwright show-trace.

@justraman
justraman marked this pull request as draft August 14, 2026 07:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Make the auto-hidden topbar recoverable by keyboard

1 participant