zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Implement "scroll to top" for profile tabs (#1973)

Browse source 
* Hook up scroll to top handlers

* Scroll and invalidate Feeds/Lists

* Fix index calc due to conditional tabs

* Reorder lines for clarity
This commit is contained in:
dan 2023-11-22 04:25:11 +00:00 • committed by GitHub
parent 3de1d556a9
commit 08333002cc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 275 additions and 181 deletions
Download patch file Download diff file Expand all files Collapse all files

52
src/view/com/feeds/ProfileFeedgens.tsx
View file

@ -8,13 +8,14 @@ import {
View,
ViewStyle,
} from 'react-native'
import {useQueryClient} from '@tanstack/react-query'
import {FlatList} from '../util/Views'
import {FeedSourceCardLoaded} from './FeedSourceCard'
import {ErrorMessage} from '../util/error/ErrorMessage'
import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn'
import {Text} from '../util/text/Text'
import {usePalette} from 'lib/hooks/usePalette'
import {useProfileFeedgensQuery} from '#/state/queries/profile-feedgens'
import {useProfileFeedgensQuery, RQKEY} from '#/state/queries/profile-feedgens'
import {OnScrollHandler} from '#/lib/hooks/useOnMainScroll'
import {logger} from '#/logger'
import {Trans} from '@lingui/macro'
@ -29,25 +30,37 @@ const EMPTY = {_reactKey: '__empty__'}
const ERROR_ITEM = {_reactKey: '__error__'}
const LOAD_MORE_ERROR_ITEM = {_reactKey: '__load_more_error__'}
export function ProfileFeedgens({
did,
scrollElRef,
onScroll,
scrollEventThrottle,
headerOffset,
enabled,
style,
testID,
}: {
interface SectionRef {
scrollToTop: () => void
}
interface ProfileFeedgensProps {
did: string
scrollElRef?: MutableRefObject<FlatList<any> | null>
scrollElRef: MutableRefObject<FlatList<any> | null>
onScroll?: OnScrollHandler
scrollEventThrottle?: number
headerOffset: number
enabled?: boolean
style?: StyleProp<ViewStyle>
testID?: string
}) {
}
export const ProfileFeedgens = React.forwardRef<
SectionRef,
ProfileFeedgensProps
>(function ProfileFeedgensImpl(
{
did,
scrollElRef,
onScroll,
scrollEventThrottle,
headerOffset,
enabled,
style,
testID,
},
ref,
) {
const pal = usePalette('default')
const theme = useTheme()
const [isPTRing, setIsPTRing] = React.useState(false)
@ -88,6 +101,17 @@ export function ProfileFeedgens({
// events
// =
const queryClient = useQueryClient()
const onScrollToTop = React.useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: -headerOffset})
queryClient.invalidateQueries({queryKey: RQKEY(did)})
}, [scrollElRef, queryClient, headerOffset, did])
React.useImperativeHandle(ref, () => ({
scrollToTop: onScrollToTop,
}))
const onRefresh = React.useCallback(async () => {
setIsPTRing(true)
try {
@ -192,7 +216,7 @@ export function ProfileFeedgens({
/>
</View>
)
}
})
const styles = StyleSheet.create({
item: {