remove precacheThreadPostProfiles (#3729)

* remove `precacheThreadPostProfiles`

* add `displayName` to `PreviewableUserAvatar`

* memo

* use `precacheProfile`

* pass `profile` directly to `PreviewableUserAvatar`

* update the `UserAvatar`'s props

* remove feed cache

* one more spot

* rm unused queryClient

* Don't call fn unnecessarily

* Preload for display name too

* try notification item

* add to feeditem

* and finally, precache for post threads

* timestamp

* Fix

* onBeforePress

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
This commit is contained in:
Hailey 2024-04-26 22:31:07 -07:00 committed by GitHub
parent ce85375c85
commit 7eb1444f2c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
17 changed files with 119 additions and 168 deletions

View file

@ -24,6 +24,7 @@ import {
} from '@fortawesome/react-native-fontawesome'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {useQueryClient} from '@tanstack/react-query'
import {FeedNotification} from '#/state/queries/notifications/feed'
import {useAnimatedValue} from 'lib/hooks/useAnimatedValue'
@ -36,6 +37,7 @@ import {pluralize} from 'lib/strings/helpers'
import {niceDate} from 'lib/strings/time'
import {colors, s} from 'lib/styles'
import {isWeb} from 'platform/detection'
import {precacheProfile} from 'state/queries/profile'
import {Link as NewLink} from '#/components/Link'
import {ProfileHoverCard} from '#/components/ProfileHoverCard'
import {FeedSourceCard} from '../feeds/FeedSourceCard'
@ -52,13 +54,9 @@ const MAX_AUTHORS = 5
const EXPANDED_AUTHOR_EL_HEIGHT = 35
interface Author {
profile: AppBskyActorDefs.ProfileViewBasic
href: string
did: string
handle: string
displayName?: string
avatar?: string
moderation: ModerationDecision
associated?: AppBskyActorDefs.ProfileAssociated
}
let FeedItem = ({
@ -68,6 +66,7 @@ let FeedItem = ({
item: FeedNotification
moderationOpts: ModerationOpts
}): React.ReactNode => {
const queryClient = useQueryClient()
const pal = usePalette('default')
const {_} = useLingui()
const [isAuthorsExpanded, setAuthorsExpanded] = useState<boolean>(false)
@ -95,28 +94,22 @@ let FeedItem = ({
setAuthorsExpanded(currentlyExpanded => !currentlyExpanded)
}
const onBeforePress = React.useCallback(() => {
precacheProfile(queryClient, item.notification.author)
}, [queryClient, item.notification.author])
const authors: Author[] = useMemo(() => {
return [
{
profile: item.notification.author,
href: makeProfileLink(item.notification.author),
did: item.notification.author.did,
handle: item.notification.author.handle,
displayName: item.notification.author.displayName,
avatar: item.notification.author.avatar,
moderation: moderateProfile(item.notification.author, moderationOpts),
associated: item.notification.author.associated,
},
...(item.additional?.map(({author}) => {
return {
href: makeProfileLink(author),
did: author.did,
handle: author.handle,
displayName: author.displayName,
avatar: author.avatar,
moderation: moderateProfile(author, moderationOpts),
associated: author.associated,
}
}) || []),
...(item.additional?.map(({author}) => ({
profile: author,
href: makeProfileLink(author),
moderation: moderateProfile(author, moderationOpts),
})) || []),
]
}, [item, moderationOpts])
@ -201,7 +194,8 @@ let FeedItem = ({
accessible={
(item.type === 'post-like' && authors.length === 1) ||
item.type === 'repost'
}>
}
onBeforePress={onBeforePress}>
<View style={styles.layoutIcon}>
{/* TODO: Prevent conditional rendering and move toward composable
notifications for clearer accessibility labeling */}
@ -231,7 +225,7 @@ let FeedItem = ({
style={[pal.text, s.bold]}
href={authors[0].href}
text={sanitizeDisplayName(
authors[0].displayName || authors[0].handle,
authors[0].profile.displayName || authors[0].profile.handle,
)}
disableMismatchWarning
/>
@ -339,11 +333,9 @@ function CondensedAuthorsList({
<View style={styles.avis}>
<PreviewableUserAvatar
size={35}
did={authors[0].did}
handle={authors[0].handle}
avatar={authors[0].avatar}
profile={authors[0].profile}
moderation={authors[0].moderation.ui('avatar')}
type={authors[0].associated?.labeler ? 'labeler' : 'user'}
type={authors[0].profile.associated?.labeler ? 'labeler' : 'user'}
/>
</View>
)
@ -360,11 +352,9 @@ function CondensedAuthorsList({
<View key={author.href} style={s.mr5}>
<PreviewableUserAvatar
size={35}
did={author.did}
handle={author.handle}
avatar={author.avatar}
profile={author.profile}
moderation={author.moderation.ui('avatar')}
type={author.associated?.labeler ? 'labeler' : 'user'}
type={author.profile.associated?.labeler ? 'labeler' : 'user'}
/>
</View>
))}
@ -415,20 +405,20 @@ function ExpandedAuthorsList({
]}>
{authors.map(author => (
<NewLink
key={author.did}
key={author.profile.did}
label={_(msg`See profile`)}
to={makeProfileLink({
did: author.did,
handle: author.handle,
did: author.profile.did,
handle: author.profile.handle,
})}
style={styles.expandedAuthor}>
<View style={styles.expandedAuthorAvi}>
<ProfileHoverCard did={author.did}>
<ProfileHoverCard did={author.profile.did}>
<UserAvatar
size={35}
avatar={author.avatar}
avatar={author.profile.avatar}
moderation={author.moderation.ui('avatar')}
type={author.associated?.labeler ? 'labeler' : 'user'}
type={author.profile.associated?.labeler ? 'labeler' : 'user'}
/>
</ProfileHoverCard>
</View>
@ -438,10 +428,12 @@ function ExpandedAuthorsList({
numberOfLines={1}
style={pal.text}
lineHeight={1.2}>
{sanitizeDisplayName(author.displayName || author.handle)}
{sanitizeDisplayName(
author.profile.displayName || author.profile.handle,
)}
&nbsp;
<Text style={[pal.textLight]} lineHeight={1.2}>
{sanitizeHandle(author.handle)}
{sanitizeHandle(author.profile.handle)}
</Text>
</Text>
</View>