diff options
Diffstat (limited to 'src/view/com/posts/Feed.tsx')
-rw-r--r-- | src/view/com/posts/Feed.tsx | 37 |
1 files changed, 22 insertions, 15 deletions
diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed.tsx index 393c1bc91..b9ca9abdc 100644 --- a/src/view/com/posts/Feed.tsx +++ b/src/view/com/posts/Feed.tsx @@ -26,6 +26,7 @@ import { pollLatest, } from '#/state/queries/post-feed' import {useModerationOpts} from '#/state/queries/preferences' +import {isWeb} from '#/platform/detection' const LOADING_ITEM = {_reactKey: '__loading__'} const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} @@ -89,7 +90,7 @@ let Feed = ({ const isEmpty = !isFetching && !data?.pages[0]?.slices.length const checkForNew = React.useCallback(async () => { - if (!data?.pages[0] || isFetching || !onHasNew) { + if (!data?.pages[0] || isFetching || !onHasNew || !enabled) { return } try { @@ -99,7 +100,7 @@ let Feed = ({ } catch (e) { logger.error('Poll latest failed', {feed, error: String(e)}) } - }, [feed, data, isFetching, onHasNew]) + }, [feed, data, isFetching, onHasNew, enabled]) React.useEffect(() => { // we store the interval handler in a ref to avoid needless @@ -216,19 +217,25 @@ let Feed = ({ const shouldRenderEndOfFeed = !hasNextPage && !isEmpty && !isFetching && !isError && !!renderEndOfFeed - const FeedFooter = React.useCallback( - () => - isFetchingNextPage ? ( - <View style={styles.feedFooter}> - <ActivityIndicator /> - </View> - ) : shouldRenderEndOfFeed ? ( - renderEndOfFeed() - ) : ( - <View /> - ), - [isFetchingNextPage, shouldRenderEndOfFeed, renderEndOfFeed], - ) + const FeedFooter = React.useCallback(() => { + /** + * A bit of padding at the bottom of the feed as you scroll and when you + * reach the end, so that content isn't cut off by the bottom of the + * screen. + */ + const offset = Math.max(headerOffset, 32) * (isWeb ? 1 : 2) + + return isFetchingNextPage ? ( + <View style={[styles.feedFooter]}> + <ActivityIndicator /> + <View style={{height: offset}} /> + </View> + ) : shouldRenderEndOfFeed ? ( + <View style={{minHeight: offset}}>{renderEndOfFeed()}</View> + ) : ( + <View style={{height: offset}} /> + ) + }, [isFetchingNextPage, shouldRenderEndOfFeed, renderEndOfFeed, headerOffset]) const scrollHandler = useAnimatedScrollHandler(onScroll || {}) return ( |