Add user badges to typing bubbles, refactor typing logic

ts/state/ducks/conversations.ts

@@ -181,17 +181,7 @@ export type ConversationType = {
   unreadCount?: number;
   isSelected?: boolean;
   isFetchingUUID?: boolean;
-  typingContact?: {
-    acceptedMessageRequest: boolean;
-    avatarPath?: string;
-    color?: AvatarColorType;
-    isMe: boolean;
-    name?: string;
-    phoneNumber?: string;
-    profileName?: string;
-    sharedGroupNames: Array<string>;
-    title: string;
-  } | null;
+  typingContactId?: string;
   recentMediaItems?: Array<MediaItemType>;
   profileSharing?: boolean;
 

ts/state/smart/Timeline.tsx

@@ -298,7 +298,7 @@ const mapStateToProps = (state: StateType, props: ExternalProps) => {
     ...pick(conversation, [
       'areWeAdmin',
       'unreadCount',
-      'typingContact',
+      'typingContactId',
       'isGroupV1AndDisabled',
     ]),
     isIncomingMessageRequest: Boolean(

ts/state/smart/TypingBubble.tsx

@@ -1,4 +1,4 @@
-// Copyright 2019-2020 Signal Messenger, LLC
+// Copyright 2019-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import { connect } from 'react-redux';
@@ -7,8 +7,9 @@ import { TypingBubble } from '../../components/conversation/TypingBubble';
 import { strictAssert } from '../../util/assert';
 import type { StateType } from '../reducer';
 
-import { getIntl } from '../selectors/user';
+import { getIntl, getTheme } from '../selectors/user';
 import { getConversationSelector } from '../selectors/conversations';
+import { getPreferredBadgeSelector } from '../selectors/badges';
 
 type ExternalProps = {
   id: string;
@@ -17,17 +18,21 @@ type ExternalProps = {
 const mapStateToProps = (state: StateType, props: ExternalProps) => {
   const { id } = props;
 
-  const conversation = getConversationSelector(state)(id);
+  const conversationSelector = getConversationSelector(state);
+  const conversation = conversationSelector(id);
   if (!conversation) {
     throw new Error(`Did not find conversation ${id} in state!`);
   }
 
-  strictAssert(conversation.typingContact, 'Missing typingContact');
+  strictAssert(conversation.typingContactId, 'Missing typing contact ID');
+  const typingContact = conversationSelector(conversation.typingContactId);
 
   return {
-    ...conversation.typingContact,
+    ...typingContact,
+    badge: getPreferredBadgeSelector(state)(typingContact.badges),
     conversationType: conversation.type,
     i18n: getIntl(state),
+    theme: getTheme(state),
   };
 };