24 lines
600 B
TypeScript
24 lines
600 B
TypeScript
|
import Badge from '@mui/joy/Badge';
|
||
|
|
import Avatar, { AvatarProps } from '@mui/joy/Avatar';
|
||
|
|
|
||
|
|
type AvatarWithStatusProps = AvatarProps & {
|
||
|
|
online?: boolean;
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function AvatarWithStatus(props: AvatarWithStatusProps) {
|
||
|
|
const { online = false, ...other } = props;
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<Badge
|
||
|
|
color={online ? 'success' : 'neutral'}
|
||
|
|
variant={online ? 'solid' : 'soft'}
|
||
|
|
size="sm"
|
||
|
|
anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
|
||
|
|
badgeInset="4px 4px"
|
||
|
|
>
|
||
|
|
<Avatar size="sm" {...other} />
|
||
|
|
</Badge>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|