mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-30 00:41:00 +00:00
ready for alpha
This commit is contained in:
parent
50f81a7d0b
commit
0c8dcef937
@ -85,6 +85,9 @@ export function ImportAccountScreen() {
|
|||||||
try {
|
try {
|
||||||
const privkey = nip19.decode(nsec).data as string;
|
const privkey = nip19.decode(nsec).data as string;
|
||||||
await db.secureSave(pubkey, privkey);
|
await db.secureSave(pubkey, privkey);
|
||||||
|
|
||||||
|
ndk.signer = new NDKPrivateKeySigner(privkey);
|
||||||
|
|
||||||
setSavedPrivkey(true);
|
setSavedPrivkey(true);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
return toast(`nsec invalid: ${e}`);
|
return toast(`nsec invalid: ${e}`);
|
||||||
|
@ -36,7 +36,7 @@ export function ChatsScreen() {
|
|||||||
<div className="col-span-1 h-full overflow-y-auto border-r border-neutral-200 scrollbar-none dark:border-neutral-800">
|
<div className="col-span-1 h-full overflow-y-auto border-r border-neutral-200 scrollbar-none dark:border-neutral-800">
|
||||||
<div
|
<div
|
||||||
data-tauri-drag-region
|
data-tauri-drag-region
|
||||||
className="flex h-11 w-full shrink-0 items-center border-b border-neutral-200 px-3 dark:border-neutral-800"
|
className="flex h-11 w-full shrink-0 items-center border-b border-neutral-100 px-3 dark:border-neutral-900"
|
||||||
>
|
>
|
||||||
<h3 className="font-semibold text-neutral-950 dark:text-neutral-50">
|
<h3 className="font-semibold text-neutral-950 dark:text-neutral-50">
|
||||||
All chats
|
All chats
|
||||||
@ -52,6 +52,12 @@ export function ChatsScreen() {
|
|||||||
</h5>
|
</h5>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
) : data.length < 1 ? (
|
||||||
|
<div className="flex h-full w-full items-center justify-center pb-16">
|
||||||
|
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||||
|
<h5 className="text-neutral-900 dark:text-neutral-100">No message</h5>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
) : (
|
) : (
|
||||||
data.map((item) => renderItem(item))
|
data.map((item) => renderItem(item))
|
||||||
)}
|
)}
|
||||||
|
@ -1,22 +1,12 @@
|
|||||||
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
|
||||||
import { writeText } from '@tauri-apps/plugin-clipboard-manager';
|
import { writeText } from '@tauri-apps/plugin-clipboard-manager';
|
||||||
import { nip19 } from 'nostr-tools';
|
import { nip19 } from 'nostr-tools';
|
||||||
import { AddressPointer, EventPointer } from 'nostr-tools/lib/types/nip19';
|
import { AddressPointer, EventPointer } from 'nostr-tools/lib/types/nip19';
|
||||||
import { useRef, useState } from 'react';
|
import { useRef, useState } from 'react';
|
||||||
import { useNavigate, useParams } from 'react-router-dom';
|
import { useNavigate, useParams } from 'react-router-dom';
|
||||||
|
|
||||||
import { useStorage } from '@libs/storage/provider';
|
|
||||||
|
|
||||||
import { ArrowLeftIcon, CheckCircleIcon, ReplyIcon, ShareIcon } from '@shared/icons';
|
import { ArrowLeftIcon, CheckCircleIcon, ReplyIcon, ShareIcon } from '@shared/icons';
|
||||||
import {
|
import { ArticleDetailNote, NoteActions, NoteReplyForm } from '@shared/notes';
|
||||||
ArticleDetailNote,
|
|
||||||
NoteActions,
|
|
||||||
NoteReplyForm,
|
|
||||||
NoteStats,
|
|
||||||
UnknownNote,
|
|
||||||
} from '@shared/notes';
|
|
||||||
import { ReplyList } from '@shared/notes/replies/list';
|
import { ReplyList } from '@shared/notes/replies/list';
|
||||||
import { NoteSkeleton } from '@shared/notes/skeleton';
|
|
||||||
import { User } from '@shared/user';
|
import { User } from '@shared/user';
|
||||||
|
|
||||||
import { useEvent } from '@utils/hooks/useEvent';
|
import { useEvent } from '@utils/hooks/useEvent';
|
||||||
@ -26,7 +16,6 @@ export function ArticleNoteScreen() {
|
|||||||
const replyRef = useRef(null);
|
const replyRef = useRef(null);
|
||||||
|
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
const { db } = useStorage();
|
|
||||||
|
|
||||||
const naddr = id.startsWith('naddr') ? (nip19.decode(id).data as AddressPointer) : null;
|
const naddr = id.startsWith('naddr') ? (nip19.decode(id).data as AddressPointer) : null;
|
||||||
const { status, data } = useEvent(id, naddr);
|
const { status, data } = useEvent(id, naddr);
|
||||||
@ -48,33 +37,22 @@ export function ArticleNoteScreen() {
|
|||||||
replyRef.current.scrollIntoView();
|
replyRef.current.scrollIntoView();
|
||||||
};
|
};
|
||||||
|
|
||||||
const renderKind = (event: NDKEvent) => {
|
|
||||||
switch (event.kind) {
|
|
||||||
case NDKKind.Article:
|
|
||||||
return <ArticleDetailNote event={event} />;
|
|
||||||
default:
|
|
||||||
return <UnknownNote event={event} />;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="h-full w-full overflow-y-auto scroll-smooth scrollbar-none">
|
<div className="container mx-auto grid grid-cols-8 scroll-smooth px-4">
|
||||||
<div className="container mx-auto px-4 pt-16 sm:px-6 lg:px-8">
|
<div className="col-span-1">
|
||||||
<div className="grid grid-cols-5">
|
<div className="flex flex-col items-end gap-4">
|
||||||
<div className="col-span-1 pr-8">
|
|
||||||
<div className="sticky top-16 flex flex-col items-end gap-4">
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={() => navigate(-1)}
|
onClick={() => navigate(-1)}
|
||||||
className="inline-flex h-12 w-12 items-center justify-center rounded-xl bg-neutral-200 dark:bg-neutral-800"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-xl bg-neutral-100 dark:bg-neutral-900"
|
||||||
>
|
>
|
||||||
<ArrowLeftIcon className="h-5 w-5" />
|
<ArrowLeftIcon className="h-5 w-5" />
|
||||||
</button>
|
</button>
|
||||||
<div className="flex flex-col divide-y divide-neutral-300 rounded-xl bg-neutral-200 dark:divide-neutral-700 dark:bg-neutral-800">
|
<div className="flex flex-col divide-y divide-neutral-200 rounded-xl bg-neutral-100 dark:divide-neutral-800 dark:bg-neutral-900">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={share}
|
onClick={share}
|
||||||
className="sticky top-16 inline-flex h-12 w-12 items-center justify-center rounded-t-xl"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-t-xl"
|
||||||
>
|
>
|
||||||
{isCopy ? (
|
{isCopy ? (
|
||||||
<CheckCircleIcon className="h-5 w-5 text-teal-500" />
|
<CheckCircleIcon className="h-5 w-5 text-teal-500" />
|
||||||
@ -85,46 +63,39 @@ export function ArticleNoteScreen() {
|
|||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={scrollToReply}
|
onClick={scrollToReply}
|
||||||
className="sticky top-16 inline-flex h-12 w-12 items-center justify-center rounded-b-xl"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-b-xl"
|
||||||
>
|
>
|
||||||
<ReplyIcon className="h-5 w-5" />
|
<ReplyIcon className="h-5 w-5" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-3 flex flex-col gap-1.5">
|
<div className="relative col-span-6 flex flex-col overflow-y-auto">
|
||||||
|
<div className="mx-auto w-full max-w-2xl">
|
||||||
{status === 'loading' ? (
|
{status === 'loading' ? (
|
||||||
<div className="px-3 py-1.5">
|
<div className="px-3 py-1.5">Loading...</div>
|
||||||
<div className="rounded-xl bg-white/10 px-3 py-3 backdrop-blur-xl">
|
|
||||||
<NoteSkeleton />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
) : (
|
||||||
<>
|
<div className="flex h-min w-full flex-col px-3">
|
||||||
<div className="flex h-min w-full flex-col gap-1 px-3">
|
<div className="mb-3 border-b border-neutral-100 pb-3 dark:border-neutral-900">
|
||||||
<div>
|
|
||||||
<User pubkey={data.pubkey} time={data.created_at} variant="thread" />
|
<User pubkey={data.pubkey} time={data.created_at} variant="thread" />
|
||||||
<div className="mt-2">{renderKind(data)}</div>
|
<div className="mt-3">
|
||||||
<div className="mb-3 mt-3">
|
<ArticleDetailNote event={data} />
|
||||||
<NoteActions
|
</div>
|
||||||
id={data.id}
|
<div className="mt-3">
|
||||||
pubkey={data.pubkey}
|
<NoteActions id={id} pubkey={data.pubkey} extraButtons={false} />
|
||||||
extraButtons={false}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<NoteStats id={data.id} />
|
|
||||||
</div>
|
</div>
|
||||||
<div ref={replyRef} className="px-3">
|
|
||||||
<NoteReplyForm id={data.id} pubkey={db.account.pubkey} />
|
|
||||||
<ReplyList id={data.id} />
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
)}
|
||||||
|
<div ref={replyRef} className="px-3">
|
||||||
|
<div className="mb-3 border-b border-neutral-100 pb-3 dark:border-neutral-900">
|
||||||
|
<NoteReplyForm id={id} />
|
||||||
|
</div>
|
||||||
|
<ReplyList id={id} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-1" />
|
<div className="col-span-1" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -5,15 +5,12 @@ import { EventPointer } from 'nostr-tools/lib/types/nip19';
|
|||||||
import { useRef, useState } from 'react';
|
import { useRef, useState } from 'react';
|
||||||
import { useNavigate, useParams } from 'react-router-dom';
|
import { useNavigate, useParams } from 'react-router-dom';
|
||||||
|
|
||||||
import { useStorage } from '@libs/storage/provider';
|
|
||||||
|
|
||||||
import { ArrowLeftIcon, CheckCircleIcon, ReplyIcon, ShareIcon } from '@shared/icons';
|
import { ArrowLeftIcon, CheckCircleIcon, ReplyIcon, ShareIcon } from '@shared/icons';
|
||||||
import {
|
import {
|
||||||
ArticleNote,
|
ArticleNote,
|
||||||
FileNote,
|
FileNote,
|
||||||
NoteActions,
|
NoteActions,
|
||||||
NoteReplyForm,
|
NoteReplyForm,
|
||||||
NoteStats,
|
|
||||||
TextNote,
|
TextNote,
|
||||||
UnknownNote,
|
UnknownNote,
|
||||||
} from '@shared/notes';
|
} from '@shared/notes';
|
||||||
@ -23,16 +20,12 @@ import { User } from '@shared/user';
|
|||||||
import { useEvent } from '@utils/hooks/useEvent';
|
import { useEvent } from '@utils/hooks/useEvent';
|
||||||
|
|
||||||
export function TextNoteScreen() {
|
export function TextNoteScreen() {
|
||||||
|
const { id } = useParams();
|
||||||
|
const { status, data } = useEvent(id);
|
||||||
|
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const replyRef = useRef(null);
|
const replyRef = useRef(null);
|
||||||
|
|
||||||
const { id } = useParams();
|
|
||||||
|
|
||||||
console.log(id);
|
|
||||||
|
|
||||||
const { db } = useStorage();
|
|
||||||
const { status, data } = useEvent(id);
|
|
||||||
|
|
||||||
const [isCopy, setIsCopy] = useState(false);
|
const [isCopy, setIsCopy] = useState(false);
|
||||||
|
|
||||||
const share = async () => {
|
const share = async () => {
|
||||||
@ -64,23 +57,21 @@ export function TextNoteScreen() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="h-full w-full overflow-y-auto scroll-smooth scrollbar-none">
|
<div className="container mx-auto grid grid-cols-8 scroll-smooth px-4">
|
||||||
<div className="container mx-auto px-4 pt-16 sm:px-6 lg:px-8">
|
<div className="col-span-1">
|
||||||
<div className="grid grid-cols-5">
|
<div className="flex flex-col items-end gap-4">
|
||||||
<div className="col-span-1 pr-8">
|
|
||||||
<div className="sticky top-16 flex flex-col items-end gap-4">
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={() => navigate(-1)}
|
onClick={() => navigate(-1)}
|
||||||
className="inline-flex h-12 w-12 items-center justify-center rounded-xl bg-neutral-200 dark:bg-neutral-800"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-xl bg-neutral-100 dark:bg-neutral-900"
|
||||||
>
|
>
|
||||||
<ArrowLeftIcon className="h-5 w-5" />
|
<ArrowLeftIcon className="h-5 w-5" />
|
||||||
</button>
|
</button>
|
||||||
<div className="flex flex-col divide-y divide-neutral-300 rounded-xl bg-neutral-200 dark:divide-neutral-700 dark:bg-neutral-800">
|
<div className="flex flex-col divide-y divide-neutral-200 rounded-xl bg-neutral-100 dark:divide-neutral-800 dark:bg-neutral-900">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={share}
|
onClick={share}
|
||||||
className="sticky top-16 inline-flex h-12 w-12 items-center justify-center rounded-t-xl"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-t-xl"
|
||||||
>
|
>
|
||||||
{isCopy ? (
|
{isCopy ? (
|
||||||
<CheckCircleIcon className="h-5 w-5 text-teal-500" />
|
<CheckCircleIcon className="h-5 w-5 text-teal-500" />
|
||||||
@ -91,40 +82,37 @@ export function TextNoteScreen() {
|
|||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={scrollToReply}
|
onClick={scrollToReply}
|
||||||
className="sticky top-16 inline-flex h-12 w-12 items-center justify-center rounded-b-xl"
|
className="inline-flex h-12 w-12 items-center justify-center rounded-b-xl"
|
||||||
>
|
>
|
||||||
<ReplyIcon className="h-5 w-5" />
|
<ReplyIcon className="h-5 w-5" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-3 flex flex-col gap-1.5">
|
<div className="relative col-span-6 flex flex-col overflow-y-auto">
|
||||||
|
<div className="mx-auto w-full max-w-2xl">
|
||||||
{status === 'loading' ? (
|
{status === 'loading' ? (
|
||||||
<div className="px-3 py-1.5">
|
<div className="px-3 py-1.5">Loading...</div>
|
||||||
<div className="rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
|
||||||
Loading...
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
) : (
|
||||||
<div className="flex h-min w-full flex-col px-3">
|
<div className="flex h-min w-full flex-col px-3">
|
||||||
<div className="rounded-xl bg-neutral-100 px-3 pt-3 dark:bg-neutral-900">
|
<div className="mb-3 border-b border-neutral-100 pb-3 dark:border-neutral-900">
|
||||||
<User pubkey={data.pubkey} time={data.created_at} variant="thread" />
|
<User pubkey={data.pubkey} time={data.created_at} variant="thread" />
|
||||||
<div className="mt-2">{renderKind(data)}</div>
|
<div className="mt-3">{renderKind(data)}</div>
|
||||||
<div className="mb-3">
|
<div className="mt-3">
|
||||||
<NoteActions id={id} pubkey={data.pubkey} extraButtons={false} />
|
<NoteActions id={id} pubkey={data.pubkey} extraButtons={false} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<NoteStats id={id} />
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div ref={replyRef} className="px-3">
|
<div ref={replyRef} className="px-3">
|
||||||
<NoteReplyForm id={id} pubkey={db.account.pubkey} />
|
<div className="mb-3 border-b border-neutral-100 pb-3 dark:border-neutral-900">
|
||||||
|
<NoteReplyForm id={id} />
|
||||||
|
</div>
|
||||||
<ReplyList id={id} />
|
<ReplyList id={id} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div className="col-span-1" />
|
<div className="col-span-1" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -4,6 +4,7 @@ import { useStorage } from '@libs/storage/provider';
|
|||||||
|
|
||||||
import {
|
import {
|
||||||
ArticleIcon,
|
ArticleIcon,
|
||||||
|
BellIcon,
|
||||||
FileIcon,
|
FileIcon,
|
||||||
FollowsIcon,
|
FollowsIcon,
|
||||||
GroupFeedsIcon,
|
GroupFeedsIcon,
|
||||||
@ -50,16 +51,18 @@ export function WidgetList({ params }: { params: Widget }) {
|
|||||||
);
|
);
|
||||||
case WidgetKinds.tmp.xhashtag:
|
case WidgetKinds.tmp.xhashtag:
|
||||||
return (
|
return (
|
||||||
<HashtagIcon className="h-5 w-4 text-neutral-900 dark:text-neutral-100" />
|
<HashtagIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
|
||||||
);
|
);
|
||||||
case WidgetKinds.nostrBand.trendingAccounts:
|
case WidgetKinds.nostrBand.trendingAccounts:
|
||||||
case WidgetKinds.nostrBand.trendingNotes:
|
case WidgetKinds.nostrBand.trendingNotes:
|
||||||
return (
|
return (
|
||||||
<TrendingIcon className="h-5 w-4 text-neutral-900 dark:text-neutral-100" />
|
<TrendingIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
|
||||||
);
|
);
|
||||||
|
case WidgetKinds.local.notification:
|
||||||
|
return <BellIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
|
||||||
case WidgetKinds.other.learnNostr:
|
case WidgetKinds.other.learnNostr:
|
||||||
return (
|
return (
|
||||||
<ThreadsIcon className="h-5 w-4 text-neutral-900 dark:text-neutral-100" />
|
<ThreadsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
|
||||||
);
|
);
|
||||||
default:
|
default:
|
||||||
return null;
|
return null;
|
||||||
@ -75,7 +78,7 @@ export function WidgetList({ params }: { params: Widget }) {
|
|||||||
<h3 className="text-sm font-semibold text-neutral-500 dark:text-neutral-300">
|
<h3 className="text-sm font-semibold text-neutral-500 dark:text-neutral-300">
|
||||||
{row.title}
|
{row.title}
|
||||||
</h3>
|
</h3>
|
||||||
<div className="flex flex-col divide-y divide-neutral-200 overflow-hidden rounded-xl bg-neutral-100 dark:divide-neutral-800 dark:bg-neutral-900">
|
<div className="flex flex-col divide-y divide-neutral-100 overflow-hidden rounded-xl bg-neutral-50 dark:divide-neutral-900 dark:bg-neutral-950">
|
||||||
{row.data.map((item, index) => (
|
{row.data.map((item, index) => (
|
||||||
<button
|
<button
|
||||||
onClick={() => openWidget(item)}
|
onClick={() => openWidget(item)}
|
||||||
|
@ -90,9 +90,12 @@ export function SpaceScreen() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<VList
|
<VList
|
||||||
className="h-full w-full flex-nowrap overflow-x-auto !overflow-y-hidden scrollbar-none"
|
className="h-full w-full flex-nowrap overflow-x-auto !overflow-y-hidden scrollbar-none focus:outline-none"
|
||||||
horizontal
|
horizontal
|
||||||
ref={vlistRef}
|
ref={vlistRef}
|
||||||
|
initialItemSize={420}
|
||||||
|
aria-current="step"
|
||||||
|
tabIndex={0}
|
||||||
>
|
>
|
||||||
{!widgets ? (
|
{!widgets ? (
|
||||||
<div className="flex h-full w-[420px] flex-col items-center justify-center">
|
<div className="flex h-full w-[420px] flex-col items-center justify-center">
|
||||||
|
@ -2,7 +2,6 @@ import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
|||||||
import { useQuery } from '@tanstack/react-query';
|
import { useQuery } from '@tanstack/react-query';
|
||||||
import { useCallback } from 'react';
|
import { useCallback } from 'react';
|
||||||
import { useParams } from 'react-router-dom';
|
import { useParams } from 'react-router-dom';
|
||||||
import { WVList } from 'virtua';
|
|
||||||
|
|
||||||
import { UserProfile } from '@app/users/components/profile';
|
import { UserProfile } from '@app/users/components/profile';
|
||||||
|
|
||||||
@ -11,15 +10,12 @@ import { useNDK } from '@libs/ndk/provider';
|
|||||||
import {
|
import {
|
||||||
ArticleNote,
|
ArticleNote,
|
||||||
FileNote,
|
FileNote,
|
||||||
NoteSkeleton,
|
|
||||||
NoteWrapper,
|
NoteWrapper,
|
||||||
Repost,
|
Repost,
|
||||||
TextNote,
|
TextNote,
|
||||||
UnknownNote,
|
UnknownNote,
|
||||||
} from '@shared/notes';
|
} from '@shared/notes';
|
||||||
|
|
||||||
import { nHoursAgo } from '@utils/date';
|
|
||||||
|
|
||||||
export function UserScreen() {
|
export function UserScreen() {
|
||||||
const { pubkey } = useParams();
|
const { pubkey } = useParams();
|
||||||
const { ndk } = useNDK();
|
const { ndk } = useNDK();
|
||||||
@ -27,9 +23,10 @@ export function UserScreen() {
|
|||||||
const events = await ndk.fetchEvents({
|
const events = await ndk.fetchEvents({
|
||||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Article],
|
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Article],
|
||||||
authors: [pubkey],
|
authors: [pubkey],
|
||||||
since: nHoursAgo(48),
|
limit: 50,
|
||||||
});
|
});
|
||||||
return [...events] as unknown as NDKEvent[];
|
const sorted = [...events].sort((a, b) => b.created_at - a.created_at);
|
||||||
|
return sorted;
|
||||||
});
|
});
|
||||||
|
|
||||||
// render event match event kind
|
// render event match event kind
|
||||||
@ -68,20 +65,16 @@ export function UserScreen() {
|
|||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="relative h-full w-full overflow-y-auto scrollbar-none">
|
<div className="relative h-full w-full overflow-y-auto">
|
||||||
<div data-tauri-drag-region className="absolute left-0 top-0 h-11 w-full" />
|
<div data-tauri-drag-region className="absolute left-0 top-0 h-11 w-full" />
|
||||||
<UserProfile pubkey={pubkey} />
|
<UserProfile pubkey={pubkey} />
|
||||||
<div className="mt-6 h-full w-full border-t border-white/5 px-1.5">
|
<div className="mt-6 h-full w-full border-t border-neutral-100 px-1.5 dark:border-neutral-900">
|
||||||
<h3 className="mb-2 pt-4 text-center text-lg font-semibold leading-none text-white">
|
<h3 className="mb-2 pt-4 text-center text-lg font-semibold leading-none text-neutral-900 dark:text-neutral-100">
|
||||||
Latest posts
|
Latest posts
|
||||||
</h3>
|
</h3>
|
||||||
<div className="mx-auto flex h-full max-w-[500px] flex-col justify-between gap-1.5 pb-4 pt-1.5">
|
<div className="mx-auto flex h-full max-w-[500px] flex-col justify-between gap-1.5 pb-4 pt-1.5">
|
||||||
{status === 'loading' ? (
|
{status === 'loading' ? (
|
||||||
<div className="px-3 py-1.5">
|
<div>Loading...</div>
|
||||||
<div className="rounded-xl bg-white/10 px-3 py-3 backdrop-blur-xl">
|
|
||||||
<NoteSkeleton />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : data.length === 0 ? (
|
) : data.length === 0 ? (
|
||||||
<div className="px-3 py-1.5">
|
<div className="px-3 py-1.5">
|
||||||
<div className="rounded-xl bg-neutral-100 px-3 py-6 dark:bg-neutral-900">
|
<div className="rounded-xl bg-neutral-100 px-3 py-6 dark:bg-neutral-900">
|
||||||
@ -93,10 +86,7 @@ export function UserScreen() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<WVList>
|
data.map((item) => renderItem(item))
|
||||||
{data.map((item) => renderItem(item))}
|
|
||||||
<div className="h-16" />
|
|
||||||
</WVList>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -55,8 +55,10 @@ export const NDKInstance = () => {
|
|||||||
async function getSigner(instance: NDK) {
|
async function getSigner(instance: NDK) {
|
||||||
if (!db.account) return null;
|
if (!db.account) return null;
|
||||||
|
|
||||||
// NIP-46 Signer
|
|
||||||
const localSignerPrivkey = await db.secureLoad(db.account.pubkey + '-bunker');
|
const localSignerPrivkey = await db.secureLoad(db.account.pubkey + '-bunker');
|
||||||
|
const userPrivkey = await db.secureLoad(db.account.pubkey);
|
||||||
|
|
||||||
|
// NIP-46 Signer
|
||||||
if (localSignerPrivkey) {
|
if (localSignerPrivkey) {
|
||||||
const localSigner = new NDKPrivateKeySigner(localSignerPrivkey);
|
const localSigner = new NDKPrivateKeySigner(localSignerPrivkey);
|
||||||
const remoteSigner = new NDKNip46Signer(instance, db.account.id, localSigner);
|
const remoteSigner = new NDKNip46Signer(instance, db.account.id, localSigner);
|
||||||
@ -66,8 +68,9 @@ export const NDKInstance = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Privkey Signer
|
// Privkey Signer
|
||||||
const userPrivkey = await db.secureLoad(db.account.pubkey);
|
if (userPrivkey) {
|
||||||
if (userPrivkey) return new NDKPrivateKeySigner(userPrivkey);
|
return new NDKPrivateKeySigner(userPrivkey);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function initNDK() {
|
async function initNDK() {
|
||||||
@ -91,7 +94,30 @@ export const NDKInstance = () => {
|
|||||||
instance.signer = signer;
|
instance.signer = signer;
|
||||||
|
|
||||||
// update account's metadata
|
// update account's metadata
|
||||||
// todo
|
if (db.account) {
|
||||||
|
const circleSetting = await db.getSettingValue('circles');
|
||||||
|
|
||||||
|
const user = instance.getUser({ hexpubkey: db.account.pubkey });
|
||||||
|
const follows = await user.follows();
|
||||||
|
const relayList = await user.relayList();
|
||||||
|
|
||||||
|
const followsAsArr = [];
|
||||||
|
follows.forEach((user) => {
|
||||||
|
followsAsArr.push(user.pubkey);
|
||||||
|
});
|
||||||
|
|
||||||
|
// update user's follows
|
||||||
|
await db.updateAccount('follows', JSON.stringify(followsAsArr));
|
||||||
|
if (circleSetting !== '1')
|
||||||
|
await db.updateAccount('circles', JSON.stringify(followsAsArr));
|
||||||
|
|
||||||
|
// update user's relay list
|
||||||
|
if (relayList) {
|
||||||
|
for (const relay of relayList.relays) {
|
||||||
|
await db.createRelay(relay);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
await message(`NDK instance init failed: ${error}`, {
|
await message(`NDK instance init failed: ${error}`, {
|
||||||
title: 'Lume',
|
title: 'Lume',
|
||||||
|
@ -2,7 +2,7 @@ import { NDKFilter, NDKKind } from '@nostr-dev-kit/ndk';
|
|||||||
import * as Avatar from '@radix-ui/react-avatar';
|
import * as Avatar from '@radix-ui/react-avatar';
|
||||||
import { minidenticon } from 'minidenticons';
|
import { minidenticon } from 'minidenticons';
|
||||||
import { useEffect } from 'react';
|
import { useEffect } from 'react';
|
||||||
import { Link } from 'react-router-dom';
|
import { Link, useLocation } from 'react-router-dom';
|
||||||
|
|
||||||
import { useNDK } from '@libs/ndk/provider';
|
import { useNDK } from '@libs/ndk/provider';
|
||||||
import { useStorage } from '@libs/storage/provider';
|
import { useStorage } from '@libs/storage/provider';
|
||||||
@ -22,14 +22,23 @@ export function ActiveAccount() {
|
|||||||
const { status, user } = useProfile(db.account.pubkey);
|
const { status, user } = useProfile(db.account.pubkey);
|
||||||
const { sub } = useNostr();
|
const { sub } = useNostr();
|
||||||
|
|
||||||
|
const location = useLocation();
|
||||||
const addActivity = useActivities((state) => state.addActivity);
|
const addActivity = useActivities((state) => state.addActivity);
|
||||||
|
const addNewMessage = useActivities((state) => state.addNewMessage);
|
||||||
|
|
||||||
const svgURI =
|
const svgURI =
|
||||||
'data:image/svg+xml;utf8,' +
|
'data:image/svg+xml;utf8,' +
|
||||||
encodeURIComponent(minidenticon(db.account.pubkey, 90, 50));
|
encodeURIComponent(minidenticon(db.account.pubkey, 90, 50));
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const filter: NDKFilter = {
|
const filter: NDKFilter = {
|
||||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Reaction, NDKKind.Zap],
|
kinds: [
|
||||||
|
NDKKind.Text,
|
||||||
|
NDKKind.EncryptedDirectMessage,
|
||||||
|
NDKKind.Repost,
|
||||||
|
NDKKind.Reaction,
|
||||||
|
NDKKind.Zap,
|
||||||
|
],
|
||||||
since: Math.floor(Date.now() / 1000),
|
since: Math.floor(Date.now() / 1000),
|
||||||
'#p': [db.account.pubkey],
|
'#p': [db.account.pubkey],
|
||||||
};
|
};
|
||||||
@ -37,7 +46,11 @@ export function ActiveAccount() {
|
|||||||
sub(
|
sub(
|
||||||
filter,
|
filter,
|
||||||
async (event) => {
|
async (event) => {
|
||||||
|
console.log('receive event: ', event.id);
|
||||||
|
|
||||||
|
if (event.kind !== NDKKind.EncryptedDirectMessage) {
|
||||||
addActivity(event);
|
addActivity(event);
|
||||||
|
}
|
||||||
|
|
||||||
const user = ndk.getUser({ hexpubkey: event.pubkey });
|
const user = ndk.getUser({ hexpubkey: event.pubkey });
|
||||||
await user.fetchProfile();
|
await user.fetchProfile();
|
||||||
@ -47,6 +60,18 @@ export function ActiveAccount() {
|
|||||||
return await sendNativeNotification(
|
return await sendNativeNotification(
|
||||||
`${user.profile.displayName || user.profile.name} has replied to your note`
|
`${user.profile.displayName || user.profile.name} has replied to your note`
|
||||||
);
|
);
|
||||||
|
case NDKKind.EncryptedDirectMessage: {
|
||||||
|
if (location.pathname !== '/chats') {
|
||||||
|
addNewMessage();
|
||||||
|
return await sendNativeNotification(
|
||||||
|
`${
|
||||||
|
user.profile.displayName || user.profile.name
|
||||||
|
} has send you a encrypted message`
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
case NDKKind.Repost:
|
case NDKKind.Repost:
|
||||||
return await sendNativeNotification(
|
return await sendNativeNotification(
|
||||||
`${user.profile.displayName || user.profile.name} has reposted to your note`
|
`${user.profile.displayName || user.profile.name} has reposted to your note`
|
||||||
|
@ -11,7 +11,13 @@ import {
|
|||||||
RelayIcon,
|
RelayIcon,
|
||||||
} from '@shared/icons';
|
} from '@shared/icons';
|
||||||
|
|
||||||
|
import { useActivities } from '@stores/activities';
|
||||||
|
|
||||||
|
import { compactNumber } from '@utils/number';
|
||||||
|
|
||||||
export function Navigation() {
|
export function Navigation() {
|
||||||
|
const newMessages = useActivities((state) => state.newMessages);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex h-full w-full flex-col justify-between p-3">
|
<div className="flex h-full w-full flex-col justify-between p-3">
|
||||||
<div className="flex flex-1 flex-col gap-5">
|
<div className="flex flex-1 flex-col gap-5">
|
||||||
@ -45,13 +51,18 @@ export function Navigation() {
|
|||||||
<>
|
<>
|
||||||
<div
|
<div
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
'inline-flex aspect-square h-auto w-full items-center justify-center rounded-lg',
|
'relative inline-flex aspect-square h-auto w-full items-center justify-center rounded-lg',
|
||||||
isActive
|
isActive
|
||||||
? 'bg-black/10 text-black dark:bg-white/10 dark:text-white'
|
? 'bg-black/10 text-black dark:bg-white/10 dark:text-white'
|
||||||
: 'text-black/50 dark:text-neutral-400'
|
: 'text-black/50 dark:text-neutral-400'
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<ChatsIcon className="h-6 w-6" />
|
<ChatsIcon className="h-6 w-6" />
|
||||||
|
{newMessages > 0 ? (
|
||||||
|
<div className="absolute right-0 top-0 inline-flex h-5 w-5 items-center justify-center rounded-full bg-blue-500 text-[9px] font-medium text-white">
|
||||||
|
{compactNumber.format(newMessages)}
|
||||||
|
</div>
|
||||||
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
<div className="text-sm font-medium text-black dark:text-white">Chats</div>
|
<div className="text-sm font-medium text-black dark:text-white">Chats</div>
|
||||||
</>
|
</>
|
||||||
|
@ -27,3 +27,4 @@ export * from './mentions/invoice';
|
|||||||
export * from './stats';
|
export * from './stats';
|
||||||
export * from './wrapper';
|
export * from './wrapper';
|
||||||
export * from './actions/more';
|
export * from './actions/more';
|
||||||
|
export * from './replies/replyMediaUploader';
|
||||||
|
@ -30,7 +30,7 @@ export function ArticleDetailNote({ event }: { event: NDKEvent }) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<ReactMarkdown
|
<ReactMarkdown
|
||||||
className="prose prose-neutral max-w-none select-text whitespace-pre-line leading-normal dark:prose-invert prose-headings:mb-1 prose-headings:mt-3 prose-p:mb-0 prose-p:mt-0 prose-p:last:mb-1 prose-a:font-normal prose-a:text-blue-500 prose-blockquote:mb-1 prose-blockquote:mt-1 prose-blockquote:border-l-[2px] prose-blockquote:border-blue-500 prose-blockquote:pl-2 prose-pre:whitespace-pre-wrap prose-pre:break-words prose-pre:break-all prose-pre:bg-white/10 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-ul:mt-1 prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2 hover:prose-a:text-blue-500"
|
className="break-p prose prose-neutral max-w-none select-text whitespace-pre-line leading-normal dark:prose-invert prose-headings:mb-1 prose-headings:mt-3 prose-p:mb-0 prose-p:mt-0 prose-p:last:mb-1 prose-a:font-normal prose-a:text-blue-500 prose-blockquote:mb-1 prose-blockquote:mt-1 prose-blockquote:border-l-[2px] prose-blockquote:border-blue-500 prose-blockquote:pl-2 prose-pre:whitespace-pre-wrap prose-pre:bg-white/10 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-ul:mt-1 prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2 hover:prose-a:text-blue-500"
|
||||||
remarkPlugins={[remarkGfm]}
|
remarkPlugins={[remarkGfm]}
|
||||||
components={{
|
components={{
|
||||||
a: ({ href }) => {
|
a: ({ href }) => {
|
||||||
|
@ -13,8 +13,6 @@ import {
|
|||||||
import { memo } from 'react';
|
import { memo } from 'react';
|
||||||
import { Link } from 'react-router-dom';
|
import { Link } from 'react-router-dom';
|
||||||
|
|
||||||
import { Image } from '@shared/image';
|
|
||||||
|
|
||||||
import { fileType } from '@utils/nip94';
|
import { fileType } from '@utils/nip94';
|
||||||
|
|
||||||
export function FileNote(props: { event?: NDKEvent }) {
|
export function FileNote(props: { event?: NDKEvent }) {
|
||||||
@ -24,10 +22,13 @@ export function FileNote(props: { event?: NDKEvent }) {
|
|||||||
if (type === 'image') {
|
if (type === 'image') {
|
||||||
return (
|
return (
|
||||||
<div className="mb-2 mt-3">
|
<div className="mb-2 mt-3">
|
||||||
<Image
|
<img
|
||||||
src={url}
|
src={url}
|
||||||
alt={props.event.content}
|
alt={props.event.content}
|
||||||
className="h-auto w-full rounded-lg object-cover"
|
className="h-auto w-full rounded-lg object-cover"
|
||||||
|
loading="lazy"
|
||||||
|
decoding="async"
|
||||||
|
style={{ contentVisibility: 'auto' }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -1,25 +1,33 @@
|
|||||||
|
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
|
import { toast } from 'sonner';
|
||||||
|
|
||||||
|
import { useNDK } from '@libs/ndk/provider';
|
||||||
import { useStorage } from '@libs/storage/provider';
|
import { useStorage } from '@libs/storage/provider';
|
||||||
|
|
||||||
|
import { ReplyMediaUploader } from '@shared/notes';
|
||||||
import { User } from '@shared/user';
|
import { User } from '@shared/user';
|
||||||
|
|
||||||
import { useNostr } from '@utils/hooks/useNostr';
|
|
||||||
|
|
||||||
export function NoteReplyForm({ id }: { id: string }) {
|
export function NoteReplyForm({ id }: { id: string }) {
|
||||||
const { publish } = useNostr();
|
|
||||||
const { db } = useStorage();
|
const { db } = useStorage();
|
||||||
|
const { ndk, relayUrls } = useNDK();
|
||||||
|
|
||||||
const [value, setValue] = useState('');
|
const [value, setValue] = useState('');
|
||||||
|
|
||||||
const submit = () => {
|
const submit = async () => {
|
||||||
const tags = [['e', id, '', 'reply']];
|
const tags = [['e', id, relayUrls[0], 'root']];
|
||||||
|
|
||||||
// publish event
|
// publish event
|
||||||
publish({ content: value, kind: 1, tags });
|
const event = new NDKEvent(ndk);
|
||||||
|
event.content = value;
|
||||||
|
event.kind = NDKKind.Text;
|
||||||
|
event.tags = tags;
|
||||||
|
|
||||||
// reset form
|
const publishedRelays = await event.publish();
|
||||||
|
if (publishedRelays) {
|
||||||
|
toast.success(`Broadcasted to ${publishedRelays.size} relays successfully.`);
|
||||||
setValue('');
|
setValue('');
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -30,17 +38,20 @@ export function NoteReplyForm({ id }: { id: string }) {
|
|||||||
value={value}
|
value={value}
|
||||||
onChange={(e) => setValue(e.target.value)}
|
onChange={(e) => setValue(e.target.value)}
|
||||||
placeholder="Reply to this thread..."
|
placeholder="Reply to this thread..."
|
||||||
className="relative h-24 w-full resize-none bg-transparent p-3 text-base text-neutral-900 !outline-none placeholder:text-neutral-600 dark:text-neutral-100 dark:placeholder:text-neutral-400"
|
className="relative h-36 w-full resize-none bg-transparent px-5 py-4 text-neutral-900 !outline-none placeholder:text-neutral-600 dark:text-neutral-100 dark:placeholder:text-neutral-400"
|
||||||
spellCheck={false}
|
spellCheck={false}
|
||||||
/>
|
/>
|
||||||
|
<div className="inline-flex items-center justify-end gap-2 rounded-b-xl border-t border-neutral-200 p-2 dark:border-neutral-800">
|
||||||
|
<ReplyMediaUploader setValue={setValue} />
|
||||||
<button
|
<button
|
||||||
onClick={() => submit()}
|
onClick={() => submit()}
|
||||||
disabled={value.length === 0 ? true : false}
|
disabled={value.length === 0 ? true : false}
|
||||||
className="mb-2 ml-auto mr-2 h-9 w-20 rounded-lg bg-blue-500 text-white hover:bg-blue-600 disabled:opacity-50"
|
className="h-9 w-20 rounded-lg bg-blue-500 text-white hover:bg-blue-600 disabled:opacity-50"
|
||||||
>
|
>
|
||||||
Reply
|
Reply
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -17,7 +17,7 @@ export function Reply({ event, root }: { event: NDKEventWithReplies; root?: stri
|
|||||||
<User pubkey={event.pubkey} time={event.created_at} eventId={event.id} />
|
<User pubkey={event.pubkey} time={event.created_at} eventId={event.id} />
|
||||||
<div className="-mt-4 flex items-start gap-3">
|
<div className="-mt-4 flex items-start gap-3">
|
||||||
<div className="w-10 shrink-0" />
|
<div className="w-10 shrink-0" />
|
||||||
<div className="flex-1">
|
<div className="relative z-10 flex-1">
|
||||||
<MemoizedTextNote content={event.content} />
|
<MemoizedTextNote content={event.content} />
|
||||||
<NoteActions
|
<NoteActions
|
||||||
id={event.id}
|
id={event.id}
|
||||||
|
@ -48,7 +48,7 @@ export function ReplyList({ id }: { id: string }) {
|
|||||||
return (
|
return (
|
||||||
<div className="mt-3 flex flex-col gap-5">
|
<div className="mt-3 flex flex-col gap-5">
|
||||||
{data?.length === 0 ? (
|
{data?.length === 0 ? (
|
||||||
<div className="mt-2 flex w-full items-center justify-center rounded-xl bg-neutral-400 dark:bg-neutral-600">
|
<div className="mt-2 flex w-full items-center justify-center">
|
||||||
<div className="flex flex-col items-center justify-center gap-2 py-6">
|
<div className="flex flex-col items-center justify-center gap-2 py-6">
|
||||||
<h3 className="text-3xl">👋</h3>
|
<h3 className="text-3xl">👋</h3>
|
||||||
<p className="leading-none text-neutral-600 dark:text-neutral-400">
|
<p className="leading-none text-neutral-600 dark:text-neutral-400">
|
||||||
|
79
src/shared/notes/replies/replyMediaUploader.tsx
Normal file
79
src/shared/notes/replies/replyMediaUploader.tsx
Normal file
@ -0,0 +1,79 @@
|
|||||||
|
import { message, open } from '@tauri-apps/plugin-dialog';
|
||||||
|
import { readBinaryFile } from '@tauri-apps/plugin-fs';
|
||||||
|
import { useState } from 'react';
|
||||||
|
|
||||||
|
import { MediaIcon } from '@shared/icons';
|
||||||
|
|
||||||
|
export function ReplyMediaUploader({ setValue }) {
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const uploadToNostrBuild = async () => {
|
||||||
|
try {
|
||||||
|
// start loading
|
||||||
|
setLoading(true);
|
||||||
|
|
||||||
|
const selected = await open({
|
||||||
|
multiple: false,
|
||||||
|
filters: [
|
||||||
|
{
|
||||||
|
name: 'Media',
|
||||||
|
extensions: [
|
||||||
|
'png',
|
||||||
|
'jpeg',
|
||||||
|
'jpg',
|
||||||
|
'gif',
|
||||||
|
'mp4',
|
||||||
|
'mp3',
|
||||||
|
'webm',
|
||||||
|
'mkv',
|
||||||
|
'avi',
|
||||||
|
'mov',
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!selected) {
|
||||||
|
setLoading(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const file = await readBinaryFile(selected.path);
|
||||||
|
const blob = new Blob([file]);
|
||||||
|
|
||||||
|
const data = new FormData();
|
||||||
|
data.append('fileToUpload', blob);
|
||||||
|
data.append('submit', 'Upload Image');
|
||||||
|
|
||||||
|
const res = await fetch('https://nostr.build/api/v2/upload/files', {
|
||||||
|
method: 'POST',
|
||||||
|
body: data,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (res.ok) {
|
||||||
|
const json = await res.json();
|
||||||
|
const content = json.data[0];
|
||||||
|
|
||||||
|
setValue((prev) => prev + ' ' + content.url);
|
||||||
|
|
||||||
|
// stop loading
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
// stop loading
|
||||||
|
setLoading(false);
|
||||||
|
await message(`Upload failed, error: ${e}`, { title: 'Lume', type: 'error' });
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={() => uploadToNostrBuild()}
|
||||||
|
className="inline-flex h-9 w-max items-center justify-center gap-1.5 rounded-lg bg-neutral-100 px-2 text-sm font-medium text-neutral-900 hover:bg-neutral-200 dark:bg-neutral-900 dark:text-neutral-100 dark:hover:bg-neutral-800"
|
||||||
|
>
|
||||||
|
<MediaIcon className="h-5 w-5" />
|
||||||
|
{loading ? 'Uploading...' : 'Add media'}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
@ -1,33 +1,38 @@
|
|||||||
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
||||||
|
|
||||||
|
import { useStorage } from '@libs/storage/provider';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
ArticleNote,
|
ArticleNote,
|
||||||
FileNote,
|
FileNote,
|
||||||
NoteActions,
|
|
||||||
NoteSkeleton,
|
NoteSkeleton,
|
||||||
TextNote,
|
TextNote,
|
||||||
UnknownNote,
|
UnknownNote,
|
||||||
} from '@shared/notes';
|
} from '@shared/notes';
|
||||||
import { User } from '@shared/user';
|
import { User } from '@shared/user';
|
||||||
|
|
||||||
|
import { WidgetKinds, useWidgets } from '@stores/widgets';
|
||||||
|
|
||||||
import { formatCreatedAt } from '@utils/createdAt';
|
import { formatCreatedAt } from '@utils/createdAt';
|
||||||
import { useEvent } from '@utils/hooks/useEvent';
|
import { useEvent } from '@utils/hooks/useEvent';
|
||||||
|
|
||||||
export function NotifyNote({
|
export function NotifyNote({ event }: { event: NDKEvent }) {
|
||||||
id,
|
const createdAt = formatCreatedAt(event.created_at, false);
|
||||||
user,
|
const rootEventId = event.tags.find((el) => el[0] === 'e')?.[1];
|
||||||
content,
|
|
||||||
kind,
|
const { db } = useStorage();
|
||||||
time,
|
const { status, data } = useEvent(rootEventId);
|
||||||
}: {
|
|
||||||
id: string;
|
const setWidget = useWidgets((state) => state.setWidget);
|
||||||
user: string;
|
|
||||||
content: string;
|
const openThread = (event, thread: string) => {
|
||||||
kind: NDKKind | number;
|
const selection = window.getSelection();
|
||||||
time: number;
|
if (selection.toString().length === 0) {
|
||||||
}) {
|
setWidget(db, { kind: WidgetKinds.local.thread, title: 'Thread', content: thread });
|
||||||
const createdAt = formatCreatedAt(time, false);
|
} else {
|
||||||
const { status, data } = useEvent(id);
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const renderKind = (event: NDKEvent) => {
|
const renderKind = (event: NDKEvent) => {
|
||||||
switch (event.kind) {
|
switch (event.kind) {
|
||||||
@ -47,7 +52,7 @@ export function NotifyNote({
|
|||||||
case NDKKind.Text:
|
case NDKKind.Text:
|
||||||
return 'replied';
|
return 'replied';
|
||||||
case NDKKind.Reaction:
|
case NDKKind.Reaction:
|
||||||
return `reacted ${content}`;
|
return `reacted ${event.content}`;
|
||||||
case NDKKind.Repost:
|
case NDKKind.Repost:
|
||||||
return 'reposted';
|
return 'reposted';
|
||||||
case NDKKind.Zap:
|
case NDKKind.Zap:
|
||||||
@ -68,28 +73,29 @@ export function NotifyNote({
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mb-5 flex h-min w-full flex-col gap-2 px-3 pb-3">
|
<div className="h-min w-full px-3 pb-3">
|
||||||
|
<div className="flex flex-col gap-2 rounded-xl bg-neutral-100 p-3 dark:bg-neutral-900">
|
||||||
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div className="flex items-center gap-1.5">
|
<div className="flex items-center gap-1.5">
|
||||||
<User pubkey={user} variant="notify" />
|
<User pubkey={event.pubkey} variant="notify" />
|
||||||
<p className="font-medium text-neutral-600 dark:text-neutral-400">
|
<p className="font-medium text-neutral-600 dark:text-neutral-400">
|
||||||
{renderText(kind)}
|
{renderText(event.kind)}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<span className="font-medium text-neutral-600 dark:text-neutral-400">
|
<span className="text-neutral-500 dark:text-neutral-400">{createdAt}</span>
|
||||||
{createdAt}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div className="relative overflow-hidden rounded-xl bg-neutral-100 px-3 py-4 dark:bg-neutral-900">
|
|
||||||
<div className="relative flex flex-col">
|
|
||||||
<User pubkey={data.pubkey} time={data.created_at} eventId={data.id} />
|
|
||||||
<div className="-mt-4 flex items-start gap-3">
|
|
||||||
<div className="w-10 shrink-0" />
|
|
||||||
<div className="relative z-20 flex-1">
|
|
||||||
{renderKind(data)}
|
|
||||||
<NoteActions id={data.id} pubkey={data.pubkey} />
|
|
||||||
</div>
|
</div>
|
||||||
|
{event.kind === 1 ? <TextNote content={event.content} /> : null}
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
onClick={(e) => openThread(e, data.id)}
|
||||||
|
onKeyDown={(e) => openThread(e, data.id)}
|
||||||
|
role="button"
|
||||||
|
tabIndex={0}
|
||||||
|
className="cursor-default rounded-lg border border-neutral-300 bg-neutral-200 p-3 dark:border-neutral-700 dark:bg-neutral-800"
|
||||||
|
>
|
||||||
|
<User pubkey={data.pubkey} time={data.created_at} variant="mention" />
|
||||||
|
<div className="mt-1">{renderKind(data)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -115,13 +115,13 @@ export const User = memo(function User({
|
|||||||
loading="lazy"
|
loading="lazy"
|
||||||
decoding="async"
|
decoding="async"
|
||||||
style={{ contentVisibility: 'auto' }}
|
style={{ contentVisibility: 'auto' }}
|
||||||
className="h-8 w-8 rounded-lg"
|
className="h-8 w-8 rounded-md"
|
||||||
/>
|
/>
|
||||||
<Avatar.Fallback delayMs={300}>
|
<Avatar.Fallback delayMs={300}>
|
||||||
<img
|
<img
|
||||||
src={svgURI}
|
src={svgURI}
|
||||||
alt={pubkey}
|
alt={pubkey}
|
||||||
className="h-8 w-8 rounded-lg bg-black dark:bg-white"
|
className="h-8 w-8 rounded-md bg-black dark:bg-white"
|
||||||
/>
|
/>
|
||||||
</Avatar.Fallback>
|
</Avatar.Fallback>
|
||||||
</Avatar.Root>
|
</Avatar.Root>
|
||||||
@ -416,10 +416,10 @@ export const User = memo(function User({
|
|||||||
</div>
|
</div>
|
||||||
<HoverCard.Portal>
|
<HoverCard.Portal>
|
||||||
<HoverCard.Content
|
<HoverCard.Content
|
||||||
className="w-[300px] overflow-hidden rounded-xl border border-white/10 bg-white/10 backdrop-blur-3xl data-[side=bottom]:animate-slideUpAndFade data-[side=left]:animate-slideRightAndFade data-[side=right]:animate-slideLeftAndFade data-[side=top]:animate-slideDownAndFade data-[state=open]:transition-all focus:outline-none"
|
className="ml-4 w-[300px] overflow-hidden rounded-xl border border-neutral-200 bg-neutral-100 shadow-lg data-[side=bottom]:animate-slideUpAndFade data-[side=left]:animate-slideRightAndFade data-[side=right]:animate-slideLeftAndFade data-[side=top]:animate-slideDownAndFade data-[state=open]:transition-all focus:outline-none dark:border-neutral-800 dark:bg-neutral-900"
|
||||||
sideOffset={5}
|
sideOffset={5}
|
||||||
>
|
>
|
||||||
<div className="flex gap-2.5 border-b border-white/5 px-3 py-3">
|
<div className="flex gap-2.5 border-b border-neutral-200 px-3 py-3 dark:border-neutral-800">
|
||||||
<Avatar.Root className="shrink-0">
|
<Avatar.Root className="shrink-0">
|
||||||
<Avatar.Image
|
<Avatar.Image
|
||||||
src={user?.picture || user?.image}
|
src={user?.picture || user?.image}
|
||||||
@ -427,13 +427,13 @@ export const User = memo(function User({
|
|||||||
loading="lazy"
|
loading="lazy"
|
||||||
decoding="async"
|
decoding="async"
|
||||||
style={{ contentVisibility: 'auto' }}
|
style={{ contentVisibility: 'auto' }}
|
||||||
className="h-10 w-10 rounded-lg border border-white/5"
|
className="h-10 w-10 rounded-lg"
|
||||||
/>
|
/>
|
||||||
<Avatar.Fallback delayMs={300}>
|
<Avatar.Fallback delayMs={300}>
|
||||||
<img
|
<img
|
||||||
src={svgURI}
|
src={svgURI}
|
||||||
alt={pubkey}
|
alt={pubkey}
|
||||||
className="h-10 w-10 rounded-lg border border-white/5 bg-black dark:bg-white"
|
className="h-10 w-10 rounded-lg bg-black dark:bg-white"
|
||||||
/>
|
/>
|
||||||
</Avatar.Fallback>
|
</Avatar.Fallback>
|
||||||
</Avatar.Root>
|
</Avatar.Root>
|
||||||
@ -467,13 +467,13 @@ export const User = memo(function User({
|
|||||||
<div className="flex items-center gap-2 px-3 py-3">
|
<div className="flex items-center gap-2 px-3 py-3">
|
||||||
<Link
|
<Link
|
||||||
to={`/users/${pubkey}`}
|
to={`/users/${pubkey}`}
|
||||||
className="inline-flex h-10 flex-1 items-center justify-center rounded-md bg-white/10 text-sm font-semibold backdrop-blur-xl hover:bg-blue-600"
|
className="inline-flex h-9 flex-1 items-center justify-center rounded-lg bg-neutral-200 text-sm font-semibold hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
|
||||||
>
|
>
|
||||||
View profile
|
View profile
|
||||||
</Link>
|
</Link>
|
||||||
<Link
|
<Link
|
||||||
to={`/chats/${pubkey}`}
|
to={`/chats/${pubkey}`}
|
||||||
className="inline-flex h-10 flex-1 items-center justify-center rounded-md bg-white/10 text-sm font-semibold backdrop-blur-xl hover:bg-blue-600"
|
className="inline-flex h-9 flex-1 items-center justify-center rounded-lg bg-neutral-200 text-sm font-semibold hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
|
||||||
>
|
>
|
||||||
Message
|
Message
|
||||||
</Link>
|
</Link>
|
||||||
|
@ -67,9 +67,9 @@ export function GlobalArticlesWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{data.map((item) => renderItem(item))}
|
{data.map((item) => renderItem(item))}
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -69,9 +69,9 @@ export function GlobalFilesWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{data.map((item) => renderItem(item))}
|
{data.map((item) => renderItem(item))}
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -99,7 +99,7 @@ export function GlobalHashtagWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{data.map((item) => renderItem(item))}
|
{data.map((item) => renderItem(item))}
|
||||||
<div className="h-16" />
|
<div className="h-16" />
|
||||||
</VList>
|
</VList>
|
||||||
|
@ -69,7 +69,7 @@ export function LocalArticlesWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{dbEvents.map((item) => renderItem(item))}
|
{dbEvents.map((item) => renderItem(item))}
|
||||||
<div className="flex items-center justify-center px-3 py-1.5">
|
<div className="flex items-center justify-center px-3 py-1.5">
|
||||||
{dbEvents.length > 0 ? (
|
{dbEvents.length > 0 ? (
|
||||||
@ -97,7 +97,7 @@ export function LocalArticlesWidget({ params }: { params: Widget }) {
|
|||||||
</button>
|
</button>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -105,7 +105,7 @@ export function LocalFeedsWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{dbEvents.map((item) => renderItem(item))}
|
{dbEvents.map((item) => renderItem(item))}
|
||||||
<div className="flex items-center justify-center px-3 py-1.5">
|
<div className="flex items-center justify-center px-3 py-1.5">
|
||||||
{dbEvents.length > 0 ? (
|
{dbEvents.length > 0 ? (
|
||||||
@ -133,7 +133,7 @@ export function LocalFeedsWidget({ params }: { params: Widget }) {
|
|||||||
</button>
|
</button>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -69,7 +69,7 @@ export function LocalFilesWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{dbEvents.map((item) => renderItem(item))}
|
{dbEvents.map((item) => renderItem(item))}
|
||||||
<div className="flex items-center justify-center px-3 py-1.5">
|
<div className="flex items-center justify-center px-3 py-1.5">
|
||||||
{dbEvents.length > 0 ? (
|
{dbEvents.length > 0 ? (
|
||||||
@ -97,7 +97,7 @@ export function LocalFilesWidget({ params }: { params: Widget }) {
|
|||||||
</button>
|
</button>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -104,7 +104,7 @@ export function LocalFollowsWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{dbEvents.map((item) => renderItem(item))}
|
{dbEvents.map((item) => renderItem(item))}
|
||||||
<div className="flex items-center justify-center px-3 py-1.5">
|
<div className="flex items-center justify-center px-3 py-1.5">
|
||||||
{dbEvents.length > 0 ? (
|
{dbEvents.length > 0 ? (
|
||||||
@ -132,7 +132,7 @@ export function LocalFollowsWidget({ params }: { params: Widget }) {
|
|||||||
</button>
|
</button>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
<div className="h-16" />
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -145,7 +145,7 @@ export function LocalNetworkWidget() {
|
|||||||
) : dbEvents.length === 0 ? (
|
) : dbEvents.length === 0 ? (
|
||||||
<EventLoader firstTime={true} />
|
<EventLoader firstTime={true} />
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{!isFetched ? <EventLoader firstTime={false} /> : null}
|
{!isFetched ? <EventLoader firstTime={false} /> : null}
|
||||||
{dbEvents.map((item) => renderItem(item))}
|
{dbEvents.map((item) => renderItem(item))}
|
||||||
<div className="flex items-center justify-center px-3 py-1.5">
|
<div className="flex items-center justify-center px-3 py-1.5">
|
||||||
|
@ -25,18 +25,8 @@ export function LocalNotificationWidget({ params }: { params: Widget }) {
|
|||||||
|
|
||||||
const renderEvent = useCallback(
|
const renderEvent = useCallback(
|
||||||
(event: NDKEvent) => {
|
(event: NDKEvent) => {
|
||||||
const rootEventId = event.tags.find((el) => el[0] === 'e')?.[1];
|
|
||||||
if (!rootEventId) return null;
|
|
||||||
if (event.pubkey === db.account.pubkey) return null;
|
if (event.pubkey === db.account.pubkey) return null;
|
||||||
return (
|
return <NotifyNote key={event.id} event={event} />;
|
||||||
<NotifyNote
|
|
||||||
id={rootEventId}
|
|
||||||
user={event.pubkey}
|
|
||||||
content={event.content}
|
|
||||||
kind={event.kind}
|
|
||||||
time={event.created_at}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
[activities]
|
[activities]
|
||||||
);
|
);
|
||||||
@ -53,7 +43,7 @@ export function LocalNotificationWidget({ params }: { params: Widget }) {
|
|||||||
return (
|
return (
|
||||||
<WidgetWrapper>
|
<WidgetWrapper>
|
||||||
<TitleBar id={params.id} title={params.title} />
|
<TitleBar id={params.id} title={params.title} />
|
||||||
<div className="h-full px-3">
|
<div className="flex-1">
|
||||||
{!activities ? (
|
{!activities ? (
|
||||||
<div className="flex h-full w-full items-center justify-center">
|
<div className="flex h-full w-full items-center justify-center">
|
||||||
<div className="flex flex-col items-center gap-1.5">
|
<div className="flex flex-col items-center gap-1.5">
|
||||||
@ -71,8 +61,9 @@ export function LocalNotificationWidget({ params }: { params: Widget }) {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full overflow-y-auto scrollbar-none">
|
<VList className="h-full" style={{ contentVisibility: 'auto' }}>
|
||||||
{activities.map((event) => renderEvent(event))}
|
{activities.map((event) => renderEvent(event))}
|
||||||
|
<div className="h-14" />
|
||||||
</VList>
|
</VList>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
|
||||||
import { useCallback } from 'react';
|
import { useCallback } from 'react';
|
||||||
|
import { WVList } from 'virtua';
|
||||||
|
|
||||||
import { LoaderIcon } from '@shared/icons';
|
import { LoaderIcon } from '@shared/icons';
|
||||||
import {
|
import {
|
||||||
@ -41,7 +42,7 @@ export function LocalThreadWidget({ params }: { params: Widget }) {
|
|||||||
return (
|
return (
|
||||||
<WidgetWrapper>
|
<WidgetWrapper>
|
||||||
<TitleBar id={params.id} title={params.title} />
|
<TitleBar id={params.id} title={params.title} />
|
||||||
<div className="h-full overflow-y-auto px-3 scrollbar-none">
|
<WVList className="flex-1 overflow-y-auto px-3">
|
||||||
{status === 'loading' ? (
|
{status === 'loading' ? (
|
||||||
<div className="flex h-16 items-center justify-center rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
<div className="flex h-16 items-center justify-center rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
||||||
<LoaderIcon className="h-5 w-5 animate-spin" />
|
<LoaderIcon className="h-5 w-5 animate-spin" />
|
||||||
@ -58,7 +59,7 @@ export function LocalThreadWidget({ params }: { params: Widget }) {
|
|||||||
<NoteReplyForm id={params.content} />
|
<NoteReplyForm id={params.content} />
|
||||||
<ReplyList id={params.content} />
|
<ReplyList id={params.content} />
|
||||||
<div className="h-10" />
|
<div className="h-10" />
|
||||||
</div>
|
</WVList>
|
||||||
</WidgetWrapper>
|
</WidgetWrapper>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -81,7 +81,7 @@ export function LocalUserWidget({ params }: { params: Widget }) {
|
|||||||
return (
|
return (
|
||||||
<WidgetWrapper>
|
<WidgetWrapper>
|
||||||
<TitleBar id={params.id} title={params.title} />
|
<TitleBar id={params.id} title={params.title} />
|
||||||
<div className="h-full overflow-y-auto scrollbar-none">
|
<WVList className="flex-1 overflow-y-auto">
|
||||||
<div className="px-3 pt-1.5">
|
<div className="px-3 pt-1.5">
|
||||||
<UserProfile pubkey={params.content} />
|
<UserProfile pubkey={params.content} />
|
||||||
</div>
|
</div>
|
||||||
@ -107,11 +107,11 @@ export function LocalUserWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<WVList>{data.map((item) => renderItem(item))}</WVList>
|
data.map((item) => renderItem(item))
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</WVList>
|
||||||
</WidgetWrapper>
|
</WidgetWrapper>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -57,7 +57,7 @@ export function TrendingAccountsWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full">
|
||||||
{data.map((item: Profile) => (
|
{data.map((item: Profile) => (
|
||||||
<NostrBandUserProfile key={item.pubkey} data={item} />
|
<NostrBandUserProfile key={item.pubkey} data={item} />
|
||||||
))}
|
))}
|
||||||
|
@ -58,7 +58,7 @@ export function TrendingNotesWidget({ params }: { params: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<VList className="h-full scrollbar-none">
|
<VList className="h-full">
|
||||||
{data.map((item) => (
|
{data.map((item) => (
|
||||||
<NoteWrapper key={item.event.id} event={item.event}>
|
<NoteWrapper key={item.event.id} event={item.event}>
|
||||||
<TextNote content={item.event.content} />
|
<TextNote content={item.event.content} />
|
||||||
|
@ -21,7 +21,7 @@ export function WidgetWrapper({
|
|||||||
minWidth={420}
|
minWidth={420}
|
||||||
maxWidth={600}
|
maxWidth={600}
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
'flex flex-col border-r border-neutral-100 dark:border-neutral-900',
|
'flex flex-col border-r-2 border-neutral-50 hover:border-neutral-100 dark:border-neutral-950 dark:hover:border-neutral-900',
|
||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
enable={{ right: true }}
|
enable={{ right: true }}
|
||||||
|
@ -3,12 +3,16 @@ import { create } from 'zustand';
|
|||||||
|
|
||||||
interface ActivitiesState {
|
interface ActivitiesState {
|
||||||
activities: Array<NDKEvent>;
|
activities: Array<NDKEvent>;
|
||||||
|
newMessages: number;
|
||||||
setActivities: (events: NDKEvent[]) => void;
|
setActivities: (events: NDKEvent[]) => void;
|
||||||
addActivity: (event: NDKEvent) => void;
|
addActivity: (event: NDKEvent) => void;
|
||||||
|
addNewMessage: () => void;
|
||||||
|
clearNewMessage: () => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useActivities = create<ActivitiesState>((set) => ({
|
export const useActivities = create<ActivitiesState>((set) => ({
|
||||||
activities: null,
|
activities: null,
|
||||||
|
newMessages: 0,
|
||||||
setActivities: (events: NDKEvent[]) => {
|
setActivities: (events: NDKEvent[]) => {
|
||||||
set(() => ({
|
set(() => ({
|
||||||
activities: events,
|
activities: events,
|
||||||
@ -19,4 +23,10 @@ export const useActivities = create<ActivitiesState>((set) => ({
|
|||||||
activities: state.activities ? [event, ...state.activities] : [event],
|
activities: state.activities ? [event, ...state.activities] : [event],
|
||||||
}));
|
}));
|
||||||
},
|
},
|
||||||
|
addNewMessage: () => {
|
||||||
|
set((state) => ({ newMessages: state.newMessages + 1 }));
|
||||||
|
},
|
||||||
|
clearNewMessage: () => {
|
||||||
|
set(() => ({ newMessages: 0 }));
|
||||||
|
},
|
||||||
}));
|
}));
|
||||||
|
@ -30,6 +30,8 @@ export function useNostr() {
|
|||||||
) => {
|
) => {
|
||||||
if (!ndk) throw new Error('NDK instance not found');
|
if (!ndk) throw new Error('NDK instance not found');
|
||||||
|
|
||||||
|
const key = JSON.stringify(filter);
|
||||||
|
if (!subManager.get(key)) {
|
||||||
const subEvent = ndk.subscribe(filter, {
|
const subEvent = ndk.subscribe(filter, {
|
||||||
closeOnEose: false,
|
closeOnEose: false,
|
||||||
groupable: groupable ?? true,
|
groupable: groupable ?? true,
|
||||||
@ -40,7 +42,8 @@ export function useNostr() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
subManager.set(JSON.stringify(filter), subEvent);
|
subManager.set(JSON.stringify(filter), subEvent);
|
||||||
console.log('current active sub: ', subManager.size);
|
console.log('sub: ', key);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const addContact = async (pubkey: string) => {
|
const addContact = async (pubkey: string) => {
|
||||||
@ -68,7 +71,7 @@ export function useNostr() {
|
|||||||
const events = await ndk.fetchEvents({
|
const events = await ndk.fetchEvents({
|
||||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Reaction, NDKKind.Zap],
|
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Reaction, NDKKind.Zap],
|
||||||
'#p': [db.account.pubkey],
|
'#p': [db.account.pubkey],
|
||||||
limit: limit ?? 100,
|
limit: limit ?? 50,
|
||||||
});
|
});
|
||||||
|
|
||||||
return [...events];
|
return [...events];
|
||||||
@ -179,31 +182,8 @@ export function useNostr() {
|
|||||||
const getAllEventsSinceLastLogin = async (customSince?: number) => {
|
const getAllEventsSinceLastLogin = async (customSince?: number) => {
|
||||||
try {
|
try {
|
||||||
const dbEventsEmpty = await db.isEventsEmpty();
|
const dbEventsEmpty = await db.isEventsEmpty();
|
||||||
const circleSetting = await db.getSettingValue('circles');
|
|
||||||
|
|
||||||
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
|
|
||||||
const follows = await user.follows();
|
|
||||||
const relayList = await user.relayList();
|
|
||||||
|
|
||||||
const followsAsArr = [];
|
|
||||||
follows.forEach((user) => {
|
|
||||||
followsAsArr.push(user.pubkey);
|
|
||||||
});
|
|
||||||
|
|
||||||
// update user's follows
|
|
||||||
await db.updateAccount('follows', JSON.stringify(followsAsArr));
|
|
||||||
if (circleSetting !== '1')
|
|
||||||
await db.updateAccount('circles', JSON.stringify(followsAsArr));
|
|
||||||
|
|
||||||
// update user's relay list
|
|
||||||
if (relayList) {
|
|
||||||
for (const relay of relayList.relays) {
|
|
||||||
await db.createRelay(relay);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
let since: number;
|
let since: number;
|
||||||
|
|
||||||
if (!customSince) {
|
if (!customSince) {
|
||||||
if (dbEventsEmpty || db.account.last_login_at === 0) {
|
if (dbEventsEmpty || db.account.last_login_at === 0) {
|
||||||
since = db.account.circles.length > 500 ? nHoursAgo(12) : nHoursAgo(24);
|
since = db.account.circles.length > 500 ? nHoursAgo(12) : nHoursAgo(24);
|
||||||
|
Loading…
Reference in New Issue
Block a user