From 83d6c15bbc2906e4654d988c7c55e68a21617240 Mon Sep 17 00:00:00 2001 From: Randall Stillwell Date: Sat, 13 Jun 2026 00:46:00 -0500 Subject: [PATCH] fix(scanner): import useFocusTrap in ScanDisambiguationDialog MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Production runtime ReferenceError on the scan flow: ReferenceError: useFocusTrap is not defined at ScanDisambiguationDialog (...) `components/ScanDisambiguationDialog.js` calls `useFocusTrap(...)` on line 14 but never imports it. The file previously had `import { useRef } from 'react'` (unused since the focus-trap refactor in PR #67 `071a3dc`); the `useFocusTrap` import was never added when the hook was introduced. The bug only manifests at runtime when the scan flow reaches a disambiguation result (i.e. when the OCR/match returns multiple candidate cards), which is why neither smoke nor visual diff caught it — the dialog never renders in the homepage smoke path. Lint also missed it because the project's flat ESLint config does NOT extend `eslint:recommended` / `@eslint/js`'s `no-undef` rule. The `react/jsx-no-undef` rule catches undefined JSX components but not plain JS identifier references. Hardening that gap is the queued `enable-no-undef-eslint-rule` follow-up — out of scope for this hotfix. Replaces the dead `useRef` import with the missing `useFocusTrap` named import from `lib/use-focus-trap.js` (parallel to how `components/ui/Modal.js` imports `useFocusTrapContainer` as the default export — see Modal.js:3 + use-focus-trap.js:21 / :87 for the two-export shape). Test plan: - [x] `npm run lint` — clean (1 pre-existing unrelated warning) - [x] `npm run test:run` — 123 tests pass (24 files) - [ ] CI on this PR - [ ] Post-merge: re-trigger a scan that disambiguates (ambiguous OCR hit) and confirm the modal renders without console errors. Co-authored-by: Cursor --- components/ScanDisambiguationDialog.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/ScanDisambiguationDialog.js b/components/ScanDisambiguationDialog.js index b6d72ac..c8d6883 100644 --- a/components/ScanDisambiguationDialog.js +++ b/components/ScanDisambiguationDialog.js @@ -1,5 +1,5 @@ /* eslint-disable @next/next/no-img-element -- external Scryfall/card CDN URLs */ -import { useRef } from 'react'; +import { useFocusTrap } from '../lib/use-focus-trap'; /** * Modal for picking among multiple catalog matches after a scan.