s444498/gonito-frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

apply eslint

Browse Source
This commit is contained in:
mattyl006 2022-07-29 10:23:07 +02:00
parent 32b1b48eac
commit 294d9f1579
45 changed files with 381 additions and 343 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
.eslintrc.json Normal file
View File

@ -0,0 +1,24 @@
{
"extends": [
"react-app",
"eslint:recommended"
],
"rules": {
"semi": [
"error",
"always"
],
"no-extra-semi": [
"error"
],
"eqeqeq": [
"error",
"always"
],
"quotes": [
2,
"single",
"avoid-escape"
]
}
}

6
.idea/inspectionProfiles/Project_Default.xml Normal file
View File

@ -0,0 +1,6 @@
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
</profile>
</component>

6
.idea/jsLinters/eslint.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="EslintConfiguration">
<option name="fix-on-save" value="true" />
</component>
</project>

1
package-lock.json generated
View File

@ -12,6 +12,7 @@
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"markdown": "^0.5.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-media": "^1.10.0",

1
package.json
View File

@ -7,6 +7,7 @@
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"markdown": "^0.5.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-media": "^1.10.0",

18
src/App.js
View File

@ -1,12 +1,12 @@
import {ThemeProvider} from 'styled-components';
import theme from "./utils/theme";
import LandingPage from "./pages/LandingPage";
import Challenges from "./pages/Challanges/Challenges";
import {BrowserRouter, Route, Routes} from "react-router-dom";
import NavBar from "./components/elements/NavBar";
import Footer from "./components/sections/Footer";
import {CHALLENGE_PAGE, CHALLENGES_PAGE} from "./utils/globals";
import Challenge from "./pages/Challenge";
import theme from './utils/theme';
import LandingPage from './pages/LandingPage';
import Challenges from './pages/Challanges/Challenges';
import {BrowserRouter, Route, Routes} from 'react-router-dom';
import NavBar from './components/elements/NavBar';
import Footer from './components/sections/Footer';
import {CHALLENGE_PAGE, CHALLENGES_PAGE} from './utils/globals';
import Challenge from './pages/Challenge';
const App = () => {
return (
@ -23,6 +23,6 @@ const App = () => {
</ThemeProvider>
</BrowserRouter>
);
}
};
export default App;

10
src/components/elements/Button.js
View File

@ -1,7 +1,7 @@
import React from "react";
import styled from "styled-components";
import {Medium} from "../../utils/fonts";
import PropsTypes from "prop-types";
import React from 'react';
import styled from 'styled-components';
import {Medium} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const ButtonStyle = styled(Medium)`
display: flex;
@ -28,7 +28,7 @@ const Button = (props) => {
{props.children}
</ButtonStyle>
);
}
};
Button.propTypes = {
handler: PropsTypes.func,

10
src/components/elements/ButtonLink.js
View File

@ -1,7 +1,7 @@
import React from "react";
import styled from "styled-components";
import {Label} from "../../utils/fonts";
import PropsTypes from "prop-types";
import React from 'react';
import styled from 'styled-components';
import {Label} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const ButtonLinkStyle = styled(Label)`
background-color: ${({theme}) => theme.colors.green};
@ -32,7 +32,7 @@ const ButtonLink = (props) => {
{props.children}
</ButtonLinkStyle>
);
}
};
ButtonLink.propTypes = {
children: PropsTypes.node,

12
src/components/elements/CircleNumber.js
View File

@ -1,7 +1,7 @@
import React from "react";
import {Container} from "../../utils/containers";
import styled from "styled-components";
import PropsTypes from "prop-types";
import React from 'react';
import {Container} from '../../utils/containers';
import styled from 'styled-components';
import PropsTypes from 'prop-types';
const CircleNumberStyle = styled(Container)`
border-radius: 50%;
@ -21,7 +21,7 @@ const CircleNumberStyle = styled(Container)`
height: 36px;
font-size: 22px;
}
`
`;
const CircleNumber = (props) => {
return (
@ -29,7 +29,7 @@ const CircleNumber = (props) => {
{props.number}
</CircleNumberStyle>
);
}
};
CircleNumber.propTypes = {
number: PropsTypes.number,

16
src/components/elements/DesktopChallengeMenu.js
View File

@ -1,8 +1,8 @@
import React from "react";
import styled from "styled-components";
import {FlexColumn} from "../../utils/containers";
import {H3} from "../../utils/fonts";
import PropsTypes from "prop-types";
import React from 'react';
import styled from 'styled-components';
import {FlexColumn} from '../../utils/containers';
import {H3} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const DesktopChallengeMenuStyle = styled(FlexColumn)`
justify-content: flex-start;
@ -47,11 +47,11 @@ const DesktopChallengeMenu = (props) => {
{option}
</H3>
</Option>
)
);
})}
</DesktopChallengeMenuStyle>
);
}
};
DesktopChallengeMenu.propTypes = {
section: PropsTypes.number,
@ -61,6 +61,6 @@ DesktopChallengeMenu.propTypes = {
DesktopChallengeMenu.defaultProps = {
section: 0,
setSection: null,
}
};
export default DesktopChallengeMenu;

12
src/components/elements/Filter.js
View File

@ -1,7 +1,7 @@
import React from "react";
import styled from "styled-components";
import {FlexRow} from "../../utils/containers";
import PropsTypes from "prop-types";
import React from 'react';
import styled from 'styled-components';
import {FlexRow} from '../../utils/containers';
import PropsTypes from 'prop-types';
const FilterStyle = styled(FlexRow)`
width: fit-content;
@ -35,7 +35,7 @@ const Filter = (props) => {
const onCheckHandler = (e) => {
if (e.target.checked)
props.handler(Number(e.target.value));
}
};
return (
<>
@ -61,6 +61,6 @@ Filter.propTypes = {
Filter.defaultProps = {
handler: null,
children: '',
}
};
export default Filter;

22
src/components/elements/FiltersMenu/FiltersMenu.js
View File

@ -1,12 +1,12 @@
import React from "react";
import {FlexColumn, FlexRow, TransBack} from "../../../utils/containers";
import Button from "../Button";
import theme from "../../../utils/theme";
import styled from "styled-components";
import FilterBy from "../../sections/FilterBy";
import filterOptions from "./filterOptions";
import Media from "react-media";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexColumn, FlexRow, TransBack} from '../../../utils/containers';
import Button from '../Button';
import theme from '../../../utils/theme';
import styled from 'styled-components';
import FilterBy from '../../sections/FilterBy';
import filterOptions from './filterOptions';
import Media from 'react-media';
import PropsTypes from 'prop-types';
const FiltersMenuStyle = styled(FlexColumn)`
position: fixed;
@ -45,7 +45,7 @@ const FiltersMenu = (props) => {
props.statusHandler(0);
props.challengeTypeHandler(0);
props.commercialHandler(0);
}
};
return (
<>
@ -81,7 +81,7 @@ const FiltersMenu = (props) => {
</FiltersMenuStyle>
</>
);
}
};
FiltersMenu.propTypes = {
translateX: PropsTypes.string,

16
src/components/elements/IconLabel.js
View File

@ -1,9 +1,9 @@
import React from "react";
import {FlexRow, Svg} from "../../utils/containers";
import {Body, Medium} from "../../utils/fonts";
import styled from "styled-components";
import {RENDER_DEADLINE_TIME, RENDER_ICO} from "../../utils/globals";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexRow, Svg} from '../../utils/containers';
import {Body, Medium} from '../../utils/fonts';
import styled from 'styled-components';
import {RENDER_DEADLINE_TIME, RENDER_ICO} from '../../utils/globals';
import PropsTypes from 'prop-types';
const HoverLabel = styled(Body)`
position: absolute;
@ -45,7 +45,7 @@ const renderHoverLabel = (type, time) => {
default:
return '';
}
}
};
const IconLabelStyle = styled(FlexRow)`
position: relative;
@ -55,7 +55,7 @@ const IconLabelStyle = styled(FlexRow)`
display: flex;
}
}
`
`;
const IconLabel = (props) => {
return (

10
src/components/elements/InfoItem.js
View File

@ -1,8 +1,8 @@
import React from "react";
import {FlexRow, Svg} from "../../utils/containers";
import theme from "../../utils/theme";
import {Medium} from "../../utils/fonts";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexRow, Svg} from '../../utils/containers';
import theme from '../../utils/theme';
import {Medium} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const InfoItem = (props) => {
return (

30
src/components/elements/InfoList.js
View File

@ -1,16 +1,16 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import InfoItem from "./InfoItem";
import textIco from "../../assets/text_ico.svg";
import metricIco from "../../assets/metric_ico.svg";
import bestScoreIco from "../../assets/cup_ico.svg";
import baselineIco from "../../assets/baseline_ico.svg";
import timeIco from "../../assets/clock_ico.svg";
import {RENDER_DEADLINE_TIME} from "../../utils/globals";
import coinsIco from "../../assets/coins_ico.svg";
import Media from "react-media";
import theme from "../../utils/theme";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import InfoItem from './InfoItem';
import textIco from '../../assets/text_ico.svg';
import metricIco from '../../assets/metric_ico.svg';
import bestScoreIco from '../../assets/cup_ico.svg';
import baselineIco from '../../assets/baseline_ico.svg';
import timeIco from '../../assets/clock_ico.svg';
import {RENDER_DEADLINE_TIME} from '../../utils/globals';
import coinsIco from '../../assets/coins_ico.svg';
import Media from 'react-media';
import theme from '../../utils/theme';
import PropsTypes from 'prop-types';
const InfoList = (props) => {
const itemsRender = (gap, iconsSize) => {
@ -36,7 +36,7 @@ const InfoList = (props) => {
</InfoItem>
</>
);
}
};
return (
<>
@ -53,7 +53,7 @@ const InfoList = (props) => {
</Media>
</>
);
}
};
InfoList.propTypes = {
iconsSize: PropsTypes.string,

10
src/components/elements/Loading.js
View File

@ -1,7 +1,7 @@
import React from "react";
import styled, {keyframes} from "styled-components";
import {Container} from "../../utils/containers";
import PropsTypes from "prop-types";
import React from 'react';
import styled, {keyframes} from 'styled-components';
import {Container} from '../../utils/containers';
import PropsTypes from 'prop-types';
const rotate = keyframes`
from {
@ -54,6 +54,6 @@ Loading.propTypes = {
Loading.defaultProps = {
visible: true,
}
};
export default Loading;

10
src/components/elements/Logo.js
View File

@ -1,8 +1,8 @@
import React from "react";
import {H1} from "../../utils/fonts";
import theme from "../../utils/theme";
import {Link} from "react-router-dom";
import styled from "styled-components";
import React from 'react';
import {H1} from '../../utils/fonts';
import theme from '../../utils/theme';
import {Link} from 'react-router-dom';
import styled from 'styled-components';
const LogoStyle = styled(H1)`
font-size: 24px;

10
src/components/elements/MobileChallengeMenu.js
View File

@ -1,8 +1,8 @@
import React from "react";
import {FlexRow} from "../../utils/containers";
import styled from "styled-components";
import {Medium} from "../../utils/fonts";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexRow} from '../../utils/containers';
import styled from 'styled-components';
import {Medium} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const MenuOption = styled(Medium)`
cursor: pointer;

16
src/components/elements/MobileNavMenu.js
View File

@ -1,13 +1,13 @@
import React from "react";
import {FlexColumn, FlexRow, Svg, TransBack} from "../../utils/containers";
import {Menu} from "../../utils/fonts";
import React from 'react';
import {FlexColumn, FlexRow, Svg, TransBack} from '../../utils/containers';
import {Menu} from '../../utils/fonts';
import loginIco from '../../assets/login_ico.svg';
import registerIco from '../../assets/register_ico.svg';
import cupIco from '../../assets/cup_ico.svg';
import styled from "styled-components";
import {Link} from "react-router-dom";
import {CHALLENGES_PAGE} from "../../utils/globals";
import PropsTypes from "prop-types";
import styled from 'styled-components';
import {Link} from 'react-router-dom';
import {CHALLENGES_PAGE} from '../../utils/globals';
import PropsTypes from 'prop-types';
const MobileNavMenuStyle = styled(FlexColumn)`
gap: 32px;
@ -72,7 +72,7 @@ const MobileNavMenu = (props) => {
</MobileNavMenuStyle>
</TransBack>
);
}
};
MobileNavMenu.propTypes = {
translateY: PropsTypes.string,

28
src/components/elements/NavBar/NavBar.js
View File

@ -1,16 +1,16 @@
import React from "react";
import {Container, FlexRow, Svg} from "../../../utils/containers";
import Logo from "../Logo";
import styled from "styled-components";
import React from 'react';
import {Container, FlexRow, Svg} from '../../../utils/containers';
import Logo from '../Logo';
import styled from 'styled-components';
import menuButtonIcon from '../../../assets/menu-button.svg';
import MobileNavMenu from "../MobileNavMenu";
import {Link} from "react-router-dom";
import loginIco from "../../../assets/login_ico.svg";
import {Menu} from "../../../utils/fonts";
import registerIco from "../../../assets/register_ico.svg";
import {CHALLENGES_PAGE} from "../../../utils/globals";
import cupIco from "../../../assets/cup_ico.svg";
import NavBarStyle from "./NavBarStyle";
import MobileNavMenu from '../MobileNavMenu';
import {Link} from 'react-router-dom';
import loginIco from '../../../assets/login_ico.svg';
import {Menu} from '../../../utils/fonts';
import registerIco from '../../../assets/register_ico.svg';
import {CHALLENGES_PAGE} from '../../../utils/globals';
import cupIco from '../../../assets/cup_ico.svg';
import NavBarStyle from './NavBarStyle';
const MenuButton = styled(Container)`
width: 20px;
@ -35,7 +35,7 @@ const NavBar = () => {
setNavMenuTranslateY('0');
else
setNavMenuTranslateY('calc(-100vh - 42px)');
}
};
return (
<NavBarStyle as='header'>
@ -66,6 +66,6 @@ const NavBar = () => {
<MobileNavMenu translateY={navMenuTranslateY} toggleNavMenu={toggleNavMenu}/>
</NavBarStyle>
);
}
};
export default NavBar;

2
src/components/elements/NavBar/NavBarStyle.js
View File

@ -1,5 +1,5 @@
import styled from 'styled-components';
import {Container} from "../../../utils/containers";
import {Container} from '../../../utils/containers';
const NavBarStyle = styled(Container)`
position: fixed;

14
src/components/elements/Pager.js
View File

@ -1,10 +1,10 @@
import React from "react";
import {FlexRow, Svg} from "../../utils/containers";
import CircleNumber from "./CircleNumber";
import React from 'react';
import {FlexRow, Svg} from '../../utils/containers';
import CircleNumber from './CircleNumber';
import polygon from '../../assets/polygon.svg';
import styled from "styled-components";
import theme from "../../utils/theme";
import PropsTypes from "prop-types";
import styled from 'styled-components';
import theme from '../../utils/theme';
import PropsTypes from 'prop-types';
const PagerStyle = styled(FlexRow)`
gap: 14px;
@ -63,7 +63,7 @@ const Pager = (props) => {
);
}
return '';
}
};
Pager.propTypes = {
visible: PropsTypes.bool,

8
src/components/elements/Placeholder.js
View File

@ -1,7 +1,7 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import theme from "../../utils/theme";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import theme from '../../utils/theme';
import PropsTypes from 'prop-types';
const Placeholder = (props) => {
return (

10
src/components/elements/Search.js
View File

@ -1,10 +1,10 @@
import React from "react";
import {FlexRow, Svg} from "../../utils/containers";
import React from 'react';
import {FlexRow, Svg} from '../../utils/containers';
import loopIco from '../../assets/loop_ico.svg';
import filtersIco from '../../assets/filters_ico.svg';
import styled from "styled-components";
import {Body} from "../../utils/fonts";
import PropsTypes from "prop-types";
import styled from 'styled-components';
import {Body} from '../../utils/fonts';
import PropsTypes from 'prop-types';
const SearchStyle = styled(FlexRow)`
width: 100%;

42
src/components/elements/Table/Table.js
View File

@ -1,14 +1,14 @@
import React from "react";
import {FlexColumn, FlexRow, Grid} from "../../../utils/containers";
import getChallengeSubmissions from "../../../api/getChallengeSubmissions";
import {H3, Medium} from "../../../utils/fonts";
import _renderSubmissions from "./_renderSubmissions";
import Pager from "../Pager";
import {CALC_PAGES} from "../../../utils/globals";
import Media from "react-media";
import theme from "../../../utils/theme";
import Loading from "../Loading";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexColumn, FlexRow, Grid} from '../../../utils/containers';
import getChallengeSubmissions from '../../../api/getChallengeSubmissions';
import {H3, Medium} from '../../../utils/fonts';
import _renderSubmissions from './_renderSubmissions';
import Pager from '../Pager';
import {CALC_PAGES} from '../../../utils/globals';
import Media from 'react-media';
import theme from '../../../utils/theme';
import Loading from '../Loading';
import PropsTypes from 'prop-types';
const Table = (props) => {
const headerElements = ['#', 'submitter', 'when', 'result', 'entries'];
@ -22,26 +22,26 @@ const Table = (props) => {
const challengeDataRequest = () => {
getChallengeSubmissions(setChallengeData, setLoading, props.challengeName);
}
};
const renderSubmissions = () => {
return _renderSubmissions(pageNr, challengeData.submissions
? challengeData.submissions : []);
}
};
const nextPage = () => {
if (pageNr !== CALC_PAGES(challengeData.submissions ? challengeData.submissions : [])) {
let newPage = pageNr + 1;
setPageNr(newPage);
}
}
};
const previousPage = () => {
if (pageNr !== 1) {
let newPage = pageNr - 1;
setPageNr(newPage);
}
}
};
const mobileRender = () => {
return (
@ -54,14 +54,14 @@ const Table = (props) => {
alignmentX={elem === 'entries' ? 'flex-end' : 'flex-start'}>
<Medium as='th'>{elem}</Medium>
</FlexRow>
)
);
})}
</Grid>
{renderSubmissions()}
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -74,13 +74,13 @@ const Table = (props) => {
alignmentX={elem === 'entries' ? 'flex-end' : 'flex-start'}>
<H3 as='th'>{elem}</H3>
</FlexRow>
)
);
})}
</Grid>
{renderSubmissions()}
</FlexColumn>
);
}
};
return (
<>
@ -95,7 +95,7 @@ const Table = (props) => {
pages={CALC_PAGES(challengeData.submissions ? challengeData.submissions : [])}/>
</>
);
}
};
Table.propTypes = {
challengeName: PropsTypes.string,
@ -103,6 +103,6 @@ Table.propTypes = {
Table.defaultProps = {
challengeName: '',
}
};
export default Table;

10
src/components/elements/Table/_renderSubmissions.js
View File

@ -1,7 +1,7 @@
import {ELEMENTS_PER_PAGE} from "../../../utils/globals";
import {FlexColumn, FlexRow, Grid} from "../../../utils/containers";
import {Body} from "../../../utils/fonts";
import styled from "styled-components";
import {ELEMENTS_PER_PAGE} from '../../../utils/globals';
import {FlexColumn, FlexRow, Grid} from '../../../utils/containers';
import {Body} from '../../../utils/fonts';
import styled from 'styled-components';
const Line = styled(FlexRow)`
position: absolute;
@ -44,6 +44,6 @@ const _renderSubmissions = (pageNr, submissions) => {
</FlexColumn>
);
}
}
};
export default _renderSubmissions;

14
src/components/sections/Commercial.js
View File

@ -1,9 +1,9 @@
import React from "react";
import {FlexColumn, FlexRow, ImageBackground} from "../../utils/containers";
import {Body, H2, Medium} from "../../utils/fonts";
import CircleNumber from "../elements/CircleNumber";
import Media from "react-media";
import theme from "../../utils/theme";
import React from 'react';
import {FlexColumn, FlexRow, ImageBackground} from '../../utils/containers';
import {Body, H2, Medium} from '../../utils/fonts';
import CircleNumber from '../elements/CircleNumber';
import Media from 'react-media';
import theme from '../../utils/theme';
import commercialImage from '../../assets/commercial-image.svg';
const Commercial = () => {
@ -100,6 +100,6 @@ const Commercial = () => {
</Media>
</>
);
}
};
export default Commercial;

16
src/components/sections/Csi.js
View File

@ -1,8 +1,8 @@
import React from "react";
import {FlexColumn, FlexRow, Svg} from "../../utils/containers";
import {Body, H2, Medium} from "../../utils/fonts";
import Media from "react-media";
import theme from "../../utils/theme";
import React from 'react';
import {FlexColumn, FlexRow, Svg} from '../../utils/containers';
import {Body, H2, Medium} from '../../utils/fonts';
import Media from 'react-media';
import theme from '../../utils/theme';
import uamLogo from '../../assets/uam-logo.svg';
const Csi = () => {
@ -26,7 +26,7 @@ const Csi = () => {
</Medium>
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -53,7 +53,7 @@ const Csi = () => {
<Svg src={uamLogo} width='200px' height='242px' size='contain'/>
</FlexRow>
);
}
};
return (
<>
@ -65,6 +65,6 @@ const Csi = () => {
</Media>
</>
);
}
};
export default Csi;

20
src/components/sections/FilterBy.js
View File

@ -1,11 +1,11 @@
import React from "react";
import {FlexColumn, Grid, Svg} from "../../utils/containers";
import Filter from "../elements/Filter";
import {Body, H3, Medium} from "../../utils/fonts";
import arrow from "../../assets/arrow.svg";
import Media from "react-media";
import theme from "../../utils/theme";
import PropsTypes from "prop-types";
import React from 'react';
import {FlexColumn, Grid, Svg} from '../../utils/containers';
import Filter from '../elements/Filter';
import {Body, H3, Medium} from '../../utils/fonts';
import arrow from '../../assets/arrow.svg';
import Media from 'react-media';
import theme from '../../utils/theme';
import PropsTypes from 'prop-types';
const FilterBy = (props) => {
const renderFilterOptions = () => {
@ -26,7 +26,7 @@ const FilterBy = (props) => {
);
})
);
}
};
return (
<FlexColumn as='fieldset' width='94%' alignmentX='flex-start'>
@ -46,7 +46,7 @@ const FilterBy = (props) => {
</Grid>
</FlexColumn>
);
}
};
FilterBy.propTypes = {
options: PropsTypes.arrayOf(PropsTypes.shape({

10
src/components/sections/Footer.js
View File

@ -1,7 +1,7 @@
import React from "react";
import {Container, FlexRow} from "../../utils/containers";
import styled from "styled-components";
import {Medium} from "../../utils/fonts";
import React from 'react';
import {Container, FlexRow} from '../../utils/containers';
import styled from 'styled-components';
import {Medium} from '../../utils/fonts';
const FooterStyle = styled(FlexRow)`
width: 100%;
@ -39,6 +39,6 @@ const Footer = () => {
</Medium>
</FooterStyle>
);
}
};
export default Footer;

22
src/components/sections/Hero.js
View File

@ -1,12 +1,12 @@
import React from "react";
import {Body, H1, Medium} from "../../utils/fonts";
import {Container, FlexColumn, FlexRow, Svg} from "../../utils/containers";
import theme from "../../utils/theme";
import ButtonLink from "../elements/ButtonLink";
import {Link} from "react-router-dom";
import Media from "react-media";
import React from 'react';
import {Body, H1, Medium} from '../../utils/fonts';
import {Container, FlexColumn, FlexRow, Svg} from '../../utils/containers';
import theme from '../../utils/theme';
import ButtonLink from '../elements/ButtonLink';
import {Link} from 'react-router-dom';
import Media from 'react-media';
import codepenIco from '../../assets/codepen_ico.svg';
import styled from "styled-components";
import styled from 'styled-components';
const TitleParagraph = styled(Medium)`
font-size: 20px;
@ -31,7 +31,7 @@ const mobileRender = () => {
</ButtonLink>
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -56,7 +56,7 @@ const desktopRender = () => {
</FlexRow>
</FlexColumn>
);
}
};
const Hero = () => {
return (
@ -69,6 +69,6 @@ const Hero = () => {
</Media>
</>
);
}
};
export default Hero;

8
src/components/sections/HowTo.js
View File

@ -1,6 +1,6 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import {H2} from "../../utils/fonts";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import {H2} from '../../utils/fonts';
const HowTo = () => {
return (
@ -10,6 +10,6 @@ const HowTo = () => {
</H2>
</FlexColumn>
);
}
};
export default HowTo;

24
src/components/sections/Leaderboard.js
View File

@ -1,10 +1,10 @@
import React from "react";
import Media from "react-media";
import theme from "../../utils/theme";
import {FlexColumn, FlexRow} from "../../utils/containers";
import {H2, H3} from "../../utils/fonts";
import Table from "../elements/Table";
import styled from "styled-components";
import React from 'react';
import Media from 'react-media';
import theme from '../../utils/theme';
import {FlexColumn, FlexRow} from '../../utils/containers';
import {H2, H3} from '../../utils/fonts';
import Table from '../elements/Table';
import styled from 'styled-components';
import PropsTypes from 'prop-types';
const BoardVariantMobile = styled(FlexRow)`
@ -64,7 +64,7 @@ const Leaderboard = (props) => {
<Table challengeName={props.challengeName}/>
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -89,7 +89,7 @@ const Leaderboard = (props) => {
<Table challengeName={props.challengeName}/>
</FlexColumn>
);
}
};
return (
<>
@ -100,12 +100,12 @@ const Leaderboard = (props) => {
{desktopRender()}
</Media>
</>
)
}
);
};
Leaderboard.propsTypes = {
challengeName: PropsTypes.string,
}
};
Leaderboard.defaultProps = {
challengeName: '',

22
src/components/sections/MiniChallenge.js
View File

@ -1,12 +1,12 @@
import React from "react";
import {Container, FlexColumn, FlexRow, Grid} from "../../utils/containers";
import {Body, H3} from "../../utils/fonts";
import styled from "styled-components";
import IconLabel from "../elements/IconLabel";
import {Link} from "react-router-dom";
import {CHALLENGE_PAGE, MINI_DESCRIPTION_RENDER} from "../../utils/globals";
import theme from "../../utils/theme";
import PropsTypes from "prop-types";
import React from 'react';
import {Container, FlexColumn, FlexRow, Grid} from '../../utils/containers';
import {Body, H3} from '../../utils/fonts';
import styled from 'styled-components';
import IconLabel from '../elements/IconLabel';
import {Link} from 'react-router-dom';
import {CHALLENGE_PAGE, MINI_DESCRIPTION_RENDER} from '../../utils/globals';
import theme from '../../utils/theme';
import PropsTypes from 'prop-types';
const ChallengeStyle = styled(FlexColumn)`
padding: 12px;
@ -85,7 +85,7 @@ const MiniChallenge = (props) => {
</FlexColumn>
</ChallengeStyle>
);
}
};
MiniChallenge.propTypes = {
name: PropsTypes.string,
@ -109,6 +109,6 @@ MiniChallenge.defaultProps = {
deadline: 'xxx',
baseline: 'xxx',
prize: 'xxx'
}
};
export default MiniChallenge;

18
src/components/sections/Motivation.js
View File

@ -1,10 +1,10 @@
import React from "react";
import {FlexColumn, FlexRow, ImageBackground, Svg} from "../../utils/containers";
import {Body, H2} from "../../utils/fonts";
import React from 'react';
import {FlexColumn, FlexRow, ImageBackground, Svg} from '../../utils/containers';
import {Body, H2} from '../../utils/fonts';
import cubeIcon from '../../assets/cube_ico.svg';
import theme from "../../utils/theme";
import Media from "react-media";
import ellipse from '../../assets/ellipse.svg'
import theme from '../../utils/theme';
import Media from 'react-media';
import ellipse from '../../assets/ellipse.svg';
const Motivation = () => {
const content = [
@ -38,7 +38,7 @@ const Motivation = () => {
</FlexColumn>
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -65,7 +65,7 @@ const Motivation = () => {
</FlexColumn>
</ImageBackground>
);
}
};
return (
<>
@ -77,6 +77,6 @@ const Motivation = () => {
</Media>
</>
);
}
};
export default Motivation;

8
src/components/sections/MyEntries.js
View File

@ -1,6 +1,6 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import {H2} from "../../utils/fonts";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import {H2} from '../../utils/fonts';
const MyEntries = () => {
return (
@ -10,6 +10,6 @@ const MyEntries = () => {
</H2>
</FlexColumn>
);
}
};
export default MyEntries;

12
src/components/sections/Partnerships.js
View File

@ -1,8 +1,8 @@
import React from "react";
import {FlexColumn, Grid} from "../../utils/containers";
import {H2} from "../../utils/fonts";
import Placeholder from "../elements/Placeholder";
import styled from "styled-components";
import React from 'react';
import {FlexColumn, Grid} from '../../utils/containers';
import {H2} from '../../utils/fonts';
import Placeholder from '../elements/Placeholder';
import styled from 'styled-components';
const PartnershipsStyle = styled(FlexColumn)`
justify-content: flex-start;
@ -43,6 +43,6 @@ const Partnerships = () => {
</FlexColumn>
</PartnershipsStyle>
);
}
};
export default Partnerships;

34
src/components/sections/Readme.js
View File

@ -1,15 +1,15 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import {Body, H2, Medium} from "../../utils/fonts";
import Media from "react-media";
import theme from "../../utils/theme";
import getChallengeFullDescription from "../../api/getChallengeFullDescription";
import {markdown} from "markdown";
import styled from "styled-components";
import InfoList from "../elements/InfoList";
import Loading from "../elements/Loading";
import PropsTypes from "prop-types";
import MiniChallenge from "./MiniChallenge";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import {Body, H2, Medium} from '../../utils/fonts';
import Media from 'react-media';
import theme from '../../utils/theme';
import getChallengeFullDescription from '../../api/getChallengeFullDescription';
import {markdown} from 'markdown';
import styled from 'styled-components';
import InfoList from '../elements/InfoList';
import Loading from '../elements/Loading';
import PropsTypes from 'prop-types';
import MiniChallenge from './MiniChallenge';
const ReadmeStyle = styled(Body)`
h3 {
@ -70,7 +70,7 @@ const Readme = (props) => {
regex = /<\/h2>/g;
result = result.replace(regex, '</h3>');
return result;
}
};
const mobileRender = () => {
return (
@ -109,7 +109,7 @@ const Readme = (props) => {
</FlexColumn>
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -147,7 +147,7 @@ const Readme = (props) => {
</FlexColumn>
</FlexColumn>
);
}
};
return (
<>
@ -159,7 +159,7 @@ const Readme = (props) => {
</Media>
</>
);
}
};
MiniChallenge.propTypes = {
challengeName: PropsTypes.string,
@ -169,6 +169,6 @@ MiniChallenge.propTypes = {
MiniChallenge.defaultProps = {
challengeName: '',
description: '',
}
};
export default Readme;

8
src/components/sections/Submit.js
View File

@ -1,6 +1,6 @@
import React from "react";
import {FlexColumn} from "../../utils/containers";
import {H2} from "../../utils/fonts";
import React from 'react';
import {FlexColumn} from '../../utils/containers';
import {H2} from '../../utils/fonts';
const Submit = () => {
return (
@ -10,6 +10,6 @@ const Submit = () => {
</H2>
</FlexColumn>
);
}
};
export default Submit;

44
src/pages/Challanges/Challenges.js
View File

@ -1,17 +1,17 @@
import React from "react";
import {Body, H1} from "../../utils/fonts";
import {FlexColumn, FlexRow, Svg} from "../../utils/containers";
import Search from "../../components/elements/Search";
import Pager from "../../components/elements/Pager";
import FiltersMenu from "../../components/elements/FiltersMenu";
import _searchQueryHandler from "./_searchQueryHandler";
import _renderChallenges from "./_renderChallenges";
import Media from "react-media";
import theme from "../../utils/theme";
import React from 'react';
import {Body, H1} from '../../utils/fonts';
import {FlexColumn, FlexRow, Svg} from '../../utils/containers';
import Search from '../../components/elements/Search';
import Pager from '../../components/elements/Pager';
import FiltersMenu from '../../components/elements/FiltersMenu';
import _searchQueryHandler from './_searchQueryHandler';
import _renderChallenges from './_renderChallenges';
import Media from 'react-media';
import theme from '../../utils/theme';
import cupIco from '../../assets/cup_ico.svg';
import getChallenges from "../../api/getChallenges";
import {CALC_PAGES} from "../../utils/globals";
import Loading from "../../components/elements/Loading";
import getChallenges from '../../api/getChallenges';
import {CALC_PAGES} from '../../utils/globals';
import Loading from '../../components/elements/Loading';
const Challenges = () => {
const [pageNr, setPageNr] = React.useState(1);
@ -38,7 +38,7 @@ const Challenges = () => {
};
const statusHandler = (value) => {
setStatus(value)
setStatus(value);
};
const challengeTypeHandler = (value) => {
@ -51,30 +51,30 @@ const Challenges = () => {
const searchQueryHandler = (event) => {
_searchQueryHandler(event, challengesFromAPI, setPageNr, setChallenges);
}
};
const nextPage = () => {
if (pageNr !== CALC_PAGES(challenges)) {
let newPage = pageNr + 1;
setPageNr(newPage);
}
}
};
const previousPage = () => {
if (pageNr !== 1) {
let newPage = pageNr - 1;
setPageNr(newPage);
}
}
};
const renderChallenges = () => {
return _renderChallenges(pageNr, challenges);
}
};
const toggleFiltersMenu = () => {
let newFiltersMenu = !filtersMenu;
setFiltersMenu(newFiltersMenu);
}
};
const mobileRender = () => {
return (
@ -101,7 +101,7 @@ const Challenges = () => {
</FlexColumn>
</>
);
}
};
const desktopRender = () => {
return (
@ -136,7 +136,7 @@ const Challenges = () => {
</FlexColumn>
</>
);
}
};
return (
<>
@ -148,6 +148,6 @@ const Challenges = () => {
</Media>
</>
);
}
};
export default Challenges;

12
src/pages/Challanges/_renderChallenges.js
View File

@ -1,7 +1,7 @@
import {ELEMENTS_PER_PAGE} from "../../utils/globals";
import MiniChallenge from "../../components/sections/MiniChallenge";
import {Grid} from "../../utils/containers";
import styled from "styled-components";
import {ELEMENTS_PER_PAGE} from '../../utils/globals';
import MiniChallenge from '../../components/sections/MiniChallenge';
import {Grid} from '../../utils/containers';
import styled from 'styled-components';
const ChallengesGrid = styled(Grid)`
margin: 32px 0;
@ -32,9 +32,9 @@ const _renderChallenges = (pageNr, challenges) => {
);
})}
</ChallengesGrid>
)
);
}
return '';
}
};
export default _renderChallenges;

2
src/pages/Challanges/_searchQueryHandler.js
View File

@ -13,6 +13,6 @@ const _searchQueryHandler = (event, challengesFromAPI, setPageNr, setChallenges)
}
setChallenges(challengesToRender);
}
}
};
export default _searchQueryHandler;

54
src/pages/Challenge.js
View File

@ -1,20 +1,20 @@
import React from "react";
import {Container, FlexColumn, FlexRow, Svg} from "../utils/containers";
import {useParams} from "react-router-dom";
import {H1, Medium} from "../utils/fonts";
import theme from "../utils/theme";
import MobileChallengeMenu from "../components/elements/MobileChallengeMenu";
import Leaderboard from "../components/sections/Leaderboard";
import Readme from "../components/sections/Readme";
import HowTo from "../components/sections/HowTo";
import MyEntries from "../components/sections/MyEntries";
import Submit from "../components/sections/Submit";
import Media from "react-media";
import DesktopChallengeMenu from "../components/elements/DesktopChallengeMenu";
import {RENDER_ICO} from "../utils/globals";
import textIco from "../assets/text_ico.svg";
import getChallengeInfo from "../api/getChallengeInfo";
import Loading from "../components/elements/Loading";
import React from 'react';
import {Container, FlexColumn, FlexRow, Svg} from '../utils/containers';
import {useParams} from 'react-router-dom';
import {H1, Medium} from '../utils/fonts';
import theme from '../utils/theme';
import MobileChallengeMenu from '../components/elements/MobileChallengeMenu';
import Leaderboard from '../components/sections/Leaderboard';
import Readme from '../components/sections/Readme';
import HowTo from '../components/sections/HowTo';
import MyEntries from '../components/sections/MyEntries';
import Submit from '../components/sections/Submit';
import Media from 'react-media';
import DesktopChallengeMenu from '../components/elements/DesktopChallengeMenu';
import {RENDER_ICO} from '../utils/globals';
import textIco from '../assets/text_ico.svg';
import getChallengeInfo from '../api/getChallengeInfo';
import Loading from '../components/elements/Loading';
const Challenge = () => {
const challengeName = useParams().challengeId;
@ -29,20 +29,20 @@ const Challenge = () => {
const sectionRender = () => {
switch (section) {
case 0:
return <Leaderboard challengeName={challengeName}/>
return <Leaderboard challengeName={challengeName}/>;
case 1:
return <Readme challengeName={challengeName} metric={challenge.mainMetric}
description={challenge.description} deadline={challenge.deadline}/>
description={challenge.description} deadline={challenge.deadline}/>;
case 2:
return <HowTo challengeName={challengeName}/>
return <HowTo challengeName={challengeName}/>;
case 3:
return <MyEntries challengeName={challengeName}/>
return <MyEntries challengeName={challengeName}/>;
case 4:
return <Submit challengeName={challengeName}/>
return <Submit challengeName={challengeName}/>;
default:
return <Leaderboard challengeName={challengeName}/>
return <Leaderboard challengeName={challengeName}/>;
}
}
};
const mobileRender = () => {
return (
@ -56,7 +56,7 @@ const Challenge = () => {
{sectionRender()}
</FlexColumn>
);
}
};
const desktopRender = () => {
return (
@ -81,7 +81,7 @@ const Challenge = () => {
</FlexColumn>
</>
);
}
};
return (
<>
@ -93,6 +93,6 @@ const Challenge = () => {
</Media>
</>
);
}
};
export default Challenge;

18
src/pages/LandingPage.js
View File

@ -1,11 +1,11 @@
import React from "react";
import {FlexColumn} from "../utils/containers";
import Motivation from "../components/sections/Motivation";
import Csi from "../components/sections/Csi";
import Commercial from "../components/sections/Commercial";
import Hero from "../components/sections/Hero";
import Partnerships from "../components/sections/Partnerships";
import styled from "styled-components";
import React from 'react';
import {FlexColumn} from '../utils/containers';
import Motivation from '../components/sections/Motivation';
import Csi from '../components/sections/Csi';
import Commercial from '../components/sections/Commercial';
import Hero from '../components/sections/Hero';
import Partnerships from '../components/sections/Partnerships';
import styled from 'styled-components';
const LandingPageStyle = styled(FlexColumn)`
justify-content: flex-start;
@ -42,6 +42,6 @@ const LandingPage = () => {
</FlexColumn>
</LandingPageStyle>
);
}
};
export default LandingPage;

24
src/utils/globals.js
View File

@ -1,11 +1,11 @@
import metricIco from "../assets/metric_ico.svg";
import coinsIco from "../assets/coins_ico.svg";
import baselineIco from "../assets/baseline_ico.svg";
import clockIco from "../assets/clock_ico.svg";
import cupIco from "../assets/cup_ico.svg";
import textIco from "../assets/text_ico.svg";
import imageIco from "../assets/image_ico.svg";
import tabularIco from "../assets/tabular_ico.svg";
import metricIco from '../assets/metric_ico.svg';
import coinsIco from '../assets/coins_ico.svg';
import baselineIco from '../assets/baseline_ico.svg';
import clockIco from '../assets/clock_ico.svg';
import cupIco from '../assets/cup_ico.svg';
import textIco from '../assets/text_ico.svg';
import imageIco from '../assets/image_ico.svg';
import tabularIco from '../assets/tabular_ico.svg';
const ELEMENTS_PER_PAGE = 12;
const MINI_DESCRIPTION_LENGTH = 70;
@ -20,7 +20,7 @@ const MINI_DESCRIPTION_RENDER = (description) => {
return `${description.slice(0, MINI_DESCRIPTION_LENGTH)}...`;
}
return 'xxx';
}
};
const RENDER_ICO = (type) => {
switch (type) {
@ -43,11 +43,11 @@ const RENDER_ICO = (type) => {
default:
return '';
}
}
};
const CALC_PAGES = (objects) => {
return Math.ceil(objects.length / ELEMENTS_PER_PAGE);
}
};
const RENDER_DEADLINE_TIME = (time) => {
if (time) {
@ -56,7 +56,7 @@ const RENDER_DEADLINE_TIME = (time) => {
return `${date} ${hour}`;
}
return '';
}
};
export {
ELEMENTS_PER_PAGE,