Notifs refresh improvement (#1941)

* Show loading state in notifications

* Fix invalidation of notifs

* Move spinner below header

* Fix: dont show spinner on initial load

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(
+    () => (
+      <View>
+        {ListHeaderComponent ? <ListHeaderComponent /> : null}
+        {showHeaderSpinner ? (
+          <View style={{padding: 10}}>
+            <ActivityIndicator />
+          </View>
+        ) : null}
+      </View>
+    ),
+    [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={
           <RefreshControl

src/view/screens/Notifications.tsx

@@ -47,7 +47,9 @@ export const NotificationsScreen = withAuthRequired(
 
     const onPressLoadLatest = React.useCallback(() => {
       scrollToTop()
-      queryClient.invalidateQueries({queryKey: NOTIFS_RQKEY()})
+      queryClient.invalidateQueries({
+        queryKey: NOTIFS_RQKEY(),
+      })
     }, [scrollToTop, queryClient])
 
     // on-visible setup