Bluesky app fork with some witchin' additions 💫

Merge pull request #9853 from bluesky-social/d/profile-screen

Use Tanstack Query isPending over isLoading

authored by

DS Boyce and committed by
GitHub
8a088e87 37e5a0f7

+27 -27
+27 -27
src/view/screens/Profile.tsx
··· 1 - import React, {useCallback, useMemo} from 'react' 2 import {StyleSheet} from 'react-native' 3 import {SafeAreaView} from 'react-native-safe-area-context' 4 import { ··· 79 data: resolvedDid, 80 error: resolveError, 81 refetch: refetchDid, 82 - isLoading: isLoadingDid, 83 } = useResolveDidQuery(name) 84 const { 85 data: profile, 86 error: profileError, 87 refetch: refetchProfile, 88 - isLoading: isLoadingProfile, 89 isPlaceholderData: isPlaceholderProfile, 90 } = useProfileQuery({ 91 did: resolvedDid, 92 }) 93 94 - const onPressTryAgain = React.useCallback(() => { 95 if (resolveError) { 96 - refetchDid() 97 } else { 98 - refetchProfile() 99 } 100 }, [resolveError, refetchDid, refetchProfile]) 101 102 // Apply hard-coded redirects as need 103 - React.useEffect(() => { 104 if (resolveError) { 105 if (name === 'lulaoficial.bsky.social') { 106 console.log('Applying redirect to lula.com.br') 107 - navigate('Profile', {name: 'lula.com.br'}) 108 } 109 } 110 }, [name, resolveError]) 111 112 // When we open the profile, we want to reset the posts query if we are blocked. 113 - React.useEffect(() => { 114 if (resolvedDid && profile?.viewer?.blockedBy) { 115 resetProfilePostsQueries(queryClient, resolvedDid) 116 } 117 }, [queryClient, profile?.viewer?.blockedBy, resolvedDid]) 118 119 // Most pushes will happen here, since we will have only placeholder data 120 - if (isLoadingDid || isLoadingProfile) { 121 return ( 122 <Layout.Content> 123 <ProfileHeaderLoading /> ··· 186 did: profile.did, 187 enabled: !!profile.associated?.labeler, 188 }) 189 - const [currentPage, setCurrentPage] = React.useState(0) 190 const {_} = useLingui() 191 192 - const [scrollViewTag, setScrollViewTag] = React.useState<number | null>(null) 193 194 - const postsSectionRef = React.useRef<SectionRef>(null) 195 - const repliesSectionRef = React.useRef<SectionRef>(null) 196 - const mediaSectionRef = React.useRef<SectionRef>(null) 197 - const videosSectionRef = React.useRef<SectionRef>(null) 198 - const likesSectionRef = React.useRef<SectionRef>(null) 199 - const feedsSectionRef = React.useRef<SectionRef>(null) 200 - const listsSectionRef = React.useRef<SectionRef>(null) 201 - const starterPacksSectionRef = React.useRef<SectionRef>(null) 202 - const labelsSectionRef = React.useRef<SectionRef>(null) 203 204 useSetTitle(combinedDisplayName(profile)) 205 ··· 315 ) 316 317 useFocusEffect( 318 - React.useCallback(() => { 319 setMinimalShellMode(false) 320 return listenSoftReset(() => { 321 scrollSectionToTop(currentPage) ··· 601 602 function useRichText(text: string): [RichTextAPI, boolean] { 603 const agent = useAgent() 604 - const [prevText, setPrevText] = React.useState(text) 605 - const [rawRT, setRawRT] = React.useState(() => new RichTextAPI({text})) 606 - const [resolvedRT, setResolvedRT] = React.useState<RichTextAPI | null>(null) 607 if (text !== prevText) { 608 setPrevText(text) 609 setRawRT(new RichTextAPI({text})) 610 setResolvedRT(null) 611 // This will queue an immediate re-render 612 } 613 - React.useEffect(() => { 614 let ignore = false 615 async function resolveRTFacets() { 616 // new each time ··· 620 setResolvedRT(resolvedRT) 621 } 622 } 623 - resolveRTFacets() 624 return () => { 625 ignore = true 626 }
··· 1 + import {useCallback, useEffect, useMemo, useRef, useState} from 'react' 2 import {StyleSheet} from 'react-native' 3 import {SafeAreaView} from 'react-native-safe-area-context' 4 import { ··· 79 data: resolvedDid, 80 error: resolveError, 81 refetch: refetchDid, 82 + isPending: isDidPending, 83 } = useResolveDidQuery(name) 84 const { 85 data: profile, 86 error: profileError, 87 refetch: refetchProfile, 88 isPlaceholderData: isPlaceholderProfile, 89 + isPending: isProfilePending, 90 } = useProfileQuery({ 91 did: resolvedDid, 92 }) 93 94 + const onPressTryAgain = useCallback(() => { 95 if (resolveError) { 96 + void refetchDid() 97 } else { 98 + void refetchProfile() 99 } 100 }, [resolveError, refetchDid, refetchProfile]) 101 102 // Apply hard-coded redirects as need 103 + useEffect(() => { 104 if (resolveError) { 105 if (name === 'lulaoficial.bsky.social') { 106 console.log('Applying redirect to lula.com.br') 107 + void navigate('Profile', {name: 'lula.com.br'}) 108 } 109 } 110 }, [name, resolveError]) 111 112 // When we open the profile, we want to reset the posts query if we are blocked. 113 + useEffect(() => { 114 if (resolvedDid && profile?.viewer?.blockedBy) { 115 resetProfilePostsQueries(queryClient, resolvedDid) 116 } 117 }, [queryClient, profile?.viewer?.blockedBy, resolvedDid]) 118 119 // Most pushes will happen here, since we will have only placeholder data 120 + if (isDidPending || isProfilePending) { 121 return ( 122 <Layout.Content> 123 <ProfileHeaderLoading /> ··· 186 did: profile.did, 187 enabled: !!profile.associated?.labeler, 188 }) 189 + const [currentPage, setCurrentPage] = useState(0) 190 const {_} = useLingui() 191 192 + const [scrollViewTag, setScrollViewTag] = useState<number | null>(null) 193 194 + const postsSectionRef = useRef<SectionRef>(null) 195 + const repliesSectionRef = useRef<SectionRef>(null) 196 + const mediaSectionRef = useRef<SectionRef>(null) 197 + const videosSectionRef = useRef<SectionRef>(null) 198 + const likesSectionRef = useRef<SectionRef>(null) 199 + const feedsSectionRef = useRef<SectionRef>(null) 200 + const listsSectionRef = useRef<SectionRef>(null) 201 + const starterPacksSectionRef = useRef<SectionRef>(null) 202 + const labelsSectionRef = useRef<SectionRef>(null) 203 204 useSetTitle(combinedDisplayName(profile)) 205 ··· 315 ) 316 317 useFocusEffect( 318 + useCallback(() => { 319 setMinimalShellMode(false) 320 return listenSoftReset(() => { 321 scrollSectionToTop(currentPage) ··· 601 602 function useRichText(text: string): [RichTextAPI, boolean] { 603 const agent = useAgent() 604 + const [prevText, setPrevText] = useState(text) 605 + const [rawRT, setRawRT] = useState(() => new RichTextAPI({text})) 606 + const [resolvedRT, setResolvedRT] = useState<RichTextAPI | null>(null) 607 if (text !== prevText) { 608 setPrevText(text) 609 setRawRT(new RichTextAPI({text})) 610 setResolvedRT(null) 611 // This will queue an immediate re-render 612 } 613 + useEffect(() => { 614 let ignore = false 615 async function resolveRTFacets() { 616 // new each time ··· 620 setResolvedRT(resolvedRT) 621 } 622 } 623 + void resolveRTFacets() 624 return () => { 625 ignore = true 626 }