about summary refs log tree commit diff
path: root/src/screens/Feeds/NoFollowingFeed.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens/Feeds/NoFollowingFeed.tsx')
-rw-r--r--src/screens/Feeds/NoFollowingFeed.tsx50
1 files changed, 50 insertions, 0 deletions
diff --git a/src/screens/Feeds/NoFollowingFeed.tsx b/src/screens/Feeds/NoFollowingFeed.tsx
new file mode 100644
index 000000000..03ced8ebd
--- /dev/null
+++ b/src/screens/Feeds/NoFollowingFeed.tsx
@@ -0,0 +1,50 @@
+import React from 'react'
+import {View} from 'react-native'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {TIMELINE_SAVED_FEED} from '#/lib/constants'
+import {useAddSavedFeedsMutation} from '#/state/queries/preferences'
+import {atoms as a, useTheme} from '#/alf'
+import {InlineLinkText} from '#/components/Link'
+import {Text} from '#/components/Typography'
+
+export function NoFollowingFeed() {
+  const t = useTheme()
+  const {_} = useLingui()
+  const {mutateAsync: addSavedFeeds} = useAddSavedFeedsMutation()
+
+  const addRecommendedFeeds = React.useCallback(
+    (e: any) => {
+      e.preventDefault()
+
+      addSavedFeeds([
+        {
+          ...TIMELINE_SAVED_FEED,
+          pinned: true,
+        },
+      ])
+
+      // prevent navigation
+      return false
+    },
+    [addSavedFeeds],
+  )
+
+  return (
+    <View style={[a.flex_row, a.flex_wrap, a.align_center, a.py_md, a.px_lg]}>
+      <Text
+        style={[a.leading_snug, t.atoms.text_contrast_medium, {maxWidth: 310}]}>
+        <Trans>Looks like you're missing a following feed.</Trans>{' '}
+      </Text>
+
+      <InlineLinkText
+        to="/"
+        label={_(msg`Add the default feed of only people you follow`)}
+        onPress={addRecommendedFeeds}
+        style={[a.leading_snug]}>
+        <Trans>Click here to add one.</Trans>
+      </InlineLinkText>
+    </View>
+  )
+}