'use client'

import { Avatar as HeroAvatar } from '@heroui/react'

interface AvatarProps {
  alt?: string
  className?: string
  color?: string
  isBordered?: boolean
  size?: 'sm' | 'md' | 'lg'
  src?: string
}

export function Avatar({ alt = '', className, isBordered, size, src }: AvatarProps) {
  return (
    <HeroAvatar
      className={`${isBordered ? 'ring-2 ring-divider' : ''} ${className ?? ''}`.trim()}
      size={size}
    >
      {src ? (
        <HeroAvatar.Image
          alt={alt}
          src={src}
        />
      ) : null}
      <HeroAvatar.Fallback>{alt.slice(0, 1)}</HeroAvatar.Fallback>
    </HeroAvatar>
  )
}