themesberg / flowbite-react

Official React components built for Flowbite and Tailwind CSS

Home Page:https://flowbite-react.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Avatar should render dummy svg when provided with render function

mkbctrl opened this issue · comments

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Summary

When overwriting the component with custom image component, the dummy svg should still render if we are facing a scenario where the image url may be undefined. Right now I have to workaround it like this:

<Avatar
        img={(avatarProps) => {
          if (imagePreviewUrl) {
            return (
              <Image
                alt={t('alt')}
                referrerPolicy='no-referrer'
                src={imagePreviewUrl}
                width={144}
                height={144}
                {...avatarProps}
              />
            )
          }

          // Flowbite avatar is unable to render dummy when props are passed
          return <Avatar {...avatarProps} size='xl' bordered={false} />
        }}
        size='xl'
        alt={t('alt')}
        className='flex-shrink-0'
        rounded
      />

Context

I want the ability to render custom component, and to maintain the ability to render the dummy, if component is null