Emoji picker - Unable to navigate the emoji picker with cursor arrows and `enter` does nothing

[isagoico]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Expected Result:

If user presses enter the first emoji should be selected and displayed in compose box.
User should be able to navigate the emoji list with the cursor arrows

Actual Result:

Pressing enter does not select the first emoji and user is not able to navigate the emoji selector with the cursor arrows.

Action Performed:

1. Log in to staging.expensify.cash
2. Open a conversation and click on the emoji icon
3. Use the cursor arrows to navigate the list
4. Press enter

Workaround:

User can select the emoji with mouse cursor

Platform:

Where is this issue occurring?

Web ✔️
iOS
Android
Desktop App
Mobile Web

Version Number: 1.0.24-1

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos:

Grabando.178.mp4

Expensify/Expensify Issue URL:

---

From @iwiznia https://expensify.slack.com/archives/C01GTK53T8Q/p1618594398337300

ISSUE: with the new emoji picker:

• Pressing enter, should add the first emoji of the list
• Pressing down should move me to the currently shown emojis and from there, I should be able to move around with the cursor and add the selected emoji with enter

[MelvinBot]

Triggered auto assignment to @cdraeger11 (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

[jasperhuangg]

It's because this functionality was never implemented 😁, I can take a look at this! This takes me back to the snake JS challenge 😅, @cdraeger11 unassigning you.