polish
This commit is contained in:
@@ -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}
|
||||
|
||||
@@ -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>
|
||||
) : (
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user