polish

src/app/space/components/blocks/following.tsx

@@ -70,7 +70,7 @@ export function FollowingBlock() {
           if (root || reply) {
             return (
               <div
-                key={(root || reply) + (note.event_id || note.id)}
+                key={(root || reply) + (note.event_id || note.id) + index}
                 data-index={index}
                 ref={rowVirtualizer.measureElement}
               >
@@ -80,7 +80,7 @@ export function FollowingBlock() {
           } else {
             return (
               <div
-                key={note.event_id || note.id}
+                key={(note.event_id || note.id) + index}
                 data-index={index}
                 ref={rowVirtualizer.measureElement}
               >
@@ -92,7 +92,7 @@ export function FollowingBlock() {
         case 6:
           return (
             <div
-              key={note.event_id || note.id}
+              key={(note.event_id || note.id) + index}
               data-index={index}
               ref={rowVirtualizer.measureElement}
             >
@@ -102,7 +102,7 @@ export function FollowingBlock() {
         case 1063:
           return (
             <div
-              key={note.event_id || note.id}
+              key={(note.event_id || note.id) + index}
               data-index={index}
               ref={rowVirtualizer.measureElement}
             >
@@ -112,7 +112,7 @@ export function FollowingBlock() {
         default:
           return (
             <div
-              key={note.event_id || note.id}
+              key={(note.event_id || note.id) + index}
               data-index={index}
               ref={rowVirtualizer.measureElement}
             >

src/index.css

@@ -15,10 +15,7 @@ button {
 }
 
 .markdown {
-  -webkit-hyphens: auto;
-  -moz-hyphens: auto;
-  hyphens: auto;
-  @apply prose prose-zinc max-w-none select-text dark:prose-invert prose-p:mb-2 prose-p:mt-0 prose-p:break-words prose-p:[word-break:break-word] prose-p:last:mb-0 prose-a:break-words prose-a:break-all prose-a:font-normal prose-a:leading-tight prose-a:text-fuchsia-400 hover:prose-a:text-fuchsia-500 prose-blockquote:m-0 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-li:leading-tight prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2;
+  @apply prose prose-zinc max-w-none select-text hyphens-auto dark:prose-invert prose-p:mb-2 prose-p:mt-0 prose-p:break-words prose-p:[word-break:break-word] prose-p:last:mb-0 prose-a:break-words prose-a:break-all prose-a:font-normal prose-a:leading-tight prose-a:text-fuchsia-400 prose-a:after:content-['_↗'] hover:prose-a:text-fuchsia-500 prose-blockquote:m-0 prose-pre:whitespace-pre-wrap prose-pre:break-words prose-pre:break-all prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-li:leading-tight prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2;
 }
 
 .ProseMirror p.is-empty::before {

src/shared/notes/content.tsx

@@ -10,18 +10,9 @@ import {
   VideoPreview,
 } from '@shared/notes';
 
-export function NoteContent({
-  content,
-}: {
-  content: {
-    original: string;
-    parsed: string;
-    notes: string[];
-    images: string[];
-    videos: string[];
-    links: string[];
-  };
-}) {
+import { Content } from '@utils/types';
+
+export function NoteContent({ content }: { content: Content }) {
   return (
     <>
       <ReactMarkdown

src/shared/notes/users/thread.tsx

@@ -25,7 +25,7 @@ export function ThreadUser({ pubkey, time }: { pubkey: string; time: number }) {
       />
       <div className="lex flex-1 items-baseline justify-between">
         <div className="inline-flex w-full items-center justify-between">
-          <h5 className="truncate font-semibold leading-none text-zinc-100">
+          <h5 className="max-w-[15rem] truncate font-semibold leading-none text-zinc-100">
             {user?.nip05?.toLowerCase() || user?.name || user?.display_name}
           </h5>
           <button

src/utils/hooks/useEvent.tsx

@@ -21,7 +21,7 @@ export function useEvent(id: string, fallback?: string) {
           embed.pubkey,
           embed.kind,
           embed.tags,
-          embed.content,
+          embed.content as unknown as string,
           embed.created_at
         );
         return embed;
@@ -42,7 +42,7 @@ export function useEvent(id: string, fallback?: string) {
             // @ts-ignore
             event['content'] = parser(event);
           }
-          return event as LumeEvent;
+          return event as unknown as LumeEvent;
         } else {
           throw new Error('Event not found');
         }

src/utils/types.d.ts

@@ -1,9 +1,19 @@
 import { NDKEvent, NDKUserProfile } from '@nostr-dev-kit/ndk';
 
+export interface Content {
+  original: string;
+  parsed: string;
+  notes: string[];
+  images: string[];
+  videos: string[];
+  links: string[];
+}
+
 export interface LumeEvent extends NDKEvent {
   event_id?: string;
   parent_id?: string;
   replies?: LumeEvent[];
+  content: Content;
 }
 
 export interface Account {