91 lines
3.0 KiB
TypeScript
91 lines
3.0 KiB
TypeScript
import { NDKFilter, NDKKind } from '@nostr-dev-kit/ndk';
|
|
import { useEffect } from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
import { useStorage } from '@libs/storage/provider';
|
|
|
|
import { SettingsIcon } from '@shared/icons';
|
|
import { Image } from '@shared/image';
|
|
import { Logout } from '@shared/logout';
|
|
|
|
import { useActivities } from '@stores/activities';
|
|
|
|
import { useNostr } from '@utils/hooks/useNostr';
|
|
import { useProfile } from '@utils/hooks/useProfile';
|
|
import { sendNativeNotification } from '@utils/notification';
|
|
import { displayNpub } from '@utils/shortenKey';
|
|
|
|
export function ActiveAccount() {
|
|
const { db } = useStorage();
|
|
const { status, user } = useProfile(db.account.pubkey);
|
|
const { sub } = useNostr();
|
|
|
|
const addActivity = useActivities((state) => state.addActivity);
|
|
|
|
useEffect(() => {
|
|
const filter: NDKFilter = {
|
|
'#p': [db.account.pubkey],
|
|
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Reaction, NDKKind.Zap],
|
|
since: Math.floor(Date.now() / 1000),
|
|
};
|
|
|
|
sub(
|
|
filter,
|
|
async (event) => {
|
|
addActivity(event);
|
|
switch (event.kind) {
|
|
case NDKKind.Text:
|
|
return await sendNativeNotification('Mention');
|
|
case NDKKind.Repost:
|
|
return await sendNativeNotification('Repost');
|
|
case NDKKind.Reaction:
|
|
return await sendNativeNotification('Reaction');
|
|
case NDKKind.Zap:
|
|
return await sendNativeNotification('Zap');
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
false
|
|
);
|
|
}, []);
|
|
|
|
if (status === 'loading') {
|
|
return (
|
|
<div className="inline-flex h-16 items-center gap-2.5 border-l-2 border-transparent px-3 pb-2">
|
|
<div className="relative h-10 w-10 shrink-0 animate-pulse rounded bg-white/10 backdrop-blur-xl" />
|
|
<div className="h-2.5 w-2/3 animate-pulse rounded bg-white/10 backdrop-blur-xl" />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex h-16 items-center justify-between border-l-2 border-transparent px-3 pb-1">
|
|
<Link to={`/users/${db.account.pubkey}`} className="flex items-center gap-1.5">
|
|
<Image
|
|
src={user?.picture || user?.image}
|
|
alt={db.account.npub}
|
|
className="h-9 w-9 shrink-0 rounded-lg object-cover"
|
|
/>
|
|
<div className="flex flex-col items-start">
|
|
<p className="max-w-[10rem] truncate text-base font-semibold leading-none text-white">
|
|
{user?.name || user?.display_name || user?.displayName}
|
|
</p>
|
|
<span className="max-w-[7rem] truncate text-sm leading-none text-white/50">
|
|
{user?.nip05 || displayNpub(db.account.pubkey, 12)}
|
|
</span>
|
|
</div>
|
|
</Link>
|
|
<div className="inline-flex divide-x divide-white/5 rounded-lg border-t border-white/5 bg-white/10">
|
|
<Link
|
|
to="/settings/"
|
|
className="inline-flex h-9 w-9 items-center justify-center rounded-l-lg hover:bg-white/10"
|
|
>
|
|
<SettingsIcon className="h-5 w-5 text-white" />
|
|
</Link>
|
|
<Logout />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|