update personal dashboard screen

This commit is contained in:
reya 2023-11-03 15:38:58 +07:00
parent 64b4745993
commit da0b48c5df
22 changed files with 499 additions and 61 deletions

View File

@ -110,13 +110,34 @@ export default function App() {
},
],
},
],
},
{
path: '/personal',
element: <AppLayout />,
errorElement: <ErrorScreen />,
children: [
{
path: 'personal',
path: '',
async lazy() {
const { PersonalScreen } = await import('@app/personal');
return { Component: PersonalScreen };
},
},
{
path: 'edit-profile',
async lazy() {
const { EditProfileScreen } = await import('@app/personal/editProfile');
return { Component: EditProfileScreen };
},
},
{
path: 'edit-contact',
async lazy() {
const { EditContactScreen } = await import('@app/personal/editContact');
return { Component: EditContactScreen };
},
},
],
},
{

View File

@ -23,7 +23,7 @@ export function Circle() {
const enableLinks = async () => {
setLoading(true);
const users = ndk.getUser({ hexpubkey: db.account.pubkey });
const users = ndk.getUser({ pubkey: db.account.pubkey });
const follows = await users.follows();
if (follows.size === 0) {

View File

@ -12,7 +12,7 @@ export function FollowList() {
const { status, data } = useQuery({
queryKey: ['follows'],
queryFn: async () => {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const follows = await user.follows();
const followsAsArr = [];

View File

@ -14,7 +14,7 @@ export function useDecryptMessage(message: NDKEvent) {
async function decryptContent() {
try {
const sender = new NDKUser({
hexpubkey:
pubkey:
db.account.pubkey === message.pubkey
? message.tags.find((el) => el[0] === 'p')[1]
: message.pubkey,

View File

@ -29,9 +29,9 @@ export const UserWithDrawer = memo(function UserWithDrawer({
const follow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
const add = await user.follow(new NDKUser({ hexpubkey: pubkey }), contacts);
const add = await user.follow(new NDKUser({ pubkey: pubkey }), contacts);
if (add) {
setFollowed(true);
@ -45,14 +45,12 @@ export const UserWithDrawer = memo(function UserWithDrawer({
const unfollow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
contacts.delete(new NDKUser({ hexpubkey: pubkey }));
contacts.delete(new NDKUser({ pubkey: pubkey }));
let list: string[][];
contacts.forEach((el) =>
list.push(['p', el.pubkey, el.relayUrls?.[0] || '', el.profile?.name || ''])
);
contacts.forEach((el) => list.push(['p', el.pubkey, el.relayUrls?.[0] || '', '']));
const event = new NDKEvent(ndk);
event.content = '';

View File

@ -1,9 +1,10 @@
import { useQuery } from '@tanstack/react-query';
import { Link } from 'react-router-dom';
import { useNDK } from '@libs/ndk/provider';
import { useStorage } from '@libs/storage/provider';
import { LoaderIcon } from '@shared/icons';
import { EditIcon, LoaderIcon } from '@shared/icons';
import { compactNumber } from '@utils/number';
@ -13,8 +14,9 @@ export function ContactCard() {
const { status, data } = useQuery({
queryKey: ['contacts'],
queryFn: async () => {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
return await user.follows();
const user = ndk.getUser({ pubkey: db.account.pubkey });
const follows = await user.follows();
return [...follows];
},
refetchOnWindowFocus: false,
});
@ -28,10 +30,19 @@ export function ContactCard() {
) : (
<div className="flex h-full w-full flex-col justify-between p-4">
<h3 className="pt-1 text-5xl font-semibold tabular-nums text-neutral-900 dark:text-neutral-100">
{compactNumber.format(data.size)}
{compactNumber.format(data.length)}
</h3>
<div className="mt-auto text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Contacts
<div className="mt-auto flex h-6 w-full items-center justify-between">
<p className="text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Contacts
</p>
<Link
to="/personal/edit-contact"
className="inline-flex h-6 w-max items-center gap-1 rounded-full bg-neutral-200 px-2.5 text-sm font-medium hover:bg-neutral-300 dark:bg-neutral-800 dark:hover:bg-neutral-700"
>
<EditIcon className="h-3 w-3" />
Edit
</Link>
</div>
</div>
)}

View File

@ -1,4 +1,5 @@
import { useQuery } from '@tanstack/react-query';
import { Link } from 'react-router-dom';
import { useStorage } from '@libs/storage/provider';
@ -41,8 +42,16 @@ export function PostCard() {
<h3 className="pt-1 text-5xl font-semibold tabular-nums text-neutral-900 dark:text-neutral-100">
{compactNumber.format(data.stats[db.account.pubkey].pub_note_count)}
</h3>
<div className="mt-auto text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Posts
<div className="mt-auto flex h-6 w-full items-center justify-between">
<p className="text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Posts
</p>
<Link
to={`/users/${db.account.pubkey}`}
className="inline-flex h-6 w-max items-center gap-1 rounded-full bg-neutral-200 px-2.5 text-sm font-medium hover:bg-neutral-300 dark:bg-neutral-800 dark:hover:bg-neutral-700"
>
View
</Link>
</div>
</div>
)}

View File

@ -1,9 +1,10 @@
import * as Avatar from '@radix-ui/react-avatar';
import { minidenticon } from 'minidenticons';
import { Link } from 'react-router-dom';
import { useStorage } from '@libs/storage/provider';
import { LoaderIcon } from '@shared/icons';
import { EditIcon, LoaderIcon } from '@shared/icons';
import { useProfile } from '@utils/hooks/useProfile';
import { displayNpub } from '@utils/shortenKey';
@ -23,7 +24,16 @@ export function ProfileCard() {
<LoaderIcon className="h-4 w-4 animate-spin" />
</div>
) : (
<div className="flex h-full w-full flex-col justify-end p-4">
<div className="flex h-full w-full flex-col justify-between p-4">
<div className="flex h-10 w-full justify-end">
<Link
to="/personal/edit-profile"
className="inline-flex h-8 w-20 items-center justify-center gap-1.5 rounded-full bg-neutral-200 text-sm font-medium hover:bg-neutral-400 dark:bg-neutral-800 dark:hover:bg-neutral-600"
>
<EditIcon className="h-4 w-4" />
Edit
</Link>
</div>
<div className="flex flex-col gap-2.5">
<Avatar.Root className="shrink-0">
<Avatar.Image

View File

@ -1,9 +1,10 @@
import { useQuery } from '@tanstack/react-query';
import { Link } from 'react-router-dom';
import { useNDK } from '@libs/ndk/provider';
import { useStorage } from '@libs/storage/provider';
import { LoaderIcon } from '@shared/icons';
import { EditIcon, LoaderIcon } from '@shared/icons';
import { compactNumber } from '@utils/number';
@ -13,7 +14,7 @@ export function RelayCard() {
const { status, data } = useQuery({
queryKey: ['relays'],
queryFn: async () => {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
return await user.relayList();
},
refetchOnWindowFocus: false,
@ -28,10 +29,19 @@ export function RelayCard() {
) : (
<div className="flex h-full w-full flex-col justify-between p-4">
<h3 className="pt-1 text-5xl font-semibold tabular-nums text-neutral-900 dark:text-neutral-100">
{compactNumber.format(data.relays.length)}
{compactNumber.format(data?.relays?.length)}
</h3>
<div className="mt-auto text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Relays
<div className="mt-auto flex h-6 w-full items-center justify-between">
<p className="text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Relays
</p>
<Link
to="/relays"
className="inline-flex h-6 w-max items-center gap-1 rounded-full bg-neutral-200 px-2.5 text-sm font-medium hover:bg-neutral-300 dark:bg-neutral-800 dark:hover:bg-neutral-700"
>
<EditIcon className="h-3 w-3" />
Edit
</Link>
</div>
</div>
)}

View File

@ -43,7 +43,7 @@ export function ZapCard() {
data.stats[db.account.pubkey].zaps_received.msats / 1000
)}
</h3>
<div className="mt-auto text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
<div className="mt-auto flex h-6 items-center text-xl font-medium leading-none text-neutral-600 dark:text-neutral-400">
Sats received
</div>
</div>

View File

@ -0,0 +1,55 @@
import { useQuery } from '@tanstack/react-query';
import { Link } from 'react-router-dom';
import { useNDK } from '@libs/ndk/provider';
import { useStorage } from '@libs/storage/provider';
import { ArrowLeftIcon, LoaderIcon } from '@shared/icons';
import { User } from '@shared/user';
export function EditContactScreen() {
const { db } = useStorage();
const { ndk } = useNDK();
const { status, data } = useQuery({
queryKey: ['contacts'],
queryFn: async () => {
const user = ndk.getUser({ pubkey: db.account.pubkey });
const follows = await user.follows();
return [...follows];
},
refetchOnWindowFocus: false,
});
return (
<div className="flex h-full w-full flex-col overflow-y-auto pb-10">
<div className="flex h-14 shrink-0 items-center justify-between px-3">
<Link
to="/personal"
className="inline-flex h-10 w-20 items-center justify-center gap-2 font-medium text-neutral-700 dark:text-neutral-300"
>
<ArrowLeftIcon className="h-4 w-4" />
Back
</Link>
<h1 className="font-semibold">Contact Manager</h1>
<div className="w-20" />
</div>
<div className="mx-auto flex w-full max-w-xl flex-col gap-3">
{status === 'pending' ? (
<div className="flex h-10 w-full items-center justify-center">
<LoaderIcon className="h-4 w-4 animate-spin" />
</div>
) : (
data.map((item) => (
<div
key={item.pubkey}
className="flex h-16 w-full items-center justify-between rounded-xl bg-neutral-100 px-2.5 dark:bg-neutral-900"
>
<User pubkey={item.pubkey} variant="simple" />
</div>
))
)}
</div>
</div>
);
}

View File

@ -0,0 +1,323 @@
import { NDKEvent, NDKKind, NDKUserProfile } from '@nostr-dev-kit/ndk';
import { useQueryClient } from '@tanstack/react-query';
import { message } from '@tauri-apps/plugin-dialog';
import { useState } from 'react';
import { useForm } from 'react-hook-form';
import { Link } from 'react-router-dom';
import { useNDK } from '@libs/ndk/provider';
import { useStorage } from '@libs/storage/provider';
import {
ArrowLeftIcon,
CheckCircleIcon,
LoaderIcon,
PlusIcon,
UnverifiedIcon,
} from '@shared/icons';
import { useNostr } from '@utils/hooks/useNostr';
export function EditProfileScreen() {
const queryClient = useQueryClient();
const [loading, setLoading] = useState(false);
const [picture, setPicture] = useState('');
const [banner, setBanner] = useState('');
const [nip05, setNIP05] = useState({ verified: true, text: '' });
const { db } = useStorage();
const { ndk } = useNDK();
const { upload } = useNostr();
const {
register,
handleSubmit,
reset,
setError,
formState: { isValid, errors },
} = useForm({
defaultValues: async () => {
const res: NDKUserProfile = queryClient.getQueryData(['user', db.account.pubkey]);
if (res.image) {
setPicture(res.image);
}
if (res.banner) {
setBanner(res.banner);
}
if (res.nip05) {
setNIP05((prev) => ({ ...prev, text: res.nip05 }));
}
return res;
},
});
const uploadAvatar = async () => {
try {
setLoading(true);
const image = await upload();
if (image) {
setPicture(image);
setLoading(false);
}
} catch (e) {
setLoading(false);
await message(`Upload failed, error: ${e}`, { title: 'Lume', type: 'error' });
}
};
const uploadBanner = async () => {
try {
setLoading(true);
const image = await upload();
if (image) {
setBanner(image);
setLoading(false);
}
} catch (e) {
setLoading(false);
await message(`Upload failed, error: ${e}`, { title: 'Lume', type: 'error' });
}
};
const onSubmit = async (data: NDKUserProfile) => {
// start loading
setLoading(true);
const content = {
...data,
username: data.name,
display_name: data.name,
bio: data.about,
image: data.picture,
};
const event = new NDKEvent(ndk);
event.kind = NDKKind.Metadata;
event.tags = [];
if (data.nip05) {
const user = ndk.getUser({ pubkey: db.account.pubkey });
const verify = await user.validateNip05(data.nip05);
if (verify) {
event.content = JSON.stringify({ ...content, nip05: data.nip05 });
} else {
setNIP05((prev) => ({ ...prev, verified: false }));
setError('nip05', {
type: 'manual',
message: "Can't verify your Lume ID / NIP-05, please check again",
});
}
} else {
event.content = JSON.stringify(content);
}
const publishedRelays = await event.publish();
if (publishedRelays) {
// invalid cache
queryClient.invalidateQueries({
queryKey: ['user', db.account.pubkey],
});
// reset form
reset();
// reset state
setLoading(false);
setPicture(null);
setBanner(null);
} else {
setLoading(false);
}
};
return (
<div className="flex h-full w-full flex-col overflow-y-auto">
<div className="flex h-14 shrink-0 items-center justify-between px-3">
<Link
to="/personal"
className="inline-flex h-10 w-20 items-center justify-center gap-2 font-medium text-neutral-700 dark:text-neutral-300"
>
<ArrowLeftIcon className="h-4 w-4" />
Back
</Link>
<h1 className="font-semibold">Edit Profile</h1>
<div className="w-20" />
</div>
<div className="mx-auto w-full max-w-md">
<form onSubmit={handleSubmit(onSubmit)} className="mb-0">
<input type={'hidden'} {...register('picture')} value={picture} />
<input type={'hidden'} {...register('banner')} value={banner} />
<div className="flex flex-col items-center justify-center">
<div className="relative h-36 w-full">
{banner ? (
<img
src={banner}
alt="user's banner"
className="h-full w-full rounded-xl object-cover"
/>
) : (
<div className="h-full w-full rounded-xl bg-neutral-200 dark:bg-neutral-900" />
)}
<div className="absolute left-1/2 top-1/2 z-10 h-full w-full -translate-x-1/2 -translate-y-1/2 transform overflow-hidden rounded-xl">
<button
type="button"
onClick={() => uploadBanner()}
className="inline-flex h-full w-full items-center justify-center bg-black/20 text-white"
>
<PlusIcon className="h-5 w-5" />
</button>
</div>
</div>
<div className="mb-5 px-4">
<div className="relative z-10 -mt-7 h-14 w-14 overflow-hidden rounded-xl ring-2 ring-white dark:ring-black">
<img
src={picture}
alt="user's avatar"
className="h-14 w-14 rounded-xl object-cover"
/>
<div className="absolute left-1/2 top-1/2 z-10 h-full w-full -translate-x-1/2 -translate-y-1/2 transform">
<button
type="button"
onClick={() => uploadAvatar()}
className="inline-flex h-full w-full items-center justify-center rounded-xl bg-black/50 text-white"
>
<PlusIcon className="h-5 w-5" />
</button>
</div>
</div>
</div>
</div>
<div className="flex flex-col gap-4">
<div className="flex flex-col gap-1">
<label
htmlFor="display_name"
className="text-sm font-semibold uppercase tracking-wider"
>
Display Name
</label>
<input
type={'text'}
{...register('display_name', {
required: true,
minLength: 4,
})}
spellCheck={false}
className="relative h-11 w-full rounded-lg bg-neutral-100 px-3 py-1 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
</div>
<div className="flex flex-col gap-1">
<label
htmlFor="name"
className="text-sm font-semibold uppercase tracking-wider"
>
Name
</label>
<input
type={'text'}
{...register('name', {
required: true,
minLength: 4,
})}
spellCheck={false}
className="relative h-11 w-full rounded-lg bg-neutral-100 px-3 py-1 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
</div>
<div className="flex flex-col gap-1">
<label
htmlFor="nip05"
className="text-sm font-semibold uppercase tracking-wider"
>
NIP-05
</label>
<div className="relative">
<input
{...register('nip05', {
required: true,
minLength: 4,
})}
spellCheck={false}
className="relative h-11 w-full rounded-lg bg-neutral-100 px-3 py-1 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
<div className="absolute right-2 top-1/2 -translate-y-1/2 transform">
{nip05.verified ? (
<span className="inline-flex h-6 items-center gap-1 rounded-full bg-teal-500 px-1 pr-1.5 text-xs font-medium text-white">
<CheckCircleIcon className="h-4 w-4" />
Verified
</span>
) : (
<span className="inline-flex h-6 items-center gap-1 rounded bg-red-500 pl-1 pr-1.5 text-xs font-medium text-white">
<UnverifiedIcon className="h-4 w-4" />
Unverified
</span>
)}
</div>
{errors.nip05 && (
<p className="mt-1 text-sm text-red-400">
{errors.nip05.message.toString()}
</p>
)}
</div>
</div>
<div className="flex flex-col gap-1">
<label
htmlFor="website"
className="text-sm font-semibold uppercase tracking-wider"
>
Website
</label>
<input
type={'text'}
{...register('website', { required: false })}
spellCheck={false}
className="relative h-11 w-full rounded-lg bg-neutral-100 px-3 py-1 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
</div>
<div className="flex flex-col gap-1">
<label
htmlFor="website"
className="text-sm font-semibold uppercase tracking-wider"
>
Lightning address
</label>
<input
type={'text'}
{...register('lud16', { required: false })}
spellCheck={false}
className="relative h-11 w-full rounded-lg bg-neutral-100 px-3 py-1 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
</div>
<div className="flex flex-col gap-1">
<label
htmlFor="about"
className="text-sm font-semibold uppercase tracking-wider"
>
Bio
</label>
<textarea
{...register('about')}
spellCheck={false}
className="relative h-20 w-full resize-none rounded-lg bg-neutral-100 px-3 py-2 text-neutral-900 !outline-none backdrop-blur-xl placeholder:text-neutral-500 dark:bg-neutral-900 dark:text-neutral-100"
/>
</div>
<div>
<button
type="submit"
disabled={!isValid}
className="mx-auto inline-flex h-9 w-full transform items-center justify-center gap-1 rounded-lg bg-blue-500 font-medium text-white hover:bg-blue-600 focus:outline-none active:translate-y-1 disabled:pointer-events-none disabled:opacity-50"
>
{loading ? (
<LoaderIcon className="h-4 w-4 animate-spin text-black dark:text-white" />
) : (
'Update'
)}
</button>
</div>
</div>
</form>
</div>
</div>
);
}

View File

@ -6,13 +6,20 @@ import { ZapCard } from '@app/personal/components/zapCard';
export function PersonalScreen() {
return (
<div className="mx-auto my-10 max-w-xl">
<ProfileCard />
<div className="grid grid-cols-2 gap-4">
<ContactCard />
<RelayCard />
<PostCard />
<ZapCard />
<div className="flex h-full w-full flex-col overflow-y-auto">
<div className="flex h-14 shrink-0 items-center justify-between px-3">
<div className="w-20" />
<h1 className="font-semibold">Personal Dashboard</h1>
<div className="w-20" />
</div>
<div className="mx-auto w-full max-w-xl">
<ProfileCard />
<div className="grid grid-cols-2 gap-4">
<ContactCard />
<RelayCard />
<PostCard />
<ZapCard />
</div>
</div>
</div>
);

View File

@ -28,9 +28,9 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
const follow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
const add = await user.follow(new NDKUser({ hexpubkey: pubkey }), contacts);
const add = await user.follow(new NDKUser({ pubkey: pubkey }), contacts);
if (add) {
setFollowed(true);
@ -44,14 +44,12 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
const unfollow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
contacts.delete(new NDKUser({ hexpubkey: pubkey }));
contacts.delete(new NDKUser({ pubkey: pubkey }));
let list: string[][];
contacts.forEach((el) =>
list.push(['p', el.pubkey, el.relayUrls?.[0] || '', el.profile?.name || ''])
);
contacts.forEach((el) => list.push(['p', el.pubkey, el.relayUrls?.[0] || '', '']));
const event = new NDKEvent(ndk);
event.content = '';

View File

@ -97,7 +97,7 @@ export const NDKInstance = () => {
if (db.account) {
const circleSetting = await db.getSettingValue('circles');
const user = instance.getUser({ hexpubkey: db.account.pubkey });
const user = instance.getUser({ pubkey: db.account.pubkey });
const follows = await user.follows();
const relayList = await user.relayList();

View File

@ -24,7 +24,7 @@ export function ActiveAccount() {
}
return (
<div className="flex flex-col gap-1 rounded-lg bg-neutral-100 p-1 hover:bg-neutral-200 dark:bg-neutral-900 dark:hover:bg-neutral-800">
<div className="flex flex-col gap-1 rounded-lg bg-neutral-100 p-1 ring-1 ring-transparent hover:bg-neutral-200 hover:ring-blue-500 dark:bg-neutral-900 dark:hover:bg-neutral-800">
<Link to="/personal" className="relative inline-block">
<Avatar.Root>
<Avatar.Image

View File

@ -115,7 +115,7 @@ export const User = memo(function User({
/>
</Avatar.Fallback>
</Avatar.Root>
<h5 className="max-w-[10rem] truncate font-semibold text-neutral-900 dark:text-neutral-100">
<h5 className="max-w-[10rem] truncate font-medium text-neutral-900 dark:text-neutral-100">
{user?.name ||
user?.display_name ||
user?.displayName ||

View File

@ -22,9 +22,9 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
const follow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
const add = await user.follow(new NDKUser({ hexpubkey: pubkey }), contacts);
const add = await user.follow(new NDKUser({ pubkey: pubkey }), contacts);
if (add) {
setFollowed(true);
@ -38,14 +38,12 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
const unfollow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
contacts.delete(new NDKUser({ hexpubkey: pubkey }));
contacts.delete(new NDKUser({ pubkey: pubkey }));
let list: string[][];
contacts.forEach((el) =>
list.push(['p', el.pubkey, el.relayUrls?.[0] || '', el.profile?.name || ''])
);
contacts.forEach((el) => list.push(['p', el.pubkey, el.relayUrls?.[0] || '', '']));
const event = new NDKEvent(ndk);
event.content = '';

View File

@ -39,9 +39,9 @@ export function NostrBandUserProfile({ data }: { data: Profile }) {
const follow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
const add = await user.follow(new NDKUser({ hexpubkey: pubkey }), contacts);
const add = await user.follow(new NDKUser({ pubkey: pubkey }), contacts);
if (add) {
setFollowed(true);
@ -55,14 +55,12 @@ export function NostrBandUserProfile({ data }: { data: Profile }) {
const unfollow = async (pubkey: string) => {
try {
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
const user = ndk.getUser({ pubkey: db.account.pubkey });
const contacts = await user.follows();
contacts.delete(new NDKUser({ hexpubkey: pubkey }));
contacts.delete(new NDKUser({ pubkey: pubkey }));
let list: string[][];
contacts.forEach((el) =>
list.push(['p', el.pubkey, el.relayUrls?.[0] || '', el.profile?.name || ''])
);
contacts.forEach((el) => list.push(['p', el.pubkey, el.relayUrls?.[0] || '', '']));
const event = new NDKEvent(ndk);
event.content = '';

View File

@ -89,7 +89,7 @@ export function NotificationWidget() {
})
);
const user = ndk.getUser({ hexpubkey: event.pubkey });
const user = ndk.getUser({ pubkey: event.pubkey });
await user.fetchProfile();
switch (event.kind) {

View File

@ -194,7 +194,7 @@ export function useNostr() {
};
const getContactsByPubkey = async (pubkey: string) => {
const user = ndk.getUser({ hexpubkey: pubkey });
const user = ndk.getUser({ pubkey: pubkey });
const follows = [...(await user.follows())].map((user) => user.hexpubkey);
return getMultipleRandom([...follows], 10);
};

View File

@ -18,7 +18,7 @@ export function useProfile(pubkey: string, embed?: string) {
}
const cleanPubkey = pubkey.replace(/[^a-zA-Z0-9]/g, '');
const user = ndk.getUser({ hexpubkey: cleanPubkey });
const user = ndk.getUser({ pubkey: cleanPubkey });
return await user.fetchProfile();
},