Add keyboard shortcut ("/" key) to focus search input #380
Conversation
This commit introduces a new feature that allows users to focus the search input by pressing the "/" key on the keyboard. Upon pressing "/", the search input will be automatically selected, improving accessibility and user experience within the GraphQL Voyager interface.
|
Hi @IvanGoncharov, Can you please review this PR and let me know if there is any issue? |
There was a problem hiding this comment.
@navidadelpour Good idea 👍
Thank you for PR.
Since we heavily depend on MUI we should use their component to handle hotkeys.
I did a quick googling and found this:
https://github.com/mui/material-ui/pull/10725/files
Can please try the same approach in Voyager?
|
@IvanGoncharov thanks for reviewing. I will definitely check that in the next couple of days and let you know when it is updated. |
|
@IvanGoncharov Hi, I Updated the PR and it's much more simpler. thanks for guidance. I didn't installed the Also, as I was checking the PR#10725 you've sent and MUI code, I realized that this PR is not actually merged to the main branch right now. they are using @docsearch/react package and the way the package is implementing this feature is here. Can you please review again? |
|
@navidadelpour can you actually run tests and lint on your branch? PR tests for linting are failing |
|
Hi @LunaticMuch Thanks for reminding me. I should have run them before my push! Would you please check again? |
Overview
This pull request adds a keyboard shortcut ("/" key) functionality in GraphQL Voyager, enabling users to focus on the search input. This enhancement aims to improve accessibility and empower users to search without relying on mouse interactions.