feat: Implement useImageStatus hook and enhance image loading status handling across various components to address cached images and loading timeouts.

src/app/(agent)/agent/network/component/ConnectionCard.tsx

@@ -41,6 +41,7 @@ export function ConnectionCard({
           )}
           {avatar && !isPlaceholder && (
             <img
+              ref={(el) => { if (el?.complete && el.naturalWidth > 0) setAvatarLoaded(true); }}
               src={avatar}
               alt={name}
               className={`absolute inset-0 w-full h-full object-cover rounded-full transition-opacity duration-300 ${avatarLoaded ? 'opacity-100' : 'opacity-0'}`}

src/app/(agent)/agent/network/component/InvitationCard.tsx

@@ -55,6 +55,7 @@ export function InvitationCard({
           )}
           {avatar && !isPlaceholder && (
             <img
+              ref={(el) => { if (el?.complete && el.naturalWidth > 0) setAvatarLoaded(true); }}
               src={avatar}
               alt={name}
               className={`absolute inset-0 w-full h-full object-cover rounded-full transition-opacity duration-300 ${avatarLoaded ? 'opacity-100' : 'opacity-0'}`}