Tune feed loading behavior (#528)

* Never autoload home feed on focus

* On web, just check for new notifications on focus

* Switching tab in the home feed now checks for latest
zio/stable
Paul Frazee 2023-04-24 19:41:27 -05:00 committed by GitHub
parent 7a10762716
commit f4da2f4442
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 17 deletions

View File

@ -149,6 +149,8 @@ const FeedPage = observer(
} }
}, [isPageFocused, scrollToTop, feed]) }, [isPageFocused, scrollToTop, feed])
// fires when screen is activated/deactivated
// - set up polls/listeners, update content
useFocusEffect( useFocusEffect(
React.useCallback(() => { React.useCallback(() => {
const softResetSub = store.onScreenSoftReset(onSoftReset) const softResetSub = store.onScreenSoftReset(onSoftReset)
@ -168,30 +170,27 @@ const FeedPage = observer(
} }
}, [store, doPoll, onSoftReset, screen, feed]), }, [store, doPoll, onSoftReset, screen, feed]),
) )
// fires when tab is actived/deactivated
// - check for latest
useTabFocusEffect( useTabFocusEffect(
'Home', 'Home',
React.useCallback( React.useCallback(
isInside => { isInside => {
if (!isPageFocused) { if (!isPageFocused || !isInside) {
return return
} }
// on mobile: feed.checkForLatest()
// fires with `isInside=true` when the user navigates to the root tab
// but not when the user goes back to the screen by pressing back
// on web:
// essentially equivalent to useFocusEffect because we dont used tabbed
// navigation
if (isInside) {
if (feed.hasNewLatest) {
feed.refresh()
} else {
feed.checkForLatest()
}
}
}, },
[isPageFocused, feed], [isPageFocused, feed],
), ),
) )
// fires when page within screen is activated/deactivated
// - check for latest
React.useEffect(() => {
if (isPageFocused && isScreenFocused) {
feed.checkForLatest()
}
}, [isPageFocused, isScreenFocused, feed])
const onPressCompose = React.useCallback(() => { const onPressCompose = React.useCallback(() => {
track('HomeScreen:PressCompose') track('HomeScreen:PressCompose')

View File

@ -16,6 +16,7 @@ import {useOnMainScroll} from 'lib/hooks/useOnMainScroll'
import {useTabFocusEffect} from 'lib/hooks/useTabFocusEffect' import {useTabFocusEffect} from 'lib/hooks/useTabFocusEffect'
import {s} from 'lib/styles' import {s} from 'lib/styles'
import {useAnalytics} from 'lib/analytics' import {useAnalytics} from 'lib/analytics'
import {isWeb} from 'platform/detection'
type Props = NativeStackScreenProps< type Props = NativeStackScreenProps<
NotificationsTabNavigatorParams, NotificationsTabNavigatorParams,
@ -70,10 +71,14 @@ export const NotificationsScreen = withAuthRequired(
// essentially equivalent to useFocusEffect because we dont used tabbed // essentially equivalent to useFocusEffect because we dont used tabbed
// navigation // navigation
if (isInside) { if (isInside) {
if (store.me.notifications.unreadCount > 0) { if (isWeb) {
store.me.notifications.refresh()
} else {
store.me.notifications.syncQueue() store.me.notifications.syncQueue()
} else {
if (store.me.notifications.unreadCount > 0) {
store.me.notifications.refresh()
} else {
store.me.notifications.syncQueue()
}
} }
} }
}, },