This commit is contained in:
2023-10-19 08:59:50 +07:00
parent 823fb0f239
commit 0de72eb009
39 changed files with 1882 additions and 4272 deletions

View File

@@ -1,4 +1,4 @@
import { NoteActions, SubReply, TextNote } from '@shared/notes';
import { MemoizedTextNote, NoteActions, SubReply } from '@shared/notes';
import { User } from '@shared/user';
import { NDKEventWithReplies } from '@utils/types';
@@ -6,16 +6,13 @@ import { NDKEventWithReplies } from '@utils/types';
export function Reply({ event, root }: { event: NDKEventWithReplies; root?: string }) {
return (
<div className="relative h-min w-full">
{event?.replies?.length > 0 && (
<div className="absolute -left-3 top-0 h-[calc(100%-1.2rem)] w-px bg-gradient-to-t from-blue-200 via-red-200 to-orange-300" />
)}
<div className="relative z-10">
<div className="relative flex flex-col">
<User pubkey={event.pubkey} time={event.created_at} />
<div className="-mt-5 flex items-start gap-3">
<User pubkey={event.pubkey} time={event.created_at} eventId={event.id} />
<div className="-mt-4 flex items-start gap-3">
<div className="w-10 shrink-0" />
<div className="flex-1">
<TextNote content={event.content} />
<MemoizedTextNote content={event.content} />
<NoteActions
id={event.id}
pubkey={event.pubkey}

View File

@@ -37,10 +37,8 @@ export function RepliesList({ id }: { id: string }) {
if (!data) {
return (
<div className="mt-5 pb-10">
<div className="flex flex-col">
<div className="rounded-xl bg-white/10 px-3 py-3 backdrop-blur-xl">
<NoteSkeleton />
</div>
<div className="rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
<NoteSkeleton />
</div>
</div>
);
@@ -48,15 +46,17 @@ export function RepliesList({ id }: { id: string }) {
return (
<div className="mt-5 pb-10">
<h5 className="mb-2 text-lg font-semibold text-white">
<h5 className="mb-2 text-lg font-semibold text-neutral-900 dark:text-neutral-100">
{data?.length || 0} replies
</h5>
<div className="flex flex-col gap-5">
<div className="flex flex-col gap-2">
{data?.length === 0 ? (
<div className="mt-2 flex w-full items-center justify-center rounded-xl bg-white/10 backdrop-blur-xl">
<div className="mt-2 flex w-full items-center justify-center rounded-xl bg-neutral-400 dark:bg-neutral-600">
<div className="flex flex-col items-center justify-center gap-2 py-6">
<h3 className="text-3xl">👋</h3>
<p className="leading-none text-white/50">Share your thought on it...</p>
<p className="leading-none text-neutral-600 dark:text-neutral-400">
Share your thought on it...
</p>
</div>
</div>
) : (

View File

@@ -1,16 +1,16 @@
import { NDKEvent } from '@nostr-dev-kit/ndk';
import { NoteActions, TextNote } from '@shared/notes';
import { MemoizedTextNote, NoteActions } from '@shared/notes';
import { User } from '@shared/user';
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-5 flex items-start gap-3">
<User pubkey={event.pubkey} time={event.created_at} eventId={event.id} />
<div className="-mt-4 flex items-start gap-3">
<div className="w-10 shrink-0" />
<div className="flex-1">
<TextNote content={event.content} />
<MemoizedTextNote content={event.content} />
<NoteActions id={event.id} pubkey={event.pubkey} extraButtons={false} />
</div>
</div>