jollywhoppers.com
Bluesky app fork with some witchin' additions 馃挮
witchsky.app
bluesky
fork
client
samuel.fm
1import {View} from 'react-native'
2import {msg} from '@lingui/core/macro'
3import {useLingui} from '@lingui/react'
4
5import {atoms as a, useTheme} from '#/alf'
6import {Button} from '#/components/Button'
7import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlash} from '#/components/icons/EyeSlash'
8import {Text} from '#/components/Typography'
9import {useAnalytics} from '#/analytics'
10
11export function ThreadItemShowOtherReplies({onPress}: {onPress: () => void}) {
12 const t = useTheme()
13 const ax = useAnalytics()
14 const {_} = useLingui()
15 const label = _(msg`Show more replies`)
16
17 return (
18 <Button
19 onPress={() => {
20 onPress()
21 ax.metric('thread:click:showOtherReplies', {})
22 }}
23 label={label}>
24 {({hovered, pressed}) => (
25 <View
26 style={[
27 a.flex_1,
28 a.flex_row,
29 a.align_center,
30 a.gap_sm,
31 a.py_lg,
32 a.px_xl,
33 a.border_t,
34 t.atoms.border_contrast_low,
35 hovered || pressed ? t.atoms.bg_contrast_25 : t.atoms.bg,
36 ]}>
37 <View
38 style={[
39 t.atoms.bg_contrast_25,
40 a.align_center,
41 a.justify_center,
42 {
43 width: 26,
44 height: 26,
45 borderRadius: 13,
46 marginRight: 4,
47 },
48 ]}>
49 <EyeSlash size="sm" fill={t.atoms.text_contrast_medium.color} />
50 </View>
51 <Text
52 style={[t.atoms.text_contrast_medium, a.flex_1, a.leading_snug]}
53 numberOfLines={1}>
54 {label}
55 </Text>
56 </View>
57 )}
58 </Button>
59 )
60}