diff options
Diffstat (limited to 'src/view/com/feeds/ProfileFeedgens.tsx')
-rw-r--r-- | src/view/com/feeds/ProfileFeedgens.tsx | 51 |
1 files changed, 32 insertions, 19 deletions
diff --git a/src/view/com/feeds/ProfileFeedgens.tsx b/src/view/com/feeds/ProfileFeedgens.tsx index 5ba17e426..f53a5f5df 100644 --- a/src/view/com/feeds/ProfileFeedgens.tsx +++ b/src/view/com/feeds/ProfileFeedgens.tsx @@ -1,8 +1,15 @@ -import React from 'react' +import { + useCallback, + useEffect, + useImperativeHandle, + useMemo, + useState, +} from 'react' import { findNodeHandle, type ListRenderItemInfo, type StyleProp, + useWindowDimensions, View, type ViewStyle, } from 'react-native' @@ -34,6 +41,7 @@ interface SectionRef { } interface ProfileFeedgensProps { + ref?: React.Ref<SectionRef> did: string scrollElRef: ListRef headerOffset: number @@ -43,17 +51,21 @@ interface ProfileFeedgensProps { setScrollViewTag: (tag: number | null) => void } -export const ProfileFeedgens = React.forwardRef< - SectionRef, - ProfileFeedgensProps ->(function ProfileFeedgensImpl( - {did, scrollElRef, headerOffset, enabled, style, testID, setScrollViewTag}, +export function ProfileFeedgens({ ref, -) { + did, + scrollElRef, + headerOffset, + enabled, + style, + testID, + setScrollViewTag, +}: ProfileFeedgensProps) { const {_} = useLingui() const t = useTheme() - const [isPTRing, setIsPTRing] = React.useState(false) - const opts = React.useMemo(() => ({enabled}), [enabled]) + const [isPTRing, setIsPTRing] = useState(false) + const {height} = useWindowDimensions() + const opts = useMemo(() => ({enabled}), [enabled]) const { data, isPending, @@ -67,7 +79,7 @@ export const ProfileFeedgens = React.forwardRef< const isEmpty = !isPending && !data?.pages[0]?.feeds.length const {data: preferences} = usePreferencesQuery() - const items = React.useMemo(() => { + const items = useMemo(() => { let items: any[] = [] if (isError && isEmpty) { items = items.concat([ERROR_ITEM]) @@ -91,7 +103,7 @@ export const ProfileFeedgens = React.forwardRef< const queryClient = useQueryClient() - const onScrollToTop = React.useCallback(() => { + const onScrollToTop = useCallback(() => { scrollElRef.current?.scrollToOffset({ animated: isNative, offset: -headerOffset, @@ -99,11 +111,11 @@ export const ProfileFeedgens = React.forwardRef< queryClient.invalidateQueries({queryKey: RQKEY(did)}) }, [scrollElRef, queryClient, headerOffset, did]) - React.useImperativeHandle(ref, () => ({ + useImperativeHandle(ref, () => ({ scrollToTop: onScrollToTop, })) - const onRefresh = React.useCallback(async () => { + const onRefresh = useCallback(async () => { setIsPTRing(true) try { await refetch() @@ -113,7 +125,7 @@ export const ProfileFeedgens = React.forwardRef< setIsPTRing(false) }, [refetch, setIsPTRing]) - const onEndReached = React.useCallback(async () => { + const onEndReached = useCallback(async () => { if (isFetchingNextPage || !hasNextPage || isError) return try { @@ -123,14 +135,14 @@ export const ProfileFeedgens = React.forwardRef< } }, [isFetchingNextPage, hasNextPage, isError, fetchNextPage]) - const onPressRetryLoadMore = React.useCallback(() => { + const onPressRetryLoadMore = useCallback(() => { fetchNextPage() }, [fetchNextPage]) // rendering // = - const renderItem = React.useCallback( + const renderItem = useCallback( ({item, index}: ListRenderItemInfo<any>) => { if (item === EMPTY) { return ( @@ -174,14 +186,14 @@ export const ProfileFeedgens = React.forwardRef< [_, t, error, refetch, onPressRetryLoadMore, preferences], ) - React.useEffect(() => { + useEffect(() => { if (isIOS && enabled && scrollElRef.current) { const nativeTag = findNodeHandle(scrollElRef.current) setScrollViewTag(nativeTag) } }, [enabled, scrollElRef, setScrollViewTag]) - const ProfileFeedgensFooter = React.useCallback(() => { + const ProfileFeedgensFooter = useCallback(() => { if (isEmpty) return null return ( <ListFooter @@ -217,10 +229,11 @@ export const ProfileFeedgens = React.forwardRef< removeClippedSubviews={true} desktopFixedHeight onEndReached={onEndReached} + contentContainerStyle={{minHeight: height + headerOffset}} /> </View> ) -}) +} function keyExtractor(item: any) { return item._reactKey || item.uri |