[Tracker] Selection List Refactor

[mountiny]

Problem

OptionRow component is a beast that handles all the use cases of the App where there is a list of options. This is error-prone and hard to maintain.

Solution

Let's refactor all different list component variations into 3 new, clean components:

• Phase 1: Radio Button List
  [HOLD for payment 2023-07-17] Selection List Refactor: Radio Button List #20352
• Phase 2: Checkbox List
  [HOLD for payment 2023-09-04] Selection List Refactor: Checkbox List #20353
• Phase 3: Simple Selection List
  LOW: [$500] Selection List Refactor: Simple Selection List #20354

---

Other Related issues

• [HOLD App#11795] [$500] Pressing enter takes the focus to Add a personal message field on Android - reported by @thesahindia #10181
• [HOLD #11795] [$250] Invite new members to workspace text-input is not focused - Reported by @aneequeahmad #10587
• [$500] [HOLD for payment 2023-09-07] - Group chat - Selecting a user with tab adds the first user in the list as well reported by @huzaifa-99 #12668
• [HOLD App#11795] [$1000] Workspace - Invite new members list always scrolls to top after selecting 4 or more #12998

Potentially updating the List button background styles as per this Slack thread.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01c464f37c9f85723e
• Upwork Job ID: 1620157290858266624
• Last Price Increase: 2023-01-30

[shawnborton]

Ah interesting, I was thinking the main issue is mostly because we have a list selection on the screen at the same time as a separate text area. So I wonder if a solution to this whole thing would be to rethink the invite flow where maybe the personal message and selection rows are not on the same screen?

[mountiny]

So I wonder if a solution to this whole thing would be to rethink the invite flow where maybe the personal message and selection rows are not on the same screen?

that is also part of the problem I would say. Can we combine other inputs with the list input on the same screen? How will it behave? I think this will benefit from the discussion about the push to page navigation decisions

[melvin-bot]

Looks like something related to react-navigation may have been mentioned in this issue discussion.

As a reminder, please make sure that all proposals are not workarounds and that any and all attempt to fix the issue holistically have been made before proceeding with a solution. Proposals to change our DeprecatedCustomActions.js files should not be accepted.

Feel free to drop a note in #expensify-open-source with any questions.

[melvin-bot]

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

[rushatgabhane]

@mountiny who is leading this issue / how i can follow the predesign?

[JmillsExpensify]

Ah interesting, I was thinking the main issue is mostly because we have a list selection on the screen at the same time as a separate text area. So I wonder if a solution to this whole thing would be to rethink the invite flow where maybe the personal message and selection rows are not on the same screen?

Oh haha yeah totally agree. I just got here from the most recently added issue and came to the same conclusion. Wouldn't the custom message be a selection row and push-to-page?

[mountiny]

Wouldn't the custom message be a selection row and push-to-page?

Makes sense, this should be discovered in the pre-design. @rushatgabhane I think there is nobody to lead this yet, @isabelastisser might need to try and get some volunteer from engineers as I dont have a time at the moment to take this on :/