Fix default conversation color overrides

ts/state/selectors/message.ts

@@ -81,6 +81,7 @@ import {
   someSendStatus,
 } from '../../messages/MessageSendState';
 import * as log from '../../logging/log';
+import { getConversationColorAttributes } from '../../util/getConversationColorAttributes';
 
 const THREE_HOURS = 3 * 60 * 60 * 1000;
 
@@ -464,8 +465,8 @@ export const getPropsForQuote = createSelectorCreator(memoizeByRoot, isEqual)(
     const firstAttachment = quote.attachments && quote.attachments[0];
     const conversation = getConversation(message, conversationSelector);
 
-    const defaultConversationColor =
+    const { conversationColor, customColor } =
-      window.Events.getDefaultConversationColor();
+      getConversationColorAttributes(conversation);
 
     return {
       authorId,
@@ -474,11 +475,8 @@ export const getPropsForQuote = createSelectorCreator(memoizeByRoot, isEqual)(
       authorProfileName,
       authorTitle,
       bodyRanges: processBodyRanges(quote, { conversationSelector }),
-      conversationColor:
+      conversationColor,
-        conversation.conversationColor || defaultConversationColor.color,
+      customColor,
-      customColor:
-        conversation.customColor ||
-        defaultConversationColor.customColorData?.value,
       isFromMe,
       rawAttachment: firstAttachment
         ? processQuoteAttachment(firstAttachment)
@@ -585,8 +583,8 @@ const getShallowPropsForMessage = createSelectorCreator(memoizeByRoot, isEqual)(
     });
     const contactNameColor = contactNameColorSelector(conversationId, authorId);
 
-    const defaultConversationColor =
+    const { conversationColor, customColor } =
-      window.Events.getDefaultConversationColor();
+      getConversationColorAttributes(conversation);
 
     return {
       canDeleteForEveryone: canDeleteForEveryone(message),
@@ -594,13 +592,10 @@ const getShallowPropsForMessage = createSelectorCreator(memoizeByRoot, isEqual)(
       canReply: canReply(message, ourConversationId, conversationSelector),
       contact: getPropsForEmbeddedContact(message, regionCode, accountSelector),
       contactNameColor,
-      conversationColor:
+      conversationColor,
-        conversation.conversationColor || defaultConversationColor.color,
       conversationId,
       conversationType: isGroup ? 'group' : 'direct',
-      customColor:
+      customColor,
-        conversation.customColor ||
-        defaultConversationColor.customColorData?.value,
       deletedForEveryone: message.deletedForEveryone || false,
       direction: isIncoming(message) ? 'incoming' : 'outgoing',
       displayLimit: message.displayLimit,

ts/state/smart/ChatColorPicker.tsx

@@ -11,8 +11,8 @@ import {
   getConversationSelector,
   getConversationsWithCustomColorSelector,
 } from '../selectors/conversations';
-import { getDefaultConversationColor } from '../selectors/items';
 import { getIntl } from '../selectors/user';
+import { getConversationColorAttributes } from '../../util/getConversationColorAttributes';
 
 export type SmartChatColorPickerProps = {
   conversationId?: string;
@@ -22,14 +22,10 @@ const mapStateToProps = (
   state: StateType,
   props: SmartChatColorPickerProps
 ): PropsDataType => {
-  const defaultConversationColor = getDefaultConversationColor(state);
+  const conversation = props.conversationId
-  const colorValues = props.conversationId
     ? getConversationSelector(state)(props.conversationId)
-    : {
+    : {};
-        conversationColor: defaultConversationColor.color,
+  const colorValues = getConversationColorAttributes(conversation);
-        customColorId: defaultConversationColor.customColorData?.id,
-        customColor: defaultConversationColor.customColorData?.value,
-      };
 
   const { customColors } = state.items;
 

ts/state/smart/ConversationDetails.tsx

@@ -22,6 +22,7 @@ import {
 } from '../selectors/badges';
 import { assert } from '../../util/assert';
 import { SignalService as Proto } from '../../protobuf';
+import { getConversationColorAttributes } from '../../util/getConversationColorAttributes';
 
 export type SmartConversationDetailsProps = {
   addMembers: (conversationIds: ReadonlyArray<string>) => Promise<void>;
@@ -87,7 +88,10 @@ const mapStateToProps = (
     badges,
     canEditGroupInfo,
     candidateContactsToAdd,
-    conversation,
+    conversation: {
+      ...conversation,
+      ...getConversationColorAttributes(conversation),
+    },
     getPreferredBadge: getPreferredBadgeSelector(state),
     i18n: getIntl(state),
     isAdmin,

ts/util/getConversationColorAttributes.ts

@@ -0,0 +1,37 @@
+// Copyright 2021 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import type { ConversationColorType, CustomColorType } from '../types/Colors';
+import type { ConversationType } from '../state/ducks/conversations';
+
+export function getConversationColorAttributes(
+  conversationColors: Pick<
+    ConversationType,
+    'conversationColor' | 'customColorId' | 'customColor'
+  >
+): {
+  conversationColor: ConversationColorType;
+  customColor: CustomColorType | undefined;
+  customColorId: string | undefined;
+} {
+  const defaultConversationColor = window.Events.getDefaultConversationColor();
+
+  const conversationColor =
+    conversationColors.conversationColor || defaultConversationColor.color;
+  const customColor =
+    conversationColor !== 'custom'
+      ? undefined
+      : conversationColors.customColor ||
+        defaultConversationColor.customColorData?.value;
+  const customColorId =
+    conversationColor !== 'custom'
+      ? undefined
+      : conversationColors.customColorId ||
+        defaultConversationColor.customColorData?.id;
+
+  return {
+    conversationColor,
+    customColor,
+    customColorId,
+  };
+}