reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

polish

Browse Source
This commit is contained in:
Ren Amamiya
2023-08-04 08:51:26 +07:00
parent 2e47415160
commit ac50cd1373
16 changed files with 108 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/space/components/blocks/thread.tsx
View File

@@ -22,7 +22,7 @@ export function ThreadBlock({ params }: { params: Block }) {
// useLiveThread(params.content);
return (
<div className="scrollbar-hide w-[400px] shrink-0 overflow-y-auto bg-white/10 pb-20">
<div className="scrollbar-hide h-full w-[400px] shrink-0 overflow-y-auto bg-white/10 pb-20">
<TitleBar id={params.id} title={params.title} />
<div className="h-full">
{status === 'loading' ? (

2
src/app/space/components/blocks/user.tsx
View File

@@ -45,7 +45,7 @@ export function UserBlock({ params }: { params: Block }) {
<UserProfile pubkey={params.content} />
</div>
<div>
<h3 className="mt-2 px-3 text-lg font-semibold text-white">
<h3 className="mt-4 px-3 text-lg font-semibold text-white">
Latest activities
</h3>
<div className="flex h-full w-full flex-col justify-between gap-1.5 pb-10">

10
src/shared/notes/content.tsx
View File

@@ -12,7 +12,15 @@ import {
import { Content } from '@utils/types';
export function NoteContent({ content }: { content: Content }) {
export function NoteContent({ content, long }: { content: Content; long?: boolean }) {
if (long) {
return (
<ReactMarkdown className="markdown" remarkPlugins={[remarkGfm]}>
{content as unknown as string}
</ReactMarkdown>
);
}
return (
<>
<ReactMarkdown

2
src/shared/notes/kinds/repost.tsx
View File

@@ -26,7 +26,7 @@ export function Repost({ event }: { event: LumeEvent }) {
if (status === 'error') {
return (
<div className="flex items-center justify-center overflow-hidden rounded-xl bg-white/10 px-3 py-3">
<p className="text-white/50">Failed to fetch</p>
<p className="text-white/50">Failed to fetch event: {repostID}</p>
</div>
);
}

4
src/shared/notes/kinds/sub.tsx
View File

@@ -17,7 +17,7 @@ export function SubNote({ id, root }: { id: string; root?: string }) {
if (status === 'error') {
return (
<div className="mb-5 flex overflow-hidden rounded-xl bg-white/10 px-3 py-3">
<p className="text-white/50">Failed to fetch</p>
<p className="break-all text-white/50">Failed to fetch event: {id}</p>
</div>
);
}
@@ -30,7 +30,7 @@ export function SubNote({ id, root }: { id: string; root?: string }) {
<div className="relative z-20 -mt-6 flex items-start gap-3">
<div className="w-11 shrink-0" />
<div className="flex-1">
<NoteContent content={data.content} />
<NoteContent content={data.content} long={data.kind === 30023} />
<NoteActions id={data.event_id} pubkey={data.pubkey} root={root} />
</div>
</div>

16
src/shared/notes/mentions/note.tsx
View File

@@ -23,6 +23,14 @@ export const MentionNote = memo(function MentionNote({ id }: { id: string }) {
}
};
if (!id) {
return (
<div className="mb-2 mt-3 cursor-default rounded-lg bg-white/10 px-3 py-3">
<p className="break-all">Failed to fetch event: {id}</p>
</div>
);
}
return (
<div
onClick={(e) => openThread(e, id)}
@@ -56,14 +64,14 @@ export const MentionNote = memo(function MentionNote({ id }: { id: string }) {
},
}}
>
{data?.content?.parsed?.length > 160
? data.content.parsed.substring(0, 160) + '...'
: data.content.parsed}
{data?.content?.original?.length > 160
? data.content.original.substring(0, 160) + '...'
: data.content.original}
</ReactMarkdown>
</div>
</>
) : (
<p>Failed to fetch event</p>
<p className="break-all">Failed to fetch event: {id}</p>
)}
</div>
);

6
src/shared/notes/mentions/user.tsx
View File

@@ -20,7 +20,11 @@ export function MentionUser({ pubkey }: { pubkey: string }) {
}
className="break-words font-normal text-blue-400 no-underline hover:text-blue-500"
>
{'@' + user?.name || user?.displayName || displayNpub(pubkey, 16)}
{user?.nip05 ||
user?.name ||
user?.display_name ||
user?.username ||
displayNpub(pubkey, 16)}
</button>
);
}

2
src/shared/notes/metadata.tsx
View File

@@ -61,7 +61,7 @@ export function NoteMetadata({ id }: { id: string }) {
return { replies, users, zap };
},
{ refetchOnWindowFocus: false, refetchOnReconnect: false }
{ refetchOnWindowFocus: false, refetchOnReconnect: false, refetchOnMount: false }
);
if (status === 'loading') {

2
src/shared/notes/replies/list.tsx
View File

@@ -43,7 +43,7 @@ export function RepliesList({ id }: { id: string }) {
return (
<div className="mt-3">
<div className="flex flex-col">
<div className="rounded-xl border-t border-zinc-800/50 bg-zinc-900 px-3 py-3">
<div className="rounded-xl bg-white/10 px-3 py-3">
<NoteSkeleton />
</div>
</div>

2
src/shared/user.tsx
View File

@@ -93,7 +93,7 @@ export function User({
</div>
<Popover.Portal>
<Popover.Content
className="w-[300px] overflow-hidden rounded-md bg-white/10 backdrop-blur-xl"
className="w-[300px] overflow-hidden rounded-md bg-white/10 backdrop-blur-xl focus:outline-none"
sideOffset={5}
>
<div className="flex gap-2.5 border-b border-white/5 px-3 py-3">

6
src/shared/userProfile.tsx
View File

@@ -102,12 +102,6 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
>
Message
</Link>
<button
type="button"
className="group inline-flex h-10 w-10 items-center justify-center rounded-md bg-white/10 text-sm font-medium hover:bg-orange-500"
>
<ZapIcon className="h-5 w-5" />
</button>
</div>
</div>
</div>

77
src/utils/hooks/useEvent.tsx
View File

@@ -8,47 +8,56 @@ import { LumeEvent } from '@utils/types';
export function useEvent(id: string, fallback?: string) {
const { ndk } = useNDK();
const { status, data, error, isFetching } = useQuery(['note', id], async () => {
const result = await getNoteByID(id);
if (result) {
return result as LumeEvent;
} else {
if (fallback) {
const embed: LumeEvent = JSON.parse(fallback);
embed['event_id'] = embed.id;
await createNote(
embed.id,
embed.pubkey,
embed.kind,
embed.tags,
embed.content as unknown as string,
embed.created_at
);
return embed;
const { status, data, error, isFetching } = useQuery(
['note', id],
async () => {
const result = await getNoteByID(id);
if (result) {
return result as LumeEvent;
} else {
const event = await ndk.fetchEvent(id);
if (event) {
if (fallback) {
const embed: LumeEvent = JSON.parse(fallback);
embed['event_id'] = embed.id;
await createNote(
event.id,
event.pubkey,
event.kind,
event.tags,
event.content,
event.created_at
embed.id,
embed.pubkey,
embed.kind,
embed.tags,
embed.content as unknown as string,
embed.created_at
);
event['event_id'] = event.id;
if (event.kind === 1) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
event['content'] = parser(event);
}
return event as unknown as LumeEvent;
return embed;
} else {
throw new Error('Event not found');
const event = await ndk.fetchEvent(id);
if (event) {
await createNote(
event.id,
event.pubkey,
event.kind,
event.tags,
event.content,
event.created_at
);
event['event_id'] = event.id;
if (event.kind === 1) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
event['content'] = parser(event);
}
return event as unknown as LumeEvent;
} else {
throw new Error('Event not found');
}
}
}
},
{
staleTime: Infinity,
refetchOnMount: false,
refetchOnWindowFocus: false,
refetchOnReconnect: false,
}
});
);
return { status, data, error, isFetching };
}

14
src/utils/hooks/useProfile.tsx
View File

@@ -1,4 +1,3 @@
import { NDKFilter } from '@nostr-dev-kit/ndk';
import { useQuery } from '@tanstack/react-query';
import { useNDK } from '@libs/ndk/provider';
@@ -15,12 +14,12 @@ export function useProfile(pubkey: string, fallback?: string) {
['user', pubkey],
async () => {
if (!fallback) {
const filter: NDKFilter = { kinds: [0], authors: [pubkey] };
const events = await ndk.fetchEvents(filter);
const latest = [...events].sort((a, b) => b.created_at - a.created_at).pop();
if (latest) {
await createMetadata(latest.id, latest.pubkey, latest.content);
return JSON.parse(latest.content);
const user = await ndk.getUser({ hexpubkey: pubkey });
await user.fetchProfile();
if (user.profile) {
user.profile.display_name = user.profile.displayName;
await createMetadata(user.npub, pubkey, JSON.stringify(user.profile));
return user.profile;
} else {
throw new Error('User not found');
}
@@ -30,6 +29,7 @@ export function useProfile(pubkey: string, fallback?: string) {
}
},
{
staleTime: Infinity,
refetchOnMount: false,
refetchOnWindowFocus: false,
refetchOnReconnect: false,

7
src/utils/parser.tsx
View File

@@ -5,6 +5,8 @@ import ReactPlayer from 'react-player';
import { Content, LumeEvent } from '@utils/types';
export function parser(event: LumeEvent) {
if (event.kind !== 1) return;
const references = parseReferences(event as unknown as Event);
const urls = getUrls(event.content as unknown as string);
@@ -49,6 +51,7 @@ export function parser(event: LumeEvent) {
references?.forEach((item) => {
const profile = item.profile;
const event = item.event;
const addr = item.address;
if (event) {
content.notes.push(event.id);
content.parsed = content.parsed.replace(item.text, '');
@@ -56,6 +59,10 @@ export function parser(event: LumeEvent) {
if (profile) {
content.parsed = content.parsed.replace(item.text, `~pub${item.profile.pubkey}~`);
}
if (addr) {
content.notes.push(addr.identifier);
content.parsed = content.parsed.replace(item.text, '');
}
});
return content;