Onboarding & feed fixes (#1602)

* Fix: improve the 'end of feed' detection condition

* Fix the feeds link on mobile in the empty state

* Align the following empty state better on web

* Dont autofocus the search input in the search tab

* Fix the error boundary render

* Add 'end of feed' CTA to following feed

* Reduce the default feeds to discover now that we have feed-selection during onboarding

* Fix case where loading spinner fails to stop rendering in bottom of feed

* Fix: dont show loading spinner at footer of feed when refreshing

* Fix: dont fire reminders during onboarding

* Optimize adding feeds and update to mirror the api behaviors more closely

* Use the lock in preferences to avoid clobbering in-flight updates

* Refresh the feed after onboarding to ensure content is visible

* Remove the now-incorrect comment

* Tune copy
This commit is contained in:
Paul Frazee 2023-10-04 08:57:23 -07:00 committed by GitHub
parent a76fb78d53
commit b1a1bae02e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 262 additions and 96 deletions

View file

@ -13,6 +13,7 @@ import {withAuthRequired} from 'view/com/auth/withAuthRequired'
import {TextLink} from 'view/com/util/Link'
import {Feed} from '../com/posts/Feed'
import {FollowingEmptyState} from 'view/com/posts/FollowingEmptyState'
import {FollowingEndOfFeed} from 'view/com/posts/FollowingEndOfFeed'
import {CustomFeedEmptyState} from 'view/com/posts/CustomFeedEmptyState'
import {LoadLatestBtn} from '../com/util/load-latest/LoadLatestBtn'
import {FeedsTabBar} from '../com/pager/FeedsTabBar'
@ -110,6 +111,10 @@ export const HomeScreen = withAuthRequired(
return <FollowingEmptyState />
}, [])
const renderFollowingEndOfFeed = React.useCallback(() => {
return <FollowingEndOfFeed />
}, [])
const renderCustomFeedEmptyState = React.useCallback(() => {
return <CustomFeedEmptyState />
}, [])
@ -127,6 +132,7 @@ export const HomeScreen = withAuthRequired(
isPageFocused={selectedPage === 0}
feed={store.me.mainFeed}
renderEmptyState={renderFollowingEmptyState}
renderEndOfFeed={renderFollowingEndOfFeed}
/>
{customFeeds.map((f, index) => {
return (
@ -149,11 +155,13 @@ const FeedPage = observer(function FeedPageImpl({
isPageFocused,
feed,
renderEmptyState,
renderEndOfFeed,
}: {
testID?: string
feed: PostsFeedModel
isPageFocused: boolean
renderEmptyState?: () => JSX.Element
renderEndOfFeed?: () => JSX.Element
}) {
const store = useStores()
const pal = usePalette('default')
@ -307,6 +315,7 @@ const FeedPage = observer(function FeedPageImpl({
onScroll={onMainScroll}
scrollEventThrottle={100}
renderEmptyState={renderEmptyState}
renderEndOfFeed={renderEndOfFeed}
ListHeaderComponent={ListHeaderComponent}
headerOffset={headerOffset}
/>