diff options
Diffstat (limited to 'src/view/com/notifications/FeedItem.tsx')
| -rw-r--r-- | src/view/com/notifications/FeedItem.tsx | 70 |
1 files changed, 31 insertions, 39 deletions
diff --git a/src/view/com/notifications/FeedItem.tsx b/src/view/com/notifications/FeedItem.tsx index 3c9c64061..94844cb1a 100644 --- a/src/view/com/notifications/FeedItem.tsx +++ b/src/view/com/notifications/FeedItem.tsx @@ -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, + )} <Text style={[pal.textLight]} lineHeight={1.2}> - {sanitizeHandle(author.handle)} + {sanitizeHandle(author.profile.handle)} </Text> </Text> </View> |