Move left pane entirely to React

ts/state/selectors/search.ts

@@ -0,0 +1,93 @@
+import { compact } from 'lodash';
+import { createSelector } from 'reselect';
+
+import { StateType } from '../reducer';
+import { SearchStateType } from '../ducks/search';
+
+import {
+  getConversationLookup,
+  getSelectedConversation,
+} from './conversations';
+import { ConversationLookupType } from '../ducks/conversations';
+
+export const getSearch = (state: StateType): SearchStateType => state.search;
+
+export const getQuery = createSelector(
+  getSearch,
+  (state: SearchStateType): string => state.query
+);
+
+export const getSelectedMessage = createSelector(
+  getSearch,
+  (state: SearchStateType): string | undefined => state.selectedMessage
+);
+
+export const isSearching = createSelector(
+  getSearch,
+  (state: SearchStateType) => {
+    const { query } = state;
+
+    return query && query.trim().length > 1;
+  }
+);
+
+export const getSearchResults = createSelector(
+  [
+    getSearch,
+    getConversationLookup,
+    getSelectedConversation,
+    getSelectedMessage,
+  ],
+  (
+    state: SearchStateType,
+    lookup: ConversationLookupType,
+    selectedConversation?: string,
+    selectedMessage?: string
+  ) => {
+    return {
+      contacts: compact(
+        state.contacts.map(id => {
+          const value = lookup[id];
+
+          if (value && id === selectedConversation) {
+            return {
+              ...value,
+              isSelected: true,
+            };
+          }
+
+          return value;
+        })
+      ),
+      conversations: compact(
+        state.conversations.map(id => {
+          const value = lookup[id];
+
+          if (value && id === selectedConversation) {
+            return {
+              ...value,
+              isSelected: true,
+            };
+          }
+
+          return value;
+        })
+      ),
+      hideMessagesHeader: false,
+      messages: state.messages.map(message => {
+        if (message.id === selectedMessage) {
+          return {
+            ...message,
+            isSelected: true,
+          };
+        }
+
+        return message;
+      }),
+      searchTerm: state.query,
+      showStartNewConversation: Boolean(
+        state.normalizedPhoneNumber && !lookup[state.normalizedPhoneNumber]
+      ),
+    };
+  }
+);