[Consumer UI Refresh] Implement the Search view

If you haven’t already, check out our contributing guidelines for onboarding!

---

We need to replace the ChatSwitcherView entirely with a “Search page” which is an even simpler version of the “New Chat” page. There is a method that should already calculate the correct options to display called OptionsListUtils.getSearchOptions(). The difference here between the “New Chat” page will be that:

• No headers will be shown
• No personalDetails will be shown
• No headers will be shown for the sections
• Users can not be invited via this flow
• Chats with multiple participants should be shown

Deliverables:

• Implement the Search page and replace the ChatSwitcherView in the Sidebar.
• The ChatSwitcherView and anything related to it (that is no longer used) must be deleted from the codebase.

[lucas-neuhaus-dev]

Ohhhhh ok! That took me a while to figure out. Needed to stop and understand the getOptions function better.

Added a new entry in the object prop of the getOptions function, called showEmptyRecentReports, defaulted it to false. Set to true in the getSearchOptions call.

PR coming soon.

[lucas-neuhaus-dev]

I thought it would be more stuff, but it’s extremely simple. I just needed to change:

alternateText: showChatPreviewLine ? lastMessageText : personalDetail.login

to

alternateText: (showChatPreviewLine && lastMessageText) ? lastMessageText : personalDetail.login

on the createOption function.

Alright I think I got all information I needed, going to finish testing on the platforms and create the PR. We can discuss better with the code in hands.

Proposal

1. Create a SearchView component which looks a lot like NewChatPage. It uses the OptionsListUtils.getSearchOptions function to fetch both personalDetails and recentReports.
2. Replace it with the ChatSwitcherView, and delete everything related to it from the code.
3. On the list, show either the last message if it is a recentReport, or the email if it personalDetail.
4. For showing the text unread style and hide the pin and draft icons on the list, I will break down the current OptionRow’s hideAdditionalOptionStates prop in two: hideAdditionalOptionStates and forceTextUnreadStyle.

The forceTextUnreadStyle will be used on NewChatPage and NewGroupPage.