Long form thread fixes

packages/app/src/Element/Thread.tsx

@@ -2,9 +2,9 @@ import "./Thread.css";
 import { useMemo, useState, ReactNode, useContext } from "react";
 import { useIntl } from "react-intl";
 import { useNavigate, useParams } from "react-router-dom";
-import { TaggedNostrEvent, u256, NostrPrefix, EventExt, parseNostrLink } from "@snort/system";
+import { TaggedNostrEvent, u256, NostrPrefix, EventExt, parseNostrLink, NostrLink } from "@snort/system";
 
-import { getReactions, getAllReactions } from "SnortUtils";
+import { getReactions, getAllReactions, unwrap } from "SnortUtils";
 import BackButton from "Element/BackButton";
 import Note from "Element/Note";
 import NoteGhost from "Element/NoteGhost";
@@ -154,9 +154,8 @@ const TierThree = ({ active, isLastSubthread, notes, related, chains, onNavigate
   return (
     <>
       <div
-        className={`subthread-container ${hasMultipleNotes ? "subthread-multi" : ""} ${
-          isLast ? "subthread-last" : "subthread-mid"
-        }`}>
+        className={`subthread-container ${hasMultipleNotes ? "subthread-multi" : ""} ${isLast ? "subthread-last" : "subthread-mid"
+          }`}>
         <Divider variant="small" />
         <Note
           highlight={active === first.id}
@@ -185,9 +184,8 @@ const TierThree = ({ active, isLastSubthread, notes, related, chains, onNavigate
         return (
           <div
             key={r.id}
-            className={`subthread-container ${lastReply ? "" : "subthread-multi"} ${
-              lastReply ? "subthread-last" : "subthread-mid"
-            }`}>
+            className={`subthread-container ${lastReply ? "" : "subthread-multi"} ${lastReply ? "subthread-last" : "subthread-mid"
+              }`}>
             <Divider variant="small" />
             <Note
               className={`thread-note ${lastNote ? "is-last-note" : ""}`}
@@ -297,6 +295,11 @@ export function Thread(props: { onBack?: () => void }) {
     description: "Navigate back button on threads view",
   });
 
+  const rootChainId = (ev: TaggedNostrEvent) => {
+    const link = NostrLink.fromEvent(ev);
+    return unwrap(link.toEventTag())[1];
+  }
+
   return (
     <>
       <div className="main-content p">
@@ -304,7 +307,7 @@ export function Thread(props: { onBack?: () => void }) {
       </div>
       <div className="main-content">
         {thread.root && renderRoot(thread.root)}
-        {thread.root && renderChain(thread.root.id)}
+        {thread.root && renderChain(rootChainId(thread.root))}
       </div>
     </>
   );

packages/app/src/Feed/Reactions.ts

@@ -10,15 +10,13 @@ export function useReactions(subId: string, ids: Array<NostrLink>, others?: (rb:
     const rb = new RequestBuilder(subId);
 
     if (ids.length > 0) {
-      const f = rb
+      rb
         .withFilter()
         .kinds(
           pref.enableReactions
             ? [EventKind.Reaction, EventKind.Repost, EventKind.ZapReceipt]
             : [EventKind.ZapReceipt, EventKind.Repost],
-        );
-
-      ids.forEach(v => f.replyToLink(v));
+        ).replyToLink(ids);
     }
     others?.(rb);
     return rb.numFilters > 0 ? rb : null;

packages/app/src/Feed/ThreadFeed.ts

@@ -13,10 +13,7 @@ export default function useThreadFeed(link: NostrLink) {
       leaveOpen: true,
     });
     sub.withFilter().link(link);
-    sub.withFilter().kinds([EventKind.TextNote]).replyToLink(link);
-    allEvents.forEach(x => {
-      sub.withFilter().kinds([EventKind.TextNote]).replyToLink(x);
-    });
+    sub.withFilter().kinds([EventKind.TextNote]).replyToLink([link, ...allEvents]);
     return sub;
   }, [allEvents.length]);
 

packages/app/src/Feed/ZapsFeed.ts

@@ -7,7 +7,7 @@ export default function useZapsFeed(link?: NostrLink) {
   const sub = useMemo(() => {
     if (!link) return null;
     const b = new RequestBuilder(`zaps:${link.encode()}`);
-    b.withFilter().kinds([EventKind.ZapReceipt]).replyToLink(link);
+    b.withFilter().kinds([EventKind.ZapReceipt]).replyToLink([link]);
     return b;
   }, [link]);
 

packages/app/src/Hooks/useThreadContext.tsx

@@ -15,6 +15,13 @@ export interface ThreadContext {
 
 export const ThreadContext = createContext({} as ThreadContext);
 
+export function threadChainKey(ev: TaggedNostrEvent) {
+  const t = EventExt.extractThread(ev);
+  if (t) {
+    return unwrap(t.replyTo?.value ?? t.root?.value);
+  }
+}
+
 export function ThreadContextWrapper({ link, children }: { link: NostrLink; children?: ReactNode }) {
   const location = useLocation();
   const [currentId, setCurrentId] = useState(link.id);
@@ -26,21 +33,12 @@ export function ThreadContextWrapper({ link, children }: { link: NostrLink; chil
       feed.thread
         ?.sort((a, b) => b.created_at - a.created_at)
         .forEach(v => {
-          const t = EventExt.extractThread(v);
-          if (t) {
-            let replyTo = t.replyTo?.value ?? t.root?.value;
-            if (t.root?.key === "a" && t.root?.value) {
-              const parsed = t.root.value.split(":");
-              replyTo = feed.thread?.find(
-                a => a.kind === Number(parsed[0]) && a.pubkey === parsed[1] && findTag(a, "d") === parsed[2],
-              )?.id;
-            }
-            if (replyTo) {
-              if (!chains.has(replyTo)) {
-                chains.set(replyTo, [v]);
-              } else {
-                unwrap(chains.get(replyTo)).push(v);
-              }
+          const replyTo = threadChainKey(v);
+          if (replyTo) {
+            if (!chains.has(replyTo)) {
+              chains.set(replyTo, [v]);
+            } else {
+              unwrap(chains.get(replyTo)).push(v);
             }
           }
         });

packages/app/src/index.tsx

@@ -38,6 +38,7 @@ import { preload, RelayMetrics, UserCache, UserRelays } from "Cache";
 import { LoginStore } from "Login";
 import { SnortDeckLayout } from "Pages/DeckLayout";
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const WasmQueryOptimizer = {
   expandFilter: (f: ReqFilter) => {
     return expand_filter(f) as Array<FlatReqFilter>;
@@ -60,7 +61,7 @@ export const System = new NostrSystem({
   relayCache: UserRelays,
   profileCache: UserCache,
   relayMetrics: RelayMetrics,
-  queryOptimizer: WasmQueryOptimizer,
+  //queryOptimizer: WasmQueryOptimizer,
   authHandler: async (c, r) => {
     const { id } = LoginStore.snapshot();
     const pub = LoginStore.getPublisher(id);