refactor: convert Author component to hooks (#150)

src/components/Author/Author.tsx

@@ -1,58 +1,44 @@
-import React, { Component, ReactNode, ReactElement } from 'react';
+import React, { FC, useContext } from 'react';
 
 import Avatar from '@material-ui/core/Avatar';
 import List from '@material-ui/core/List';
 
-import { DetailContextConsumer } from '../../pages/Version';
+import { DetailContext } from '../../pages/Version';
 import { Heading, AuthorListItem, AuthorListItemText } from './styles';
 import { isEmail } from '../../utils/url';
 
-class Authors extends Component {
-  public render(): ReactElement<HTMLElement> {
-    return (
-      <DetailContextConsumer>
-        {context => {
-          const { packageMeta } = context;
+const Authors: FC = () => {
+  const { packageMeta } = useContext(DetailContext);
 
-          if (!packageMeta) {
-            return null;
-          }
-
-          return this.renderAuthor(packageMeta);
-        }}
-      </DetailContextConsumer>
-    );
+  if (!packageMeta) {
+    return null;
   }
 
-  public renderLinkForMail(email: string, avatarComponent: ReactNode, packageName: string, version: string): ReactElement<HTMLElement> | ReactNode {
-    if (!email || isEmail(email) === false) {
-      return avatarComponent;
-    }
+  const { author, name: packageName, version } = packageMeta.latest;
 
-    return (
-      <a href={`mailto:${email}?subject=${packageName}@${version}`} target={'_top'}>
-        {avatarComponent}
-      </a>
-    );
+  if (!author) {
+    return null;
   }
 
-  public renderAuthor = ({ latest }) => {
-    const { author, name: packageName, version } = latest;
+  const { email, name } = author;
 
-    if (!author) {
-      return null;
-    }
+  const avatarComponent = <Avatar alt={author.name} src={author.avatar} />;
 
-    const avatarComponent = <Avatar alt={author.name} src={author.avatar} />;
-    return (
-      <List subheader={<Heading variant={'subtitle1'}>{'Author'}</Heading>}>
-        <AuthorListItem button={true}>
-          {this.renderLinkForMail(author.email, avatarComponent, packageName, version)}
-          <AuthorListItemText primary={author.name} />
-        </AuthorListItem>
-      </List>
-    );
-  };
-}
+  return (
+    <List subheader={<Heading variant={'subtitle1'}>{'Author'}</Heading>}>
+      <AuthorListItem button={true}>
+        {!email || !isEmail(email) ? (
+          avatarComponent
+        ) : (
+          <a href={`mailto:${email}?subject=${packageName}@${version}`} target={'_top'}>
+            {avatarComponent}
+          </a>
+        )}
+
+        <AuthorListItemText primary={name} />
+      </AuthorListItem>
+    </List>
+  );
+};
 
 export default Authors;