From ad049a20fa2d92d9d0cee0af25be799eadf02b46 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 5 Jul 2020 11:14:15 +0300
Subject: feat: add reviews under logo

---
 src/pages/HomePage/HomePage.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

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

diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
index f00289a..ab04281 100644
--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -14,6 +14,7 @@ import { Feedback } from 'which-types';
 import { useNavigate } from '../../hooks/useNavigate';
 import { useAuth } from '../../hooks/useAuth';
 import { get } from '../../requests';
+import ReviewCard from '../../components/ReviewCard/ReviewCard';
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -29,6 +30,11 @@ const useStyles = makeStyles(theme => ({
   },
   signup: {
     marginLeft: theme.spacing(2)
+  },
+  reviews: {
+    [theme.breakpoints.up('md')]: {
+      padding: theme.spacing(0, 10)
+    }
   }
 }));
 
@@ -63,6 +69,12 @@ const HomePage: React.FC = () => {
   const FeathersLink = <Link href="https://feathersjs.com">Feathers</Link>;
   const MUILink = <Link href="https://material-ui.com">Material-UI</Link>;
 
+  const Reviews = (
+    <div className={classes.reviews}>
+      {feedbacks.map(feedback => <ReviewCard feedback={feedback} />)}
+    </div>
+  );
+
   return (
     <div className={classes.root}>
       <Grid container spacing={4}>
@@ -80,6 +92,7 @@ const HomePage: React.FC = () => {
               </Typography>
             </Grid>
           </Grid>
+          {Reviews}
         </Grid>
         <Grid item xs={12} md={5}>
           <Grid container direction="column" spacing={6}>
-- 
cgit v1.2.3


From c50c38657e23de012699781f07a51dd7e4199b77 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 5 Jul 2020 12:18:55 +0300
Subject: feat: implement feedback feature

---
 src/pages/HomePage/HomePage.tsx | 62 +++++++++++++++++++++++++++++++++++------
 1 file changed, 54 insertions(+), 8 deletions(-)

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

diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
index ab04281..7b04bff 100644
--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -4,9 +4,10 @@ import {
   Divider,
   Grid,
   Button,
-  Link
+  Link,
+  useMediaQuery
 } from '@material-ui/core/';
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles, useTheme } from '@material-ui/core/styles';
 import TrendingUpIcon from '@material-ui/icons/TrendingUp';
 import { Rating } from '@material-ui/lab';
 import { Feedback } from 'which-types';
@@ -15,6 +16,7 @@ import { useNavigate } from '../../hooks/useNavigate';
 import { useAuth } from '../../hooks/useAuth';
 import { get } from '../../requests';
 import ReviewCard from '../../components/ReviewCard/ReviewCard';
+import ReviewForm from './ReviewForm';
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -42,7 +44,9 @@ const HomePage: React.FC = () => {
   const [feedbacks, setFeedbacks] = useState<Feedback[]>([]);
   const classes = useStyles();
   const { navigate } = useNavigate();
-  const { isAuthenticated } = useAuth();
+  const { isAuthenticated, user } = useAuth();
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
 
   const rating = feedbacks.length && feedbacks.reduce(
     (acc: number, feedback: Feedback) => acc + feedback.score,
@@ -68,6 +72,7 @@ const HomePage: React.FC = () => {
   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>;
+  const EmailLink = <Link href="mailto: eug-vs@keemail.me">eug-vs@keemail.me</Link>
 
   const Reviews = (
     <div className={classes.reviews}>
@@ -75,6 +80,33 @@ const HomePage: React.FC = () => {
     </div>
   );
 
+  const FeedbackSection = feedbacks.findIndex((feedback: Feedback) => feedback.author._id === user?._id) >= 0 ? (
+    <p>
+      You have already left feedback for this version.
+      If you have more to say, please open GitHub issue or contact us directly via email: {EmailLink}.
+      Alternatively, you can just wait for another application patch to come out.
+    </p>
+  ) : (
+    <>
+      <p>
+        Here you can share your thougts about Which with us!
+        Note that you can ony leave feedback once per application version (there will be plenty of them later).
+      </p>
+      {isAuthenticated() ? <ReviewForm /> : (
+        <>
+          <p> You must be authorized to leave feedback.</p>
+          <Button
+            variant="outlined"
+            color="primary"
+            onClick={handleSignUp}
+          >
+            sign in
+          </Button>
+        </>
+      )}
+    </>
+  );
+
   return (
     <div className={classes.root}>
       <Grid container spacing={4}>
@@ -84,15 +116,17 @@ const HomePage: React.FC = () => {
               <img src={`${process.env.PUBLIC_URL}/which-logo-512.png`} alt="logo" className={classes.logo} />
             </Grid>
             <Grid item>
-              <Rating value={rating} readOnly size="large" />
+              {rating && <Rating value={rating} readOnly size="large" />}
             </Grid>
             <Grid item>
-              <Typography variant="h5" className={classes.score}>
-                User score: {rating.toFixed(1)}
-              </Typography>
+              {rating && (
+                <Typography variant="h5" className={classes.score}>
+                  User score: {rating.toFixed(1)}
+                </Typography>
+              )}
             </Grid>
           </Grid>
-          {Reviews}
+          {isMobile || Reviews}
         </Grid>
         <Grid item xs={12} md={5}>
           <Grid container direction="column" spacing={6}>
@@ -146,6 +180,18 @@ const HomePage: React.FC = () => {
                 </Button>
               </Typography>
             </Grid>
+            <Grid item>
+              <Typography variant="h4"> Leave feedback </Typography>
+              <Divider />
+              <Typography>
+                {FeedbackSection}
+              </Typography>
+            </Grid>
+            {isMobile && (
+              <Grid item>
+                {Reviews}
+              </Grid>
+            )}
           </Grid>
         </Grid>
       </Grid>
-- 
cgit v1.2.3


From 202f2ab4209a836e51a57081e5f78e255973c6f1 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 5 Jul 2020 12:22:38 +0300
Subject: style: fix eslint errors

---
 src/pages/HomePage/HomePage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

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

diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
index 7b04bff..5a33b42 100644
--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -72,7 +72,7 @@ const HomePage: React.FC = () => {
   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>;
-  const EmailLink = <Link href="mailto: eug-vs@keemail.me">eug-vs@keemail.me</Link>
+  const EmailLink = <Link href="mailto: eug-vs@keemail.me">eug-vs@keemail.me</Link>;
 
   const Reviews = (
     <div className={classes.reviews}>
-- 
cgit v1.2.3