fix(scanner): import useFocusTrap in ScanDisambiguationDialog #144

Merged

varutasu merged 1 commit from fix/scan-disambiguation-missing-import into main

2026-06-13 02:00:47 -04:00

varutasu commented

2026-06-13 01:47:40 -04:00

(Migrated from github.com)

Why

Production runtime ReferenceError on the scan flow:

```
ReferenceError: useFocusTrap is not defined
at ScanDisambiguationDialog (...)
at
```

The dialog only renders when OCR returns ambiguous matches, which is why the homepage smoke + visual baselines never caught it — the dialog mount path is reachable only via a real scan-with-multiple-candidates flow.

What

`components/ScanDisambiguationDialog.js` calls `useFocusTrap(...)` on line 14 but never imports it. The file previously had `import { useRef } from 'react'` (unused since PR #67 / `071a3dc` swapped the inline ref-management for the hook). The `useFocusTrap` named import from `lib/use-focus-trap.js` was never added.

```diff
-import { useRef } from 'react';
+import { useFocusTrap } from '../lib/use-focus-trap';
```

Parallel to how `components/ui/Modal.js` imports the OTHER named export (`useFocusTrapContainer`, exposed as the default) — see Modal.js:3 + use-focus-trap.js:21 (`export function useFocusTrap`) / :87 (`export default function useFocusTrapContainer`).

Why didn't lint catch this?

The project's flat ESLint config does NOT extend `@eslint/js`'s `recommended` rule set, so the core `no-undef` rule is OFF. The `eslint-plugin-react` rule `react/jsx-no-undef` only catches undefined JSX components, not plain JS identifier references.

`npx eslint components/ScanDisambiguationDialog.js` against the pre-fix file: 0 problems.

Followup queued: `enable-no-undef-eslint-rule` — add `@eslint/js`'s `recommended` to the flat config (or just enable `no-undef` directly), audit the existing 122-file codebase for false positives (likely few because the rule pairs cleanly with module-scoped imports), and ship. Out of scope for this hotfix to keep the PR diff tight.

Test plan

`npm run lint` — clean (1 pre-existing unrelated warning)
`npm run test:run` — 123 tests (24 files) pass
CI on this PR
Post-merge smoke (NOT in CI): scan a card whose OCR result has multiple candidates; confirm the disambiguation modal renders without console errors and focus is trapped inside the panel.

Made with Cursor

## Why Production runtime ReferenceError on the scan flow: \`\`\` ReferenceError: useFocusTrap is not defined at ScanDisambiguationDialog (...) at <react render path> \`\`\` The dialog only renders when OCR returns ambiguous matches, which is why the homepage smoke + visual baselines never caught it — the dialog mount path is reachable only via a real scan-with-multiple-candidates flow. ## What \`components/ScanDisambiguationDialog.js\` calls \`useFocusTrap(...)\` on line 14 but never imports it. The file previously had \`import { useRef } from 'react'\` (unused since PR #67 / \`071a3dc\` swapped the inline ref-management for the hook). The \`useFocusTrap\` named import from \`lib/use-focus-trap.js\` was never added. \`\`\`diff -import { useRef } from 'react'; +import { useFocusTrap } from '../lib/use-focus-trap'; \`\`\` Parallel to how \`components/ui/Modal.js\` imports the OTHER named export (\`useFocusTrapContainer\`, exposed as the default) — see Modal.js:3 + use-focus-trap.js:21 (\`export function useFocusTrap\`) / :87 (\`export default function useFocusTrapContainer\`). ## Why didn't lint catch this? The project's flat ESLint config does NOT extend \`@eslint/js\`'s \`recommended\` rule set, so the core \`no-undef\` rule is OFF. The \`eslint-plugin-react\` rule \`react/jsx-no-undef\` only catches undefined JSX *components*, not plain JS identifier references. \`npx eslint components/ScanDisambiguationDialog.js\` against the pre-fix file: 0 problems. **Followup queued:** \`enable-no-undef-eslint-rule\` — add \`@eslint/js\`'s \`recommended\` to the flat config (or just enable \`no-undef\` directly), audit the existing 122-file codebase for false positives (likely few because the rule pairs cleanly with module-scoped imports), and ship. Out of scope for this hotfix to keep the PR diff tight. ## Test plan - [x] \`npm run lint\` — clean (1 pre-existing unrelated warning) - [x] \`npm run test:run\` — 123 tests (24 files) pass - [ ] CI on this PR - [ ] Post-merge smoke (NOT in CI): scan a card whose OCR result has multiple candidates; confirm the disambiguation modal renders without console errors and focus is trapped inside the panel. Made with [Cursor](https://cursor.com)

vercel[bot] commented

2026-06-13 01:47:43 -04:00

(Migrated from github.com)

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
tcg-vault	Ready	Preview, Comment	Jun 13, 2026 5:47am

[vc]: #cAT5PgdXAhVwahMr+Etd+o0kmZIuR7XkxH7cRQ6RTP0=:eyJpc01vbm9yZXBvIjp0cnVlLCJ0eXBlIjoiZ2l0aHViIiwicHJvamVjdHMiOlt7Im5hbWUiOiJ0Y2ctdmF1bHQiLCJwcm9qZWN0SWQiOiJwcmpfRjZXOEVvRkd3Y0g3aWVGcnRvRlNlOXdVVkFhNSIsImxpdmVGZWVkYmFjayI6eyJyZXNvbHZlZCI6MCwidW5yZXNvbHZlZCI6MCwidG90YWwiOjAsImxpbmsiOiJ0Y2ctdmF1bHQtZ2l0LWZpeC1zY2FuLWRpc2FtLTUxNTZlMC1yYW5kYWxsLXN0aWxsd2VsbHMtcHJvamVjdHMudmVyY2VsLmFwcCJ9LCJpbnNwZWN0b3JVcmwiOiJodHRwczovL3ZlcmNlbC5jb20vcmFuZGFsbC1zdGlsbHdlbGxzLXByb2plY3RzL3RjZy12YXVsdC81eDNUcWRZY3lCNkJxS3VkdGJFRW1tQ2dwMXBXIiwicHJldmlld1VybCI6InRjZy12YXVsdC1naXQtZml4LXNjYW4tZGlzYW0tNTE1NmUwLXJhbmRhbGwtc3RpbGx3ZWxscy1wcm9qZWN0cy52ZXJjZWwuYXBwIiwibmV4dENvbW1pdFN0YXR1cyI6IkRFUExPWUVEIn1dLCJyZXF1ZXN0UmV2aWV3VXJsIjoiaHR0cHM6Ly92ZXJjZWwuY29tL3ZlcmNlbC1hZ2VudC9yZXF1ZXN0LXJldmlldz9vd25lcj1zdHdsLWxhYnMmcmVwbz10Y2ctdmF1bHQmcHI9MTQ0In0= The latest updates on your projects. Learn more about [Vercel for GitHub](https://vercel.link/github-learn-more). | Project | Deployment | Actions | Updated (UTC) | | :--- | :----- | :------ | :------ | | [tcg-vault](https://vercel.com/randall-stillwells-projects/tcg-vault) | ![Ready](https://vercel.com/static/status/ready.svg) [Ready](https://vercel.com/randall-stillwells-projects/tcg-vault/5x3TqdYcyB6BqKudtbEEmmCgp1pW) | [Preview](https://tcg-vault-git-fix-scan-disam-5156e0-randall-stillwells-projects.vercel.app), [Comment](https://vercel.live/open-feedback/tcg-vault-git-fix-scan-disam-5156e0-randall-stillwells-projects.vercel.app?via=pr-comment-feedback-link) | Jun 13, 2026 5:47am | <a href="https://vercel.com/vercel-agent/request-review?owner=stwl-labs&repo=tcg-vault&pr=144" rel="noreferrer"><picture><source media="(prefers-color-scheme: dark)" srcset="https://agents-vade-review.vercel.sh/request-review-dark.svg"><source media="(prefers-color-scheme: light)" srcset="https://agents-vade-review.vercel.sh/request-review-light.svg"><img src="https://agents-vade-review.vercel.sh/request-review-light.svg" alt="Request Review"></picture></a>

github-actions[bot] commented

2026-06-13 01:50:25 -04:00

(Migrated from github.com)

Pipeline Health

Build + CI gates

Gate	Status
Vercel build (Preview)	✅ pass
CI: Lint	✅ pass
CI: Schema map fresh	❌ skipped
Preview smoke	✅ pass
Visual diff	✅ pass

Build runs on Vercel; this CI runs lint and schema-map drift only (no duplicate build).

Role reports

Role	Status
Reviewer report	⏳ pending
A11y audit	⏳ pending
Design system audit	⏳ pending

See individual comments above for details. This rollup updates automatically.

## Pipeline Health ### Build + CI gates | Gate | Status | | --- | --- | | Vercel build (Preview) | ✅ pass | | CI: Lint | ✅ pass | | CI: Schema map fresh | ❌ skipped | | Preview smoke | ✅ pass | | Visual diff | ✅ pass | _Build runs on Vercel; this CI runs lint and schema-map drift only (no duplicate build)._ ### Role reports | Role | Status | | --- | --- | | Reviewer report | ⏳ pending | | A11y audit | ⏳ pending | | Design system audit | ⏳ pending | See individual comments above for details. This rollup updates automatically.

github-actions[bot] commented

2026-06-13 01:58:48 -04:00

(Migrated from github.com)

Visual Diff

Screenshots and diffs uploaded as artifacts: view run

If intentional changes: update snapshots locally with npx playwright test --project=visual --update-snapshots and commit.

## Visual Diff Screenshots and diffs uploaded as artifacts: [view run](https://github.com/stwl-labs/tcg-vault/actions/runs/27458233546) If intentional changes: update snapshots locally with `npx playwright test --project=visual --update-snapshots` and commit.