From bff39941e2da37db8d971b2dc1b84bce8b1fbbc2 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Tue, 23 Jun 2020 13:27:28 +0300 Subject: feat: add auth headers to reqeusts --- src/requests.ts | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/requests.ts b/src/requests.ts index 486502d..6446baa 100644 --- a/src/requests.ts +++ b/src/requests.ts @@ -1,10 +1,12 @@ -import axios, { AxiosResponse } from 'axios'; +import axios from 'axios'; -type Request = (url: string, data?: Record) => Promise; +const requests = axios.create({ + baseURL: 'http://localhost:3030', + headers: { + 'Authorization': localStorage.getItem('token') + } +}); -const baseApiUrl = 'http://localhost:3030'; - -export const get: Request = url => axios.get(baseApiUrl + url); -export const del: Request = url => axios.delete(baseApiUrl + url); -export const post: Request = (url, data) => axios.post(baseApiUrl + url, data); +export const { get, post, put } = requests; +export default requests; -- cgit v1.2.3 From 8930046d41841cba6cf368076b86e26088807848 Mon Sep 17 00:00:00 2001 From: ilyayudovin Date: Tue, 23 Jun 2020 19:41:43 +0300 Subject: feat:add percentage line --- src/components/PollCard/PollCard.tsx | 51 +++++++++++++++++++++++++++--------- 1 file changed, 39 insertions(+), 12 deletions(-) diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index baf896f..190d001 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useState} from 'react'; import { makeStyles } from '@material-ui/core/styles'; import { Card, @@ -9,6 +9,8 @@ import { } from '@material-ui/core/'; import { Poll } from '../../types'; import PercentageBar from './PercentageBar'; +import {post} from '../../requests'; +import teal from "@material-ui/core/colors/teal"; interface PropTypes { poll: Poll; @@ -18,32 +20,56 @@ interface PropTypes { const useStyles = makeStyles(theme => ({ root: { maxWidth: theme.spacing(75), - height: theme.spacing(63), - margin: '20px auto' + height: 488, + margin: '40px auto', }, images: { height: theme.spacing(50), - width: theme.spacing(38) + width: 300 }, imagesBlock: { display: 'flex' }, avatar: { cursor: 'pointer' - } + }, + rateLine: { + position:'relative', + margin: '0 auto', + width: '100%', + height:16, + backgroundColor: teal[100] + }, + fillRateLine: { + height:16, + backgroundColor: teal[800], + transitionDuration: '0.5s' + }, })); - const PollCard: React.FC = ({ poll, navigate }) => { const classes = useStyles(); const { author, contents } = poll; + const [rate, setRate] = useState<{left: number, right: number}>({left: contents.left.votes,right: contents.right.votes}); const handleNavigate = () => { navigate('profile', poll.author._id); }; - const leftPercentage = Math.round(100 * (contents.left.votes / (contents.left.votes + contents.right.votes))); - const rightPercentage = 100 - leftPercentage; + const vote = (which: 'left' | 'right') => { + post(`polls/${ poll._id }/votes/`,{ which }).then((response)=>{ + console.log(response.data); + const leftV = response.data.contents.left.votes; + const rightV = response.data.contents.right.votes; + setRate({left: leftV, right: rightV}); + }) + .catch(error => { + console.log(error.response) + }); + }; + + const leftPercentage = Math.round(100 * (rate.left / (rate.left + rate.right))); + const rightPercentage = 100 - leftPercentage; return ( @@ -60,14 +86,14 @@ const PollCard: React.FC = ({ poll, navigate }) => { title={author.name} />
- + vote('left')}> - + vote('right')}> = ({ poll, navigate }) => {
+
+
+
); }; - export default PollCard; - -- cgit v1.2.3 From fbdaa40e7ce585b65038835c05a283cec6f28d0e Mon Sep 17 00:00:00 2001 From: eug-vs Date: Wed, 24 Jun 2020 00:52:26 +0300 Subject: chore: migrate to which-types@1.3.1 --- package-lock.json | 6 ++++++ package.json | 3 ++- src/components/Feed/Feed.tsx | 2 +- src/components/PollCard/PollCard.tsx | 9 +++++---- src/index.tsx | 7 ++++--- src/pages/AuthPage/SignUpForm.tsx | 9 ++++----- src/pages/FeedPage/FeedPage.tsx | 3 ++- src/pages/ProfilePage/ProfileInfo.tsx | 4 ++-- src/pages/ProfilePage/ProfilePage.tsx | 3 ++- src/types.d.ts | 19 ------------------- 10 files changed, 28 insertions(+), 37 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9b01055..dc8d8cd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14111,6 +14111,12 @@ "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz", "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=" }, + "which-types": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/which-types/-/which-types-1.3.1.tgz", + "integrity": "sha512-UU7+/FRfELIrUyZiTJkTDJ9dNxhW/ZVcWTjXn9TMtaqdIEDtu+NDFe13jZkFhlPVsVwwXa5R4n6MUa1iuLhAlg==", + "dev": true + }, "word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", diff --git a/package.json b/package.json index a8e1718..4584877 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "eslint-plugin-react": "^7.20.0", "eslint-plugin-react-hooks": "^2.5.1", "gh-pages": "^3.0.0", - "typescript": "^3.9.5" + "typescript": "^3.9.5", + "which-types": "^1.3.1" } } diff --git a/src/components/Feed/Feed.tsx b/src/components/Feed/Feed.tsx index 3b8e16f..c649935 100644 --- a/src/components/Feed/Feed.tsx +++ b/src/components/Feed/Feed.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; -import { Poll } from '../../types'; +import { Poll } from 'which-types'; import PollCard from '../PollCard/PollCard'; interface PropTypes { diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 190d001..9f89d9a 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -7,7 +7,8 @@ import { Avatar, CardHeader } from '@material-ui/core/'; -import { Poll } from '../../types'; +import { Which, Poll } from 'which-types'; + import PercentageBar from './PercentageBar'; import {post} from '../../requests'; import teal from "@material-ui/core/colors/teal"; @@ -56,7 +57,7 @@ const PollCard: React.FC = ({ poll, navigate }) => { navigate('profile', poll.author._id); }; - const vote = (which: 'left' | 'right') => { + const vote = (which: Which) => { post(`polls/${ poll._id }/votes/`,{ which }).then((response)=>{ console.log(response.data); const leftV = response.data.contents.left.votes; @@ -78,12 +79,12 @@ const PollCard: React.FC = ({ poll, navigate }) => { )} - title={author.name} + title={author.username} />
vote('left')}> diff --git a/src/index.tsx b/src/index.tsx index 1777e90..4e6779a 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -13,7 +13,8 @@ import Header from './components/Header/Header'; import ProfilePage from './pages/ProfilePage/ProfilePage'; import FeedPage from './pages/FeedPage/FeedPage'; import AuthPage from './pages/AuthPage/AuthPage'; -import { User, Page } from './types'; +import { Page } from './types'; +import { User } from 'which-types'; import { get, post } from './requests'; import ScrollTopArrow from './components/ScrollTopArrow/ScrollTopArrow'; @@ -53,10 +54,10 @@ const App: React.FC = () => { } }; - const logIn = (name: string, password: string): Promise => { + const logIn = (username: string, password: string): Promise => { return post('/authentication', { strategy: 'local', - name, + username, password }).then(response => { const me = response.data.user; diff --git a/src/pages/AuthPage/SignUpForm.tsx b/src/pages/AuthPage/SignUpForm.tsx index 2769eb0..0e3d0c7 100644 --- a/src/pages/AuthPage/SignUpForm.tsx +++ b/src/pages/AuthPage/SignUpForm.tsx @@ -31,12 +31,11 @@ const SignUpForm: React.FC = ({ logIn }) => { const inputRefPassword = useRef(); const onClick = () => { - const name = inputRef.current?.value; + const username = inputRef.current?.value; const password = inputRefPassword.current?.value; - const newUser = { name, password }; - if (name && password) { - post('/users', newUser).then(() => { - logIn(name, password); + if (username && password) { + post('/users', { username, password }).then(() => { + logIn(username, password); }); } }; diff --git a/src/pages/FeedPage/FeedPage.tsx b/src/pages/FeedPage/FeedPage.tsx index fd75190..937b0a9 100644 --- a/src/pages/FeedPage/FeedPage.tsx +++ b/src/pages/FeedPage/FeedPage.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; -import { Poll } from '../../types'; +import { Poll } from 'which-types'; + import Feed from '../../components/Feed/Feed'; import { get } from '../../requests'; diff --git a/src/pages/ProfilePage/ProfileInfo.tsx b/src/pages/ProfilePage/ProfileInfo.tsx index bddecd8..7208ec8 100644 --- a/src/pages/ProfilePage/ProfileInfo.tsx +++ b/src/pages/ProfilePage/ProfileInfo.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Avatar } from '@material-ui/core/'; import { makeStyles } from '@material-ui/core/styles'; import Button from '@material-ui/core/Button/Button'; -import { User } from '../../types'; +import { User } from 'which-types'; interface PropTypes { user: User | undefined; @@ -41,7 +41,7 @@ const ProfileInfo: React.FC = ({ user, logOut }) => {
- {user?.name} + {user?.username}
diff --git a/src/pages/ProfilePage/ProfilePage.tsx b/src/pages/ProfilePage/ProfilePage.tsx index 0f5fb2b..363d4ff 100644 --- a/src/pages/ProfilePage/ProfilePage.tsx +++ b/src/pages/ProfilePage/ProfilePage.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; -import { User, Poll } from '../../types'; +import { User, Poll } from 'which-types'; + import ProfileInfo from './ProfileInfo'; import Feed from '../../components/Feed/Feed'; import { get } from '../../requests'; diff --git a/src/types.d.ts b/src/types.d.ts index a62eec8..73346ce 100644 --- a/src/types.d.ts +++ b/src/types.d.ts @@ -2,23 +2,4 @@ export interface Page { prefix: string; id: string; } -export interface User { - name: string; - avatarUrl: string; - _id: string; -} - -interface ImageData { - url: string; - votes: number; -} - -export interface Poll { - _id: string; - author: User; - contents: { - left: ImageData; - right: ImageData; - }; -} -- cgit v1.2.3 From cf3b9a1002d1971e5b867225baaca5f46039991b Mon Sep 17 00:00:00 2001 From: eug-vs Date: Wed, 24 Jun 2020 01:03:34 +0300 Subject: refactor: use theme in styles --- src/components/PollCard/PollCard.tsx | 11 +++++------ src/index.tsx | 3 ++- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 9f89d9a..27f2203 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -10,8 +10,7 @@ import { import { Which, Poll } from 'which-types'; import PercentageBar from './PercentageBar'; -import {post} from '../../requests'; -import teal from "@material-ui/core/colors/teal"; +import { post } from '../../requests'; interface PropTypes { poll: Poll; @@ -38,12 +37,12 @@ const useStyles = makeStyles(theme => ({ position:'relative', margin: '0 auto', width: '100%', - height:16, - backgroundColor: teal[100] + height: theme.spacing(2), + backgroundColor: theme.palette.primary.light }, fillRateLine: { - height:16, - backgroundColor: teal[800], + height: theme.spacing(2), + backgroundColor: theme.palette.primary.main, transitionDuration: '0.5s' }, })); diff --git a/src/index.tsx b/src/index.tsx index 4e6779a..2b7c689 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -22,7 +22,8 @@ import ScrollTopArrow from './components/ScrollTopArrow/ScrollTopArrow'; const theme = createMuiTheme({ palette: { primary: { - main: teal[700] + main: teal[700], + light: teal[100] } } }); -- cgit v1.2.3 From 0204f48a00543ea876efc83260f244f7c14d8a82 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Jun 2020 13:40:03 +0300 Subject: fix: listen to token changes in requests --- src/requests.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/requests.ts b/src/requests.ts index 6446baa..fa84c4a 100644 --- a/src/requests.ts +++ b/src/requests.ts @@ -2,9 +2,11 @@ import axios from 'axios'; const requests = axios.create({ baseURL: 'http://localhost:3030', - headers: { - 'Authorization': localStorage.getItem('token') - } +}); + +requests.interceptors.request.use(config => { + config.headers.Authorization = localStorage.getItem('token'); + return config; }); export const { get, post, put } = requests; -- cgit v1.2.3 From 3e92c59a0a79646f77a6f882d3543ecde7cb2dc8 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Jun 2020 13:52:03 +0300 Subject: feat: use latest API --- package-lock.json | 6 ++--- package.json | 2 +- src/components/Feed/Feed.tsx | 2 +- src/components/PollCard/PercentageBar.tsx | 12 ++++++--- src/components/PollCard/PollCard.tsx | 42 ++++++++++++++++--------------- 5 files changed, 35 insertions(+), 29 deletions(-) diff --git a/package-lock.json b/package-lock.json index dc8d8cd..572165e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14112,9 +14112,9 @@ "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=" }, "which-types": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/which-types/-/which-types-1.3.1.tgz", - "integrity": "sha512-UU7+/FRfELIrUyZiTJkTDJ9dNxhW/ZVcWTjXn9TMtaqdIEDtu+NDFe13jZkFhlPVsVwwXa5R4n6MUa1iuLhAlg==", + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/which-types/-/which-types-1.4.1.tgz", + "integrity": "sha512-ZtN3cDwz/fQbJBwrItsZ0jpGafReTd/fIffHNQtFW4THrZqi8z4qnFTbyu1M6LnAmPlwU/FaRLZPfd67ZQ4mFw==", "dev": true }, "word-wrap": { diff --git a/package.json b/package.json index 4584877..22e3488 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,6 @@ "eslint-plugin-react-hooks": "^2.5.1", "gh-pages": "^3.0.0", "typescript": "^3.9.5", - "which-types": "^1.3.1" + "which-types": "^1.4.1" } } diff --git a/src/components/Feed/Feed.tsx b/src/components/Feed/Feed.tsx index c649935..d81da99 100644 --- a/src/components/Feed/Feed.tsx +++ b/src/components/Feed/Feed.tsx @@ -21,7 +21,7 @@ const Feed: React.FC = ({ polls, navigate }) => { return (
- {polls.map(poll => )} + {polls.map(poll => )}
); }; diff --git a/src/components/PollCard/PercentageBar.tsx b/src/components/PollCard/PercentageBar.tsx index 6a50a9e..a93d7b4 100644 --- a/src/components/PollCard/PercentageBar.tsx +++ b/src/components/PollCard/PercentageBar.tsx @@ -1,9 +1,11 @@ import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; +import LikeIcon from '@material-ui/icons/Favorite'; interface PropTypes { value: number; which: 'left' | 'right'; + like: boolean; } const useStyles = makeStyles({ @@ -12,7 +14,9 @@ const useStyles = makeStyles({ color: 'white', top: '86%', fontSize: 20, - textShadow: '0 0 3px black' + textShadow: '0 0 3px black', + display: 'flex', + alignItems: 'center' }, left: { left: 30 @@ -22,13 +26,13 @@ const useStyles = makeStyles({ } }); -const PercentageBar: React.FC = ({ value, which }) => { +const PercentageBar: React.FC = ({ value, which, like }) => { const classes = useStyles(); return (
- {value} - % + {like && } + {`${value}%`}
); }; diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 27f2203..82d94e9 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -13,7 +13,7 @@ import PercentageBar from './PercentageBar'; import { post } from '../../requests'; interface PropTypes { - poll: Poll; + initialPoll: Poll; navigate: (prefix: string, id: string) => void; } @@ -44,32 +44,34 @@ const useStyles = makeStyles(theme => ({ height: theme.spacing(2), backgroundColor: theme.palette.primary.main, transitionDuration: '0.5s' - }, + } })); -const PollCard: React.FC = ({ poll, navigate }) => { +const PollCard: React.FC = ({ initialPoll, navigate }) => { + const [poll, setPoll] = useState(initialPoll); const classes = useStyles(); - const { author, contents } = poll; - const [rate, setRate] = useState<{left: number, right: number}>({left: contents.left.votes,right: contents.right.votes}); + const { author, contents: { left, right }, userChoice } = poll; const handleNavigate = () => { navigate('profile', poll.author._id); }; const vote = (which: Which) => { - post(`polls/${ poll._id }/votes/`,{ which }).then((response)=>{ - console.log(response.data); - const leftV = response.data.contents.left.votes; - const rightV = response.data.contents.right.votes; - setRate({left: leftV, right: rightV}); - }) - .catch(error => { + if (userChoice) return; + post('votes/', { which, pollId: poll._id }).then(() => { + poll.contents[which].votes += 1; + poll.userChoice = which; + setPoll({ ...poll}); + }).catch(error => { console.log(error.response) }); }; + + const handleLeft = () => vote('left'); + const handleRight = () => vote('right'); - const leftPercentage = Math.round(100 * (rate.left / (rate.left + rate.right))); - const rightPercentage = 100 - leftPercentage; + const leftPercentage = Math.round(100 * (left.votes / (left.votes + right.votes))); + const rightPercentage = 100 - leftPercentage; return ( @@ -86,19 +88,19 @@ const PollCard: React.FC = ({ poll, navigate }) => { title={author.username} />
- vote('left')}> + - + - vote('right')}> + - +
-- cgit v1.2.3 From 6212b5ef0e2ae1f2c2334bc003ead1d4fd0b1fe4 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Jun 2020 14:14:44 +0300 Subject: style: fix linting errors --- package-lock.json | 9 +++++++-- package.json | 8 +++++--- src/components/PollCard/PollCard.tsx | 18 ++++++++---------- src/index.tsx | 2 +- src/requests.ts | 7 ++++--- 5 files changed, 25 insertions(+), 19 deletions(-) diff --git a/package-lock.json b/package-lock.json index 572165e..f9311e4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1629,6 +1629,12 @@ "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.4.tgz", "integrity": "sha512-8+KAKzEvSUdeo+kmqnKrqgeE+LcA0tjYWFY7RPProVYwnqDjukzO+3b6dLD56rYX5TdWejnEOLJYOIeh4CXKuA==" }, + "@types/lodash": { + "version": "4.14.157", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.157.tgz", + "integrity": "sha512-Ft5BNFmv2pHDgxV5JDsndOWTRJ+56zte0ZpYLowp03tW+K+t8u8YMOzAnpuqPgzX6WO1XpDIUm7u04M8vdDiVQ==", + "dev": true + }, "@types/minimatch": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz", @@ -14114,8 +14120,7 @@ "which-types": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/which-types/-/which-types-1.4.1.tgz", - "integrity": "sha512-ZtN3cDwz/fQbJBwrItsZ0jpGafReTd/fIffHNQtFW4THrZqi8z4qnFTbyu1M6LnAmPlwU/FaRLZPfd67ZQ4mFw==", - "dev": true + "integrity": "sha512-ZtN3cDwz/fQbJBwrItsZ0jpGafReTd/fIffHNQtFW4THrZqi8z4qnFTbyu1M6LnAmPlwU/FaRLZPfd67ZQ4mFw==" }, "word-wrap": { "version": "1.2.3", diff --git a/package.json b/package.json index 22e3488..98f44df 100644 --- a/package.json +++ b/package.json @@ -6,11 +6,13 @@ "@material-ui/core": "^4.10.1", "@material-ui/icons": "^4.9.1", "axios": "^0.19.2", + "lodash": "^4.17.15", "react": "^16.13.1", "react-dom": "^16.13.1", "react-icons": "^3.10.0", "react-scripts": "3.4.1", - "typeface-roboto": "0.0.75" + "typeface-roboto": "0.0.75", + "which-types": "^1.4.1" }, "scripts": { "start": "react-scripts start", @@ -32,6 +34,7 @@ ] }, "devDependencies": { + "@types/lodash": "^4.14.157", "@types/node": "^12.12.44", "@types/react": "^16.9.35", "@types/react-dom": "^16.9.8", @@ -45,7 +48,6 @@ "eslint-plugin-react": "^7.20.0", "eslint-plugin-react-hooks": "^2.5.1", "gh-pages": "^3.0.0", - "typescript": "^3.9.5", - "which-types": "^1.4.1" + "typescript": "^3.9.5" } } diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 82d94e9..06d33d5 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -1,4 +1,4 @@ -import React, {useState} from 'react'; +import React, { useState } from 'react'; import { makeStyles } from '@material-ui/core/styles'; import { Card, @@ -21,7 +21,7 @@ const useStyles = makeStyles(theme => ({ root: { maxWidth: theme.spacing(75), height: 488, - margin: '40px auto', + margin: '40px auto' }, images: { height: theme.spacing(50), @@ -34,7 +34,7 @@ const useStyles = makeStyles(theme => ({ cursor: 'pointer' }, rateLine: { - position:'relative', + position: 'relative', margin: '0 auto', width: '100%', height: theme.spacing(2), @@ -61,12 +61,10 @@ const PollCard: React.FC = ({ initialPoll, navigate }) => { post('votes/', { which, pollId: poll._id }).then(() => { poll.contents[which].votes += 1; poll.userChoice = which; - setPoll({ ...poll}); - }).catch(error => { - console.log(error.response) + setPoll({ ...poll }); }); }; - + const handleLeft = () => vote('left'); const handleRight = () => vote('right'); @@ -93,18 +91,18 @@ const PollCard: React.FC = ({ initialPoll, navigate }) => { className={classes.images} image={left.url} /> - + - +
-
+
); diff --git a/src/index.tsx b/src/index.tsx index 2b7c689..50b19f7 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -9,12 +9,12 @@ import { CssBaseline } from '@material-ui/core'; import teal from '@material-ui/core/colors/teal'; import 'typeface-roboto'; +import { User } from 'which-types'; import Header from './components/Header/Header'; import ProfilePage from './pages/ProfilePage/ProfilePage'; import FeedPage from './pages/FeedPage/FeedPage'; import AuthPage from './pages/AuthPage/AuthPage'; import { Page } from './types'; -import { User } from 'which-types'; import { get, post } from './requests'; import ScrollTopArrow from './components/ScrollTopArrow/ScrollTopArrow'; diff --git a/src/requests.ts b/src/requests.ts index fa84c4a..4cfd37b 100644 --- a/src/requests.ts +++ b/src/requests.ts @@ -1,12 +1,13 @@ import axios from 'axios'; +import _ from 'lodash'; const requests = axios.create({ - baseURL: 'http://localhost:3030', + baseURL: 'http://localhost:3030' }); requests.interceptors.request.use(config => { - config.headers.Authorization = localStorage.getItem('token'); - return config; + const token = localStorage.getItem('token'); + return _.set(config, 'headers.Authorization', token); }); export const { get, post, put } = requests; -- cgit v1.2.3 From 1a7e205b615c4ba51aeb79a7c75cfc77290ba063 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Jun 2020 14:38:23 +0300 Subject: feat: highlight rateline correctly --- src/components/PollCard/PollCard.tsx | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 06d33d5..6b5f456 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -8,6 +8,7 @@ import { CardHeader } from '@material-ui/core/'; import { Which, Poll } from 'which-types'; +import _ from 'lodash'; import PercentageBar from './PercentageBar'; import { post } from '../../requests'; @@ -35,7 +36,6 @@ const useStyles = makeStyles(theme => ({ }, rateLine: { position: 'relative', - margin: '0 auto', width: '100%', height: theme.spacing(2), backgroundColor: theme.palette.primary.light @@ -69,7 +69,12 @@ const PollCard: React.FC = ({ initialPoll, navigate }) => { const handleRight = () => vote('right'); const leftPercentage = Math.round(100 * (left.votes / (left.votes + right.votes))); - const rightPercentage = 100 - leftPercentage; + + const percentage = { + left: leftPercentage, + right: 100 - leftPercentage + }; + const dominant: Which = left.votes >= right.votes ? 'left' : 'right'; return ( @@ -91,18 +96,24 @@ const PollCard: React.FC = ({ initialPoll, navigate }) => { className={classes.images} image={left.url} /> - + - +
-
+
); -- cgit v1.2.3 From a3afe917442fb29627aa9deade1baefbea9a60c5 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Jun 2020 14:39:51 +0300 Subject: fix: remove unused lodash --- src/components/PollCard/PollCard.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx index 6b5f456..40f5fd7 100644 --- a/src/components/PollCard/PollCard.tsx +++ b/src/components/PollCard/PollCard.tsx @@ -8,7 +8,6 @@ import { CardHeader } from '@material-ui/core/'; import { Which, Poll } from 'which-types'; -import _ from 'lodash'; import PercentageBar from './PercentageBar'; import { post } from '../../requests'; -- cgit v1.2.3