Refactor messages model; New timeline react components

ts/state/selectors/conversations.ts

@@ -1,3 +1,4 @@
+import memoizee from 'memoizee';
 import { createSelector } from 'reselect';
 import { format } from '../../types/PhoneNumber';
 
@@ -7,6 +8,9 @@ import {
   ConversationLookupType,
   ConversationsStateType,
   ConversationType,
+  MessageLookupType,
+  MessagesByConversationType,
+  MessageType,
 } from '../ducks/conversations';
 
 import { getIntl, getRegionCode, getUserNumber } from './user';
@@ -35,6 +39,19 @@ export const getShowArchived = createSelector(
   }
 );
 
+export const getMessages = createSelector(
+  getConversations,
+  (state: ConversationsStateType): MessageLookupType => {
+    return state.messagesLookup;
+  }
+);
+export const getMessagesByConversation = createSelector(
+  getConversations,
+  (state: ConversationsStateType): MessagesByConversationType => {
+    return state.messagesByConversation;
+  }
+);
+
 function getConversationTitle(
   conversation: ConversationType,
   options: { i18n: LocalizerType; ourRegionCode: string }
@@ -140,3 +157,94 @@ export const getMe = createSelector(
     return lookup[ourNumber];
   }
 );
+
+// This is where we will put Conversation selector logic, replicating what
+//   is currently in models/conversation.getProps()
+//   Blockers:
+//     1) contactTypingTimers - that UI-only state needs to be moved to redux
+export function _conversationSelector(
+  conversation: ConversationType
+  // regionCode: string,
+  // userNumber: string
+): ConversationType {
+  return conversation;
+}
+
+// A little optimization to reset our selector cache when high-level application data
+//   changes: regionCode and userNumber.
+type CachedConversationSelectorType = (
+  conversation: ConversationType
+) => ConversationType;
+export const getCachedSelectorForConversation = createSelector(
+  getRegionCode,
+  getUserNumber,
+  (): CachedConversationSelectorType => {
+    return memoizee(_conversationSelector, { max: 100 });
+  }
+);
+
+type GetConversationByIdType = (id: string) => ConversationType | undefined;
+export const getConversationSelector = createSelector(
+  getCachedSelectorForConversation,
+  getConversationLookup,
+  (
+    selector: CachedConversationSelectorType,
+    lookup: ConversationLookupType
+  ): GetConversationByIdType => {
+    return (id: string) => {
+      const conversation = lookup[id];
+      if (!conversation) {
+        return;
+      }
+
+      return selector(conversation);
+    };
+  }
+);
+
+// For now we pass through, as selector logic is still happening in the Backbone Model.
+//   Blockers:
+//     1) it's a lot of code to pull over - ~500 lines
+//     2) a couple places still rely on all that code - will need to move these to Roots:
+//       - quote compose
+//       - message details
+export function _messageSelector(
+  message: MessageType
+  // ourNumber: string,
+  // regionCode: string,
+  // conversation?: ConversationType,
+  // sender?: ConversationType,
+  // quoted?: ConversationType
+): MessageType {
+  return message;
+}
+
+// A little optimization to reset our selector cache whenever high-level application data
+//   changes: regionCode and userNumber.
+type CachedMessageSelectorType = (message: MessageType) => MessageType;
+export const getCachedSelectorForMessage = createSelector(
+  getRegionCode,
+  getUserNumber,
+  (): CachedMessageSelectorType => {
+    return memoizee(_messageSelector, { max: 500 });
+  }
+);
+
+type GetMessageByIdType = (id: string) => MessageType | undefined;
+export const getMessageSelector = createSelector(
+  getCachedSelectorForMessage,
+  getMessages,
+  (
+    selector: CachedMessageSelectorType,
+    lookup: MessageLookupType
+  ): GetMessageByIdType => {
+    return (id: string) => {
+      const message = lookup[id];
+      if (!message) {
+        return;
+      }
+
+      return selector(message);
+    };
+  }
+);