Something went wrong. Try again.
Bluesky app fork with some witchin' additions 💫 forked from jollywhoppers.com/witchsky.app
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115import React, {useEffect} from 'react'import {StyleSheet, View} from 'react-native'import { FontAwesomeIcon, type FontAwesomeIconStyle,} from '@fortawesome/react-native-fontawesome'import {Trans} from '@lingui/macro'import {useNavigation} from '@react-navigation/native'
import {DISCOVER_FEED_URI} from '#/lib/constants'import {usePalette} from '#/lib/hooks/usePalette'import {MagnifyingGlassIcon} from '#/lib/icons'import {type NavigationProp} from '#/lib/routes/types'import {s} from '#/lib/styles'import {useFeedFeedbackContext} from '#/state/feed-feedback'import {useSession} from '#/state/session'import {useAnalytics} from '#/analytics'import {IS_WEB} from '#/env'import {Button} from '../util/forms/Button'import {Text} from '../util/text/Text'
export function CustomFeedEmptyState() { const ax = useAnalytics() const feedFeedback = useFeedFeedbackContext() const {currentAccount} = useSession() const hasLoggedDiscoverEmptyErrorRef = React.useRef(false)
useEffect(() => { // Log the empty feed error event if (feedFeedback.feedSourceInfo && currentAccount?.did) { const uri = feedFeedback.feedSourceInfo.uri if ( uri === DISCOVER_FEED_URI && !hasLoggedDiscoverEmptyErrorRef.current ) { hasLoggedDiscoverEmptyErrorRef.current = true ax.metric('feed:discover:emptyError', { userDid: currentAccount.did, }) } } }, [feedFeedback.feedSourceInfo, currentAccount?.did]) const pal = usePalette('default') const palInverted = usePalette('inverted') const navigation = useNavigation<NavigationProp>()
const onPressFindAccounts = React.useCallback(() => { if (IS_WEB) { navigation.navigate('Search', {}) } else { navigation.navigate('SearchTab') navigation.popToTop() } }, [navigation])
return ( <View style={styles.emptyContainer}> <View style={styles.emptyIconContainer}> <MagnifyingGlassIcon style={[styles.emptyIcon, pal.text]} size={62} /> </View> <Text type="xl-medium" style={[s.textCenter, pal.text]}> <Trans> This feed is empty! You may need to follow more users or tune your language settings. </Trans> </Text> <Button type="inverted" style={styles.emptyBtn} onPress={onPressFindAccounts}> <Text type="lg-medium" style={palInverted.text}> <Trans>Find accounts to follow</Trans> </Text> <FontAwesomeIcon icon="angle-right" style={palInverted.text as FontAwesomeIconStyle} size={14} /> </Button> </View> )}const styles = StyleSheet.create({ emptyContainer: { height: '100%', paddingVertical: 40, paddingHorizontal: 30, }, emptyIconContainer: { marginBottom: 16, }, emptyIcon: { marginLeft: 'auto', marginRight: 'auto', }, emptyBtn: { marginVertical: 20, flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', paddingVertical: 18, paddingHorizontal: 24, borderRadius: 30, },
feedsTip: { position: 'absolute', left: 22, }, feedsTipArrow: { marginLeft: 32, marginTop: 8, },})