1import React from 'react';
 2import { Link as RouterLink } from 'react-router-dom';
 3
 4import MAvatar from '@material-ui/core/Avatar';
 5import Link from '@material-ui/core/Link';
 6import Tooltip from '@material-ui/core/Tooltip/Tooltip';
 7
 8import { AuthoredFragment } from '../graphql/fragments.generated';
 9
10type Props = AuthoredFragment & {
11  className?: string;
12  bold?: boolean;
13};
14
15const Author = ({ author, ...props }: Props) => {
16  return (
17    <Tooltip title={`Goto the ${author.displayName}'s profile.`}>
18      <Link {...props} component={RouterLink} to={`/user/${author.humanId}`}>
19        {author.displayName}
20      </Link>
21    </Tooltip>
22  );
23};
24
25export const Avatar = ({ author, ...props }: Props) => {
26  if (author.avatarUrl) {
27    return <MAvatar src={author.avatarUrl} {...props} />;
28  }
29
30  return <MAvatar {...props}>{author.displayName[0]}</MAvatar>;
31};
32
33export default Author;