From 14926e00ec1d749d5e2c83bdcd98ed68e9b2f896 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Fri, 3 Jul 2020 21:15:28 +0300
Subject: style: fix eslint errors

---
 src/pages/HomePage/HomePage.tsx | 59 +++++++++++++++++++++++------------------
 1 file changed, 33 insertions(+), 26 deletions(-)

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

diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
index f3cadee..8995630 100644
--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -1,5 +1,11 @@
 import React, { useState, useEffect } from 'react';
-import { Typography, Divider, Grid, Button, Link } from '@material-ui/core/';
+import {
+  Typography,
+  Divider,
+  Grid,
+  Button,
+  Link
+} from '@material-ui/core/';
 import { makeStyles } from '@material-ui/core/styles';
 import TrendingUpIcon from '@material-ui/icons/TrendingUp';
 import { Rating } from '@material-ui/lab';
@@ -28,7 +34,6 @@ const HomePage: React.FC = () => {
   const { navigate } = useNavigate();
   const { isAuthenticated } = useAuth();
 
-
   const rating = feedbacks.length && feedbacks.reduce(
     (acc: number, feedback: Feedback) => acc + feedback.score,
     0
@@ -48,12 +53,18 @@ const HomePage: React.FC = () => {
     navigate('auth');
   };
 
+  const GithubLink = <Link href="https://github.com/which-ecosystem">GitHub</Link>;
+  const TypescriptLink = <Link href="https://www.typescriptlang.org/">Typescript</Link>;
+  const ReactLink = <Link href="https://reactjs.org/">React</Link>;
+  const FeathersLink = <Link href="https://feathersjs.com">Feathers</Link>;
+  const MUILink = <Link href="https://material-ui.com">Material-UI</Link>;
+
   return (
     <Grid container spacing={4}>
       <Grid item xs={4}>
         <Grid container direction="column" spacing={1} alignItems="center">
           <Grid item>
-              <img src={process.env.PUBLIC_URL + '/which-logo-512.png'} alt="logo" className={classes.logo}/>
+            <img src={`${process.env.PUBLIC_URL}/which-logo-512.png`} alt="logo" className={classes.logo} />
           </Grid>
           <Grid item>
             <Rating value={rating} readOnly size="large" />
@@ -71,20 +82,25 @@ const HomePage: React.FC = () => {
             <Typography variant="h4"> Which one to choose? </Typography>
             <Divider />
             <Typography>
-              <p>Have you ever found yourself stuck between two options, not being able to choose any? This is exactly the problem we are going to solve!</p>
+              <p>
+                Have you ever found yourself stuck between two options, not being able to choose any?
+                This is exactly the problem we are going to solve!
+              </p>
               <p>Share your minor everyday uncertainties with the whole world and see what others think!</p>
               <Button variant="contained" color="primary" size="large" onClick={handleLetsGo}>
-                let's go!
+                {'let\'s go!'}
               </Button>
-              {!isAuthenticated() && <Button
-                variant="outlined"
-                color="primary"
-                size="large"
-                className={classes.signup}
-                onClick={handleSignUp}
-              >
-                sign up
-              </Button>}
+              {!isAuthenticated() && (
+                <Button
+                  variant="outlined"
+                  color="primary"
+                  size="large"
+                  className={classes.signup}
+                  onClick={handleSignUp}
+                >
+                  sign up
+                </Button>
+              )}
             </Typography>
           </Grid>
           <Grid item>
@@ -92,17 +108,8 @@ const HomePage: React.FC = () => {
             <Divider />
             <Typography>
               <p>
-                The project is written in <Link href="https://www.typescriptlang.org/">
-                  Typescript
-                </Link> and features <Link href="https://reactjs.org/">
-                  React
-                </Link>, <Link href="https://feathersjs.com/">
-                  Feathers
-                </Link>, and <Link href="https://material-ui.com/">
-                  Material-UI
-                </Link>.
-               It is currently open-source and you can visit our <Link href="https://github.com/which-ecosystem">
-                GitHub</Link> (make sure to star our repositories)!
+                The project is written in {TypescriptLink} and features {ReactLink}, {FeathersLink}, and {MUILink}.
+                It is currently open-source and you can visit our {GithubLink} (make sure to star our repositories)!
               </p>
               <p>
                 We encourage any developer to check it out. Feel free to open issues and create Pull Requests!
@@ -117,7 +124,7 @@ const HomePage: React.FC = () => {
                 startIcon={<TrendingUpIcon />}
                 href="https://github.com/orgs/which-ecosystem/projects/1"
               >
-                 track our progress
+                track our progress
               </Button>
             </Typography>
           </Grid>
-- 
cgit v1.2.3

