Austin/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2024-11-16 11:42:29 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

fix: Improved fallback solution for avatar image loading failure (#1172)

Browse Source
This commit is contained in:
leo 2023-09-14 13:31:35 +08:00 committed by GitHub
parent fc68c81791
commit 562a571281
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/app/components/base/avatar/index.tsx
View File

@ -1,5 +1,6 @@
'use client' 'use client'
import cn from 'classnames' import cn from 'classnames'
import { useState } from 'react'
type AvatarProps = { type AvatarProps = {
name: string name: string
@ -17,14 +18,20 @@ const Avatar = ({
}: AvatarProps) => { }: AvatarProps) => {
const avatarClassName = 'shrink-0 flex items-center rounded-full bg-primary-600' const avatarClassName = 'shrink-0 flex items-center rounded-full bg-primary-600'
const style = { width: `${size}px`, height: `${size}px`, fontSize: `${size}px`, lineHeight: `${size}px` } const style = { width: `${size}px`, height: `${size}px`, fontSize: `${size}px`, lineHeight: `${size}px` }
const [imgError, setImgError] = useState(false)
if (avatar) { const handleError = () => {
setImgError(true)
}
if (avatar && !imgError) {
return ( return (
<img <img
className={cn(avatarClassName, className)} className={cn(avatarClassName, className)}
style={style} style={style}
alt={name} alt={name}
src={avatar} src={avatar}
onError={handleError}
/> />
) )
} }