add support for nip-94

This commit is contained in:
Ren Amamiya
2023-05-08 09:07:49 +07:00
parent b6ef52e38c
commit 348dc9009c
11 changed files with 75 additions and 30 deletions

View File

@@ -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]">

View File

@@ -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>
);
}

View File

@@ -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>
</>
) : (

View File

@@ -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>
</>

View File

@@ -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} />

View File

@@ -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>
</>

View File

@@ -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}`}

View File

@@ -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" />