Reduce listConvos requests (bluesky-social#6378)

* Reduce page size for request

* Remove refetch interval entirely

* Add comment

* Optimistically mark as read

* Drop default active poll interval to 60s from 5min

* Only optimistically update unread count if success

src/state/messages/events/const.ts

@@ -1,2 +1,2 @@
-export const DEFAULT_POLL_INTERVAL = 60e3 * 5
+export const DEFAULT_POLL_INTERVAL = 60e3
 export const BACKGROUND_POLL_INTERVAL = 60e3 * 5

src/state/queries/messages/conversation.ts

@@ -5,7 +5,11 @@ import {STALE} from '#/state/queries'
 import {DM_SERVICE_HEADERS} from '#/state/queries/messages/const'
 import {useOnMarkAsRead} from '#/state/queries/messages/list-converations'
 import {useAgent} from '#/state/session'
-import {RQKEY as LIST_CONVOS_KEY} from './list-converations'
+import {
+  ConvoListQueryData,
+  getConvoFromQueryData,
+  RQKEY as LIST_CONVOS_KEY,
+} from './list-converations'
 
 const RQKEY_ROOT = 'convo'
 export const RQKEY = (convoId: string) => [RQKEY_ROOT, convoId]
@@ -57,8 +61,37 @@ export function useMarkAsReadMutation() {
       if (!convoId) throw new Error('No convoId provided')
       optimisticUpdate(convoId)
     },
-    onSettled() {
-      queryClient.invalidateQueries({queryKey: LIST_CONVOS_KEY})
+    onSuccess(_, {convoId}) {
+      if (!convoId) return
+
+      queryClient.setQueryData(LIST_CONVOS_KEY, (old: ConvoListQueryData) => {
+        if (!old) return old
+
+        const existingConvo = getConvoFromQueryData(convoId, old)
+
+        if (existingConvo) {
+          return {
+            ...old,
+            pages: old.pages.map(page => {
+              return {
+                ...page,
+                convos: page.convos.map(convo => {
+                  if (convo.id === convoId) {
+                    return {
+                      ...convo,
+                      unreadCount: 0,
+                    }
+                  }
+                  return convo
+                }),
+              }
+            }),
+          }
+        } else {
+          // If we somehow marked a convo as read that doesn't exist in the
+          // list, then we don't need to do anything.
+        }
+      })
     },
   })
 }

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

@@ -39,17 +39,14 @@ export function useListConvosQuery({
     queryKey: RQKEY,
     queryFn: async ({pageParam}) => {
       const {data} = await agent.api.chat.bsky.convo.listConvos(
-        {cursor: pageParam},
+        {cursor: pageParam, limit: 20},
         {headers: DM_SERVICE_HEADERS},
       )
 
       return data
     },
     initialPageParam: undefined as RQPageParam,
     getNextPageParam: lastPage => lastPage.cursor,
-    // refetch every 60 seconds since we can't get *all* info from the logs
-    // i.e. reading chats on another device won't update the unread count
-    refetchInterval: 60_000,
   })
 }
 
@@ -180,6 +177,11 @@ export function ListConvosProviderInner({
                   }),
                 }
               } else {
+                /**
+                 * We received a message from an conversation old enough that
+                 * it doesn't exist in the query cache, meaning we need to
+                 * refetch and bump the old convo to the top.
+                 */
                 debouncedRefetch()
               }
             })
@@ -245,12 +247,12 @@ export function useUnreadMessageCount() {
   return useMemo(() => {
     return {
       count,
-      numUnread: count > 0 ? (count > 30 ? '30+' : String(count)) : undefined,
+      numUnread: count > 0 ? (count > 10 ? '10+' : String(count)) : undefined,
     }
   }, [count])
 }
 
-type ConvoListQueryData = {
+export type ConvoListQueryData = {
   pageParams: Array<string | undefined>
   pages: Array<ChatBskyConvoListConvos.OutputSchema>
 }
@@ -301,7 +303,7 @@ function optimisticDelete(chatId: string, old: ConvoListQueryData) {
   }
 }
 
-function getConvoFromQueryData(chatId: string, old: ConvoListQueryData) {
+export function getConvoFromQueryData(chatId: string, old: ConvoListQueryData) {
   for (const page of old.pages) {
     for (const convo of page.convos) {
       if (convo.id === chatId) {