feat: language dropdown enhancements#16010
Conversation
JoeChenJ
requested review from
corwintines,
minimalsm,
pettinarip and
wackerow
as code owners
github-actions
Bot
added
content 🖋️
✅ Deploy Preview for ethereumorg canceled.
|
| key={language.langCode} | ||
| value={language.langCode} | ||
| className={!isVisible ? "hidden" : ""} | ||
| > |
There was a problem hiding this comment.
Using hidden here instead of filtering the array directly, to avoid SelectValue losing its value and in turn leads to Input losing focus when searchQuery changes
wackerow
left a comment
wackerow
left a comment
There was a problem hiding this comment.
Thanks @JoeChenJ!
Couple things I'm noticing on initial glance:
Seeing a layout bug (Brave and Safari) with space above the input which looks poor visually.
Also, in my opinion, focus should be set to the search input upon entering that menu. Should be able to click once and start typing, and ideally "enter" executes top match (feel free to weigh in if you disagree @konopkja)
Right now when I click, I can't even tab into that field by keyboard, which we should be able to for good a11y.
|
Thanks for the feedback @wackerow! Just pushed a commit for those issues. I also noticed the same issues in the wallet dropdown on layer-2/networks page. Should I fix that here as well or open another pr? |
|
Hey @JoeChenJ! Sorry for delay, yes please =) A fix for that would be great, but to your point, let's do that in a separate PR. This looks better, and it's auto-focusing to the input when the menu is clicked... perhaps it's a "nice-to-have", but I'm not able to keyboard navigate with down/up arrows to select my desired option, but it DOES allow me to press "enter" to select the top result when filtering. I don't see that as a blocker, but will ask @konopkja to chime in if there is any preference |
|
@all-contributors please add @JoeChenJ for code |
2 participants
Description
Preview Link
https://deploy-preview-16010--ethereumorg.netlify.app/en/wallets/find-wallet/
Related Issue
Closes #15997