mirror of
https://github.com/lumehq/lume.git
synced 2025-04-11 13:30:04 +02:00
polish
This commit is contained in:
Ren Amamiya
parent
d10462cd4a
commit
3432005ade
@ -18,7 +18,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@headlessui/react": "^1.7.16",
|
||||
"@nostr-dev-kit/ndk": "^0.8.0",
|
||||
"@nostr-dev-kit/ndk": "^0.8.1",
|
||||
"@nostr-fetch/adapter-ndk": "^0.11.0",
|
||||
"@radix-ui/react-collapsible": "^1.0.3",
|
||||
"@radix-ui/react-dialog": "^1.0.4",
|
||||
@ -93,7 +93,7 @@
|
||||
"csstype": "^3.1.2",
|
||||
"encoding": "^0.1.13",
|
||||
"eslint": "^8.46.0",
|
||||
"eslint-config-prettier": "^8.9.0",
|
||||
"eslint-config-prettier": "^8.10.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.7.1",
|
||||
"eslint-plugin-react": "^7.33.1",
|
||||
"eslint-plugin-simple-import-sort": "^10.0.0",
|
||||
|
||||
32
pnpm-lock.yaml
generated
32
pnpm-lock.yaml
generated
@ -5,11 +5,11 @@ dependencies:
|
||||
specifier: ^1.7.16
|
||||
version: 1.7.16(react-dom@18.2.0)(react@18.2.0)
|
||||
'@nostr-dev-kit/ndk':
|
||||
specifier: ^0.8.0
|
||||
version: 0.8.0(typescript@4.9.5)
|
||||
specifier: ^0.8.1
|
||||
version: 0.8.1(typescript@4.9.5)
|
||||
'@nostr-fetch/adapter-ndk':
|
||||
specifier: ^0.11.0
|
||||
version: 0.11.0(@nostr-dev-kit/ndk@0.8.0)(nostr-fetch@0.12.2)
|
||||
version: 0.11.0(@nostr-dev-kit/ndk@0.8.1)(nostr-fetch@0.12.2)
|
||||
'@radix-ui/react-collapsible':
|
||||
specifier: ^1.0.3
|
||||
version: 1.0.3(@types/react-dom@18.2.7)(@types/react@18.2.18)(react-dom@18.2.0)(react@18.2.0)
|
||||
@ -226,8 +226,8 @@ devDependencies:
|
||||
specifier: ^8.46.0
|
||||
version: 8.46.0
|
||||
eslint-config-prettier:
|
||||
specifier: ^8.9.0
|
||||
version: 8.9.0(eslint@8.46.0)
|
||||
specifier: ^8.10.0
|
||||
version: 8.10.0(eslint@8.46.0)
|
||||
eslint-plugin-jsx-a11y:
|
||||
specifier: ^6.7.1
|
||||
version: 6.7.1(eslint@8.46.0)
|
||||
@ -1131,8 +1131,8 @@ packages:
|
||||
'@nodelib/fs.scandir': 2.1.5
|
||||
fastq: 1.15.0
|
||||
|
||||
/@nostr-dev-kit/ndk@0.8.0(typescript@4.9.5):
|
||||
resolution: {integrity: sha512-SFrB7dW80kMZgquw33OUEjDpE5JJD11PsS/ET4Lxl5FtYMHP/unR61BmcIsCPhBXLm+0Pf2QqAq+N5/BYVZqEA==}
|
||||
/@nostr-dev-kit/ndk@0.8.1(typescript@4.9.5):
|
||||
resolution: {integrity: sha512-uI41sCs+7CxtKGIKXQGZjdwvksfeCwd83bB2yrJCePx4oIkEMMH1gVRYsNfQIMFBPejnU2bfBqcO2zEP9RzIFg==}
|
||||
dependencies:
|
||||
'@noble/hashes': 1.3.1
|
||||
'@noble/secp256k1': 2.0.0
|
||||
@ -1143,7 +1143,7 @@ packages:
|
||||
esbuild: 0.17.19
|
||||
esbuild-plugin-alias: 0.2.1
|
||||
eslint: 8.46.0
|
||||
eslint-config-prettier: 8.9.0(eslint@8.46.0)
|
||||
eslint-config-prettier: 8.10.0(eslint@8.46.0)
|
||||
eslint-plugin-import: 2.28.0(@typescript-eslint/parser@5.62.0)(eslint@8.46.0)
|
||||
esm-loader-typescript: 1.0.5
|
||||
eventemitter3: 5.0.1
|
||||
@ -1160,13 +1160,13 @@ packages:
|
||||
- typescript
|
||||
dev: false
|
||||
|
||||
/@nostr-fetch/adapter-ndk@0.11.0(@nostr-dev-kit/ndk@0.8.0)(nostr-fetch@0.12.2):
|
||||
/@nostr-fetch/adapter-ndk@0.11.0(@nostr-dev-kit/ndk@0.8.1)(nostr-fetch@0.12.2):
|
||||
resolution: {integrity: sha512-Otl7SEzm9ecqyHB10bpYXBu1qpqJEnipp7dZ4qcA9LeJAtM38fnYKUD34HX0JXA9EDjtc6VS5UNZe544xC9GCg==}
|
||||
peerDependencies:
|
||||
'@nostr-dev-kit/ndk': ^0.5.0
|
||||
nostr-fetch: ^0.11.0
|
||||
dependencies:
|
||||
'@nostr-dev-kit/ndk': 0.8.0(typescript@4.9.5)
|
||||
'@nostr-dev-kit/ndk': 0.8.1(typescript@4.9.5)
|
||||
'@nostr-fetch/kernel': 0.11.0
|
||||
nostr-fetch: 0.12.2
|
||||
dev: false
|
||||
@ -2837,7 +2837,7 @@ packages:
|
||||
postcss: ^8.1.0
|
||||
dependencies:
|
||||
browserslist: 4.21.10
|
||||
caniuse-lite: 1.0.30001518
|
||||
caniuse-lite: 1.0.30001519
|
||||
fraction.js: 4.2.0
|
||||
normalize-range: 0.1.2
|
||||
picocolors: 1.0.0
|
||||
@ -2908,7 +2908,7 @@ packages:
|
||||
engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
|
||||
hasBin: true
|
||||
dependencies:
|
||||
caniuse-lite: 1.0.30001518
|
||||
caniuse-lite: 1.0.30001519
|
||||
electron-to-chromium: 1.4.482
|
||||
node-releases: 2.0.13
|
||||
update-browserslist-db: 1.0.11(browserslist@4.21.10)
|
||||
@ -2968,8 +2968,8 @@ packages:
|
||||
engines: {node: '>=6'}
|
||||
dev: false
|
||||
|
||||
/caniuse-lite@1.0.30001518:
|
||||
resolution: {integrity: sha512-rup09/e3I0BKjncL+FesTayKtPrdwKhUufQFd3riFw1hHg8JmIFoInYfB102cFcY/pPgGmdyl/iy+jgiDi2vdA==}
|
||||
/caniuse-lite@1.0.30001519:
|
||||
resolution: {integrity: sha512-0QHgqR+Jv4bxHMp8kZ1Kn8CH55OikjKJ6JmKkZYP1F3D7w+lnFXF70nG5eNfsZS89jadi5Ywy5UCSKLAglIRkg==}
|
||||
|
||||
/case-anything@2.1.13:
|
||||
resolution: {integrity: sha512-zlOQ80VrQ2Ue+ymH5OuM/DlDq64mEm+B9UTdHULv5osUMD6HalNTblf2b1u/m6QecjsnOkBpqVZ+XPwIVsy7Ng==}
|
||||
@ -3596,8 +3596,8 @@ packages:
|
||||
engines: {node: '>=12'}
|
||||
dev: false
|
||||
|
||||
/eslint-config-prettier@8.9.0(eslint@8.46.0):
|
||||
resolution: {integrity: sha512-+sbni7NfVXnOpnRadUA8S28AUlsZt9GjgFvABIRL9Hkn8KqNzOp+7Lw4QWtrwn20KzU3wqu1QoOj2m+7rKRqkA==}
|
||||
/eslint-config-prettier@8.10.0(eslint@8.46.0):
|
||||
resolution: {integrity: sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==}
|
||||
hasBin: true
|
||||
peerDependencies:
|
||||
eslint: '>=7.0.0'
|
||||
|
||||
@ -34,12 +34,12 @@ export function ChatsList() {
|
||||
return (
|
||||
<div className="flex flex-col">
|
||||
<div className="inline-flex h-9 items-center gap-2.5 rounded-md px-2.5">
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-zinc-800" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-zinc-800" />
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-white/10" />
|
||||
</div>
|
||||
<div className="inline-flex h-9 items-center gap-2.5 rounded-md px-2.5">
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-zinc-800" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-zinc-800" />
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-white/10" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@ -51,15 +51,15 @@ export function ChatsList() {
|
||||
<ChatsListSelfItem data={account} />
|
||||
) : (
|
||||
<div className="inline-flex h-9 items-center gap-2.5 rounded-md px-2">
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-zinc-800" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-zinc-800" />
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-white/10" />
|
||||
</div>
|
||||
)}
|
||||
{chats.follows.map((item) => renderItem(item))}
|
||||
{isFetching && (
|
||||
<div className="inline-flex h-9 items-center gap-2.5 rounded-md px-2">
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-zinc-800" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-zinc-800" />
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-white/10" />
|
||||
</div>
|
||||
)}
|
||||
{chats.unknowns.length > 0 && <UnknownsModal data={chats.unknowns} />}
|
||||
|
||||
@ -14,9 +14,9 @@ export function ChatsListSelfItem({ data }: { data: { pubkey: string } }) {
|
||||
if (status === 'loading') {
|
||||
return (
|
||||
<div className="inline-flex h-9 items-center gap-2.5 rounded-md px-2">
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-zinc-800" />
|
||||
<div className="relative h-6 w-6 shrink-0 animate-pulse rounded bg-white/10" />
|
||||
<div>
|
||||
<div className="h-2.5 w-full animate-pulse truncate rounded bg-zinc-800 text-base font-medium" />
|
||||
<div className="h-2.5 w-full animate-pulse truncate rounded bg-white/10 text-base font-medium" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -23,7 +23,7 @@ export function NoteScreen() {
|
||||
<div className="scrollbar-hide flex h-full w-full flex-col gap-1.5 overflow-y-auto pb-20 pt-16">
|
||||
{status === 'loading' ? (
|
||||
<div className="px-3 py-1.5">
|
||||
<div className="shadow-input rounded-md bg-zinc-900 px-3 py-3 shadow-black/20">
|
||||
<div className="shadow-input rounded-md bg-white/10 px-3 py-3">
|
||||
<NoteSkeleton />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -156,7 +156,7 @@ export function FeedBlock({ params }: { params: Block }) {
|
||||
)}
|
||||
{isFetchingNextPage && (
|
||||
<div className="px-3 py-1.5">
|
||||
<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>
|
||||
|
||||
@ -177,7 +177,7 @@ export function FollowingBlock() {
|
||||
)}
|
||||
{isFetchingNextPage && (
|
||||
<div className="px-3 py-1.5">
|
||||
<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>
|
||||
|
||||
@ -10,7 +10,7 @@ export function ImageBlock({ params }: { params: Block }) {
|
||||
const { remove } = useBlock();
|
||||
|
||||
return (
|
||||
<div className="flex h-full w-[350px] shrink-0 flex-col justify-between border-r border-zinc-900">
|
||||
<div className="flex h-full w-[400px] shrink-0 flex-col justify-between">
|
||||
<div className="relative h-full w-full flex-1 overflow-hidden p-3">
|
||||
<div className="absolute left-0 top-3 h-16 w-full px-3">
|
||||
<div className="flex h-16 items-center justify-between overflow-hidden rounded-t-xl px-5">
|
||||
@ -28,7 +28,7 @@ export function ImageBlock({ params }: { params: Block }) {
|
||||
src={params.content}
|
||||
fallback={DEFAULT_AVATAR}
|
||||
alt={params.title}
|
||||
className="h-full w-full rounded-xl border-t border-zinc-800/50 object-cover"
|
||||
className="h-full w-full rounded-xl object-cover"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -27,7 +27,7 @@ export function ThreadBlock({ params }: { params: Block }) {
|
||||
<div className="h-full">
|
||||
{status === 'loading' ? (
|
||||
<div className="px-3 py-1.5">
|
||||
<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>
|
||||
|
||||
@ -51,7 +51,7 @@ export function UserBlock({ params }: { params: Block }) {
|
||||
<div className="flex h-full w-full flex-col justify-between gap-1.5 pb-10">
|
||||
{status === 'loading' ? (
|
||||
<div className="px-3 py-1.5">
|
||||
<div className="shadow-input rounded-md bg-zinc-900 px-3 py-3 shadow-black/20">
|
||||
<div className="rounded-md bg-white/10 px-3 py-3">
|
||||
<NoteSkeleton />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -116,12 +116,7 @@ export function ImageModal() {
|
||||
onSubmit={handleSubmit(onSubmit)}
|
||||
className="mb-0 flex h-full w-full flex-col gap-3"
|
||||
>
|
||||
<input
|
||||
type={'hidden'}
|
||||
{...register('content')}
|
||||
value={image}
|
||||
className="shadow-input relative h-10 w-full rounded-lg border border-black/5 px-3 py-2 shadow-black/5 !outline-none placeholder:text-white/50 dark:bg-zinc-800 dark:text-white dark:shadow-black/10 dark:placeholder:text-zinc-500"
|
||||
/>
|
||||
<input type={'hidden'} {...register('content')} value={image} />
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="title"
|
||||
@ -145,7 +140,7 @@ export function ImageModal() {
|
||||
>
|
||||
Picture
|
||||
</label>
|
||||
<div className="relative inline-flex h-56 w-full items-center justify-center overflow-hidden rounded-lg border border-zinc-900 bg-zinc-950">
|
||||
<div className="relative inline-flex h-56 w-full items-center justify-center overflow-hidden rounded-lg bg-white/10">
|
||||
<Image
|
||||
src={image}
|
||||
fallback={DEFAULT_AVATAR}
|
||||
@ -156,7 +151,7 @@ export function ImageModal() {
|
||||
<button
|
||||
onClick={() => uploadImage()}
|
||||
type="button"
|
||||
className="inline-flex h-6 items-center justify-center rounded bg-zinc-900 px-3 text-sm font-medium text-zinc-300 ring-1 ring-zinc-800 hover:bg-zinc-800"
|
||||
className="inline-flex h-6 items-center justify-center rounded bg-white/10 px-3 text-sm font-medium text-white hover:bg-fuchsia-500"
|
||||
>
|
||||
Upload
|
||||
</button>
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
import * as Dialog from '@radix-ui/react-dialog';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
|
||||
import { Button } from '@shared/button';
|
||||
import { Composer, ComposerUser } from '@shared/composer';
|
||||
import {
|
||||
CancelIcon,
|
||||
@ -28,10 +27,13 @@ export function ComposerModal() {
|
||||
return (
|
||||
<Dialog.Root open={open}>
|
||||
<Dialog.Trigger asChild>
|
||||
<Button preset="small">
|
||||
<button
|
||||
type="button"
|
||||
className="inline-flex h-9 w-min items-center justify-center gap-1 rounded-md bg-white/10 px-4 text-sm font-medium text-white hover:bg-fuchsia-500 focus:outline-none active:translate-y-1 disabled:pointer-events-none disabled:opacity-50"
|
||||
>
|
||||
<ComposeIcon className="h-4 w-4" />
|
||||
Postr
|
||||
</Button>
|
||||
</button>
|
||||
</Dialog.Trigger>
|
||||
<Dialog.Portal className="relative z-10">
|
||||
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/80 backdrop-blur-xl" />
|
||||
|
||||
@ -10,11 +10,11 @@ export function LinkPreview({ urls }: { urls: string[] }) {
|
||||
<div className="mb-2 mt-3 max-w-[420px] overflow-hidden rounded-lg bg-white/10">
|
||||
{status === 'loading' ? (
|
||||
<div className="flex flex-col">
|
||||
<div className="h-44 w-full animate-pulse bg-zinc-700" />
|
||||
<div className="h-44 w-full animate-pulse bg-white/10" />
|
||||
<div className="flex flex-col gap-2 px-3 py-3">
|
||||
<div className="h-3 w-2/3 animate-pulse rounded bg-zinc-700" />
|
||||
<div className="h-3 w-3/4 animate-pulse rounded bg-zinc-700" />
|
||||
<span className="mt-2.5 text-sm leading-none text-zinc-500">
|
||||
<div className="h-3 w-2/3 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-3/4 animate-pulse rounded bg-white/10" />
|
||||
<span className="mt-2.5 text-sm leading-none text-white/50">
|
||||
{domain.hostname}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@ -60,19 +60,14 @@ export function NotificationModal({ pubkey }: { pubkey: string }) {
|
||||
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/80 backdrop-blur-xl" />
|
||||
<Dialog.Content className="fixed inset-0 z-50 flex min-h-full items-center justify-center">
|
||||
<div className="relative h-min w-full max-w-xl rounded-xl bg-white/10">
|
||||
<div className="h-min w-full shrink-0 border-b border-white/10 bg-white/5 px-5 py-5">
|
||||
<div className="h-min w-full shrink-0 rounded-t-xl border-b border-white/10 bg-white/5 px-5 py-5">
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="flex items-center justify-between">
|
||||
<Dialog.Title className="text-lg font-semibold leading-none text-white">
|
||||
Notification
|
||||
</Dialog.Title>
|
||||
<Dialog.Close asChild>
|
||||
<button
|
||||
type="button"
|
||||
className="inline-flex h-5 w-5 items-center justify-center rounded hover:bg-zinc-900"
|
||||
>
|
||||
<CancelIcon className="h-5 w-5 text-zinc-300" />
|
||||
</button>
|
||||
<Dialog.Close className="inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-white/10">
|
||||
<CancelIcon className="h-4 w-4 text-white/50" />
|
||||
</Dialog.Close>
|
||||
</div>
|
||||
<Dialog.Description className="text-sm leading-tight text-white/50">
|
||||
@ -80,7 +75,7 @@ export function NotificationModal({ pubkey }: { pubkey: string }) {
|
||||
</Dialog.Description>
|
||||
</div>
|
||||
</div>
|
||||
<div className="scrollbar-hide flex h-[500px] flex-col overflow-y-auto overflow-x-hidden pb-5">
|
||||
<div className="scrollbar-hide flex h-[500px] flex-col divide-y divide-white/10 overflow-y-auto overflow-x-hidden">
|
||||
{status === 'loading' ? (
|
||||
<div className="inline-flex items-center justify-center px-4 py-3">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -13,20 +13,16 @@ export function NotiMention({ event }: { event: NDKEvent }) {
|
||||
const content = useMemo(() => parser(event), [event]);
|
||||
|
||||
return (
|
||||
<div className="flex h-min flex-col px-5 py-2">
|
||||
<div className="flex h-min flex-col px-3 py-3">
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex items-start gap-1">
|
||||
<NotiUser pubkey={event.pubkey} />
|
||||
<p className="leading-none text-white/50">reply your post</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="leading-none text-zinc-500">{createdAt}</span>
|
||||
</div>
|
||||
<span className="leading-none text-white/50">{createdAt}</span>
|
||||
</div>
|
||||
<div className="-mt-4 pl-[35px]">
|
||||
<div>
|
||||
<NoteContent content={content} />
|
||||
</div>
|
||||
<div className="-mt-3 pl-[44px]">
|
||||
<NoteContent content={content} />
|
||||
{replyTo && <MentionNote id={replyTo} />}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -10,17 +10,17 @@ export function NotiReaction({ event }: { event: NDKEvent }) {
|
||||
const createdAt = formatCreatedAt(event.created_at);
|
||||
|
||||
return (
|
||||
<div className="flex h-min flex-col px-5 py-2">
|
||||
<div className="flex h-min flex-col px-3 py-3">
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex items-start gap-1">
|
||||
<NotiUser pubkey={event.pubkey} />
|
||||
<p className="leading-none text-white/50">reacted {event.content}</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="leading-none text-zinc-500">{createdAt}</span>
|
||||
<span className="leading-none text-white/50">{createdAt}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="-mt-4 pl-[35px]">{root && <MentionNote id={root} />}</div>
|
||||
<div className="-mt-5 pl-[44px]">{root && <MentionNote id={root} />}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ export function NotiRepost({ event }: { event: NDKEvent }) {
|
||||
const createdAt = formatCreatedAt(event.created_at);
|
||||
|
||||
return (
|
||||
<div className="flex h-min flex-col px-5 py-2">
|
||||
<div className="flex h-min flex-col px-3 py-3">
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex items-start gap-1">
|
||||
<NotiUser pubkey={event.pubkey} />
|
||||
@ -20,7 +20,7 @@ export function NotiRepost({ event }: { event: NDKEvent }) {
|
||||
<span className="leading-none text-zinc-500">{createdAt}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="-mt-4 pl-[35px]">{root && <MentionNote id={root} />}</div>
|
||||
<div className="-mt-5 pl-[44px]">{root && <MentionNote id={root} />}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -20,17 +20,15 @@ export function NotiUser({ pubkey }: { pubkey: string }) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex shrink-0 items-start justify-start gap-2">
|
||||
<div className="w-88 relative h-8 shrink-0 rounded-md">
|
||||
<Image
|
||||
src={user?.picture || user?.image}
|
||||
fallback={DEFAULT_AVATAR}
|
||||
alt={pubkey}
|
||||
className="w-88 h-8 rounded-md object-cover"
|
||||
/>
|
||||
</div>
|
||||
<span className="max-w-[10rem] flex-1 truncate leading-none text-zinc-200">
|
||||
{user?.nip05 || user?.name || user?.displayName || displayNpub(pubkey, 16)}
|
||||
<div className="flex shrink-0 items-start justify-start gap-3">
|
||||
<Image
|
||||
src={user?.picture || user?.image}
|
||||
fallback={DEFAULT_AVATAR}
|
||||
alt={pubkey}
|
||||
className="h-10 w-10 shrink-0 rounded-md object-cover"
|
||||
/>
|
||||
<span className="max-w-[10rem] flex-1 truncate font-medium leading-none text-white">
|
||||
{user?.nip05 || user?.name || user?.display_name || displayNpub(pubkey, 16)}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user