Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-28 14:18:51 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: enhance UserAvatar component to improve custom avatar loading logic

Browse source
This commit is contained in:
Danny Avila 2025-10-23 14:40:15 +02:00
parent 41380d9cb9
commit e5a5931818
No known key found for this signature in database
GPG key ID: BF31EEB2C5CA0956
1 changed files with 10 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

12
client/src/components/Endpoints/Icon.tsx
View file

@ -46,6 +46,14 @@ const UserAvatar = memo(({ size, user, avatarSrc, username, className }: UserAva
const showImage = useMemo(() => hasAvatar && !imageError, [hasAvatar, imageError]);
const imageSrc = useMemo(() => (user?.avatar ?? '') || avatarSrc, [user?.avatar, avatarSrc]);
/** Check if we're using a custom avatar (not initials) */
const isCustomAvatar = useMemo(() => !!(user?.avatar && user.avatar !== ''), [user?.avatar]);
/** Only show default while loading for custom avatars, not for initials */
const showDefaultWhileLoading = useMemo(
() => isCustomAvatar && !imageLoaded && showImage,
[isCustomAvatar, imageLoaded, showImage],
);
return (
<div
title={username}
@ -55,11 +63,11 @@ const UserAvatar = memo(({ size, user, avatarSrc, username, className }: UserAva
}}
className={cn('relative flex items-center justify-center', className ?? '')}
>
{!showImage || !imageLoaded ? renderDefaultAvatar() : null}
{!showImage || showDefaultWhileLoading ? renderDefaultAvatar() : null}
{showImage && (
<img
style={{
display: imageLoaded ? 'block' : 'none',
display: imageLoaded || !isCustomAvatar ? 'block' : 'none',
}}
className="rounded-full"
src={imageSrc}