From f4d8ee37400f25d4fec3638b1ba73e8661c30959 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sat, 21 Mar 2020 14:29:05 +0300 Subject: feat: add types.d.ts, migrate Scoreboard --- src/pages/Scoreboard/Scoreboard.js | 68 --------------------------------- src/pages/Scoreboard/Scoreboard.tsx | 76 +++++++++++++++++++++++++++++++++++++ 2 files changed, 76 insertions(+), 68 deletions(-) delete mode 100644 src/pages/Scoreboard/Scoreboard.js create mode 100644 src/pages/Scoreboard/Scoreboard.tsx (limited to 'src/pages/Scoreboard') diff --git a/src/pages/Scoreboard/Scoreboard.js b/src/pages/Scoreboard/Scoreboard.js deleted file mode 100644 index 47c0899..0000000 --- a/src/pages/Scoreboard/Scoreboard.js +++ /dev/null @@ -1,68 +0,0 @@ -import React, { useEffect, useState } from 'react'; - -import { makeStyles } from '@material-ui/core/styles'; - -import { Window, SmartList } from 'react-benzin'; - -import SolutionCard from '../../components/SolutionCard/SolutionCard'; -import Loading from '../../components/Loading/Loading'; - -import { get } from '../../requests'; - - -const useStyles = makeStyles(theme => ({ - cell: { - display: 'flex', - justifyContent: 'center', - padding: theme.spacing(4), - - '& .MuiCard-root': { - width: '30%', - } - } -})); - -const Scoreboard = () => { - const classes = useStyles(); - const [solutions, setSolutions] = useState([]); - - const updateSolutions = () => { - get('scoreboard/').then(response => { - setSolutions(response.data); - }); - }; - - const removeSolution = id => { - updateSolutions(); - }; - - useEffect(() => { - setTimeout(updateSolutions, 300); - }, []); - - const renderItem = ({ index, style }) => { - return ( -
- -
- ) - }; - - return ( - - { solutions.length === 0 && -
- -
- } - -
- ) -}; - - -export default Scoreboard; diff --git a/src/pages/Scoreboard/Scoreboard.tsx b/src/pages/Scoreboard/Scoreboard.tsx new file mode 100644 index 0000000..c6826d2 --- /dev/null +++ b/src/pages/Scoreboard/Scoreboard.tsx @@ -0,0 +1,76 @@ +import React, { useEffect, useState } from 'react'; + +import { makeStyles } from '@material-ui/core/styles'; + +import { Window, SmartList } from 'react-benzin'; +import { Solution } from '../../types'; + +import SolutionCard from '../../components/SolutionCard/SolutionCard'; +import Loading from '../../components/Loading/Loading'; + +import { get } from '../../requests'; + + +const useStyles = makeStyles(theme => ({ + cell: { + display: 'flex', + justifyContent: 'center', + padding: theme.spacing(4), + + '& .MuiCard-root': { + width: '30%', + } + } +})); + + +interface RenderPropTypes { + index: number; + style: React.CSSProperties; +} + + +const Scoreboard: React.FC = () => { + const classes = useStyles(); + const [solutions, setSolutions] = useState([]); + + const updateSolutions = () => { + get('scoreboard/').then(response => { + setSolutions(response.data); + }); + }; + + const removeSolution = (id: number) => { + updateSolutions(); + }; + + useEffect(() => { + setTimeout(updateSolutions, 300); + }, []); + + const renderItem: React.FC = ({ index, style }) => { + return ( +
+ +
+ ) + }; + + return ( + + { solutions.length === 0 && +
+ +
+ } + +
+ ) +}; + + +export default Scoreboard; -- cgit v1.2.3