Skip to content

Refactor search bar menu width to use Popover sameWidth#3514

Open
tom2drum wants to merge 2 commits into
mainfrom
tom2drum/search-bar-menu
Open

Refactor search bar menu width to use Popover sameWidth#3514
tom2drum wants to merge 2 commits into
mainfrom
tom2drum/search-bar-menu

Conversation

@tom2drum
Copy link
Copy Markdown
Collaborator

@tom2drum tom2drum commented Jun 8, 2026

Description and Related Issue(s)

Refactors search bar dropdown positioning to use Chakra Popover's built-in sameWidth positioning instead of manually tracking input width with a ResizeObserver.

Proposed Changes

  • Remove manual ResizeObserver + debounced width calculation from SearchBarDesktop and SearchResultsInput
  • Use Popover positioning.sameWidth: true so the suggest/recent-keywords menu matches the trigger width
  • Simplify PopoverContent width styling (w="auto", maxW="100%") and drop the menuWidth ref
  • Restore input focus when selecting a recent keyword in the desktop search bar (handleRecentKeywordsClick)

Breaking or Incompatible Changes

None.

Additional Information

Net reduction of ~40 lines of layout-sync logic. Behavior should be unchanged aside from the recent-keywords focus fix on desktop.

Checklist for PR author

  • I have tested these changes locally.
  • I added tests to cover any new functionality, following this guide
  • Whenever I fix a bug, I include a regression test to ensure that the bug does not reappear silently.
  • If I have added a feature or functionality that is not privacy-compliant (e.g., tracking, analytics, third-party services), I have disabled it for private mode.
  • If I have added, changed, renamed, or removed an environment variable
    • I updated the list of environment variables in the documentation
    • I made the necessary changes to the validator script according to the guide
    • I added "ENVs" label to this pull request

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jun 8, 2026

Important

Review skipped

Auto reviews are disabled on this repository. To trigger a review, include @coderabbitai review in the PR description. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 0b1b34e9-74f8-41b0-b30a-04d2c35d62f8

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant