clean up and improve perf

src/shared/notes/replies/item.tsx

@@ -12,19 +12,26 @@ export function Reply({ event, root }: { event: NDKEventWithReplies; root?: stri
       <div className="relative z-10">
         <div className="relative flex flex-col">
           <User pubkey={event.pubkey} time={event.created_at} />
-          <div className="-mt-6 flex items-start gap-3">
-            <div className="w-11 shrink-0" />
+          <div className="-mt-5 flex items-start gap-3">
+            <div className="w-10 shrink-0" />
             <div className="flex-1">
               <TextNote content={event.content} />
-              <NoteActions id={event.id} pubkey={event.pubkey} root={root} />
+              <NoteActions
+                id={event.id}
+                pubkey={event.pubkey}
+                root={root}
+                extraButtons={false}
+              />
             </div>
           </div>
         </div>
-        {event.replies ? (
-          event.replies.map((sub) => <SubReply key={sub.id} event={sub} />)
-        ) : (
-          <div className="pb-3" />
-        )}
+        <div className="pl-14">
+          {event.replies ? (
+            event.replies.map((sub) => <SubReply key={sub.id} event={sub} />)
+          ) : (
+            <div className="pb-3" />
+          )}
+        </div>
       </div>
     </div>
   );

src/shared/notes/replies/list.tsx

@@ -51,7 +51,7 @@ export function RepliesList({ id }: { id: string }) {
       <h5 className="mb-2 text-lg font-semibold text-white">
         {data?.length || 0} replies
       </h5>
-      <div className="flex flex-col gap-3">
+      <div className="flex flex-col gap-5">
         {data?.length === 0 ? (
           <div className="mt-2 flex w-full items-center justify-center rounded-xl bg-white/10 backdrop-blur-xl">
             <div className="flex flex-col items-center justify-center gap-2 py-6">

src/shared/notes/replies/sub.tsx

@@ -7,11 +7,11 @@ export function SubReply({ event }: { event: NDKEvent }) {
   return (
     <div className="relative z-10 mb-3 mt-5 flex flex-col">
       <User pubkey={event.pubkey} time={event.created_at} />
-      <div className="-mt-6 flex items-start gap-3">
-        <div className="w-11 shrink-0" />
+      <div className="-mt-5 flex items-start gap-3">
+        <div className="w-10 shrink-0" />
         <div className="flex-1">
-          <TextNote />
-          <NoteActions id={event.id} pubkey={event.pubkey} />
+          <TextNote content={event.content} />
+          <NoteActions id={event.id} pubkey={event.pubkey} extraButtons={false} />
         </div>
       </div>
     </div>