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

Merge branch 'master' of https://github.com/mattyl006/gonito

Browse Source
This commit is contained in:
mattyl006 2022-12-07 16:22:55 +01:00
commit dfdcdddd93
5 changed files with 46 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/api/challengeSubmissionPost.js
View File

@ -1,7 +1,7 @@
import KeyCloakService from '../services/KeyCloakService'; import KeyCloakService from '../services/KeyCloakService';
import {API} from '../utils/globals'; import {API} from '../utils/globals';
const challengeSubmission = (challengeName, repoUrl, repoBranch, description) => { const challengeSubmission = (challengeName, repoUrl, repoBranch, description, setLoading) => {
const details = { const details = {
'f1': description, 'f1': description,
'f3': repoUrl, 'f3': repoUrl,
@ -14,13 +14,17 @@ const challengeSubmission = (challengeName, repoUrl, repoBranch, description) =>
formBody.push(encodedKey + '=' + encodedValue); formBody.push(encodedKey + '=' + encodedValue);
} }
formBody = formBody.join('&'); formBody = formBody.join('&');
return fetch(`${API}/challenge-submission/${challengeName}`, { fetch(`${API}/challenge-submission/${challengeName}`, {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8', 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
'Authorization': `Bearer ${KeyCloakService.getToken()}` 'Authorization': `Bearer ${KeyCloakService.getToken()}`
}, },
body: formBody body: formBody
}).then((resp) => resp.json())
.then((data) => {
setLoading(true);
window.location.replace(`https://gonito.net/view-progress/${data}#form`);
}); });
}; };

4
src/components/generic/Button.js
View File

@ -16,6 +16,10 @@ const ButtonStyle = styled(Medium)`
cursor: pointer; cursor: pointer;
transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;
* {
cursor: pointer;
}
&:hover { &:hover {
transform: scale(1.15); transform: scale(1.15);
} }

5
src/components/specific_challenge/Submit.js
View File

@ -24,10 +24,7 @@ const Submit = (props) => {
}; };
const challengeSubmissionSubmit = () => { const challengeSubmissionSubmit = () => {
challengeSubmission(props.challengeName, repoUrl, repoBranch, description) challengeSubmission(props.challengeName, repoUrl, repoBranch, description, props.setLoading);
.then((response) => response.text())
.then((data) => console.log(data));
props.popUpMessageHandler('Submit success!', 'Check your entries.');
}; };
return ( return (

57
src/pages/Challenge.js
View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import {Container, FlexColumn, FlexRow, Svg} from '../utils/containers'; import {Container, FlexColumn, FlexRow, Svg} from '../utils/containers';
import {useParams} from 'react-router-dom'; import {useParams} from 'react-router-dom';
import {H1, Medium} from '../utils/fonts'; import {H1, H2, Medium} from '../utils/fonts';
import theme from '../utils/theme'; import theme from '../utils/theme';
import MobileChallengeMenu from '../components/specific_challenge/MobileChallengeMenu'; import MobileChallengeMenu from '../components/specific_challenge/MobileChallengeMenu';
import Leaderboard from '../components/specific_challenge/Leaderboard/Leaderboard'; import Leaderboard from '../components/specific_challenge/Leaderboard/Leaderboard';
@ -41,7 +41,7 @@ const Challenge = (props) => {
case 3: case 3:
return <MyEntries challengeName={challengeName}/>; return <MyEntries challengeName={challengeName}/>;
case 4: case 4:
return <Submit popUpMessageHandler={props.popUpMessageHandler} challengeName={challengeName}/>; return <Submit popUpMessageHandler={props.popUpMessageHandler} challengeName={challengeName} setLoading={setLoading}/>;
default: default:
return <Leaderboard challengeName={challengeName} mainMetric={challenge.mainMetric}/>; return <Leaderboard challengeName={challengeName} mainMetric={challenge.mainMetric}/>;
} }
@ -62,28 +62,39 @@ const Challenge = (props) => {
}; };
const desktopRender = () => { const desktopRender = () => {
return ( if (!loading) {
<> return (
<DesktopChallengeMenu setSection={setSection} section={section}/> <>
<FlexColumn minHeight='100vh' alignmentY='flex-start' padding='64px 24px 64px 310px' id='start'> <DesktopChallengeMenu setSection={setSection} section={section}/>
<FlexRow gap='32px' margin='0 0 32px 0' padding='16px'> <FlexColumn minHeight='100vh' alignmentY='flex-start' padding='64px 24px 64px 310px' id='start'>
<Loading visible={loading}/> <FlexRow gap='32px' margin='0 0 32px 0' padding='16px'>
<FlexColumn alignmentX='flex-start' gap='24px' maxWidth='500px'> <FlexColumn alignmentX='flex-start' gap='24px' maxWidth='500px'>
<H1 as='h1'> <H1 as='h1'>
{challenge.title} {challenge.title}
</H1> </H1>
<Medium as='p'> <Medium as='p'>
{challenge.description} {challenge.description}
</Medium> </Medium>
</FlexColumn> </FlexColumn>
<Svg src={challenge.type ? RENDER_ICO(challenge.type) : textIco} <Svg src={challenge.type ? RENDER_ICO(challenge.type) : textIco}
width='120px' height='120px' size='contain'/> width='120px' height='120px' size='contain'/>
</FlexRow> </FlexRow>
<Container width='55%' height='1px' backgroundColor={theme.colors.dark}/> <Container width='55%' height='1px' backgroundColor={theme.colors.dark}/>
{sectionRender()} {sectionRender()}
</FlexColumn>
</>
);
}
else {
return (
<FlexColumn position='fixed' top='0' left='0' width='100%' height='100vh' zIndex='10'>
<H2 as='h1'>
Submission processing...
</H2>
<Loading />
</FlexColumn> </FlexColumn>
</> );
); }
}; };
return ( return (

1
src/utils/fonts.js
View File

@ -7,6 +7,7 @@ const H1 = styled(Container)`
font-weight: 400; font-weight: 400;
font-size: 24px; font-size: 24px;
line-height: 24px; line-height: 24px;
letter-spacing: 0.1px;
@media (min-width: ${({theme}) => theme.overMobile}) { @media (min-width: ${({theme}) => theme.overMobile}) {
font-size: 48px; font-size: 48px;
line-height: 52px; line-height: 52px;