diff --git a/src/lib/constants.ts b/src/lib/constants.ts
index 970317b754..85e48922bb 100644
--- a/src/lib/constants.ts
+++ b/src/lib/constants.ts
@@ -1,4 +1,6 @@
import {Insets, Platform} from 'react-native'
+import {AppBskyActorDefs} from '@atproto/api'
+import {TID} from '@atproto/common-web'
export const LOCAL_DEV_SERVICE =
Platform.OS === 'android' ? 'http://10.0.2.2:2583' : 'http://localhost:2583'
@@ -92,3 +94,18 @@ export const BSKY_FEED_OWNER_DIDS = [
export const DISCOVER_FEED_URI =
'at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/whats-hot'
+
+export const RECOMMENDED_SAVED_FEEDS: AppBskyActorDefs.SavedFeed[] = [
+ {
+ id: TID.nextStr(),
+ type: 'feed',
+ value: DISCOVER_FEED_URI,
+ pinned: true,
+ },
+ {
+ id: TID.nextStr(),
+ type: 'timeline',
+ value: 'home',
+ pinned: true,
+ },
+]
diff --git a/src/screens/Home/NoFeedsPinned.tsx b/src/screens/Home/NoFeedsPinned.tsx
new file mode 100644
index 0000000000..346cc11cc9
--- /dev/null
+++ b/src/screens/Home/NoFeedsPinned.tsx
@@ -0,0 +1,89 @@
+import React from 'react'
+import {useWindowDimensions, View} from 'react-native'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {RECOMMENDED_SAVED_FEEDS} from '#/lib/constants'
+import {useSetSaveFeedsMutation} from '#/state/queries/preferences'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {CenteredView} from '#/view/com/util/Views'
+import {atoms as a} from '#/alf'
+import {Button, ButtonIcon, ButtonText} from '#/components/Button'
+import {ListSparkle_Stroke2_Corner0_Rounded as ListSparkle} from '#/components/icons/ListSparkle'
+import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus'
+import {Link} from '#/components/Link'
+import {Text} from '#/components/Typography'
+
+export function useHeaderOffset() {
+ const {isDesktop, isTablet} = useWebMediaQueries()
+ const {fontScale} = useWindowDimensions()
+ if (isDesktop || isTablet) {
+ return 0
+ }
+ const navBarHeight = 42
+ const tabBarPad = 10 + 10 + 3 // padding + border
+ const normalLineHeight = 1.2
+ const tabBarText = 16 * normalLineHeight * fontScale
+ return navBarHeight + tabBarPad + tabBarText
+}
+
+export function NoFeedsPinned() {
+ const {_} = useLingui()
+ const headerOffset = useHeaderOffset()
+ const {isPending, mutateAsync: setSavedFeeds} = useSetSaveFeedsMutation()
+
+ const addRecommendedFeeds = React.useCallback(async () => {
+ await setSavedFeeds(RECOMMENDED_SAVED_FEEDS)
+ }, [setSavedFeeds])
+
+ return (
+
+
+
+
+ Whoops!
+
+
+
+ Looks like you unpinned all your feeds. But don't worry, you can
+ add some below 😄
+
+
+
+
+
+
+
+
+
+ {_(msg`Browse other feeds`)}
+
+
+
+
+ )
+}
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index 33e40997f8..2ae99e26fe 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -21,6 +21,7 @@ import {Pager, PagerRef, RenderTabBarFnProps} from 'view/com/pager/Pager'
import {CustomFeedEmptyState} from 'view/com/posts/CustomFeedEmptyState'
import {FollowingEmptyState} from 'view/com/posts/FollowingEmptyState'
import {FollowingEndOfFeed} from 'view/com/posts/FollowingEndOfFeed'
+import {NoFeedsPinned} from '#/screens/Home/NoFeedsPinned'
import {HomeHeader} from '../com/home/HomeHeader'
type Props = NativeStackScreenProps
@@ -110,12 +111,14 @@ function HomeScreenReady({
useFocusEffect(
useNonReactiveCallback(() => {
- logEvent('home:feedDisplayed', {
- index: selectedIndex,
- feedType: selectedFeed.split('|')[0],
- feedUrl: selectedFeed,
- reason: 'focus',
- })
+ if (selectedFeed) {
+ logEvent('home:feedDisplayed', {
+ index: selectedIndex,
+ feedType: selectedFeed.split('|')[0],
+ feedUrl: selectedFeed,
+ reason: 'focus',
+ })
+ }
}),
)
@@ -147,12 +150,15 @@ function HomeScreenReady({
const onPageSelecting = React.useCallback(
(index: number, reason: LogEvents['home:feedDisplayed']['reason']) => {
const feed = allFeeds[index]
- logEvent('home:feedDisplayed', {
- index,
- feedType: feed.split('|')[0],
- feedUrl: feed,
- reason,
- })
+
+ if (feed) {
+ logEvent('home:feedDisplayed', {
+ index,
+ feedType: feed.split('|')[0],
+ feedUrl: feed,
+ reason,
+ })
+ }
},
[allFeeds],
)
@@ -212,35 +218,39 @@ function HomeScreenReady({
onPageSelected={onPageSelected}
onPageScrollStateChanged={onPageScrollStateChanged}
renderTabBar={renderTabBar}>
- {allFeeds.map(feed => {
- if (feed === 'home' || feed === 'following') {
+ {allFeeds.length ? (
+ allFeeds.map(feed => {
+ if (feed === 'home' || feed === 'following') {
+ return (
+
+ )
+ }
+ const savedFeedConfig = preferences.savedFeeds.find(f => {
+ return feed.includes(f.value)
+ })
+
return (
)
- }
- const savedFeedConfig = preferences.savedFeeds.find(f => {
- return feed.includes(f.value)
})
-
- return (
-
- )
- })}
+ ) : (
+
+ )}
) : (