From 2f7a4bb3de4ff346a928f6887bc2fb4a5973977d Mon Sep 17 00:00:00 2001 From: eug-vs Date: Fri, 9 Oct 2020 02:12:36 +0300 Subject: feat: show latest release patchnotes on homepage --- src/containers/Home/Home.tsx | 45 ++++++++++++++++++-------------------------- src/hooks/APIClient.ts | 19 +++++++++++++++++++ 2 files changed, 37 insertions(+), 27 deletions(-) diff --git a/src/containers/Home/Home.tsx b/src/containers/Home/Home.tsx index 072e2fa..71b902b 100644 --- a/src/containers/Home/Home.tsx +++ b/src/containers/Home/Home.tsx @@ -9,7 +9,7 @@ import { useMediaQuery } from '@material-ui/core/'; import { makeStyles, useTheme } from '@material-ui/core/styles'; -import TrendingUpIcon from '@material-ui/icons/TrendingUp'; +import GitHubIcon from '@material-ui/icons/GitHub'; import { Rating } from '@material-ui/lab'; import { Feedback } from 'which-types'; @@ -17,7 +17,7 @@ import ReviewCard from '../../components/ReviewCard/ReviewCard'; import Image from '../../components/Image/Image'; import ReviewForm from './ReviewForm'; import { useAuth } from '../../hooks/useAuth'; -import { useFeedback } from '../../hooks/APIClient'; +import { useFeedback, usePatchNotes } from '../../hooks/APIClient'; const useStyles = makeStyles(theme => ({ root: { @@ -28,6 +28,9 @@ const useStyles = makeStyles(theme => ({ width: theme.spacing(20), height: theme.spacing(20) }, + patchNotes: { + whiteSpace: 'pre-wrap' + }, score: { fontWeight: 'bold' }, @@ -43,6 +46,7 @@ const useStyles = makeStyles(theme => ({ const Home: React.FC = () => { const { data: feedbacks } = useFeedback(); + const { data: release } = usePatchNotes(); const classes = useStyles(); const history = useHistory(); const { isAuthenticated, user } = useAuth(); @@ -62,11 +66,6 @@ const Home: React.FC = () => { history.push('/registration'); }; - const GithubLink = GitHub; - const TypescriptLink = Typescript; - const ReactLink = React; - const FeathersLink = Feathers; - const MUILink = Material-UI; const EmailLink = eug-vs@keemail.me; const Reviews = ( @@ -152,31 +151,23 @@ const Home: React.FC = () => { )} - - About the project - - -

- 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)! -

-

- We encourage any developer to check it out. Feel free to open issues and create Pull Requests! -

-

- All the development process is being tracked on the KanBan board (thanks GitHub). - You can always check it to see what is the current state of the project. -

+ {release && ( + + {`What's new in ${release?.version}?`} + + +

{release?.description}

+ - - + + )} Leave feedback diff --git a/src/hooks/APIClient.ts b/src/hooks/APIClient.ts index 68413b0..1d4110c 100644 --- a/src/hooks/APIClient.ts +++ b/src/hooks/APIClient.ts @@ -1,5 +1,6 @@ import useSWR, { responseInterface } from 'swr'; import { User, Poll, Feedback } from 'which-types'; +import axios from 'axios'; import { get } from '../requests'; type Response = responseInterface; @@ -24,3 +25,21 @@ export const useFeed = (): Response => { export const useFeedback = (): Response => { return useSWR('/feedback', fetcher); }; + +interface Release { + url: string; + description: string; + version: string; + name: string; +} + +export const usePatchNotes = (): Response => { + const fetchRelease = () => axios.get('https://api.github.com/repos/which-ecosystem/which/releases/latest') + .then(({ data }) => ({ + name: data.name, + url: data.html_url, + version: data.tag_name, + description: data.body + })); + return useSWR('/patchnotes', fetchRelease, { revalidateOnFocus: false }); +}; -- cgit v1.2.3 From fbb0a7fd921c4f2675147f0f8bc08a221b736a53 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Fri, 9 Oct 2020 03:08:16 +0300 Subject: feat!: remove whitesmoke background color --- src/containers/Page/Page.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/containers/Page/Page.tsx b/src/containers/Page/Page.tsx index 9a904a4..e60f7da 100644 --- a/src/containers/Page/Page.tsx +++ b/src/containers/Page/Page.tsx @@ -17,8 +17,7 @@ const useStyles = makeStyles(theme => ({ }, [theme.breakpoints.up('md')]: { padding: theme.spacing(15, 5, 8, 5) - }, - backgroundColor: 'whitesmoke' + } } })); -- cgit v1.2.3 From 6514ed55e3f608f468e103cacad547aed276b8bf Mon Sep 17 00:00:00 2001 From: eug-vs Date: Fri, 9 Oct 2020 03:26:42 +0300 Subject: feat: display version chip on ReviewCard --- src/components/ReviewCard/ReviewCard.tsx | 17 +++++++++++++++-- src/containers/Home/Home.tsx | 7 ++++--- src/containers/Home/ReviewForm.tsx | 7 +++++-- src/hooks/APIClient.ts | 2 +- 4 files changed, 25 insertions(+), 8 deletions(-) diff --git a/src/components/ReviewCard/ReviewCard.tsx b/src/components/ReviewCard/ReviewCard.tsx index 2016a5e..ccf051c 100644 --- a/src/components/ReviewCard/ReviewCard.tsx +++ b/src/components/ReviewCard/ReviewCard.tsx @@ -4,7 +4,8 @@ import { Card, CardContent, Typography, - Divider + Divider, + Chip } from '@material-ui/core/'; import { Rating } from '@material-ui/lab'; import { Feedback } from 'which-types'; @@ -17,7 +18,13 @@ interface PropTypes { const useStyles = makeStyles(theme => ({ root: { - margin: theme.spacing(4, 0, 1, 0) + margin: theme.spacing(4, 0, 1, 0), + position: 'relative' + }, + versionChip: { + position: 'absolute', + right: theme.spacing(2), + top: theme.spacing(2) } })); @@ -30,6 +37,12 @@ const ReviewCard: React.FC = ({ feedback }) => { user={feedback.author} info={} /> + {feedback.contents && ( <> diff --git a/src/containers/Home/Home.tsx b/src/containers/Home/Home.tsx index 71b902b..4fd2833 100644 --- a/src/containers/Home/Home.tsx +++ b/src/containers/Home/Home.tsx @@ -38,8 +38,9 @@ const useStyles = makeStyles(theme => ({ marginLeft: theme.spacing(2) }, reviews: { + margin: 'auto', [theme.breakpoints.up('md')]: { - padding: theme.spacing(0, 10) + width: '70%' } } })); @@ -75,7 +76,7 @@ const Home: React.FC = () => { ); const FeedbackSection = feedbacks && feedbacks.findIndex( - (feedback: Feedback) => feedback.author._id === user?._id + (feedback: Feedback) => (feedback.author._id === user?._id && feedback.version === release?.version) ) >= 0 ? (

You have already left feedback for this version. @@ -88,7 +89,7 @@ const Home: React.FC = () => { 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).

- {isAuthenticated ? : ( + {isAuthenticated ? : ( <>

You must be authorized to leave feedback.