Maintain some feed data to avoid needless glimmers (#2054)

src/view/com/feeds/FeedPage.tsx

@@ -23,6 +23,7 @@ import {useLingui} from '@lingui/react'
 import {useSession} from '#/state/session'
 import {useComposerControls} from '#/state/shell/composer'
 import {listenSoftReset, emitSoftReset} from '#/state/events'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 const POLL_FREQ = 30e3 // 30sec
 
@@ -62,7 +63,7 @@ export function FeedPage({
   const onSoftReset = React.useCallback(() => {
     if (isPageFocused) {
       scrollToTop()
-      queryClient.resetQueries({queryKey: FEED_RQKEY(feed)})
+      truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
       setHasNew(false)
     }
   }, [isPageFocused, scrollToTop, queryClient, feed, setHasNew])
@@ -83,7 +84,7 @@ export function FeedPage({
 
   const onPressLoadLatest = React.useCallback(() => {
     scrollToTop()
-    queryClient.resetQueries({queryKey: FEED_RQKEY(feed)})
+    truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
     setHasNew(false)
   }, [scrollToTop, feed, queryClient, setHasNew])
 

src/view/screens/Notifications.tsx

@@ -25,6 +25,7 @@ import {
 } from '#/state/queries/notifications/unread'
 import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed'
 import {listenSoftReset, emitSoftReset} from '#/state/events'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 type Props = NativeStackScreenProps<
   NotificationsTabNavigatorParams,
@@ -54,9 +55,7 @@ export function NotificationsScreen({}: Props) {
     scrollToTop()
     if (hasNew) {
       // render what we have now
-      queryClient.resetQueries({
-        queryKey: NOTIFS_RQKEY(),
-      })
+      truncateAndInvalidate(queryClient, NOTIFS_RQKEY())
     } else {
       // check with the server
       unreadApi.checkUnread({invalidate: true})

src/view/screens/Profile.tsx

@@ -35,6 +35,7 @@ import {LoadLatestBtn} from '../com/util/load-latest/LoadLatestBtn'
 import {useQueryClient} from '@tanstack/react-query'
 import {useComposerControls} from '#/state/shell/composer'
 import {listenSoftReset} from '#/state/events'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 interface SectionRef {
   scrollToTop: () => void
@@ -404,7 +405,7 @@ const FeedSection = React.forwardRef<SectionRef, FeedSectionProps>(
 
     const onScrollToTop = React.useCallback(() => {
       scrollElRef.current?.scrollToOffset({offset: -headerHeight})
-      queryClient.resetQueries({queryKey: FEED_RQKEY(feed)})
+      truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
       setHasNew(false)
     }, [scrollElRef, headerHeight, queryClient, feed, setHasNew])
     React.useImperativeHandle(ref, () => ({

src/view/screens/ProfileFeed.tsx

@@ -64,6 +64,7 @@ import {
 import {useSession} from '#/state/session'
 import {useLikeMutation, useUnlikeMutation} from '#/state/queries/like'
 import {useComposerControls} from '#/state/shell/composer'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 const SECTION_TITLES = ['Posts', 'About']
 
@@ -502,7 +503,7 @@ const FeedSection = React.forwardRef<SectionRef, FeedSectionProps>(
 
     const onScrollToTop = useCallback(() => {
       scrollElRef.current?.scrollToOffset({offset: -headerHeight})
-      queryClient.resetQueries({queryKey: FEED_RQKEY(feed)})
+      truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
       setHasNew(false)
     }, [scrollElRef, headerHeight, queryClient, feed, setHasNew])
 

src/view/screens/ProfileList.tsx

@@ -55,6 +55,7 @@ import {cleanError} from '#/lib/strings/errors'
 import {useSession} from '#/state/session'
 import {useComposerControls} from '#/state/shell/composer'
 import {isWeb} from '#/platform/detection'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 const SECTION_TITLES_CURATE = ['Posts', 'About']
 const SECTION_TITLES_MOD = ['About']
@@ -128,10 +129,8 @@ function ProfileListScreenLoaded({
       list,
       onChange() {
         if (isCurateList) {
-          queryClient.resetQueries({
-            // TODO(eric) should construct these strings with a fn too
-            queryKey: FEED_RQKEY(`list|${list.uri}`),
-          })
+          // TODO(eric) should construct these strings with a fn too
+          truncateAndInvalidate(queryClient, FEED_RQKEY(`list|${list.uri}`))
         }
       },
     })

src/view/shell/Drawer.tsx

@@ -53,6 +53,7 @@ import {emitSoftReset} from '#/state/events'
 import {useInviteCodesQuery} from '#/state/queries/invites'
 import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed'
 import {NavSignupCard} from '#/view/shell/NavSignupCard'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 export function DrawerProfileCard({
   account,
@@ -141,9 +142,7 @@ export function DrawerContent() {
         } else {
           if (tab === 'Notifications') {
             // fetch new notifs on view
-            queryClient.resetQueries({
-              queryKey: NOTIFS_RQKEY(),
-            })
+            truncateAndInvalidate(queryClient, NOTIFS_RQKEY())
           }
           // @ts-ignore must be Home, Search, Notifications, or MyProfile
           navigation.navigate(`${tab}Tab`)

src/view/shell/bottom-bar/BottomBar.tsx

@@ -32,6 +32,7 @@ import {emitSoftReset} from '#/state/events'
 import {useSession} from '#/state/session'
 import {useProfileQuery} from '#/state/queries/profile'
 import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 type TabOptions = 'Home' | 'Search' | 'Notifications' | 'MyProfile' | 'Feeds'
 
@@ -62,9 +63,7 @@ export function BottomBar({navigation}: BottomTabBarProps) {
       } else {
         if (tab === 'Notifications') {
           // fetch new notifs on view
-          queryClient.resetQueries({
-            queryKey: NOTIFS_RQKEY(),
-          })
+          truncateAndInvalidate(queryClient, NOTIFS_RQKEY())
         }
         navigation.navigate(`${tab}Tab`)
       }

src/view/shell/desktop/LeftNav.tsx

@@ -48,6 +48,7 @@ import {emitSoftReset} from '#/state/events'
 import {useQueryClient} from '@tanstack/react-query'
 import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed'
 import {NavSignupCard} from '#/view/shell/NavSignupCard'
+import {truncateAndInvalidate} from '#/state/queries/util'
 
 function ProfileCard() {
   const {currentAccount} = useSession()
@@ -150,9 +151,7 @@ function NavItem({count, href, icon, iconFilled, label}: NavItemProps) {
       } else {
         if (href === '/notifications') {
           // fetch new notifs on view
-          queryClient.resetQueries({
-            queryKey: NOTIFS_RQKEY(),
-          })
+          truncateAndInvalidate(queryClient, NOTIFS_RQKEY())
         }
         onPress()
       }