refactor: improve user avatar rendering by always displaying initials and handling image load errors.
This commit is contained in:
@@ -313,15 +313,14 @@ export default function UserDetailPage() {
|
||||
<div className="flex items-center">
|
||||
{/* Avatar */}
|
||||
<div className="flex-shrink-0 h-20 w-20">
|
||||
{avatarUrl ? (
|
||||
<img className="h-20 w-20 rounded-full object-cover" src={avatarUrl} alt="" />
|
||||
) : (
|
||||
<div className="h-20 w-20 rounded-full bg-[#e8f0ee] flex items-center justify-center">
|
||||
<span className="text-[#666666] font-medium text-2xl">
|
||||
{user.profile?.firstName?.[0] || user.email[0].toUpperCase()}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="h-20 w-20 rounded-full bg-[#e8f0ee] flex items-center justify-center relative overflow-hidden">
|
||||
<span className="text-[#666666] font-medium text-2xl">
|
||||
{user.profile?.firstName?.[0] || user.email[0].toUpperCase()}
|
||||
</span>
|
||||
{avatarUrl && (
|
||||
<img className="absolute inset-0 h-20 w-20 rounded-full object-cover" src={avatarUrl} alt="" onError={(e) => { (e.target as HTMLImageElement).style.display = 'none'; }} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Name & Email */}
|
||||
|
||||
Reference in New Issue
Block a user