From 295c6e179ec0f14a10303e01fb6e5b5ef969db79 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sat, 21 Mar 2020 17:38:44 +0300
Subject: feat: add github avatars to users

---
 src/pages/Contribute/Contribute.tsx | 40 +++++++++++++++----------------------
 1 file changed, 16 insertions(+), 24 deletions(-)

(limited to 'src/pages/Contribute/Contribute.tsx')

diff --git a/src/pages/Contribute/Contribute.tsx b/src/pages/Contribute/Contribute.tsx
index 4c37fb9..77228a1 100644
--- a/src/pages/Contribute/Contribute.tsx
+++ b/src/pages/Contribute/Contribute.tsx
@@ -6,7 +6,6 @@ import {
   List,
   ListItem,
   Link,
-  Avatar,
   Divider,
   makeStyles,
 } from '@material-ui/core';
@@ -16,6 +15,7 @@ import BugReportIcon from '@material-ui/icons/BugReport';
 import NewReleasesIcon from '@material-ui/icons/NewReleases';
 
 import { Window, ContentSection } from 'react-benzin';
+import GithubAvatar from '../../components/GithubAvatar/GithubAvatar';
 
 import developers from '../../developers.json';
 
@@ -111,31 +111,23 @@ const Contribute: React.FC = () => {
         <ContentSection sectionName="Developers">
           <List>
             {
-              developers.map(developer => {
-                const githubUrl = `https://github.com/${developer.username}`;
-
-                return (
-                  <div key={developer.username}>
-                    <ListItem>
-                      <Link href={githubUrl}>
-                        <Avatar alt={developer.username} src={`${githubUrl}.png`} />
-                      </Link>
-                      <div>
-                        <Link href={githubUrl}>
-                          {developer.username}
-                        </Link>
-                        <Typography component="div" color="textSecondary">
-                          {developer.role}
-                        </Typography>
-                      </div>
-                    </ListItem>
-                    <Divider variant="middle" />
-                  </div>
-                )
-              })
+              developers.map(developer => (
+                <div key={developer.username}>
+                  <ListItem>
+                    <GithubAvatar username={developer.username} />
+                    <div>
+                      <Link href="#">{developer.username}</Link>
+                      <Typography component="div" color="textSecondary">
+                        {developer.role}
+                      </Typography>
+                    </div>
+                  </ListItem>
+                  <Divider variant="middle" />
+                </div>
+              ))
             }
             <ListItem>
-              <Avatar />
+              <GithubAvatar username="anonymous" />
               You can be here!
             </ListItem>
           </List>
-- 
cgit v1.2.3

