diff --git a/src/components/Favicon/index.tsx b/src/components/Favicon/index.tsx index 43f7d8fa..01341c5f 100644 --- a/src/components/Favicon/index.tsx +++ b/src/components/Favicon/index.tsx @@ -1,15 +1,29 @@ +import { cn } from '@/lib/utils' import { useState } from 'react' -export function Favicon({ domain, className }: { domain: string; className?: string }) { +export function Favicon({ + domain, + className, + fallback = null +}: { + domain: string + className?: string + fallback?: React.ReactNode +}) { + const [loading, setLoading] = useState(true) const [error, setError] = useState(false) - if (error) return null + if (error) return fallback return ( - {domain} setError(true)} - /> +
+ {loading &&
{fallback}
} + {domain} setError(true)} + onLoad={() => setLoading(false)} + /> +
) } diff --git a/src/components/Nip05/index.tsx b/src/components/Nip05/index.tsx index bef22de9..1de6e883 100644 --- a/src/components/Nip05/index.tsx +++ b/src/components/Nip05/index.tsx @@ -32,10 +32,13 @@ export default function Nip05({ pubkey, append }: { pubkey: string; append?: str to={toNoteList({ domain: nip05Domain })} className={`flex items-center gap-1 hover:underline truncate [&_svg]:size-3.5 [&_svg]:shrink-0 ${nip05IsVerified ? 'text-primary' : 'text-muted-foreground'}`} > - {nip05IsVerified ? : } + {nip05IsVerified ? ( + } /> + ) : ( + + )} {nip05Domain} - {append && {append}} )