51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
import Image from 'next/image'
|
|
import Link from 'next/link'
|
|
import { Button } from './ui'
|
|
import type { NostrProfile } from '@/types/nostr'
|
|
import { NotificationCenter } from './NotificationCenter'
|
|
|
|
interface ConnectedUserMenuProps {
|
|
pubkey: string
|
|
profile: NostrProfile | null
|
|
onDisconnect: () => void
|
|
loading: boolean
|
|
}
|
|
|
|
export function ConnectedUserMenu({
|
|
pubkey,
|
|
profile,
|
|
onDisconnect,
|
|
loading,
|
|
}: ConnectedUserMenuProps): React.ReactElement {
|
|
const displayName = profile?.name ?? `${pubkey.slice(0, 8)}...`
|
|
|
|
return (
|
|
<div className="flex items-center gap-4">
|
|
<NotificationCenter userPubkey={pubkey} />
|
|
<Link
|
|
href="/profile"
|
|
className="flex items-center gap-2 hover:opacity-80 transition-opacity"
|
|
>
|
|
{profile?.picture && (
|
|
<Image
|
|
src={profile.picture}
|
|
alt={displayName}
|
|
width={32}
|
|
height={32}
|
|
className="rounded-full object-cover"
|
|
/>
|
|
)}
|
|
<span className="text-sm font-medium">{displayName}</span>
|
|
</Link>
|
|
<Button
|
|
variant="secondary"
|
|
size="small"
|
|
onClick={onDisconnect}
|
|
disabled={loading}
|
|
>
|
|
Disconnect
|
|
</Button>
|
|
</div>
|
|
)
|
|
}
|