feat(mute): collapse muted-thread embeds with reveal (parity with muted users)

src/components/Note/MutedNote.tsx

@@ -2,12 +2,22 @@ import { Button } from '@/components/ui/button'
 import { Eye } from 'lucide-react'
 import { useTranslation } from 'react-i18next'
 
-export default function MutedNote({ show }: { show: () => void }) {
+export default function MutedNote({
+  show,
+  reason = 'user'
+}: {
+  show: () => void
+  reason?: 'user' | 'thread'
+}) {
   const { t } = useTranslation()
 
   return (
     <div className="text-muted-foreground my-4 flex flex-col items-center gap-2 font-medium">
-      <div>{t('This user has been muted')}</div>
+      <div>
+        {reason === 'thread'
+          ? t('This note is from a thread you muted')
+          : t('This user has been muted')}
+      </div>
       <Button
         onClick={(e) => {
           e.stopPropagation()

src/components/Note/index.tsx

@@ -1,7 +1,7 @@
 import { useSecondaryPage } from '@/DeckManager'
 import { ExtendedKind, NSFW_DISPLAY_POLICY, SUPPORTED_KINDS } from '@/constants'
 import { cn } from '@/lib/utils'
-import { getParentStuff, isNsfwEvent } from '@/lib/event'
+import { getParentStuff, isInMutedThread, isNsfwEvent } from '@/lib/event'
 import { toExternalContent, toNote } from '@/lib/link'
 import { generateBech32IdFromATag, generateBech32IdFromETag, tagNameEquals } from '@/lib/tag'
 import { useContentPolicy } from '@/providers/ContentPolicyProvider'
@@ -77,7 +77,7 @@ export default function Note({
   }, [event])
   const { nsfwDisplayPolicy } = useContentPolicy()
   const [showNsfw, setShowNsfw] = useState(false)
-  const { mutePubkeySet } = useMuteList()
+  const { mutePubkeySet, muteEventIdSet } = useMuteList()
   const [showMuted, setShowMuted] = useState(false)
   const isNsfw = useMemo(
     () => (nsfwDisplayPolicy === NSFW_DISPLAY_POLICY.SHOW ? false : isNsfwEvent(event)),
@@ -104,6 +104,8 @@ export default function Note({
     content = <UnknownNote className="mt-1" event={event} />
   } else if (mutePubkeySet.has(event.pubkey) && !showMuted) {
     content = <MutedNote show={() => setShowMuted(true)} />
+  } else if (isInMutedThread(event, muteEventIdSet) && !showMuted) {
+    content = <MutedNote reason="thread" show={() => setShowMuted(true)} />
   } else if (isNsfw && !showNsfw) {
     content = <NsfwNote show={() => setShowNsfw(true)} />
   } else if (event.kind === kinds.Highlights) {

src/components/NoteCard/index.tsx

@@ -1,7 +1,7 @@
 import { UserAvatarSkeleton } from '@/components/UserAvatar'
 import { Skeleton } from '@/components/ui/skeleton'
 import { NSFW_DISPLAY_POLICY } from '@/constants'
-import { isMentioningMutedUsers, isNsfwEvent } from '@/lib/event'
+import { isInMutedThread, isMentioningMutedUsers, isNsfwEvent } from '@/lib/event'
 import { cn } from '@/lib/utils'
 import { useContentPolicy } from '@/providers/ContentPolicyProvider'
 import { useMuteList } from '@/providers/UserListsProvider'
@@ -23,20 +23,23 @@ function NoteCardImpl({
   pinned?: boolean
   reposters?: string[]
 }) {
-  const { mutePubkeySet } = useMuteList()
+  const { mutePubkeySet, muteEventIdSet } = useMuteList()
   const { hideContentMentioningMutedUsers, nsfwDisplayPolicy } = useContentPolicy()
   const shouldHide = useMemo(() => {
     if (filterMutedNotes && mutePubkeySet.has(event.pubkey)) {
       return true
     }
+    if (filterMutedNotes && isInMutedThread(event, muteEventIdSet)) {
+      return true
+    }
     if (hideContentMentioningMutedUsers && isMentioningMutedUsers(event, mutePubkeySet)) {
       return true
     }
     if (nsfwDisplayPolicy === NSFW_DISPLAY_POLICY.HIDE && isNsfwEvent(event)) {
       return true
     }
     return false
-  }, [event, filterMutedNotes, mutePubkeySet, nsfwDisplayPolicy])
+  }, [event, filterMutedNotes, mutePubkeySet, muteEventIdSet, nsfwDisplayPolicy])
   if (shouldHide) return null
 
   if (event.kind === kinds.Repost || event.kind === kinds.GenericRepost) {

src/hooks/useFilteredReplies.tsx

@@ -1,4 +1,4 @@
-import { getEventKey, isMentioningMutedUsers } from '@/lib/event'
+import { getEventKey, isInMutedThread, isMentioningMutedUsers } from '@/lib/event'
 import { useContentPolicy } from '@/providers/ContentPolicyProvider'
 import { useMuteList } from '@/providers/UserListsProvider'
 import { useNostr } from '@/providers/NostrProvider'
@@ -8,7 +8,7 @@ import { useAllDescendantThreads } from './useThread'
 
 export function useFilteredReplies(stuffKey: string) {
   const { pubkey } = useNostr()
-  const { mutePubkeySet } = useMuteList()
+  const { mutePubkeySet, muteEventIdSet } = useMuteList()
   const { hideContentMentioningMutedUsers } = useContentPolicy()
   const allThreads = useAllDescendantThreads(stuffKey)
   const [replies, setReplies] = useState<NostrEvent[]>([])
@@ -25,14 +25,15 @@ export function useFilteredReplies(stuffKey: string) {
       replyKeySet.add(key)
 
       if (mutePubkeySet.has(evt.pubkey)) continue
+      if (isInMutedThread(evt, muteEventIdSet)) continue
       if (hideContentMentioningMutedUsers && isMentioningMutedUsers(evt, mutePubkeySet)) continue
 
       filtered.push(evt)
     }
 
     filtered.sort((a, b) => b.created_at - a.created_at)
     setReplies(filtered)
-  }, [stuffKey, allThreads, mutePubkeySet, hideContentMentioningMutedUsers])
+  }, [stuffKey, allThreads, mutePubkeySet, muteEventIdSet, hideContentMentioningMutedUsers])
 
   useEffect(() => {
     let replied = false
@@ -51,7 +52,7 @@ export function useFilteredReplies(stuffKey: string) {
 export function useFilteredAllReplies(stuffKey: string) {
   const { pubkey } = useNostr()
   const allThreads = useAllDescendantThreads(stuffKey)
-  const { mutePubkeySet } = useMuteList()
+  const { mutePubkeySet, muteEventIdSet } = useMuteList()
   const { hideContentMentioningMutedUsers } = useContentPolicy()
   const [replies, setReplies] = useState<NostrEvent[]>([])
   const [hasReplied, setHasReplied] = useState(false)
@@ -76,7 +77,7 @@ export function useFilteredAllReplies(stuffKey: string) {
       parentKeys = events.map((evt) => getEventKey(evt))
     }
     setReplies(replyEvents.sort((a, b) => a.created_at - b.created_at))
-  }, [stuffKey, allThreads, mutePubkeySet, hideContentMentioningMutedUsers])
+  }, [stuffKey, allThreads, mutePubkeySet, muteEventIdSet, hideContentMentioningMutedUsers])
 
   useEffect(() => {
     let replied = false

src/i18n/locales/en.ts

@@ -1081,6 +1081,7 @@ export default {
     'Configure relay sets': 'Configure relay sets',
     'Mute thread': 'Mute thread',
     'Unmute thread': 'Unmute thread',
-    'Muted threads': 'Muted threads'
+    'Muted threads': 'Muted threads',
+    'This note is from a thread you muted': 'This note is from a thread you muted'
   }
 }