get user request and bold current user in Table logic
This commit is contained in:
parent
3af9523a79
commit
bd176e2329
@ -42,9 +42,6 @@ const App = () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const popUpMessageHandler = (header, message) => {
|
const popUpMessageHandler = (header, message) => {
|
||||||
console.log('elo');
|
|
||||||
console.log(header);
|
|
||||||
console.log(message);
|
|
||||||
setPopUpHeader(header);
|
setPopUpHeader(header);
|
||||||
setPopUpMessage(message);
|
setPopUpMessage(message);
|
||||||
};
|
};
|
||||||
|
14
src/api/getUser.js
Normal file
14
src/api/getUser.js
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import {API} from '../utils/globals';
|
||||||
|
|
||||||
|
const getUser = (setDataState, setLoadingState) => {
|
||||||
|
fetch(`${API}/user-info`)
|
||||||
|
.then(response => response.text())
|
||||||
|
.then(data => {
|
||||||
|
console.log(data);
|
||||||
|
setDataState(data);
|
||||||
|
if (setLoadingState)
|
||||||
|
setLoadingState(false);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
export default getUser;
|
@ -11,6 +11,7 @@ import {CALC_PAGES, EVALUATIONS_FORMAT, RENDER_WHEN} from '../../../utils/global
|
|||||||
import Search from '../../generic/Search';
|
import Search from '../../generic/Search';
|
||||||
import Pager from '../../generic/Pager';
|
import Pager from '../../generic/Pager';
|
||||||
import Loading from '../../generic/Loading';
|
import Loading from '../../generic/Loading';
|
||||||
|
import getUser from '../../../api/getUser';
|
||||||
|
|
||||||
const Leaderboard = (props) => {
|
const Leaderboard = (props) => {
|
||||||
const [entriesFromApi, setEntriesFromApi] = React.useState([]);
|
const [entriesFromApi, setEntriesFromApi] = React.useState([]);
|
||||||
@ -21,6 +22,7 @@ const Leaderboard = (props) => {
|
|||||||
const [entriesSorted, setEntriesSorted] = React.useState(false);
|
const [entriesSorted, setEntriesSorted] = React.useState(false);
|
||||||
const [whenSorted, setWhenSorted] = React.useState(false);
|
const [whenSorted, setWhenSorted] = React.useState(false);
|
||||||
const [scoreSorted, setScoreSorted] = React.useState(false);
|
const [scoreSorted, setScoreSorted] = React.useState(false);
|
||||||
|
const [user, setUser] = React.useState('');
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
challengeDataRequest(props.challengeName);
|
challengeDataRequest(props.challengeName);
|
||||||
@ -28,6 +30,7 @@ const Leaderboard = (props) => {
|
|||||||
|
|
||||||
const challengeDataRequest = (challengeName) => {
|
const challengeDataRequest = (challengeName) => {
|
||||||
getChallengeLeaderboard(setEntriesFromApi, challengeName);
|
getChallengeLeaderboard(setEntriesFromApi, challengeName);
|
||||||
|
getUser(setUser);
|
||||||
getChallengeLeaderboard(setEntries, challengeName, setLoading);
|
getChallengeLeaderboard(setEntries, challengeName, setLoading);
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -156,6 +159,7 @@ const Leaderboard = (props) => {
|
|||||||
<Search searchQueryHandler={searchQueryHandler}/>
|
<Search searchQueryHandler={searchQueryHandler}/>
|
||||||
<Table challengeName={props.challengeName} headerElements={getLeaderboardHeader()}
|
<Table challengeName={props.challengeName} headerElements={getLeaderboardHeader()}
|
||||||
gridTemplateColumns={entries[0] ? '1fr 3fr ' + '2fr '.repeat(entries[0].evaluations.length) + '1fr 2fr' : ''}
|
gridTemplateColumns={entries[0] ? '1fr 3fr ' + '2fr '.repeat(entries[0].evaluations.length) + '1fr 2fr' : ''}
|
||||||
|
user={user}
|
||||||
staticColumnElements={
|
staticColumnElements={
|
||||||
[
|
[
|
||||||
{name: 'id', format: null, order: 1, align: 'left'},
|
{name: 'id', format: null, order: 1, align: 'left'},
|
||||||
|
@ -24,7 +24,9 @@ const Submit = (props) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const challengeSubmissionSubmit = () => {
|
const challengeSubmissionSubmit = () => {
|
||||||
challengeSubmission(props.challengeName, repoUrl, repoBranch, description).then(r => console.log(r));
|
challengeSubmission(props.challengeName, repoUrl, repoBranch, description)
|
||||||
|
.then((response) => response.text())
|
||||||
|
.then((data) => console.log(data));
|
||||||
props.popUpMessageHandler('Submit success!', 'Check your entries.');
|
props.popUpMessageHandler('Submit success!', 'Check your entries.');
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -60,6 +60,33 @@ const Table = (props) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const rowRender = (elem) => {
|
||||||
|
if (elem.submitter === props.user) {
|
||||||
|
return (
|
||||||
|
props.staticColumnElements.map((elemName, i) => {
|
||||||
|
return (
|
||||||
|
<Medium key={`leaderboard-static-elemName-${i}-${elem[elemName.name]}`}
|
||||||
|
as='td'
|
||||||
|
order={elemName.order} textAlign={elemName.align}>
|
||||||
|
{elemName.format ? elemName.format(elem[elemName.name]) : elem[elemName.name]}
|
||||||
|
</Medium>
|
||||||
|
);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
props.staticColumnElements.map((elemName, i) => {
|
||||||
|
return (
|
||||||
|
<Body key={`leaderboard-static-elemName-${i}-${elem[elemName.name]}`}
|
||||||
|
as='td'
|
||||||
|
order={elemName.order} textAlign={elemName.align}>
|
||||||
|
{elemName.format ? elemName.format(elem[elemName.name]) : elem[elemName.name]}
|
||||||
|
</Body>
|
||||||
|
);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const desktopRender = () => {
|
const desktopRender = () => {
|
||||||
const n = (props.pageNr - 1) * (ELEMENTS_PER_PAGE * 2);
|
const n = (props.pageNr - 1) * (ELEMENTS_PER_PAGE * 2);
|
||||||
let elementsToMap = props.elements.slice(n, n + (ELEMENTS_PER_PAGE * 2));
|
let elementsToMap = props.elements.slice(n, n + (ELEMENTS_PER_PAGE * 2));
|
||||||
@ -104,15 +131,7 @@ const Table = (props) => {
|
|||||||
backgroundColor={index % 2 === 1 ? theme.colors.dark01 : 'transparent'}
|
backgroundColor={index % 2 === 1 ? theme.colors.dark01 : 'transparent'}
|
||||||
gridTemplateColumns={props.gridTemplateColumns}
|
gridTemplateColumns={props.gridTemplateColumns}
|
||||||
gridGap='20px' position='relative' width='100%' padding='4px'>
|
gridGap='20px' position='relative' width='100%' padding='4px'>
|
||||||
{props.staticColumnElements.map((elemName, i) => {
|
{rowRender(elem)}
|
||||||
return (
|
|
||||||
<Body key={`leaderboard-static-elemName-${i}-${elem[elemName.name]}`}
|
|
||||||
as='td'
|
|
||||||
order={elemName.order} textAlign={elemName.align}>
|
|
||||||
{elemName.format ? elemName.format(elem[elemName.name]) : elem[elemName.name]}
|
|
||||||
</Body>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
{props.headerElements ? metricsRender(elem) : ''}
|
{props.headerElements ? metricsRender(elem) : ''}
|
||||||
</Grid>
|
</Grid>
|
||||||
);
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user