-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Emoji picker - Unable to navigate with arrow keys when there's text in search box #3858
Comments
Triggered auto assignment to @roryabraham ( |
Triggered auto assignment to @MitchExpensify ( |
Proposal
A similar thing is happening here, we already have arrow navigation for the Emojipicker but events are not bubbling so to fix this we need to attach the event in the capture phase. So we update this line https://github.com/Expensify/Expensify.cash/blob/824e85f8099cdf903e88107c0b33d47ed93882ff/src/pages/home/report/EmojiPickerMenu/index.js#L113. as
which fixes the arrow navigation. Suggestion
Video showing my suggestion with the bug fix. Notice now Arrows are not blocked on the search input and we can move the cursor around. emojipicker.mp4 |
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
@parasharrajat Great proposal as always! I agree that it's better to allow arrow keys to move the cursor around in the text input, then activate emoji-selection only with the down arrow key. When in the top row of emoji, the up-arrow key should refocus the text input. |
Sure, I will add that too. Point taken. |
This isn't working on Desktop Version 1.0.76-2, regression? 2021-07-14_09-46-10.mp4 |
@mallenexpensify Have you used the down arrow key to activate the arrow navigation? More here Edit: |
Yes, I was trying to click the down arrow and nothing happened. I swear it worked days ago.... |
Sure, bear with me. As soon as this PR is deployed to Staging, you will get back arrow navigation. |
Desktop just updated to Version 1.0.77-5 (1.0.77-5) and it's working there for now, so closing again. Thanks @parasharrajat |
Paid in Upwork |
If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!
Action Performed:
Expected Result:
User should be able to navigate the emoji list with arrow keys after pressing the down arrow
Actual Result:
Pressing the down arrow does not allow the user to navigate through the emoji list
Workaround:
User has to manually select the emoji with the mouse cursor
Platform:
Where is this issue occurring?
Web ✔️
iOS
Android
Desktop App ✔️
Mobile Web
Version Number: 1.0.74-0
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation
2021-07-01_08-53-32.mp4
Expensify/Expensify Issue URL:
View all open jobs on Upwork
From @mallenexpensify https://expensify.slack.com/archives/C01GTK53T8Q/p1625155126323200?thread_ts=1625154887.322400&cid=C01GTK53T8Q
The text was updated successfully, but these errors were encountered: