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

···
 } 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,
···
 import {useModalControls} from '#/state/modals'
 import {useLightboxControls, ProfileImageLightbox} from '#/state/lightbox'
 import {
+  RQKEY as profileQueryKey,
   useProfileMuteMutationQueue,
   useProfileBlockMutationQueue,
   useProfileFollowMutationQueue,
···
   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()) {
···
       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')
···
       })
       if (!isMe) {
         if (!profile.viewer?.blocking) {
-          items.push({
-            testID: 'profileHeaderDropdownMuteBtn',
-            label: profile.viewer?.muted
-              ? _(msg`Unmute Account`)
-              : _(msg`Mute Account`),
-            onPress: profile.viewer?.muted
-              ? onPressUnmuteAccount
-              : onPressMuteAccount,
-            icon: {
-              ios: {
-                name: 'speaker.slash',
+          if (!profile.viewer?.mutedByList) {
+            items.push({
+              testID: 'profileHeaderDropdownMuteBtn',
+              label: profile.viewer?.muted
+                ? _(msg`Unmute Account`)
+                : _(msg`Mute Account`),
+              onPress: profile.viewer?.muted
+                ? onPressUnmuteAccount
+                : onPressMuteAccount,
+              icon: {
+                ios: {
+                  name: 'speaker.slash',
+                },
+                android: 'ic_lock_silent_mode',
+                web: 'comment-slash',
               },
-              android: 'ic_lock_silent_mode',
-              web: 'comment-slash',
-            },
-          })
+            })
+          }
         }
         if (!profile.viewer?.blockingByList) {
           items.push({
···
     isMe,
     hasSession,
     profile.viewer?.muted,
+    profile.viewer?.mutedByList,
     profile.viewer?.blocking,
     profile.viewer?.blockingByList,
     onPressShare,

src/view/screens/Profile.tsx

···
     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,
   })
···
     }
   }, [resolveError, refetchDid, refetchProfile])
 
-  if (isFetchingDid || isFetchingProfile || !moderationOpts) {
+  if (isInitialLoadingDid || isInitialLoadingProfile || !moderationOpts) {
     return (
       <CenteredView>
         <ProfileHeader