Set profile hover prefetch stale time to 30s (#4417)

* Set prefetch stale time to 30s

* Run prefetch on mouseOver

* Only prefetch once on mousemove
zio/stable
Eric Bailey 2024-06-12 21:44:06 -05:00 committed by GitHub
parent 247af5aee9
commit d989128e5b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 42 additions and 34 deletions

View File

@ -94,6 +94,7 @@ export function usePrefetchProfileQuery() {
const prefetchProfileQuery = useCallback( const prefetchProfileQuery = useCallback(
async (did: string) => { async (did: string) => {
await queryClient.prefetchQuery({ await queryClient.prefetchQuery({
staleTime: STALE.SECONDS.THIRTY,
queryKey: RQKEY(did), queryKey: RQKEY(did),
queryFn: async () => { queryFn: async () => {
const res = await agent.getProfile({actor: did || ''}) const res = await agent.getProfile({actor: did || ''})

View File

@ -11,6 +11,7 @@ import {sanitizeHandle} from 'lib/strings/handles'
import {niceDate} from 'lib/strings/time' import {niceDate} from 'lib/strings/time'
import {TypographyVariant} from 'lib/ThemeContext' import {TypographyVariant} from 'lib/ThemeContext'
import {isAndroid, isWeb} from 'platform/detection' import {isAndroid, isWeb} from 'platform/detection'
import {atoms as a} from '#/alf'
import {ProfileHoverCard} from '#/components/ProfileHoverCard' import {ProfileHoverCard} from '#/components/ProfileHoverCard'
import {TextLinkOnWebOnly} from './Link' import {TextLinkOnWebOnly} from './Link'
import {Text} from './text/Text' import {Text} from './text/Text'
@ -39,9 +40,13 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => {
const prefetchProfileQuery = usePrefetchProfileQuery() const prefetchProfileQuery = usePrefetchProfileQuery()
const profileLink = makeProfileLink(opts.author) const profileLink = makeProfileLink(opts.author)
const onPointerEnter = isWeb const prefetchedProfile = React.useRef(false)
? () => prefetchProfileQuery(opts.author.did) const onPointerMove = React.useCallback(() => {
: undefined if (!prefetchedProfile.current) {
prefetchedProfile.current = true
prefetchProfileQuery(opts.author.did)
}
}, [opts.author.did, prefetchProfileQuery])
const queryClient = useQueryClient() const queryClient = useQueryClient()
const onOpenAuthor = opts.onOpenAuthor const onOpenAuthor = opts.onOpenAuthor
@ -66,6 +71,9 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => {
</View> </View>
)} )}
<ProfileHoverCard inline did={opts.author.did}> <ProfileHoverCard inline did={opts.author.did}>
<View
onPointerMove={isWeb ? onPointerMove : undefined}
style={[a.flex_1]}>
<Text <Text
numberOfLines={1} numberOfLines={1}
style={[styles.maxWidth, pal.textLight, opts.displayNameStyle]}> style={[styles.maxWidth, pal.textLight, opts.displayNameStyle]}>
@ -84,7 +92,6 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => {
} }
href={profileLink} href={profileLink}
onBeforePress={onBeforePressAuthor} onBeforePress={onBeforePressAuthor}
onPointerEnter={onPointerEnter}
/> />
<TextLinkOnWebOnly <TextLinkOnWebOnly
type="md" type="md"
@ -93,10 +100,10 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => {
text={'\xa0' + sanitizeHandle(handle, '@')} text={'\xa0' + sanitizeHandle(handle, '@')}
href={profileLink} href={profileLink}
onBeforePress={onBeforePressAuthor} onBeforePress={onBeforePressAuthor}
onPointerEnter={onPointerEnter}
anchorNoUnderline anchorNoUnderline
/> />
</Text> </Text>
</View>
</ProfileHoverCard> </ProfileHoverCard>
{!isAndroid && ( {!isAndroid && (
<Text <Text