add support for nip-94

package.json

@@ -42,7 +42,7 @@
     "@tauri-apps/cli": "^1.3.0",
     "@trivago/prettier-plugin-sort-imports": "^4.1.1",
     "@types/node": "^18.16.5",
-    "@types/react": "^18.2.5",
+    "@types/react": "^18.2.6",
     "@types/react-dom": "^18.2.4",
     "@types/youtube-player": "^5.5.7",
     "@typescript-eslint/eslint-plugin": "^5.59.2",

pnpm-lock.yaml

@@ -18,7 +18,7 @@ dependencies:
     version: 1.3.0
   '@vidstack/react':
     specifier: ^0.4.5
-    version: 0.4.5(@types/react@18.2.5)(maverick.js@0.33.1)(media-icons@0.4.2)(react@18.2.0)(vidstack@0.4.5)
+    version: 0.4.5(@types/react@18.2.6)(maverick.js@0.33.1)(media-icons@0.4.2)(react@18.2.0)(vidstack@0.4.5)
   dayjs:
     specifier: ^1.11.7
     version: 1.11.7
@@ -48,7 +48,7 @@ dependencies:
     version: 3.3.1(react@18.2.0)
   react-markdown:
     specifier: ^8.0.7
-    version: 8.0.7(@types/react@18.2.5)(react@18.2.0)
+    version: 8.0.7(@types/react@18.2.6)(react@18.2.0)
   react-virtuoso:
     specifier: ^4.3.5
     version: 4.3.5(react-dom@18.2.0)(react@18.2.0)
@@ -82,8 +82,8 @@ devDependencies:
     specifier: ^18.16.5
     version: 18.16.5
   '@types/react':
-    specifier: ^18.2.5
-    version: 18.2.5
+    specifier: ^18.2.6
+    version: 18.2.6
   '@types/react-dom':
     specifier: ^18.2.4
     version: 18.2.4
@@ -1135,12 +1135,12 @@ packages:
     resolution:
       { integrity: sha512-G2mHoTMTL4yoydITgOGwWdWMVd8sNgyEP85xVmMKAPUBwQWm9wBPQUmvbeF4V3WBY1P7mmL4BkjQ0SqUpf1snw== }
     dependencies:
-      '@types/react': 18.2.5
+      '@types/react': 18.2.6
     dev: true
 
-  /@types/react@18.2.5:
+  /@types/react@18.2.6:
     resolution:
-      { integrity: sha512-RuoMedzJ5AOh23Dvws13LU9jpZHIc/k90AgmK7CecAYeWmSr3553L4u5rk4sWAPBuQosfT7HmTfG4Rg5o4nGEA== }
+      { integrity: sha512-wRZClXn//zxCFW+ye/D2qY65UsYP1Fpex2YXorHc8awoNamkMZSvBxwxdYVInsHOZZd2Ppq8isnSzJL5Mpf8OA== }
     dependencies:
       '@types/prop-types': 15.7.5
       '@types/scheduler': 0.16.3
@@ -1303,7 +1303,7 @@ packages:
       eslint-visitor-keys: 3.4.1
     dev: true
 
-  /@vidstack/react@0.4.5(@types/react@18.2.5)(maverick.js@0.33.1)(media-icons@0.4.2)(react@18.2.0)(vidstack@0.4.5):
+  /@vidstack/react@0.4.5(@types/react@18.2.6)(maverick.js@0.33.1)(media-icons@0.4.2)(react@18.2.0)(vidstack@0.4.5):
     resolution:
       { integrity: sha512-spcim3+p1fMzkhHRKn5PS54YQjfThW5M3F2+R8tCT+wpsxbbCDa/TGdLBoIy2oC0LNziPkn0vlBWIZko9F5iig== }
     engines: { node: '>=16' }
@@ -1314,7 +1314,7 @@ packages:
       react: ^18.0.0
       vidstack: 0.4.5
     dependencies:
-      '@types/react': 18.2.5
+      '@types/react': 18.2.6
       maverick.js: 0.33.1(typescript@4.9.5)
       media-icons: 0.4.2
       react: 18.2.0
@@ -1505,7 +1505,7 @@ packages:
       postcss: ^8.1.0
     dependencies:
       browserslist: 4.21.5
-      caniuse-lite: 1.0.30001482
+      caniuse-lite: 1.0.30001486
       fraction.js: 4.2.0
       normalize-range: 0.1.2
       picocolors: 1.0.0
@@ -1557,7 +1557,7 @@ packages:
     engines: { node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7 }
     hasBin: true
     dependencies:
-      caniuse-lite: 1.0.30001482
+      caniuse-lite: 1.0.30001486
       electron-to-chromium: 1.4.385
       node-releases: 2.0.10
       update-browserslist-db: 1.0.11(browserslist@4.21.5)
@@ -1588,9 +1588,9 @@ packages:
     engines: { node: '>= 6' }
     dev: true
 
-  /caniuse-lite@1.0.30001482:
+  /caniuse-lite@1.0.30001486:
     resolution:
-      { integrity: sha512-F1ZInsg53cegyjroxLNW9DmrEQ1SuGRTO1QlpA0o2/6OpQ0gFeDRoq1yFmnr8Sakn9qwwt9DmbxHB6w167OSuQ== }
+      { integrity: sha512-uv7/gXuHi10Whlj0pp5q/tsK/32J2QSqVRKQhs2j8VsDCjgyruAh/eEXHF822VqO9yT6iZKw3nRwZRSPBE9OQg== }
     dev: true
 
   /ccount@2.0.1:
@@ -3956,7 +3956,7 @@ packages:
       react: 18.2.0
     dev: false
 
-  /react-markdown@8.0.7(@types/react@18.2.5)(react@18.2.0):
+  /react-markdown@8.0.7(@types/react@18.2.6)(react@18.2.0):
     resolution:
       { integrity: sha512-bvWbzG4MtOU62XqBx3Xx+zB2raaFFsq4mYiAzfjXJMEz2sixgeAfraA3tvzULF02ZdOMUOKTBFFaZJDDrq+BJQ== }
     peerDependencies:
@@ -3965,7 +3965,7 @@ packages:
     dependencies:
       '@types/hast': 2.3.4
       '@types/prop-types': 15.7.5
-      '@types/react': 18.2.5
+      '@types/react': 18.2.6
       '@types/unist': 2.0.6
       comma-separated-tokens: 2.0.3
       hast-util-whitespace: 2.0.1

src/app/note/components/base.tsx

@@ -4,15 +4,22 @@ import { NoteParent } from '@lume/app/note/components/parent';
 import { NoteDefaultUser } from '@lume/app/note/components/user/default';
 import { NoteWrapper } from '@lume/app/note/components/wrapper';
 import { noteParser } from '@lume/utils/parser';
+import { isTagsIncludeID } from '@lume/utils/transform';
 
 export const NoteBase = ({ event }: { event: any }) => {
   const content = noteParser(event);
+  const checkParentID = isTagsIncludeID(event.parent_id, event.tags);
+
   const href = event.parent_id ? `/app/note?id=${event.parent_id}` : `/app/note?id=${event.event_id}`;
 
   return (
     <NoteWrapper href={href} className="h-min w-full px-3 py-1.5">
       <div className="rounded-md border border-zinc-800 bg-zinc-900 px-3 pt-3 shadow-input shadow-black/20">
-        {event.parent_id && event.parent_id !== event.event_id && <NoteParent id={event.parent_id} />}
+        {event.parent_id && (event.parent_id !== event.event_id || checkParentID) ? (
+          <NoteParent id={event.parent_id} />
+        ) : (
+          <></>
+        )}
         <div className="flex flex-col">
           <NoteDefaultUser pubkey={event.pubkey} time={event.created_at} />
           <div className="mt-3 pl-[46px]">

src/app/note/components/file.tsx

@@ -0,0 +1,16 @@
+import { Image } from '@lume/shared/image';
+
+export default function NoteFile({ url }: { url: string }) {
+  return (
+    <div className="mt-3 grid h-full w-full grid-cols-3">
+      <div className="col-span-3">
+        <Image
+          src={url}
+          alt="image"
+          className="h-auto w-full rounded-lg object-cover"
+          style={{ contentVisibility: 'auto' }}
+        />
+      </div>
+    </div>
+  );
+}

src/app/note/components/mentions/note.tsx

@@ -1,4 +1,5 @@
 import { NoteContent } from '@lume/app/note/components/content';
+import NoteFile from '@lume/app/note/components/file';
 import { NoteDefaultUser } from '@lume/app/note/components/user/default';
 import { NoteWrapper } from '@lume/app/note/components/wrapper';
 import { RelayContext } from '@lume/shared/relayProvider';
@@ -35,15 +36,17 @@ export const MentionNote = memo(function MentionNote({ id }: { id: string }) {
     };
   });
 
-  const content = !error && data ? noteParser(data) : null;
+  const kind1 = !error && data?.kind === 1 ? noteParser(data) : null;
+  const kind1063 = !error && data?.kind === 1063 ? data.tags : null;
 
   return (
     <NoteWrapper href={`/app/note?id=${id}`} className="mt-3 rounded-lg border border-zinc-800 px-3 py-3">
       {data ? (
         <>
           <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />
-          <div className="mt-1 pl-[52px]">
-            <NoteContent content={content} />
+          <div className="mt-1 pl-[46px]">
+            {kind1 && <NoteContent content={kind1} />}
+            {kind1063 && <NoteFile url={kind1063[0][1]} />}
           </div>
         </>
       ) : (

src/app/note/components/parent.tsx

@@ -1,4 +1,5 @@
 import { NoteContent } from '@lume/app/note/components/content';
+import NoteFile from '@lume/app/note/components/file';
 import NoteMetadata from '@lume/app/note/components/metadata';
 import { NoteDefaultUser } from '@lume/app/note/components/user/default';
 import { RelayContext } from '@lume/shared/relayProvider';
@@ -35,7 +36,8 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) {
     };
   });
 
-  const content = !error && data ? noteParser(data) : null;
+  const kind1 = !error && data?.kind === 1 ? noteParser(data) : null;
+  const kind1063 = !error && data?.kind === 1063 ? data.tags : null;
 
   return (
     <div className="relative flex flex-col pb-6">
@@ -44,7 +46,8 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) {
         <>
           <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />
           <div className="mt-3 pl-[46px]">
-            <NoteContent content={content} />
+            {kind1 && <NoteContent content={kind1} />}
+            {kind1063 && <NoteFile url={kind1063[0][1]} />}
             <NoteMetadata id={data.id} eventPubkey={data.pubkey} />
           </div>
         </>

src/app/note/components/quoteRepost.tsx

@@ -10,7 +10,7 @@ export const NoteQuoteRepost = ({ event }: { event: any }) => {
     <NoteWrapper href={`/app/note?id=${rootID}`} className="h-min w-full px-3 py-1.5">
       <div className="rounded-md border border-zinc-800 bg-zinc-900 shadow-input shadow-black/20">
         <div className="relative px-3 pb-5 pt-3">
-          <div className="absolute left-[32px] top-[20px] h-[70px] w-0.5 bg-gradient-to-t from-zinc-800 to-zinc-600"></div>
+          <div className="absolute left-[29px] top-[20px] h-[70px] w-0.5 bg-gradient-to-t from-zinc-800 to-zinc-600"></div>
           <NoteRepostUser pubkey={event.pubkey} time={event.created_at} />
         </div>
         <RootNote id={rootID} fallback={event.content} />

src/app/note/components/rootNote.tsx

@@ -1,4 +1,5 @@
 import { NoteContent } from '@lume/app/note/components/content';
+import NoteFile from '@lume/app/note/components/file';
 import NoteMetadata from '@lume/app/note/components/metadata';
 import { NoteDefaultUser } from '@lume/app/note/components/user/default';
 import { RelayContext } from '@lume/shared/relayProvider';
@@ -55,7 +56,8 @@ export const RootNote = memo(function RootNote({ id, fallback }: { id: string; f
     }
   };
 
-  const content = !error && data ? noteParser(data) : null;
+  const kind1 = !error && data?.kind === 1 ? noteParser(data) : null;
+  const kind1063 = !error && data?.kind === 1063 ? data.tags : null;
 
   if (parseFallback) {
     const contentFallback = noteParser(parseFallback);
@@ -63,7 +65,7 @@ export const RootNote = memo(function RootNote({ id, fallback }: { id: string; f
     return (
       <div onClick={(e) => openNote(e)} className="flex flex-col px-3">
         <NoteDefaultUser pubkey={parseFallback.pubkey} time={parseFallback.created_at} />
-        <div className="mt-1 pl-[52px]">
+        <div className="mt-3 pl-[46px]">
           <NoteContent content={contentFallback} />
           <NoteMetadata id={parseFallback.id} eventPubkey={parseFallback.pubkey} />
         </div>
@@ -77,7 +79,8 @@ export const RootNote = memo(function RootNote({ id, fallback }: { id: string; f
         <>
           <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />
           <div className="mt-3 pl-[46px]">
-            <NoteContent content={content} />
+            {kind1 && <NoteContent content={kind1} />}
+            {kind1063 && <NoteFile url={kind1063[0][1]} />}
             <NoteMetadata id={data.id} eventPubkey={data.pubkey} />
           </div>
         </>

src/app/note/components/user/repost.tsx

@@ -12,7 +12,7 @@ export const NoteRepostUser = ({ pubkey, time }: { pubkey: string; time: number
   const { user } = useProfile(pubkey);
 
   return (
-    <div className="group flex items-center gap-2">
+    <div className="group flex items-center gap-2.5">
       <div className="relative h-9 w-9 shrink-0 overflow-hidden rounded-md bg-zinc-900">
         <Image
           src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`}

src/app/note/pages/index.page.tsx

@@ -26,7 +26,7 @@ export function Page() {
         },
       ],
       READONLY_RELAYS,
-      (event: { id: string; pubkey: string }) => {
+      (event: any) => {
         next(null, event);
       }
     );
@@ -42,7 +42,7 @@ export function Page() {
     <div className="scrollbar-hide h-full w-full overflow-y-auto">
       <div className="p-3">
         <div className="relative w-full rounded-lg border border-zinc-800 bg-zinc-900 shadow-input shadow-black/20">
-          {!data && error ? (
+          {!data || error ? (
             <div className="animated-pulse p-3">
               <div className="flex items-start gap-2">
                 <div className="relative h-11 w-11 shrink overflow-hidden rounded-md bg-zinc-700" />

src/utils/transform.tsx

@@ -36,7 +36,7 @@ export const getParentID = (arr: string[], fallback: string) => {
   let parentID = fallback;
 
   if (tags.length > 0) {
-    if (tags[0][0] === 'e' || tags[0][2] === 'root' || tags[0][3] === 'root') {
+    if (tags[0][0] === 'e') {
       parentID = tags[0][1];
     } else {
       tags.forEach((tag) => {
@@ -50,6 +50,19 @@ export const getParentID = (arr: string[], fallback: string) => {
   return parentID;
 };
 
+// check id present in event tags
+export const isTagsIncludeID = (id: string, arr: string[]) => {
+  const tags = destr(arr);
+
+  if (tags.length > 0) {
+    if (tags[0][1] === id) {
+      return true;
+    }
+  } else {
+    return false;
+  }
+};
+
 // get parent id from event tags
 export const getQuoteID = (arr: string[]) => {
   const tags = destr(arr);