diff options
Diffstat (limited to 'src/pages')
-rw-r--r-- | src/pages/Profile/Profile.tsx (renamed from src/pages/Profile/Profile.js) | 17 | ||||
-rw-r--r-- | src/pages/Profile/Registration.tsx (renamed from src/pages/Profile/Registration/Registration.js) | 19 | ||||
-rw-r--r-- | src/pages/Scoreboard/Scoreboard.tsx | 8 |
3 files changed, 25 insertions, 19 deletions
diff --git a/src/pages/Profile/Profile.js b/src/pages/Profile/Profile.tsx index 65c3734..bbf55f1 100644 --- a/src/pages/Profile/Profile.js +++ b/src/pages/Profile/Profile.tsx @@ -5,12 +5,13 @@ import { makeStyles, } from '@material-ui/core'; -import Registration from './Registration/Registration'; +import Registration from './Registration'; import { Window, ContentSection, SmartList, } from 'react-benzin'; +import { User, Solution, RenderPropTypes } from '../../types'; import SolutionCard from '../../components/SolutionCard/SolutionCard'; @@ -27,10 +28,16 @@ const useStyles = makeStyles(theme => ({ })); -const Profile = ({ user, setUser }) => { +interface PropTypes { + user: User; + setUser: (user: User) => void; +} + + +const Profile: React.FC<PropTypes> = ({ user, setUser }) => { const classes = useStyles(); - const [profileSolutions, setProfileSolutions] = useState([]); + const [profileSolutions, setProfileSolutions] = useState<Solution[]>([]); const handleLogout = () => { setUser({ username: 'anonymous', id: null }); @@ -43,11 +50,11 @@ const Profile = ({ user, setUser }) => { }); }, [user]); - const removeSolution = (id) => { + const removeSolution = (id: number): void => { setProfileSolutions(profileSolutions.filter((solution => solution.id !== id))); }; - const renderItem = ({ index, style }) => { + const renderItem: React.FC<RenderPropTypes> = ({ index, style }) => { return ( <div style={style} className={classes.cell}> <SolutionCard data={profileSolutions[index]} removeThisCard={removeSolution} /> diff --git a/src/pages/Profile/Registration/Registration.js b/src/pages/Profile/Registration.tsx index b2d5503..30e357d 100644 --- a/src/pages/Profile/Registration/Registration.js +++ b/src/pages/Profile/Registration.tsx @@ -7,21 +7,26 @@ import { FormControlLabel, Grid, } from '@material-ui/core'; +import { User } from '../../types'; import { ContentSection } from 'react-benzin'; -import { get, post } from '../../../requests'; +import { get, post } from '../../requests'; -const Registration = ({ setUser }) => { +interface PropTypes { + setUser: (user: User) => void; +} - const [username, setUsername] = useState(''); - const [isRememberMe, setIsRememberMe] = useState(false); +const Registration: React.FC<PropTypes> = ({ setUser }) => { - const handleChange = (event) => { + const [username, setUsername] = useState<string>(''); + const [isRememberMe, setIsRememberMe] = useState<boolean>(false); + + const handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => { setUsername(event.target.value); }; - const handleCheck = (event) => { + const handleCheck = (event: React.ChangeEvent<HTMLInputElement>): void => { setIsRememberMe(event.target.checked); }; @@ -37,7 +42,7 @@ const Registration = ({ setUser }) => { }) .catch(err => { get('users/').then(response => { - const user = response.data.filter(user => user.username === username)[0]; + const user = response.data.filter((user: User) => user.username === username)[0]; setUser(user); if (isRememberMe) { localStorage.setItem('userId', user.id); diff --git a/src/pages/Scoreboard/Scoreboard.tsx b/src/pages/Scoreboard/Scoreboard.tsx index 9b9ee01..e4185bd 100644 --- a/src/pages/Scoreboard/Scoreboard.tsx +++ b/src/pages/Scoreboard/Scoreboard.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react'; import { makeStyles } from '@material-ui/core/styles'; import { Window, SmartList } from 'react-benzin'; -import { Solution } from '../../types'; +import { Solution, RenderPropTypes } from '../../types'; import SolutionCard from '../../components/SolutionCard/SolutionCard'; import Loading from '../../components/Loading/Loading'; @@ -24,12 +24,6 @@ const useStyles = makeStyles(theme => ({ })); -interface RenderPropTypes { - index: number; - style: React.CSSProperties; -} - - const Scoreboard: React.FC = () => { const classes = useStyles(); const [solutions, setSolutions] = useState<Solution[]>([]); |