Display join requests on chat list (#10679)

src/screens/Messages/ConversationSettings/MembersAndRequests.tsx

@@ -48,7 +48,7 @@ export function MembersAndRequests({
             ? l({
                 message: `${requestCount}+ requests`,
                 comment:
-                  'Displayed when there are more than 50 requests to join a group chat',
+                  'Displayed when there are more than 20 requests to join a group chat',
               })
             : l({
                 message: plural(requestCount, {

src/screens/Messages/components/ChatListItem.tsx

@@ -6,6 +6,7 @@ import {
   type ModerationDecision,
   type ModerationOpts,
 } from '@atproto/api'
+import {plural} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react/macro'
 import {useQueryClient} from '@tanstack/react-query'
 
@@ -213,6 +214,20 @@ function GroupChatItem({
       primaryProfileModeration={moderation}
       isBlockedAccount={false}
       isDeletedAccount={false}
+      subtitle={
+        convo.details.joinRequestCount
+          ? convo.details.joinRequestCount > 20
+            ? l({
+                message: '20+ new join requests',
+                context:
+                  'Displayed when there are more than 20 requests to join a group chat',
+              })
+            : plural(convo.details.joinRequestCount, {
+                one: '# new join request',
+                other: '# new join requests',
+              })
+          : undefined
+      }
       showProfileBadges={false}
       selected={selected}
       showMenu={showMenu}>

src/state/queries/messages/list-conversations.tsx

@@ -489,12 +489,22 @@ export function ListConvosProviderInner({
             // Join link data not included in the log event, trigger refetch to get it
             debouncedRefetch()
           } else if (
-            ChatBskyConvoDefs.isLogIncomingJoinRequest(log) ||
             ChatBskyConvoDefs.isLogApproveJoinRequest(log) ||
-            ChatBskyConvoDefs.isLogRejectJoinRequest(log) ||
-            ChatBskyConvoDefs.isLogOutgoingJoinRequest(log)
+            ChatBskyConvoDefs.isLogRejectJoinRequest(log)
           ) {
-            // TODO Update join request count here when available. -dsb
+            queryClient.setQueriesData(
+              {queryKey: [RQKEY_ROOT]},
+              (old?: ConvoListQueryData) =>
+                updateGroupConvoJoinRequestCount(log, old, -1),
+            )
+          } else if (ChatBskyConvoDefs.isLogIncomingJoinRequest(log)) {
+            queryClient.setQueriesData(
+              {queryKey: [RQKEY_ROOT]},
+              (old?: ConvoListQueryData) =>
+                updateGroupConvoJoinRequestCount(log, old, 1),
+            )
+          } else if (ChatBskyConvoDefs.isLogOutgoingJoinRequest(log)) {
+            // Viewer isn't in the chat yet, no need to do anything
           } else if (ChatBskyConvoDefs.isLogAddReaction(log)) {
             queryClient.setQueriesData(
               {queryKey: [RQKEY_ROOT]},
@@ -762,6 +772,29 @@ function optimisticUpdate(
   }
 }
 
+function updateGroupConvoJoinRequestCount(
+  log: {convoId: string; rev: string},
+  old: ConvoListQueryData | undefined,
+  delta: 1 | -1,
+) {
+  return optimisticUpdate(log.convoId, old, convo => {
+    // Join requests are only meaningful for group convos.
+    if (!ChatBskyConvoDefs.isGroupConvo(convo.kind)) {
+      return {...convo, rev: log.rev}
+    }
+    const current = convo.kind.joinRequestCount ?? 0
+    const next = Math.max(0, current + delta)
+    return {
+      ...convo,
+      kind: {
+        ...convo.kind,
+        joinRequestCount: next === 0 ? undefined : next,
+      },
+      rev: log.rev,
+    }
+  })
+}
+
 function removeMemberFromConvoView(
   convo: ChatBskyConvoDefs.ConvoView,
   did: string,