jollywhoppers.com
Bluesky app fork with some witchin' additions 馃挮
witchsky.app
bluesky
fork
client
samuel.fm
1import {View} from 'react-native'
2import {Trans} from '@lingui/react/macro'
3
4import {type ThreadItem} from '#/state/queries/usePostThread/types'
5import {
6 LINEAR_AVI_WIDTH,
7 OUTER_SPACE,
8 REPLY_LINE_WIDTH,
9} from '#/screens/PostThread/const'
10import {atoms as a, useTheme} from '#/alf'
11import {Lock_Stroke2_Corner0_Rounded as LockIcon} from '#/components/icons/Lock'
12import * as Skele from '#/components/Skeleton'
13import {Text} from '#/components/Typography'
14
15export function ThreadItemPostNoUnauthenticated({
16 item,
17}: {
18 item: Extract<ThreadItem, {type: 'threadPostNoUnauthenticated'}>
19}) {
20 const t = useTheme()
21
22 return (
23 <View style={[{paddingHorizontal: OUTER_SPACE}]}>
24 <View style={[a.flex_row, {height: 12}]}>
25 <View style={{width: LINEAR_AVI_WIDTH}}>
26 {item.ui.showParentReplyLine && (
27 <View
28 style={[
29 a.mx_auto,
30 a.flex_1,
31 a.mb_xs,
32 {
33 width: REPLY_LINE_WIDTH,
34 backgroundColor: t.atoms.border_contrast_low.borderColor,
35 },
36 ]}
37 />
38 )}
39 </View>
40 </View>
41 <Skele.Row style={[a.align_center, a.gap_md]}>
42 <Skele.Circle size={LINEAR_AVI_WIDTH}>
43 <LockIcon size="md" fill={t.atoms.text_contrast_medium.color} />
44 </Skele.Circle>
45
46 <Text style={[a.text_md, a.italic, t.atoms.text_contrast_medium]}>
47 <Trans>
48 This author has chosen to make their posts visible only to people
49 who are signed in.
50 </Trans>
51 </Text>
52 </Skele.Row>
53 <View
54 style={[
55 a.flex_row,
56 a.justify_center,
57 {
58 height: OUTER_SPACE / 1.5,
59 width: LINEAR_AVI_WIDTH,
60 },
61 ]}>
62 {item.ui.showChildReplyLine && (
63 <View
64 style={[
65 a.mt_xs,
66 a.h_full,
67 {
68 width: REPLY_LINE_WIDTH,
69 backgroundColor: t.atoms.border_contrast_low.borderColor,
70 },
71 ]}
72 />
73 )}
74 </View>
75 </View>
76 )
77}