Hide normal mute if muted by list, and invalidate profile query upon list mute (#2048)

* Hide normal mute if muted by list, and invalidate profile query upon list mute

* Prevent profile flashing

src/view/com/profile/ProfileHeader.tsx

@@ -7,6 +7,7 @@ import {
 } from 'react-native'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {useNavigation} from '@react-navigation/native'
+import {useQueryClient} from '@tanstack/react-query'
 import {
   AppBskyActorDefs,
   ProfileModeration,
@@ -32,6 +33,7 @@ import {ProfileHeaderSuggestedFollows} from './ProfileHeaderSuggestedFollows'
 import {useModalControls} from '#/state/modals'
 import {useLightboxControls, ProfileImageLightbox} from '#/state/lightbox'
 import {
+  RQKEY as profileQueryKey,
   useProfileMuteMutationQueue,
   useProfileBlockMutationQueue,
   useProfileFollowMutationQueue,
@@ -134,6 +136,13 @@ let ProfileHeaderLoaded = ({
   const [queueFollow, queueUnfollow] = useProfileFollowMutationQueue(profile)
   const [queueMute, queueUnmute] = useProfileMuteMutationQueue(profile)
   const [queueBlock, queueUnblock] = useProfileBlockMutationQueue(profile)
+  const queryClient = useQueryClient()
+
+  const invalidateProfileQuery = React.useCallback(() => {
+    queryClient.invalidateQueries({
+      queryKey: profileQueryKey(profile.did),
+    })
+  }, [queryClient, profile.did])
 
   const onPressBack = React.useCallback(() => {
     if (navigation.canGoBack()) {
@@ -209,8 +218,10 @@ let ProfileHeaderLoaded = ({
       name: 'user-add-remove-lists',
       subject: profile.did,
       displayName: profile.displayName || profile.handle,
+      onAdd: invalidateProfileQuery,
+      onRemove: invalidateProfileQuery,
     })
-  }, [track, profile, openModal])
+  }, [track, profile, openModal, invalidateProfileQuery])
 
   const onPressMuteAccount = React.useCallback(async () => {
     track('ProfileHeader:MuteAccountButtonClicked')
@@ -325,6 +336,7 @@ let ProfileHeaderLoaded = ({
       })
       if (!isMe) {
         if (!profile.viewer?.blocking) {
+          if (!profile.viewer?.mutedByList) {
             items.push({
               testID: 'profileHeaderDropdownMuteBtn',
               label: profile.viewer?.muted
@@ -342,6 +354,7 @@ let ProfileHeaderLoaded = ({
               },
             })
           }
+        }
         if (!profile.viewer?.blockingByList) {
           items.push({
             testID: 'profileHeaderDropdownBlockBtn',
@@ -379,6 +392,7 @@ let ProfileHeaderLoaded = ({
     isMe,
     hasSession,
     profile.viewer?.muted,
+    profile.viewer?.mutedByList,
     profile.viewer?.blocking,
     profile.viewer?.blockingByList,
     onPressShare,

src/view/screens/Profile.tsx

@@ -50,13 +50,13 @@ export function ProfileScreen({route}: Props) {
     data: resolvedDid,
     error: resolveError,
     refetch: refetchDid,
-    isFetching: isFetchingDid,
+    isInitialLoading: isInitialLoadingDid,
   } = useResolveDidQuery(name)
   const {
     data: profile,
     error: profileError,
     refetch: refetchProfile,
-    isFetching: isFetchingProfile,
+    isInitialLoading: isInitialLoadingProfile,
   } = useProfileQuery({
     did: resolvedDid,
   })
@@ -69,7 +69,7 @@ export function ProfileScreen({route}: Props) {
     }
   }, [resolveError, refetchDid, refetchProfile])
 
-  if (isFetchingDid || isFetchingProfile || !moderationOpts) {
+  if (isInitialLoadingDid || isInitialLoadingProfile || !moderationOpts) {
     return (
       <CenteredView>
         <ProfileHeader