highperfocused/lumina
1
0
Fork 0
mirror of https://github.com/lumina-rocks/lumina.git synced 2026-06-04 09:41:32 +02:00
Code Issues Packages Projects Releases Wiki Activity

update KIND20Card to handle image loading errors with a placeholder image

Browse Source
This commit is contained in:
highperfocused
2025-04-01 22:05:03 +02:00
parent 46dc1b837c
commit 2d5dcb139b
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/KIND20Card.tsx
View File

@@ -38,8 +38,9 @@ const KIND20Card: React.FC<KIND20CardProps> = ({
pubkey,
})
const [imageError, setImageError] = useState(false);
const [imageState, setImageState] = useState(image);
if (!image || !image.startsWith("http") || imageError) return null;
// if (!image || !image.startsWith("http") || imageError) return null;
const title =
userData?.username || userData?.display_name || userData?.name || userData?.npub || nip19.npubEncode(pubkey)
@@ -82,11 +83,14 @@ const KIND20Card: React.FC<KIND20CardProps> = ({
<div className="w-full">
<div className="relative w-full" style={{ paddingBottom: "100%" }}>
<Image
src={image}
src={imageState || "/placeholder.png"}
alt={text}
fill
className="rounded-lg object-contain"
onError={() => setImageError(true)}
// onError={() => setImageError(true)}
onError={() => {
setImageState("/placeholder.png")
}}
/>
</div>
</div>