4cacb31522
The pie chart was not properly centered. This commit aligns the pie chart to the center of the component.
42 lines
850 B
TypeScript
42 lines
850 B
TypeScript
|
|
import React from 'react';
|
|
|
|
interface SimpleAvatarProps {
|
|
src?: string;
|
|
name: string;
|
|
size?: 'sm' | 'md' | 'lg';
|
|
className?: string;
|
|
}
|
|
|
|
const SimpleAvatar: React.FC<SimpleAvatarProps> = ({
|
|
src,
|
|
name,
|
|
size = 'md',
|
|
className = ''
|
|
}) => {
|
|
const initials = name
|
|
.split(' ')
|
|
.map(part => part.charAt(0))
|
|
.join('')
|
|
.toUpperCase()
|
|
.substring(0, 2);
|
|
|
|
const sizeClasses = {
|
|
sm: 'w-8 h-8 text-xs',
|
|
md: 'w-10 h-10 text-sm',
|
|
lg: 'w-12 h-12 text-base'
|
|
};
|
|
|
|
return (
|
|
<div className={`flex items-center justify-center rounded-full bg-neuro-income text-white ${sizeClasses[size]} ${className}`}>
|
|
{src ? (
|
|
<img src={src} alt={name} className="w-full h-full rounded-full object-cover" />
|
|
) : (
|
|
<span>{initials}</span>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SimpleAvatar;
|