From 20e17c0ccbe8d72df3f4963bb4ca3646509f4182 Mon Sep 17 00:00:00 2001 From: npeter83 Date: Sat, 5 Sep 2026 23:52:29 +0200 Subject: [PATCH] =?UTF-8?q?fix(e10):=20review=20round=201=20=E2=80=94=20th?= =?UTF-8?q?e=20boundary=20that=20did=20not=20bind,=20and=2014=20more?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The epic-end review found 32 verified issues. This is the first fix round: the three highs, the user-facing mediums, and the tests that were passing for the wrong reason. Docs and the remaining low-severity tail are next. The boundary rule was the worst of them. Both `no-restricted-imports` regexes were written in plain "..." literals, where `\.` is an unknown escape that collapses to the any-char `.` — so the rule read like a boundary and matched far less than one. `../../lib/api` (the barrel every feature component imports) and `../../components/Feed` (the same file `../Feed` names) both sailed through a green gate. String.raw, a third pattern for the second spelling, and a vitest over ESLint.lintText so a rule that silently matches nothing can never look like a clean codebase again. closeThenNavigate waited for exactly one reclaim popstate. With a second Back-closable layer still mounted — a palette opened over the player — the navigation unmounted that layer too, and its reconcile backed over the entry the navigation had just pushed: "go to Channels" closed the player and landed on the feed. It now waits for the LAST programmatic back, then adopts the entries the navigation buried, and falls back after 250ms rather than hanging if no popstate is ever coming. The rail's inline rename died on arrival. With no domReference, floating- ui's returnFocus falls through to a module-global stack and restores some unrelated element from an earlier popover — blurring the field into its own commit-and-close, from the second popover of a session onward. The context menu now owns the restore: back to the row, but only if the row is still there and nothing else has claimed focus. Also: - Backspace under the cheat sheet stopped Plex playback and dropped to the grid; `back` now defers to any layer above, like `escape` beside it. - A move invalidated only the source list, so the target kept serving pre-move contents for 30s while the rail already counted N+1. - Every move error a user can reach is a 404, which `req` leaves to the caller — so the row snapped back in silence and the shipped moveErrors strings were unreachable. - swallowClick armed on long-press but was disarmed only by the click it was armed for; any press that produced no click ate the next tap on the whole list. - The context menu stayed parked over whatever row scrolled under it. - overflow-clip on the chip lanes ate the focus ring's top and bottom. - "Why is this off" rode on disabled rows, which show no tooltip and take no focus: a new `inert` item keeps the reason readable. - Shift+F10 was advertised app-wide but wired only on Playlists; it has its own scope now, and useContextMenu matches through the shared parser instead of its own literals. - Mod+K could not close the palette, `h` machine-gunned on auto-repeat, and both were bound above the branch that mounts their overlays. - Palette options were in the tab order under aria-activedescendant, and a scroll-synthesised mousemove stole the keyboard selection. - The OSD live region was created together with its own text. - Ending a rename stranded focus on . - The Button variants' hover halves are `enabled:` — the one migrated site that had guarded its own lost the guard on the way in. - HU builtinLocked named the list "Watch later" in a Hungarian sentence. Tests: the chip-lane contract counted per FILE, so a second hand-rolled lane in an already-compliant file was invisible; the closeThenNavigate ordering test only passed on a popstate left behind by its neighbours and failed alone, so it moved to its own file. --- frontend/eslint.config.js | 17 ++++- frontend/src/App.tsx | 8 +- frontend/src/components/Messages.tsx | 6 ++ frontend/src/components/Playlists.tsx | 30 ++++++-- frontend/src/components/PlaylistsRail.tsx | 45 +++++++++-- frontend/src/components/PlexPlayer.tsx | 28 +++++-- frontend/src/components/ui/ActionMenu.tsx | 13 +++- .../src/components/ui/AnchoredPopover.tsx | 22 +++++- frontend/src/components/ui/Button.tsx | 23 ++++-- .../components/ui/CommandPalette.dom.test.tsx | 19 ++--- .../ui/CommandPalette.ordering.dom.test.tsx | 67 +++++++++++++++++ frontend/src/components/ui/CommandPalette.tsx | 18 ++++- .../components/ui/KeyboardHelp.dom.test.tsx | 23 +++++- frontend/src/components/ui/UndoToolbar.tsx | 5 +- frontend/src/components/ui/useContextMenu.ts | 75 ++++++++++++++++++- frontend/src/i18n/locales/en/playlists.json | 2 +- frontend/src/i18n/locales/hu/playlists.json | 2 +- frontend/src/lib/chipLane.contract.test.ts | 48 ++++++++---- frontend/src/lib/history.dom.test.ts | 51 +++++++++++++ frontend/src/lib/history.ts | 29 ++++++- frontend/src/lib/keymap.ts | 47 ++++++++++-- frontend/src/lib/uiBoundary.contract.test.ts | 63 ++++++++++++++++ frontend/src/lib/useChipOverflowFit.ts | 10 ++- 23 files changed, 562 insertions(+), 89 deletions(-) create mode 100644 frontend/src/components/ui/CommandPalette.ordering.dom.test.tsx create mode 100644 frontend/src/lib/uiBoundary.contract.test.ts diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js index 88a51850..7a85a064 100644 --- a/frontend/eslint.config.js +++ b/frontend/eslint.config.js @@ -78,16 +78,29 @@ export default tseslint.config( "no-restricted-imports": [ "error", { + // NOTE the String.raw: these are REGEX sources, and in a plain "..." literal `\.` is an + // unknown escape that collapses to a bare `.` — the any-char wildcard. The first cut of + // this rule shipped that way and matched far less than it read like (E10 review round 1). patterns: [ { // `../X` (exactly one level up = a feature component). A `regex` rather than a glob: // eslint matches `patterns` gitignore-style, where `../*` also swallows `../../lib/x`. - regex: "^\.\./(?!\.\./)", + regex: String.raw`^\.\./(?!\.\./)`, message: "components/ui/ is domain-free: a platform component may not import a feature component. Invert the dependency (take a prop/render-prop) or keep the component outside ui/.", }, { - regex: "^\.\./\.\./lib/api/", + // The same file by its OTHER spelling. `../../components/Feed` resolves exactly where + // `../Feed` does, so the rule above is only half the boundary; `ui/` is carved out + // because a sibling primitive is the one thing this path may legitimately name. + regex: String.raw`^\.\./\.\./components/(?!ui/)`, + message: + "components/ui/ is domain-free: a platform component may not import a feature component. Invert the dependency (take a prop/render-prop) or keep the component outside ui/.", + }, + { + // `(/|$)` so the BARREL counts too: `../../lib/api` is the spelling every feature + // component uses, and a `/`-anchored pattern let exactly that one through. + regex: String.raw`^\.\./\.\./lib/api(/|$)`, message: "components/ui/ is domain-free: a platform component may not call a domain API slice. Take the data as props.", }, diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 9a0f239b..7fdb2b6e 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -59,9 +59,6 @@ export default function App() { const { t, i18n } = useTranslation(); const { page, channelView, ytSearch } = useNavigation(); const { setPage, enterYtSearch } = useNavigationActions(); - // The `global` key scope, bound once for the whole app: `h` opens the cheat sheet, Mod+K the - // jump-to palette (both rendered at the bottom of this tree). - useGlobalKeymap(); // An emailed verification link is confirmed HERE, above the signed-in/signed-out branch below, so // it works in a browser that already holds a session. It used to be handled inside Welcome, which // that branch never renders when signed in — the token was silently dropped. Signed out, the @@ -140,6 +137,11 @@ export default function App() { refetchInterval: (query) => (query.state.data ? 60_000 : false), }); + // The `global` key scope: `h` opens the cheat sheet, Mod+K the jump-to palette. Bound only once + // signed in, because that is where both overlays are mounted (bottom of this tree) — see + // useGlobalKeymap on why binding it above the signed-out branch is worse than not binding it. + useGlobalKeymap(!!meQuery.data); + // Pin this tab to whatever account it first loaded as. Without this, a tab that never picked // an account (it was riding the session's default) would silently swap identity when ANOTHER // tab changes the default — e.g. that other tab adds/switches an account. Once pinned, this diff --git a/frontend/src/components/Messages.tsx b/frontend/src/components/Messages.tsx index b61695bc..687b7661 100644 --- a/frontend/src/components/Messages.tsx +++ b/frontend/src/components/Messages.tsx @@ -214,6 +214,9 @@ function Directory({ onPick, onBack }: { onPick: (u: MessageUser) => void; onBac