2
0
Files
bot/apps/builder/components/shared/EmojiOrImageIcon.tsx
2022-05-13 15:33:53 -07:00

40 lines
857 B
TypeScript

import { ToolIcon } from 'assets/icons'
import React from 'react'
import { chakra, IconProps, Image } from '@chakra-ui/react'
type Props = {
icon?: string | null
emojiFontSize?: string
boxSize?: string
defaultIcon?: (props: IconProps) => JSX.Element
}
export const EmojiOrImageIcon = ({
icon,
boxSize = '25px',
emojiFontSize,
defaultIcon = ToolIcon,
}: Props) => {
return (
<>
{icon ? (
icon.startsWith('http') ? (
<Image
src={icon}
boxSize={boxSize}
objectFit={icon.endsWith('.svg') ? undefined : 'cover'}
alt="typebot icon"
rounded="10%"
/>
) : (
<chakra.span role="img" fontSize={emojiFontSize}>
{icon}
</chakra.span>
)
) : (
defaultIcon({ boxSize })
)}
</>
)
}