* enhancement: built-in custom emoji and show metadata message * chore: seperate render avatar as component * fix: avatar on assistant screen
32 lines
831 B
TypeScript
32 lines
831 B
TypeScript
import React from 'react'
|
|
|
|
/**
|
|
* Checks if an avatar is a custom image (starts with '/images/')
|
|
*/
|
|
const isCustomImageAvatar = (avatar: React.ReactNode): avatar is string => {
|
|
return typeof avatar === 'string' && avatar.startsWith('/images/')
|
|
}
|
|
|
|
/**
|
|
* Component for rendering assistant avatars with consistent styling
|
|
*/
|
|
interface AvatarEmojiProps {
|
|
avatar?: React.ReactNode
|
|
fallback?: React.ReactNode
|
|
imageClassName?: string
|
|
textClassName?: string
|
|
}
|
|
|
|
export const AvatarEmoji: React.FC<AvatarEmojiProps> = ({
|
|
avatar,
|
|
fallback = '👋',
|
|
imageClassName = 'w-5 h-5 object-contain',
|
|
textClassName = 'text-base',
|
|
}) => {
|
|
if (isCustomImageAvatar(avatar)) {
|
|
return <img src={avatar} alt="Custom avatar" className={imageClassName} />
|
|
}
|
|
|
|
return <span className={textClassName}>{avatar || fallback}</span>
|
|
}
|