fix: use 999+ for convo unread count, but 99+ for global one

ts/components/icon/SessionNotificationCount.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import styled from 'styled-components';
+import { Constants } from '../../session';
 
 type Props = {
   overflowingAt: number;
@@ -57,9 +58,21 @@ const NotificationOrUnreadCount = ({ centeredOnTop, overflowingAt, count }: Prop
 };
 
 export const SessionNotificationCount = (props: Pick<Props, 'count'>) => {
-  return <NotificationOrUnreadCount centeredOnTop={false} overflowingAt={99} count={props.count} />;
+  return (
+    <NotificationOrUnreadCount
+      centeredOnTop={false}
+      overflowingAt={Constants.CONVERSATION.MAX_GLOBAL_UNREAD_COUNT}
+      count={props.count}
+    />
+  );
 };
 
 export const SessionUnreadCount = (props: Pick<Props, 'count'>) => {
-  return <NotificationOrUnreadCount centeredOnTop={true} overflowingAt={999} count={props.count} />;
+  return (
+    <NotificationOrUnreadCount
+      centeredOnTop={true}
+      overflowingAt={Constants.CONVERSATION.MAX_CONVO_UNREAD_COUNT}
+      count={props.count}
+    />
+  );
 };

ts/components/leftpane/conversation-list-item/HeaderItem.tsx

@@ -12,6 +12,7 @@ import {
   useMentionedUs,
   useUnreadCount,
 } from '../../../hooks/useParamSelector';
+import { Constants } from '../../../session';
 import {
   openConversationToSpecificMessage,
   openConversationWithMessages,
@@ -160,8 +161,14 @@ const UnreadCount = ({ convoId }: { convoId: string }) => {
   const unreadMsgCount = useUnreadCount(convoId);
   const forcedUnread = useIsForcedUnreadWithoutUnreadMsg(convoId);
 
+  const unreadWithOverflow =
+    unreadMsgCount > Constants.CONVERSATION.MAX_CONVO_UNREAD_COUNT
+      ? `${Constants.CONVERSATION.MAX_CONVO_UNREAD_COUNT}+`
+      : unreadMsgCount || ' ';
+
+  // TODO would be good to merge the style of this with SessionNotificationCount or SessionUnreadCount at some point.
   return unreadMsgCount > 0 || forcedUnread ? (
-    <p className="module-conversation-list-item__unread-count">{unreadMsgCount || ' '}</p>
+    <p className="module-conversation-list-item__unread-count">{unreadWithOverflow}</p>
   ) : null;
 };
 

ts/hooks/useParamSelector.ts

@@ -7,7 +7,6 @@ import {
   hasValidOutgoingRequestValues,
 } from '../models/conversation';
 import { isUsAnySogsFromCache } from '../session/apis/open_group_api/sogsv3/knownBlindedkeys';
-import { CONVERSATION } from '../session/constants';
 import { TimerOptions, TimerOptionsArray } from '../session/disappearing_messages/timerOptions';
 import { PubKey } from '../session/types';
 import { UserUtils } from '../session/utils';
@@ -241,12 +240,11 @@ export function useMessageReactsPropsById(messageId?: string) {
 
 /**
  * Returns the unread count of that conversation, or 0 if none are found.
- * Note: returned value is capped at a max of CONVERSATION.MAX_UNREAD_COUNT
+ * Note: returned value is capped at a max of CONVERSATION.MAX_CONVO_UNREAD_COUNT
  */
 export function useUnreadCount(conversationId?: string): number {
   const convoProps = useConversationPropsById(conversationId);
-  const convoUnreadCount = convoProps?.unreadCount || 0;
-  return Math.min(CONVERSATION.MAX_UNREAD_COUNT, convoUnreadCount);
+  return convoProps?.unreadCount || 0;
 }
 
 export function useHasUnread(conversationId?: string): boolean {

ts/session/constants.ts

@@ -51,8 +51,9 @@ export const CONVERSATION = {
   // Maximum voice message duraton of 5 minutes
   // which equates to 1.97 MB
   MAX_VOICE_MESSAGE_DURATION: 300,
-  MAX_UNREAD_COUNT: 999,
-};
+  MAX_CONVO_UNREAD_COUNT: 999,
+  MAX_GLOBAL_UNREAD_COUNT: 99, // the global one does not look good with 4 digits (999+) so we have a smaller one for it
+} as const;
 
 /**
  * The file server and onion request max upload size is 10MB precisely.

ts/state/selectors/conversations.ts

@@ -336,7 +336,6 @@ const _getGlobalUnreadCount = (sortedConversations: Array<ReduxConversationType>
     }
 
     if (
-      globalUnreadCount < 100 &&
       isNumber(conversation.unreadCount) &&
       isFinite(conversation.unreadCount) &&
       conversation.unreadCount > 0 &&
@@ -345,7 +344,6 @@ const _getGlobalUnreadCount = (sortedConversations: Array<ReduxConversationType>
       globalUnreadCount += conversation.unreadCount;
     }
   }
-
   return globalUnreadCount;
 };
 

ts/state/selectors/selectedConversation.ts

@@ -1,5 +1,6 @@
 import { isString } from 'lodash';
 import { useSelector } from 'react-redux';
+import { useUnreadCount } from '../../hooks/useParamSelector';
 import { ConversationTypeEnum, isOpenOrClosedGroup } from '../../models/conversationAttributes';
 import {
   DisappearingMessageConversationModeType,
@@ -60,10 +61,6 @@ const getIsSelectedActive = (state: StateType): boolean => {
   return Boolean(getSelectedConversation(state)?.activeAt) || false;
 };
 
-const getSelectedUnreadCount = (state: StateType) => {
-  return getSelectedConversation(state)?.unreadCount || 0;
-};
-
 const getIsSelectedNoteToSelf = (state: StateType): boolean => {
   return getSelectedConversation(state)?.isMe || false;
 };
@@ -307,7 +304,8 @@ export function useSelectedIsActive() {
 }
 
 export function useSelectedUnreadCount() {
-  return useSelector(getSelectedUnreadCount);
+  const selectedConversation = useSelectedConversationKey();
+  return useUnreadCount(selectedConversation);
 }
 
 export function useSelectedIsNoteToSelf() {