@@ -1,10 +1,6 @@
|
||||
import {useCallback, useEffect, useRef} from 'react'
|
||||
import {StyleSheet, View} from 'react-native'
|
||||
import {
|
||||
FontAwesomeIcon,
|
||||
type FontAwesomeIconStyle,
|
||||
} from '@fortawesome/react-native-fontawesome'
|
||||
import {Trans} from '@lingui/react/macro'
|
||||
import {Trans, useLingui} from '@lingui/react/macro'
|
||||
import {useNavigation} from '@react-navigation/native'
|
||||
|
||||
import {DISCOVER_FEED_URI} from '#/lib/constants'
|
||||
@@ -14,9 +10,11 @@ import {type NavigationProp} from '#/lib/routes/types'
|
||||
import {s} from '#/lib/styles'
|
||||
import {useFeedFeedbackContext} from '#/state/feed-feedback'
|
||||
import {useSession} from '#/state/session'
|
||||
import {atoms as a} from '#/alf'
|
||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||
import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRightIcon} from '#/components/icons/Chevron'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
import {IS_WEB} from '#/env'
|
||||
import {Button} from '../util/forms/Button'
|
||||
import {Text} from '../util/text/Text'
|
||||
|
||||
export function CustomFeedEmptyState() {
|
||||
@@ -40,8 +38,8 @@ export function CustomFeedEmptyState() {
|
||||
}
|
||||
}
|
||||
}, [feedFeedback.feedSourceInfo, currentAccount?.did])
|
||||
const {t: l} = useLingui()
|
||||
const pal = usePalette('default')
|
||||
const palInverted = usePalette('inverted')
|
||||
const navigation = useNavigation<NavigationProp>()
|
||||
|
||||
const onPressFindAccounts = useCallback(() => {
|
||||
@@ -64,19 +62,18 @@ export function CustomFeedEmptyState() {
|
||||
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 style={[a.mt_xl, a.align_center]}>
|
||||
<Button
|
||||
label={l`Find accounts to follow`}
|
||||
onPress={onPressFindAccounts}
|
||||
color="secondary_inverted"
|
||||
size="large">
|
||||
<ButtonText>
|
||||
<Trans>Find accounts to follow</Trans>
|
||||
</ButtonText>
|
||||
<ButtonIcon icon={ChevronRightIcon} />
|
||||
</Button>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -93,22 +90,4 @@ const styles = StyleSheet.create({
|
||||
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,
|
||||
},
|
||||
})
|
||||
|
||||
@@ -1,23 +1,21 @@
|
||||
import {useCallback} from 'react'
|
||||
import {StyleSheet, View} from 'react-native'
|
||||
import {
|
||||
FontAwesomeIcon,
|
||||
type FontAwesomeIconStyle,
|
||||
} from '@fortawesome/react-native-fontawesome'
|
||||
import {Trans} from '@lingui/react/macro'
|
||||
import {Trans, useLingui} from '@lingui/react/macro'
|
||||
import {useNavigation} from '@react-navigation/native'
|
||||
|
||||
import {usePalette} from '#/lib/hooks/usePalette'
|
||||
import {MagnifyingGlassIcon} from '#/lib/icons'
|
||||
import {type NavigationProp} from '#/lib/routes/types'
|
||||
import {s} from '#/lib/styles'
|
||||
import {atoms as a} from '#/alf'
|
||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||
import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRightIcon} from '#/components/icons/Chevron'
|
||||
import {IS_WEB} from '#/env'
|
||||
import {Button} from '../util/forms/Button'
|
||||
import {Text} from '../util/text/Text'
|
||||
|
||||
export function FollowingEmptyState() {
|
||||
const {t: l} = useLingui()
|
||||
const pal = usePalette('default')
|
||||
const palInverted = usePalette('inverted')
|
||||
const navigation = useNavigation<NavigationProp>()
|
||||
|
||||
const onPressFindAccounts = useCallback(() => {
|
||||
@@ -45,36 +43,34 @@ export function FollowingEmptyState() {
|
||||
happening.
|
||||
</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 style={[a.mt_xl, a.align_center]}>
|
||||
<Button
|
||||
label={l`Find accounts to follow`}
|
||||
onPress={onPressFindAccounts}
|
||||
color="secondary_inverted"
|
||||
size="large">
|
||||
<ButtonText>
|
||||
<Trans>Find accounts to follow</Trans>
|
||||
</ButtonText>
|
||||
<ButtonIcon icon={ChevronRightIcon} />
|
||||
</Button>
|
||||
</View>
|
||||
|
||||
<Text type="xl-medium" style={[s.textCenter, pal.text, s.mt20]}>
|
||||
<Trans>You can also discover new Custom Feeds to follow.</Trans>
|
||||
</Text>
|
||||
<Button
|
||||
type="inverted"
|
||||
style={[styles.emptyBtn, s.mt10]}
|
||||
onPress={onPressDiscoverFeeds}>
|
||||
<Text type="lg-medium" style={palInverted.text}>
|
||||
<Trans>Discover new custom feeds</Trans>
|
||||
</Text>
|
||||
<FontAwesomeIcon
|
||||
icon="angle-right"
|
||||
style={palInverted.text as FontAwesomeIconStyle}
|
||||
size={14}
|
||||
/>
|
||||
</Button>
|
||||
<View style={[a.mt_md, a.align_center]}>
|
||||
<Button
|
||||
label={l`Discover new custom feeds`}
|
||||
onPress={onPressDiscoverFeeds}
|
||||
color="secondary_inverted"
|
||||
size="large">
|
||||
<ButtonText>
|
||||
<Trans>Discover new custom feeds</Trans>
|
||||
</ButtonText>
|
||||
<ButtonIcon icon={ChevronRightIcon} />
|
||||
</Button>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
@@ -98,13 +94,4 @@ const styles = StyleSheet.create({
|
||||
marginLeft: 'auto',
|
||||
marginRight: 'auto',
|
||||
},
|
||||
emptyBtn: {
|
||||
marginVertical: 20,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
paddingVertical: 18,
|
||||
paddingHorizontal: 24,
|
||||
borderRadius: 30,
|
||||
},
|
||||
})
|
||||
|
||||
@@ -1,22 +1,20 @@
|
||||
import {useCallback} from 'react'
|
||||
import {Dimensions, StyleSheet, View} from 'react-native'
|
||||
import {
|
||||
FontAwesomeIcon,
|
||||
type FontAwesomeIconStyle,
|
||||
} from '@fortawesome/react-native-fontawesome'
|
||||
import {Trans} from '@lingui/react/macro'
|
||||
import {Trans, useLingui} from '@lingui/react/macro'
|
||||
import {useNavigation} from '@react-navigation/native'
|
||||
|
||||
import {usePalette} from '#/lib/hooks/usePalette'
|
||||
import {type NavigationProp} from '#/lib/routes/types'
|
||||
import {s} from '#/lib/styles'
|
||||
import {atoms as a} from '#/alf'
|
||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||
import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRightIcon} from '#/components/icons/Chevron'
|
||||
import {IS_WEB} from '#/env'
|
||||
import {Button} from '../util/forms/Button'
|
||||
import {Text} from '../util/text/Text'
|
||||
|
||||
export function FollowingEndOfFeed() {
|
||||
const {t: l} = useLingui()
|
||||
const pal = usePalette('default')
|
||||
const palInverted = usePalette('inverted')
|
||||
const navigation = useNavigation<NavigationProp>()
|
||||
|
||||
const onPressFindAccounts = useCallback(() => {
|
||||
@@ -46,36 +44,34 @@ export function FollowingEndOfFeed() {
|
||||
follow.
|
||||
</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 style={[a.mt_xl, a.align_center]}>
|
||||
<Button
|
||||
label={l`Find accounts to follow`}
|
||||
onPress={onPressFindAccounts}
|
||||
color="secondary_inverted"
|
||||
size="large">
|
||||
<ButtonText>
|
||||
<Trans>Find accounts to follow</Trans>
|
||||
</ButtonText>
|
||||
<ButtonIcon icon={ChevronRightIcon} />
|
||||
</Button>
|
||||
</View>
|
||||
|
||||
<Text type="xl-medium" style={[s.textCenter, pal.text, s.mt20]}>
|
||||
<Trans>You can also discover new Custom Feeds to follow.</Trans>
|
||||
</Text>
|
||||
<Button
|
||||
type="inverted"
|
||||
style={[styles.emptyBtn, s.mt10]}
|
||||
onPress={onPressDiscoverFeeds}>
|
||||
<Text type="lg-medium" style={palInverted.text}>
|
||||
<Trans>Discover new custom feeds</Trans>
|
||||
</Text>
|
||||
<FontAwesomeIcon
|
||||
icon="angle-right"
|
||||
style={palInverted.text as FontAwesomeIconStyle}
|
||||
size={14}
|
||||
/>
|
||||
</Button>
|
||||
<View style={[a.mt_md, a.align_center]}>
|
||||
<Button
|
||||
label={l`Discover new custom feeds`}
|
||||
onPress={onPressDiscoverFeeds}
|
||||
color="secondary_inverted"
|
||||
size="large">
|
||||
<ButtonText>
|
||||
<Trans>Discover new custom feeds</Trans>
|
||||
</ButtonText>
|
||||
<ButtonIcon icon={ChevronRightIcon} />
|
||||
</Button>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
@@ -93,13 +89,4 @@ const styles = StyleSheet.create({
|
||||
width: '100%',
|
||||
maxWidth: 460,
|
||||
},
|
||||
emptyBtn: {
|
||||
marginVertical: 20,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
paddingVertical: 18,
|
||||
paddingHorizontal: 24,
|
||||
borderRadius: 30,
|
||||
},
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user