fd5c0c9747
* applied eslint * add locales and lint the project * removed error boundary * updated locales * fix min files * fix locales
53 lines
1.4 KiB
JavaScript
53 lines
1.4 KiB
JavaScript
import React from 'react';
|
|
import cn from 'classnames';
|
|
import { avatarIconName } from 'App/iconNames';
|
|
import { Icon } from 'UI';
|
|
import { Tooltip } from 'antd';
|
|
|
|
function Avatar({
|
|
isActive = false,
|
|
isAssist = false,
|
|
width = '38px',
|
|
height = '38px',
|
|
iconSize = 24,
|
|
seed,
|
|
}) {
|
|
const iconName = avatarIconName(seed);
|
|
return (
|
|
<Tooltip
|
|
title={
|
|
!isAssist ? '' : isActive ? 'Active user' : 'User might be inactive'
|
|
}
|
|
>
|
|
<div
|
|
className={cn(
|
|
// stl.wrapper,
|
|
'border flex items-center justify-center rounded-full relative bg-tealx-light',
|
|
)}
|
|
style={{ width, height }}
|
|
>
|
|
{/* <img src={`/assets/${iconName}`} width={iconSize} height={iconSize} /> */}
|
|
<Icon name={iconName} size={iconSize} color="tealx" />
|
|
{isAssist && (
|
|
<div
|
|
className={cn('w-2 h-2 rounded-full absolute right-0 bottom-0', {
|
|
'bg-green': isActive,
|
|
'bg-orange': !isActive,
|
|
})}
|
|
style={{ marginRight: '3px', marginBottom: '3px' }}
|
|
>
|
|
{isActive ? null : (
|
|
<Icon
|
|
name="sleep"
|
|
size={9}
|
|
style={{ position: 'absolute', right: -6, top: -3 }}
|
|
/>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</Tooltip>
|
|
);
|
|
}
|
|
|
|
export default Avatar;
|