diff options
| author | Paul Frazee <pfrazee@gmail.com> | 2023-11-16 15:50:57 -0800 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-11-16 15:50:57 -0800 |
| commit | c03c744008bc15be807ccb172801268bd24dae53 (patch) | |
| tree | 7e18bfb6b1ceb0480eb3ef6695b71b53942e9c77 /src | |
| parent | 6f57192bd56e1e9b8eb89eb23cf847371ca2684c (diff) | |
| download | voidsky-c03c744008bc15be807ccb172801268bd24dae53.tar.zst | |
Notifs refresh improvement (#1941)
* Show loading state in notifications * Fix invalidation of notifs * Move spinner below header * Fix: dont show spinner on initial load
Diffstat (limited to 'src')
| -rw-r--r-- | src/view/com/notifications/Feed.tsx | 18 | ||||
| -rw-r--r-- | src/view/screens/Notifications.tsx | 4 |
2 files changed, 20 insertions, 2 deletions
diff --git a/src/view/com/notifications/Feed.tsx b/src/view/com/notifications/Feed.tsx index e82c654be..3daa53ec7 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( + () => ( + <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 diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx index 970882f12..c892ee4e3 100644 --- a/src/view/screens/Notifications.tsx +++ b/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 |