reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update widget list

Browse Source
This commit is contained in:
reya
2023-11-11 09:14:23 +07:00
parent 0710996a0d
commit 1c3119577f
11 changed files with 316 additions and 563 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/shared/widgets/other/nostrBandUserProfile.tsx
View File

@@ -1,5 +1,4 @@
import { NDKEvent, NDKKind, NDKUser } from '@nostr-dev-kit/ndk';
import { useQuery } from '@tanstack/react-query';
import { useEffect, useState } from 'react';
import { toast } from 'sonner';
@@ -8,7 +7,6 @@ import { useStorage } from '@libs/storage/provider';
import { FollowIcon, UnfollowIcon } from '@shared/icons';
import { compactNumber } from '@utils/number';
import { shortenKey } from '@utils/shortenKey';
export interface Profile {
@@ -17,23 +15,12 @@ export interface Profile {
}
export function NostrBandUserProfile({ data }: { data: Profile }) {
const { db } = useStorage();
const { ndk } = useNDK();
const { status, data: userStats } = useQuery({
queryKey: ['user-stats', data.pubkey],
queryFn: async () => {
const res = await fetch(`https://api.nostr.band/v0/stats/profile/${data.pubkey}`);
return res.json();
},
refetchOnMount: false,
refetchOnReconnect: false,
refetchOnWindowFocus: false,
staleTime: Infinity,
});
const embedProfile = data.profile ? JSON.parse(data.profile.content) : null;
const profile = embedProfile;
const { db } = useStorage();
const { ndk } = useNDK();
const [followed, setFollowed] = useState(false);
const follow = async (pubkey: string) => {
@@ -90,8 +77,8 @@ export function NostrBandUserProfile({ data }: { data: Profile }) {
}
return (
<div className="h-min w-full px-3 pb-3">
<div className="rounded-xl bg-neutral-100 px-5 py-5 dark:bg-neutral-900">
<div className="mb-3 h-min w-full px-3">
<div className="rounded-xl bg-neutral-50 px-5 py-5 dark:bg-neutral-950">
<div className="flex items-center justify-between">
<div className="inline-flex items-center gap-2">
<img
@@ -128,45 +115,9 @@ export function NostrBandUserProfile({ data }: { data: Profile }) {
)}
</div>
</div>
<div className="mt-2 whitespace-pre-line break-words text-neutral-900 dark:text-neutral-100">
<div className="mt-2 line-clamp-5 whitespace-pre-line break-all text-neutral-900 dark:text-neutral-100">
{profile.about || profile.bio}
</div>
<div className="mt-5">
{status === 'pending' ? (
<p>Loading...</p>
) : (
<div className="flex w-full items-center gap-8">
<div className="inline-flex flex-col gap-1">
<span className="font-semibold leading-none text-neutral-900 dark:text-neutral-100">
{userStats.stats[data.pubkey].followers_pubkey_count ?? 0}
</span>
<span className="text-sm leading-none text-neutral-900 dark:text-neutral-100/50">
Followers
</span>
</div>
<div className="inline-flex flex-col gap-1">
<span className="font-semibold leading-none text-neutral-900 dark:text-neutral-100">
{userStats.stats[data.pubkey].pub_following_pubkey_count ?? 0}
</span>
<span className="text-sm leading-none text-neutral-900 dark:text-neutral-100/50">
Following
</span>
</div>
<div className="inline-flex flex-col gap-1">
<span className="font-semibold leading-none text-neutral-900 dark:text-neutral-100">
{userStats.stats[data.pubkey].zaps_received
? compactNumber.format(
userStats.stats[data.pubkey].zaps_received.msats / 1000
)
: 0}
</span>
<span className="text-sm leading-none text-neutral-900 dark:text-neutral-100/50">
Zaps received
</span>
</div>
</div>
)}
</div>
</div>
</div>
);