Fix threads

src/app/components/Content.svelte

@@ -50,6 +50,8 @@
     return false
   }
 
+  const isStartAndEnd = (i: number) => Boolean(isBoundary(i - 1) && isBoundary(i + 1))
+
   const isStartOrEnd = (i: number) => Boolean(isBoundary(i - 1) || isBoundary(i + 1))
 
   const isBlock = (i: number) => {
@@ -81,7 +83,7 @@
       {:else if isTopic(parsed)}
         <ContentTopic value={parsed.value} />
       {:else if isCode(parsed)}
-        <ContentCode value={parsed.value} />
+        <ContentCode value={parsed.value} isBlock={isStartAndEnd(i)} />
       {:else if isCashu(parsed) || isInvoice(parsed)}
         <ContentToken value={parsed.value} />
       {:else if isLink(parsed)}

src/app/components/ContentCode.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
   export let value
+  export let isBlock
 </script>
 
-<pre>
-  <code class="link-content block w-full">
-    {value}
-  </code>
-</pre>
+<code class="link-content w-full" class:block={isBlock}>
+  {value}
+</code>

src/app/components/ThreadItem.svelte

@@ -1,29 +1,32 @@
 <script lang="ts">
   import {nip19} from "nostr-tools"
   import {ctx} from "@welshman/lib"
+  import {repository} from "@welshman/app"
+  import {getReplyFilters} from "@welshman/util"
+  import {deriveEvents} from "@welshman/store"
   import Icon from "@lib/components/Icon.svelte"
   import Link from "@lib/components/Link.svelte"
   import Content from "@app/components/Content.svelte"
   import NoteCard from "@app/components/NoteCard.svelte"
   import {entityLink} from "@app/state"
 
-  export let root
-  export let replies
+  export let event
 
-  const relays = ctx.app.router.Event(root).getUrls()
-  const nevent = nip19.neventEncode({...root, relays})
+  const replies = deriveEvents(repository, {filters: getReplyFilters([event])})
+  const relays = ctx.app.router.Event(event).getUrls()
+  const nevent = nip19.neventEncode({...event, relays})
 </script>
 
 <div class="flex flex-col items-end">
-  <NoteCard event={root} class="card2 bg-alt w-full">
+  <NoteCard {event} class="card2 bg-alt w-full">
     <div class="ml-12">
-      <Content event={root} />
+      <Content {event} />
     </div>
   </NoteCard>
   <Link
     href={entityLink(nevent)}
     class="btn btn-neutral z-feature -mt-6 mr-4 flex items-center gap-2 rounded-full">
     <Icon icon="chat-round" />
-    <span>{replies.length}</span>
+    <span>{$replies.length}</span>
   </Link>
 </div>

src/app/state.ts

@@ -17,7 +17,6 @@ import {
 } from "@welshman/lib"
 import {
   getIdFilters,
-  NOTE,
   WRAP,
   RELAYS,
   REACTION,
@@ -27,8 +26,6 @@ import {
   EVENT_TIME,
   getRelayTagValues,
   isShareableRelayUrl,
-  getAncestorTags,
-  getAncestorTagValues,
   getPubkeyTagValues,
   isHashedEvent,
   displayProfile,
@@ -60,7 +57,7 @@ import {
 } from "@welshman/app"
 import type {AppSyncOpts} from "@welshman/app"
 import type {SubscribeRequestWithHandlers} from "@welshman/net"
-import {throttled, deriveEvents, deriveEventsMapped, withGetter} from "@welshman/store"
+import {deriveEvents, deriveEventsMapped, withGetter} from "@welshman/store"
 
 export const ROOM = "~"
 
@@ -394,46 +391,6 @@ export const eventsByUrl = derived([trackerStore, events], ([$tracker, $events])
   return eventsByUrl
 })
 
-// Threads
-
-export type Thread = {
-  root: TrustedEvent
-  replies: TrustedEvent[]
-}
-
-export const notes = deriveEvents(repository, {filters: [{kinds: [NOTE]}]})
-
-export const threadsByUrl = derived(
-  [throttled(300, trackerStore), throttled(300, notes)],
-  ([$tracker, $notes]) => {
-    const threadsByUrl = new Map<string, Thread[]>()
-    const [parents, children] = partition(e => getAncestorTags(e.tags).replies.length === 0, $notes)
-
-    for (const event of parents) {
-      for (const url of $tracker.getRelays(event.id)) {
-        pushToMapKey(threadsByUrl, url, {root: event, replies: []})
-      }
-    }
-
-    for (const event of children) {
-      const [id] = getAncestorTagValues(event.tags).replies
-
-      for (const url of $tracker.getRelays(event.id)) {
-        const threads = threadsByUrl.get(url) || []
-        const thread = threads.find(thread => thread.root.id === id)
-
-        if (!thread) {
-          continue
-        }
-
-        thread.replies.push(event)
-      }
-    }
-
-    return threadsByUrl
-  },
-)
-
 // Rooms
 
 export const roomsByUrl = derived(channels, $channels => {