feat(shell): global back and forward in the top bar
The history stack has been global since the Android back gesture landed -- every navigation is an entry and `popstate` restores any of them in either direction. What the report describes as "back is tab-scoped" is that the only way back was a detail view's own button, which leaves the screen with the view it belongs to: click over to Tracks and the album you were reading is still one entry away with nothing on screen saying so. `<nav-history>` is that affordance, plus `nav.back` / `nav.forward` on Alt+Left / Alt+Right -- the browser's own combination, and clear of the bare arrows that seek, since a binding matches on its full canonical string. Forward is not back negated, which is why the old `pushedEntries` counter is gone rather than extended: `popstate` carries no direction and fires identically both ways, so one counter decremented on every pop reads a forward as a second back. Each entry carries its index and the shell keeps the current one and a high-water mark, which also survives a jump of more than one. The buttons dispatch the events the rest of the app already dispatches rather than calling `history` themselves -- the shell owns the guard that stops a press at the root leaving the app, and a second caller reaching for history is how the old `navStack` came to disagree with the platform. Below 900px the control stands down: the top bar is what runs out of room first below that, and nothing becomes unreachable -- the shortcuts are global at every width and the phone has the platform's gesture. Closes #6
This commit is contained in:
@@ -400,6 +400,20 @@ async function dispatch(action: string): Promise<void> {
|
||||
break;
|
||||
}
|
||||
|
||||
// The keyboard half of #6. It dispatches the same events the
|
||||
// header's buttons and the detail views' own back buttons do,
|
||||
// rather than calling `history.back()` here: the shell owns the
|
||||
// guard that stops a press at the root leaving the app, and a
|
||||
// second caller reaching for `history` directly is how the old
|
||||
// `navStack` came to disagree with the platform.
|
||||
case 'nav.back':
|
||||
document.dispatchEvent(new CustomEvent('navigate-back'));
|
||||
break;
|
||||
|
||||
case 'nav.forward':
|
||||
document.dispatchEvent(new CustomEvent('navigate-forward'));
|
||||
break;
|
||||
|
||||
case 'nav.queue': {
|
||||
const queuePanel = document.getElementById(
|
||||
'queue-panel',
|
||||
|
||||
@@ -103,6 +103,18 @@ export const SHORTCUT_META: Record<string, ShortcutMeta> = {
|
||||
scope: 'global',
|
||||
defaultKey: 'Q',
|
||||
},
|
||||
'nav.back': {
|
||||
label: 'Back',
|
||||
category: 'Navigation',
|
||||
scope: 'global',
|
||||
defaultKey: 'Alt+Left',
|
||||
},
|
||||
'nav.forward': {
|
||||
label: 'Forward',
|
||||
category: 'Navigation',
|
||||
scope: 'global',
|
||||
defaultKey: 'Alt+Right',
|
||||
},
|
||||
'app.shortcuts': {
|
||||
label: 'Keyboard Shortcuts',
|
||||
category: 'App',
|
||||
|
||||
Reference in New Issue
Block a user