Files
smesh/src/components/ProfileBanner/index.tsx
2025-12-24 22:48:38 +08:00

37 lines
808 B
TypeScript

import { generateImageByPubkey } from '@/lib/pubkey'
import { useEffect, useMemo, useState } from 'react'
import Image from '../Image'
export default function ProfileBanner({
pubkey,
banner,
className
}: {
pubkey: string
banner?: string
className?: string
}) {
const defaultBanner = useMemo(() => generateImageByPubkey(pubkey), [pubkey])
const [bannerUrl, setBannerUrl] = useState(banner ?? defaultBanner)
useEffect(() => {
if (banner) {
setBannerUrl(banner)
} else {
setBannerUrl(defaultBanner)
}
}, [defaultBanner, banner])
return (
<Image
image={{ url: bannerUrl, pubkey }}
alt={`${pubkey} banner`}
className={className}
classNames={{
wrapper: 'rounded-none'
}}
errorPlaceholder={defaultBanner}
/>
)
}