Use scroll position to gate post-created feed refresh (#9881)
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -24,6 +24,7 @@ yarn android # Run on Android
|
||||
yarn ios # Run on iOS
|
||||
|
||||
# Testing & Quality
|
||||
# IMPORTANT: Always use these yarn scripts, never call the underlying tools directly
|
||||
yarn test # Run Jest tests
|
||||
yarn lint # Run ESLint
|
||||
yarn typecheck # Run TypeScript type checking
|
||||
|
||||
@@ -1,12 +1,4 @@
|
||||
import {
|
||||
type JSX,
|
||||
memo,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from 'react'
|
||||
import {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react'
|
||||
import {
|
||||
ActivityIndicator,
|
||||
AppState,
|
||||
@@ -220,13 +212,13 @@ let PostFeed = ({
|
||||
scrollElRef?: ListRef
|
||||
onHasNew?: (v: boolean) => void
|
||||
onScrolledDownChange?: (isScrolledDown: boolean) => void
|
||||
renderEmptyState: () => JSX.Element
|
||||
renderEndOfFeed?: () => JSX.Element
|
||||
renderEmptyState: () => React.ReactElement
|
||||
renderEndOfFeed?: () => React.ReactElement
|
||||
testID?: string
|
||||
headerOffset?: number
|
||||
progressViewOffset?: number
|
||||
desktopFixedHeightOffset?: number
|
||||
ListHeaderComponent?: () => JSX.Element
|
||||
ListHeaderComponent?: () => React.ReactElement
|
||||
extraData?: any
|
||||
savedFeedConfig?: AppBskyActorDefs.SavedFeed
|
||||
initialNumToRender?: number
|
||||
@@ -309,20 +301,26 @@ let PostFeed = ({
|
||||
}
|
||||
})
|
||||
|
||||
const isScrolledDownRef = useRef(false)
|
||||
const handleScrolledDownChange = (isScrolledDown: boolean) => {
|
||||
isScrolledDownRef.current = isScrolledDown
|
||||
onScrolledDownChange?.(isScrolledDown)
|
||||
}
|
||||
|
||||
const myDid = currentAccount?.did || ''
|
||||
const onPostCreated = useCallback(() => {
|
||||
// NOTE
|
||||
// only invalidate if there's 1 page
|
||||
// more than 1 page can trigger some UI freakouts on iOS and android
|
||||
// -prf
|
||||
// only invalidate if at the top of the feed
|
||||
// changing content when scrolled can trigger some UI freakouts on iOS and android
|
||||
// -sfn
|
||||
if (
|
||||
data?.pages.length === 1 &&
|
||||
!isScrolledDownRef.current &&
|
||||
(feed === 'following' ||
|
||||
feed === `author|${myDid}|posts_and_author_threads`)
|
||||
) {
|
||||
queryClient.invalidateQueries({queryKey: RQKEY(feed)})
|
||||
void queryClient.invalidateQueries({queryKey: RQKEY(feed)})
|
||||
}
|
||||
}, [queryClient, feed, data, myDid])
|
||||
}, [queryClient, feed, myDid])
|
||||
useEffect(() => {
|
||||
return listenPostCreated(onPostCreated)
|
||||
}, [onPostCreated])
|
||||
@@ -981,7 +979,7 @@ let PostFeed = ({
|
||||
}
|
||||
}
|
||||
},
|
||||
[feedFeedback, feed, liveNowConfig, getPostPosition],
|
||||
[feedFeedback, feed, liveNowConfig, getPostPosition, ax],
|
||||
)
|
||||
|
||||
return (
|
||||
@@ -1001,7 +999,7 @@ let PostFeed = ({
|
||||
contentContainerStyle={{
|
||||
minHeight: Dimensions.get('window').height * 1.5,
|
||||
}}
|
||||
onScrolledDownChange={onScrolledDownChange}
|
||||
onScrolledDownChange={handleScrolledDownChange}
|
||||
onEndReached={onEndReached}
|
||||
onEndReachedThreshold={2} // number of posts left to trigger load more
|
||||
removeClippedSubviews={true}
|
||||
|
||||
Reference in New Issue
Block a user