diff options
author | Khuddite <62555977+khuddite@users.noreply.github.com> | 2024-11-23 14:52:36 -0500 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-11-23 19:52:36 +0000 |
commit | f802f81fa6608f2d0c6fb9e8ca65cb42813ef739 (patch) | |
tree | c5157f8917b0e9d3458b44d854211884a6e9fde5 /src/view/com/lists/ProfileLists.tsx | |
parent | 30af267bb41b3fddcf05d8107c4936f1c2589c00 (diff) | |
download | voidsky-f802f81fa6608f2d0c6fb9e8ca65cb42813ef739.tar.zst |
Fix broken pagination for lists tab on profile page (#6221)
* set onEndReachedThreshold to 2 for ProfileLists * Add a footer for ProfileLists component for consistency * Remove logs * Revert onEndReachedThreshold change on Feed component * Fix threshold defaults to match native * Align lists and feedgens --------- Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
Diffstat (limited to 'src/view/com/lists/ProfileLists.tsx')
-rw-r--r-- | src/view/com/lists/ProfileLists.tsx | 18 |
1 files changed, 17 insertions, 1 deletions
diff --git a/src/view/com/lists/ProfileLists.tsx b/src/view/com/lists/ProfileLists.tsx index 27b7f94df..2f63fd172 100644 --- a/src/view/com/lists/ProfileLists.tsx +++ b/src/view/com/lists/ProfileLists.tsx @@ -1,8 +1,10 @@ import React from 'react' import { + ActivityIndicator, findNodeHandle, ListRenderItemInfo, StyleProp, + StyleSheet, View, ViewStyle, } from 'react-native' @@ -10,6 +12,7 @@ import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' import {useQueryClient} from '@tanstack/react-query' +import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' import {isNative, isWeb} from '#/platform/detection' @@ -56,10 +59,12 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>( isFetched, hasNextPage, fetchNextPage, + isFetchingNextPage, isError, error, refetch, } = useProfileListsQuery(did, opts) + const {isMobile} = useWebMediaQueries() const isEmpty = !isFetching && !data?.pages[0]?.lists.length const items = React.useMemo(() => { @@ -176,6 +181,12 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>( } }, [enabled, scrollElRef, setScrollViewTag]) + const ProfileListsFooter = React.useCallback(() => { + return isFetchingNextPage ? ( + <ActivityIndicator style={[styles.footer]} /> + ) : null + }, [isFetchingNextPage]) + return ( <View testID={testID} style={style}> <List @@ -184,12 +195,13 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>( data={items} keyExtractor={(item: any) => item._reactKey || item.uri} renderItem={renderItemInner} + ListFooterComponent={ProfileListsFooter} refreshing={isPTRing} onRefresh={onRefresh} headerOffset={headerOffset} progressViewOffset={ios(0)} contentContainerStyle={ - isNative && {paddingBottom: headerOffset + 100} + isMobile && {paddingBottom: headerOffset + 100} } indicatorStyle={t.name === 'light' ? 'black' : 'white'} removeClippedSubviews={true} @@ -201,3 +213,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>( ) }, ) + +const styles = StyleSheet.create({ + footer: {paddingTop: 20}, +}) |