Something went wrong. Try again.
fork of witchsky forked from jollywhoppers.com/witchsky.app
Something went wrong. Try again.
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374import {useMemo} from 'react'import {View} from 'react-native'import Svg, {Circle, Line} from 'react-native-svg'import {AtUri} from '@atproto/syntax'import {useLingui} from '@lingui/react/macro'
import {makeProfileLink} from '#/lib/routes/links'import {useCompactPosts} from '#/state/preferences/compact-posts'import {atoms as a, select, useTheme} from '#/alf'import {Link} from '#/components/Link'import {SubtleHover} from '#/components/SubtleHover'import {Text} from '#/components/Typography'
export function ViewFullThread({uri}: {uri: string}) { const t = useTheme() const compactPosts = useCompactPosts() const itemHref = useMemo(() => { const urip = new AtUri(uri) return makeProfileLink({did: urip.hostname, handle: ''}, 'post', urip.rkey) }, [uri]) const {t: l} = useLingui()
return ( <Link style={[ a.flex_row, { gap: compactPosts ? 8 : 10, paddingLeft: compactPosts ? 16 : 18, }, ]} to={itemHref} label={l`View full thread`}> {({hovered}) => ( <> <SubtleHover hover={hovered} // adjust position for visual alignment - the actual box has lots of top padding and not much bottom padding -sfn style={{top: 8, bottom: -5}} /> <View style={[a.align_center, {width: compactPosts ? 34 : 42}]}> <Svg width="4" height="40"> <Line x1="2" y1="0" x2="2" y2="15" stroke={select(t.name, { light: t.palette.contrast_100, dim: t.palette.contrast_200, dark: t.palette.contrast_200, })} strokeWidth="2" /> <Circle cx="2" cy="22" r="1.5" fill={t.palette.contrast_200} /> <Circle cx="2" cy="28" r="1.5" fill={t.palette.contrast_200} /> <Circle cx="2" cy="34" r="1.5" fill={t.palette.contrast_200} /> </Svg> </View> <Text style={[ a.text_md, t.atoms.text_link, {paddingTop: 18, paddingBottom: 4}, ]}> {/* HACKFIX: Trans isn't working after SDK 53 upgrade -sfn */} {l`View full thread`} </Text> </> )} </Link> )}