forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import {View} from 'react-native'
2import {TID} from '@atproto/common-web'
3import {msg, Trans} from '@lingui/macro'
4import {useLingui} from '@lingui/react'
5
6import {RECOMMENDED_SAVED_FEEDS} from '#/lib/constants'
7import {useOverwriteSavedFeedsMutation} from '#/state/queries/preferences'
8import {atoms as a, useTheme} from '#/alf'
9import {Button, ButtonIcon, ButtonText} from '#/components/Button'
10import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus'
11import {Text} from '#/components/Typography'
12
13/**
14 * Explicitly named, since the CTA in this component will overwrite all saved
15 * feeds if pressed. It should only be presented to the user if they actually
16 * have no other feeds saved.
17 */
18export function NoSavedFeedsOfAnyType({
19 onAddRecommendedFeeds,
20}: {
21 onAddRecommendedFeeds?: () => void
22}) {
23 const t = useTheme()
24 const {_} = useLingui()
25 const {isPending, mutateAsync: overwriteSavedFeeds} =
26 useOverwriteSavedFeedsMutation()
27
28 const addRecommendedFeeds = async () => {
29 onAddRecommendedFeeds?.()
30 await overwriteSavedFeeds(
31 RECOMMENDED_SAVED_FEEDS.map(f => ({
32 ...f,
33 id: TID.nextStr(),
34 })),
35 )
36 }
37
38 return (
39 <View
40 style={[a.flex_row, a.flex_wrap, a.justify_between, a.p_xl, a.gap_md]}>
41 <Text
42 style={[a.leading_snug, t.atoms.text_contrast_medium, {maxWidth: 310}]}>
43 <Trans>
44 Looks like you haven't saved any feeds! Use our recommendations or
45 browse more below.
46 </Trans>
47 </Text>
48
49 <Button
50 disabled={isPending}
51 label={_(msg`Apply default recommended feeds`)}
52 size="small"
53 color="primary_subtle"
54 onPress={addRecommendedFeeds}>
55 <ButtonIcon icon={Plus} />
56 <ButtonText>{_(msg`Use recommended`)}</ButtonText>
57 </Button>
58 </View>
59 )
60}