ENG-2184 Add search to the settings panel

[trangdoan982]

Reviewer brief

• Result: A search field at the top of the settings rail matches settings by name, section/group and description, and jumps to the matching row wherever it currently lives — including per-node-type settings behind the Grammar › Nodes drill-down. Tabs are offered as their own result kind, so "export" reaches the Export page even though no setting is named that.

• Stacked on ENG-2213 Settings catalog: address every setting by key and location #1379 (ENG-2213), which records what every setting is called and where it lives. This PR is only the search layer that reads it: ranking, the field, and the jump.

• Review focus — two Blueprint behaviours the code works around, both load-bearing.

  • The results are a portalled Popover rather than an in-flow dropdown, because the field renders inside Blueprint's tab list, which Settings.tsx styles overflow-y: auto; overflow-x: hidden — an in-flow panel is clipped on both axes.
  • The popover paints its own background, radius and shadow instead of inheriting Blueprint's. Roam ships its own Blueprint build and themes .bp3-popover; inheriting the default renders the panel fully transparent with the rail showing through it. This was only visible in Roam itself, not in isolation.
  • flip and preventOverflow are disabled deliberately: the rail sits at the window edge, so Blueprint's overflow handling pushed the panel off the left of the dialog.

• Review focus — the jump retries by frame. The target row is not in the DOM when the jump is dispatched: renderActiveTabPanelOnly means the destination panel mounts on a later commit, and a row inside a Collapse mounts later still. useSettingAnchorScroll therefore polls by animation frame until the row appears or a ~500ms budget runs out, then degrades to leaving the user on the right page. A single lookup would silently miss.

• Risk or follow-up:

  • No tests. Ranking tiers, node-type expansion and availability gating are unverified by CI.
  • Not verified in Roam: the transparency fix itself. Roam stopped re-registering the developer extension after the reload needed to pick up the new CSS. Worth one manual look — open settings, type anything, confirm the panel has a solid background.
  • Escape stops propagation only while the query is non-empty, so a first Escape clears the search and a second closes the dialog. Intentional, and easy to read as a bug.

Verification

Manual and local only.

• pnpm ci:validate (check-types + 142 unit tests) and eslint on the changed files — 0 errors, no new warnings on added lines.
• Driven in a real Roam graph on this build (version stamp …eng-2184-add-search-to-the-settings-panel): the field renders in the rail and returns correct labels and breadcrumbs. That run is what caught the transparent popover.
• Position, contrast and keyboard scrolling were measured in a throwaway browser harness that mounted the real component inside a real vertical Blueprint Tabs carrying the same overflow rules as Settings.tsx. Measured: opaque 340px surface; opens rightward from the field's left edge; active-row breadcrumb at 4.53:1 on Blueprint's #137CBD (80% opacity measured 3.49:1, below AA — hence full white); ArrowDown scrolls the active row into view. The harness was not kept.

Scope check

• Ran $scope-check against the ENG ticket and final diff.
• Scope beyond Done When:
  • Description matching. The ticket scoped this out; requested during implementation. The text lives on the ENG-2213 entry, so search and the row read the same string.
  • Dead settingAnchorId export removed — added earlier in this branch's history, never used.

Local delegated full review

• Ran a comprehensive review of the entire final diff in a subagent with a fresh context.

[linear-code]

ENG-2184

[graphite-app]

PR size/scope check

This PR is over our review-size guideline.

• Recommended: ~200 lines changed
• Acceptable limit: up to 400 lines when well-scoped/self-contained
• Preferred file count: fewer than 5 files

Please split this into smaller PRs unless there is a clear reason the changes need to land together.

If keeping it as one PR, please add a brief justification covering:

• What single problem this PR solves
• Why the files/changes are coupled

[vercel]

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

1 Skipped Deployment

Project	Deployment	Actions	Updated
discourse-graph	Skipped		Sep 5, 2026 11:12pm UTC

[supabase]

This pull request has been ignored for the connected project zytfjzqyijgagqxrzbmz because there are no changes detected in packages/database/supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[devin-ai-integration]

Devin Review found 2 potential issues.

1 flag not posted on this PR by your GitHub settings — view it in Devin Review. (Configure)