[HOLD for payment 2023-09-06] [HOLD for payment 2023-09-04] [$1000] Workspace - CMD+ENTER does not work when inviting new members to WS

[lanitochka17]

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:

1. Go to staging.new.expensify.com on Chrome or Safari or open Desktop App
2. Login with Expensifail account
3. Go to existing or create new workspace
4. Go to Settings > Workspace > Members > Invite
5. Select some new members using arrow keys of keyboard and press ENTER
6. Press CMD+ENTER to go to the next page

Expected Result:

User can go to the next page using CMD+ENTER

Actual Result:

Nothing happens

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.57-1

Reproducible in staging?: Yes

Reproducible in production?: No

If this was caught during regression testing, add the test name, ID and link from TestRail:

Email or phone of affected tester (no customers):

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

Notes/Photos/Videos: Any additional supporting documentation

Bug6175814_T3611067-CMD-Enter-not-work.mp4

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team

Slack conversation:

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~016a1186aeecdfe466
• Upwork Job ID: 1694821304249151488
• Last Price Increase: 2023-08-24

[OSBotify]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open StagingDeployCash deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[melvin-bot]

Triggered auto assignment to @stitesExpensify (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[jeet-dhandha]

Proposal (Updated)

Please re-state the problem that we are trying to solve in this issue.

• After selecting workspace members not able to navigate to next screen using cmd+enter

What is the root cause of that problem?

• We don't have any implementation for cmd+enter in WorkspaceInvitePage component.

What changes do you think we should make in order to solve the problem?

• We can use useKeyboardShortcut like below and it should do the trick.

+ useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.CTRL_ENTER, inviteUser);

return (
       <ScreenWrapper shouldEnableMaxHeight>

What alternative solutions did you explore? (Optional)

• We can implement it directly in SelectionList component to make use in further implementations, just like we have done in OptionsSelector.
  • We can pass an onSumbit prop to SelectionList component with inviteUser function. So than on ctrl+enter it gets called.
  • And inside BaseSelectionComponent below Enter's implemenation we can add this line.

useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.CTRL_ENTER, onSubmit);

[roryabraham]

Shouldn't we use the useKeyboardShortcut hook?

[jeet-dhandha]

Let me check @roryabraham

[jeet-dhandha]

I thought CTRL_ENTER wouldn't have been handled but forgot that BaseOptionSelector is still a class component