Handle muting correctly

src/lib/moderation.ts

@@ -1,6 +1,7 @@
 import React from 'react'
 import {
   ModerationCause,
+  ModerationUI,
   LABEL_GROUPS,
   LabelGroupDefinition,
   AppBskyModerationDefs,
@@ -22,6 +23,10 @@ export function getModerationCauseKey(cause: ModerationCause): string {
   return `${cause.type}:${source}`
 }
 
+export function isJustAMute(modui: ModerationUI): boolean {
+  return modui.filters.length === 1 && modui.filters[0].type === 'muted'
+}
+
 export function getLabelGroupsFromLabels(labels: string[]) {
   const groups: LabelGroupDefinition[] = []
 

src/lib/moderation/useModerationCauseDescription.ts

@@ -58,18 +58,12 @@ export function useModerationCauseDescription(
   if (cause.type === 'muted') {
     if (cause.source.type === 'list') {
       return {
-        name:
-          context === 'account'
-            ? _(msg`Muted by "${cause.source.list.name}"`)
-            : _(msg`Post by muted user ("${cause.source.list.name}")`),
+        name: _(msg`Muted by "${cause.source.list.name}"`),
         description: _(msg`You have muted this user`),
       }
     } else {
       return {
-        name:
-          context === 'account'
-            ? _(msg`Muted User`)
-            : _(msg`Post by muted user`),
+        name: _(msg`Muted User`),
         description: _(msg`You have muted this user`),
       }
     }

src/state/queries/actor-autocomplete.ts

@@ -8,6 +8,7 @@ import {useMyFollowsQuery} from '#/state/queries/my-follows'
 import {STALE} from '#/state/queries'
 import {DEFAULT_LOGGED_OUT_PREFERENCES, useModerationOpts} from './preferences'
 import {isInvalidHandle} from '#/lib/strings/handles'
+import {isJustAMute} from '#/lib/moderation'
 
 const DEFAULT_MOD_OPTS = DEFAULT_LOGGED_OUT_PREFERENCES.moderationOpts
 
@@ -107,8 +108,8 @@ function computeSuggestions(
     }
   }
   return items.filter(profile => {
-    const mod = moderateProfile(profile, moderationOpts).ui('profileList')
-    return !mod.filter // TODO && mod.account.cause?.type !== 'muted'
+    const modui = moderateProfile(profile, moderationOpts).ui('profileList')
+    return !modui.filter || isJustAMute(modui)
   })
 }
 

src/state/queries/post-feed.ts

@@ -230,9 +230,17 @@ export function usePostFeedQuery(
 
                   // apply moderation filter
                   for (let i = 0; i < slice.items.length; i++) {
+                    const ignoreFilter =
+                      slice.items[i].post.author.did === ignoreFilterFor
+                    if (ignoreFilter) {
+                      // remove mutes to avoid confused UIs
+                      moderations[i].causes = moderations[i].causes.filter(
+                        cause => cause.type !== 'muted',
+                      )
+                    }
                     if (
-                      moderations[i]?.ui('contentList').filter &&
-                      slice.items[i].post.author.did !== ignoreFilterFor
+                      !ignoreFilter &&
+                      moderations[i]?.ui('contentList').filter
                     ) {
                       return undefined
                     }

src/view/com/post-thread/PostThreadItem.tsx

@@ -173,7 +173,6 @@ let PostThreadItemLoaded = ({
   const itemTitle = _(msg`Post by ${post.author.handle}`)
   const authorHref = makeProfileLink(post.author)
   const authorTitle = post.author.handle
-  const isAuthorMuted = post.author.viewer?.muted
   const likesHref = React.useMemo(() => {
     const urip = new AtUri(post.uri)
     return makeProfileLink(post.author, 'post', urip.rkey, 'liked-by')
@@ -275,30 +274,6 @@ let PostThreadItemLoaded = ({
                 </Link>
               </View>
               <View style={styles.meta}>
-                {isAuthorMuted && (
-                  <View
-                    style={[
-                      pal.viewLight,
-                      {
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        gap: 4,
-                        borderRadius: 6,
-                        paddingHorizontal: 6,
-                        paddingVertical: 2,
-                        marginRight: 4,
-                      },
-                    ]}>
-                    <FontAwesomeIcon
-                      icon={['far', 'eye-slash']}
-                      size={12}
-                      color={pal.colors.textLight}
-                    />
-                    <Text type="sm-medium" style={pal.textLight}>
-                      Muted
-                    </Text>
-                  </View>
-                )}
                 <Link style={s.flex1} href={authorHref} title={authorTitle}>
                   <Text type="md" style={[pal.textLight]} numberOfLines={1}>
                     {sanitizeHandle(post.author.handle, '@')}

src/view/com/profile/ProfileCard.tsx

@@ -15,7 +15,7 @@ import {FollowButton} from './FollowButton'
 import {sanitizeDisplayName} from 'lib/strings/display-names'
 import {sanitizeHandle} from 'lib/strings/handles'
 import {makeProfileLink} from 'lib/routes/links'
-import {getModerationCauseKey} from 'lib/moderation'
+import {getModerationCauseKey, isJustAMute} from 'lib/moderation'
 import {Shadow} from '#/state/cache/types'
 import {useModerationOpts} from '#/state/queries/preferences'
 import {useProfileShadow} from '#/state/cache/profile-shadow'
@@ -52,7 +52,7 @@ export function ProfileCard({
   }
   const moderation = moderateProfile(profile, moderationOpts)
   const modui = moderation.ui('profileList')
-  if (!noModFilter && modui.filter /* TODO && modui.type !== 'muted'*/) {
+  if (!noModFilter && modui.filter && !isJustAMute(modui)) {
     return null
   }
 

src/view/com/util/moderation/ContentHider.tsx

@@ -4,6 +4,7 @@ import {ModerationUI} from '@atproto/api'
 import {useLingui} from '@lingui/react'
 import {msg, Trans} from '@lingui/macro'
 import {useModerationCauseDescription} from '#/lib/moderation/useModerationCauseDescription'
+import {isJustAMute} from '#/lib/moderation'
 
 import {atoms as a, useTheme, useBreakpoints} from '#/alf'
 import {Button, ButtonText, ButtonIcon} from '#/components/Button'
@@ -16,7 +17,7 @@ import {useOpenGlobalDialog} from '#/components/dialogs'
 export function ContentHider({
   testID,
   modui,
-  // ignoreMute, TODO
+  ignoreMute,
   style,
   childContainerStyle,
   children,
@@ -36,10 +37,7 @@ export function ContentHider({
   const blur = modui?.blurs[0]
   const desc = useModerationCauseDescription(blur, 'content')
 
-  if (
-    !blur
-    // || (ignoreMute && moderation.cause?.type === 'muted') TODO
-  ) {
+  if (!blur || (ignoreMute && isJustAMute(modui))) {
     return (
       <View testID={testID} style={[styles.outer, style]}>
         {children}

src/view/com/util/moderation/ProfileHeaderAlerts.tsx

@@ -44,7 +44,7 @@ export function ProfileHeaderAlerts({
 
 function ProfileInform({cause}: {cause: ModerationCause}) {
   const openDialog = useOpenGlobalDialog()
-  const desc = useModerationCauseDescription(cause, 'content')
+  const desc = useModerationCauseDescription(cause, 'account')
 
   return (
     <Button
@@ -55,7 +55,7 @@ function ProfileInform({cause}: {cause: ModerationCause}) {
       shape="default"
       onPress={() => {
         openDialog(ModerationDetailsDialog, {
-          context: 'content',
+          context: 'account',
           modcause: cause,
         })
       }}>
@@ -71,7 +71,7 @@ function ProfileInform({cause}: {cause: ModerationCause}) {
 function ProfileAlert({cause}: {cause: ModerationCause}) {
   const t = useTheme()
   const openDialog = useOpenGlobalDialog()
-  const desc = useModerationCauseDescription(cause, 'content')
+  const desc = useModerationCauseDescription(cause, 'account')
 
   return (
     <Button
@@ -82,7 +82,7 @@ function ProfileAlert({cause}: {cause: ModerationCause}) {
       shape="default"
       onPress={() => {
         openDialog(ModerationDetailsDialog, {
-          context: 'content',
+          context: 'account',
           modcause: cause,
         })
       }}>