Implement consistent Link component
This commit is contained in:
parent
6835caa760
commit
2f0939a1c2
9 changed files with 177 additions and 143 deletions
|
@ -11,6 +11,7 @@ import {
|
|||
} from 'react-native'
|
||||
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
|
||||
import {PostThreadViewModel} from '../../../state/models/post-thread-view'
|
||||
import {Link} from '../util/Link'
|
||||
import {useStores} from '../../../state'
|
||||
import {s, colors} from '../../lib/styles'
|
||||
import {ago} from '../../lib/strings'
|
||||
|
@ -54,13 +55,13 @@ export const Post = observer(function Post({uri}: {uri: string}) {
|
|||
const item = view.thread
|
||||
const record = view.thread?.record as unknown as bsky.Post.Record
|
||||
|
||||
const onPressOuter = () => {
|
||||
const itemHref = useMemo(() => {
|
||||
const urip = new AdxUri(item.uri)
|
||||
store.nav.navigate(`/profile/${item.author.name}/post/${urip.recordKey}`)
|
||||
}
|
||||
const onPressAuthor = () => {
|
||||
store.nav.navigate(`/profile/${item.author.name}`)
|
||||
}
|
||||
return `/profile/${item.author.name}/post/${urip.recordKey}`
|
||||
}, [item.uri, item.author.name])
|
||||
const itemTitle = `Post by ${item.author.name}`
|
||||
const authorHref = `/profile/${item.author.name}`
|
||||
const authorTitle = item.author.name
|
||||
const onPressReply = () => {
|
||||
store.nav.navigate(`/composer?replyTo=${item.uri}`)
|
||||
}
|
||||
|
@ -76,26 +77,22 @@ export const Post = observer(function Post({uri}: {uri: string}) {
|
|||
}
|
||||
|
||||
return (
|
||||
<TouchableOpacity style={styles.outer} onPress={onPressOuter}>
|
||||
<Link style={styles.outer} href={itemHref} title={itemTitle}>
|
||||
<View style={styles.layout}>
|
||||
<TouchableOpacity style={styles.layoutAvi} onPress={onPressAuthor}>
|
||||
<Link style={styles.layoutAvi} href={authorHref} title={authorTitle}>
|
||||
<Image
|
||||
style={styles.avi}
|
||||
source={AVIS[item.author.name] || AVIS['alice.com']}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
</Link>
|
||||
<View style={styles.layoutContent}>
|
||||
<View style={styles.meta}>
|
||||
<Text
|
||||
style={[styles.metaItem, s.f15, s.bold]}
|
||||
onPress={onPressAuthor}>
|
||||
{item.author.displayName}
|
||||
</Text>
|
||||
<Text
|
||||
style={[styles.metaItem, s.f14, s.gray5]}
|
||||
onPress={onPressAuthor}>
|
||||
@{item.author.name}
|
||||
</Text>
|
||||
<Link style={styles.metaItem} href={authorHref} title={authorTitle}>
|
||||
<Text style={[s.f15, s.bold]}>{item.author.displayName}</Text>
|
||||
</Link>
|
||||
<Link style={styles.metaItem} href={authorHref} title={authorTitle}>
|
||||
<Text style={[s.f14, s.gray5]}>@{item.author.name}</Text>
|
||||
</Link>
|
||||
<Text style={[styles.metaItem, s.f14, s.gray5]}>
|
||||
· {ago(item.indexedAt)}
|
||||
</Text>
|
||||
|
@ -149,7 +146,7 @@ export const Post = observer(function Post({uri}: {uri: string}) {
|
|||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
</Link>
|
||||
)
|
||||
})
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue