diff --git a/src/view/com/notifications/Feed.tsx b/src/view/com/notifications/Feed.tsx
index e82c654be4..3daa53ec7c 100644
--- a/src/view/com/notifications/Feed.tsx
+++ b/src/view/com/notifications/Feed.tsx
@@ -39,6 +39,7 @@ export function Feed({
const {
data,
dataUpdatedAt,
+ isLoading,
isFetching,
isFetched,
isError,
@@ -139,6 +140,21 @@ export function Feed({
[onPressRetryLoadMore, dataUpdatedAt, moderationOpts],
)
+ const showHeaderSpinner = !isPTRing && isFetching && !isLoading
+ const FeedHeader = React.useCallback(
+ () => (
+
+ {ListHeaderComponent ? : null}
+ {showHeaderSpinner ? (
+
+
+
+ ) : null}
+
+ ),
+ [ListHeaderComponent, showHeaderSpinner],
+ )
+
const FeedFooter = React.useCallback(
() =>
isFetchingNextPage ? (
@@ -168,7 +184,7 @@ export function Feed({
data={items}
keyExtractor={item => item._reactKey}
renderItem={renderItem}
- ListHeaderComponent={ListHeaderComponent}
+ ListHeaderComponent={FeedHeader}
ListFooterComponent={FeedFooter}
refreshControl={
{
scrollToTop()
- queryClient.invalidateQueries({queryKey: NOTIFS_RQKEY()})
+ queryClient.invalidateQueries({
+ queryKey: NOTIFS_RQKEY(),
+ })
}, [scrollToTop, queryClient])
// on-visible setup