2019-08-12 12:06:10 +07:00
|
|
|
import React, { FC } from 'react';
|
|
|
|
|
|
|
|
import { isEmail } from '../../utils/url';
|
2019-10-06 21:01:58 +07:00
|
|
|
import Tooltip from '../../muiComponents/Tooltip';
|
2019-10-06 23:30:05 +07:00
|
|
|
import Avatar from '../../muiComponents/Avatar';
|
2019-10-03 23:17:04 +07:00
|
|
|
|
2019-08-12 12:06:10 +07:00
|
|
|
export interface AvatarDeveloper {
|
|
|
|
name: string;
|
|
|
|
packageName: string;
|
|
|
|
version: string;
|
|
|
|
avatar: string;
|
|
|
|
email: string;
|
|
|
|
}
|
|
|
|
|
|
|
|
const AvatarTooltip: FC<AvatarDeveloper> = ({ name, packageName, version, avatar, email }) => {
|
|
|
|
const avatarComponent = <Avatar aria-label={name} src={avatar} />;
|
2019-10-11 03:20:05 +07:00
|
|
|
function renderLinkForMail(email: string, avatarComponent: JSX.Element, packageName: string, version: string): JSX.Element {
|
2019-08-12 12:06:10 +07:00
|
|
|
if (!email || isEmail(email) === false) {
|
|
|
|
return avatarComponent;
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<a href={`mailto:${email}?subject=${packageName}@${version}`} target={'_top'}>
|
|
|
|
{avatarComponent}
|
|
|
|
</a>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return <Tooltip title={name}>{renderLinkForMail(email, avatarComponent, packageName, version)}</Tooltip>;
|
|
|
|
};
|
|
|
|
|
|
|
|
export { AvatarTooltip };
|