Skip to content

Commit 1863157

Browse files
authored
Merge pull request #3303 from topcoder-platform/mm-leaderboard-misc-fixes-v2
Mm leaderboard misc fixes v2
2 parents 65f5762 + cea1398 commit 1863157

File tree

12 files changed

+6958
-6293
lines changed

12 files changed

+6958
-6293
lines changed

package-lock.json

Lines changed: 6390 additions & 6287 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@
111111
"slick-carousel": "^1.8.1",
112112
"supertest": "^3.1.0",
113113
"tc-accounts": "git+https://github.com/appirio-tech/accounts-app.git#dev",
114-
"topcoder-react-lib": "0.7.11-6",
114+
"topcoder-react-lib": "0.7.11-7",
115115
"topcoder-react-ui-kit": "^1.0.11",
116116
"topcoder-react-utils": "0.7.8",
117117
"turndown": "^4.0.2",

src/shared/actions/page/challenge-details.js

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/**
22
* Actions related to the UI state of challenge details page.
33
*/
4-
4+
import _ from 'lodash';
55
import { createActions } from 'redux-actions';
66

77
/**
@@ -62,6 +62,15 @@ function toggleCheckpointFeedback(id, open) {
6262
return { id, open };
6363
}
6464

65+
/**
66+
* Creates action that toggle the submission testcase..
67+
* @param {Number} index of submission testcase.
68+
* @return {Action}
69+
*/
70+
function toggleSubmissionTestCase(index) {
71+
return index;
72+
}
73+
6574
export default createActions({
6675
PAGE: {
6776
CHALLENGE_DETAILS: {
@@ -70,6 +79,8 @@ export default createActions({
7079
TOGGLE_CHECKPOINT_FEEDBACK: toggleCheckpointFeedback,
7180
SUBMISSIONS: {
7281
TOGGLE_SUBMISSION_HISTORY: toggleSubmissionHistory,
82+
TOGGLE_SUBMISSION_TESTCASE: toggleSubmissionTestCase,
83+
CLEAR_SUBMISSION_TESTCASE_OPEN: _.identity,
7384
},
7485
},
7586
},
Lines changed: 186 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,186 @@
1+
/* eslint-disable jsx-a11y/click-events-have-key-events */
2+
import _ from 'lodash';
3+
import React from 'react';
4+
import PT from 'prop-types';
5+
import moment from 'moment';
6+
import { Modal, PrimaryButton } from 'topcoder-react-ui-kit';
7+
import ArrowUp from 'assets/images/icon-arrow-up.svg';
8+
import ArrowDown from 'assets/images/icon-arrow-down.svg';
9+
import LoadingIndicator from 'components/LoadingIndicator';
10+
11+
import modal from './style.scss';
12+
13+
class SubmissionInformationModal extends React.Component {
14+
constructor(props) {
15+
super(props);
16+
17+
this.getTestCaseOpen = this.getTestCaseOpen.bind(this);
18+
this.getSubmissionBasicInfo = this.getSubmissionBasicInfo.bind(this);
19+
this.getTestcases = this.getTestcases.bind(this);
20+
}
21+
22+
componentWillUnmount() {
23+
const { clearTestcaseOpen } = this.props;
24+
clearTestcaseOpen();
25+
}
26+
27+
getTestCaseOpen(index) {
28+
const { openTestcase } = this.props;
29+
return openTestcase[index.toString()] || false;
30+
}
31+
32+
33+
getSubmissionBasicInfo() {
34+
const { submission, submissionInformation } = this.props;
35+
return _.find(submission.submissions, item => item.submissionId === submissionInformation.id);
36+
}
37+
38+
getTestcases() {
39+
const { submissionInformation } = this.props;
40+
41+
let list = [];
42+
_.forEach(submissionInformation.review, (item) => {
43+
if (_.has(item, 'metadata.public.testcases') && item.metadata.public.testcases.length > 0) {
44+
list = list.concat(item.metadata.public.testcases);
45+
}
46+
});
47+
48+
return list;
49+
}
50+
51+
/* eslint-disable class-methods-use-this */
52+
renderCase(key, value) {
53+
return (
54+
<React.Fragment>
55+
<span>{key}</span>
56+
<span>{value}</span>
57+
</React.Fragment>
58+
);
59+
}
60+
61+
render() {
62+
const {
63+
toggleTestcase, onClose, isLoadingSubmissionInformation,
64+
submissionInformation, isReviewPhaseComplete,
65+
} = this.props;
66+
const submissionBasicInfo = isLoadingSubmissionInformation
67+
? null : this.getSubmissionBasicInfo();
68+
const testcases = isLoadingSubmissionInformation ? [] : this.getTestcases();
69+
70+
return (
71+
<Modal theme={{ container: modal.container }} onCancel={() => onClose(false)}>
72+
{
73+
!isLoadingSubmissionInformation && (
74+
<React.Fragment>
75+
<div styleName="modal.submission-information-title">Advanced Details</div>
76+
{
77+
submissionBasicInfo ? (
78+
<div styleName="modal.submission-information-details">
79+
<div styleName="modal.submission-information-details-row1">
80+
<span styleName="modal.submission-information-details-title">Submission:&nbsp;</span>
81+
<span styleName="modal.submission-information-details-id">{submissionInformation.id}</span>
82+
</div>
83+
<div styleName="modal.submission-information-details-row2">
84+
<div styleName="modal.details-header">
85+
<div styleName="modal.header-item">Final Score</div>
86+
<div styleName="modal.header-item">Provissional Score</div>
87+
<div styleName="modal.header-item">Time</div>
88+
</div>
89+
<div styleName="modal.details-grid">
90+
<div
91+
styleName="modal.details-item"
92+
>
93+
{(!submissionBasicInfo.finalScore && submissionBasicInfo.finalScore !== 0) || !isReviewPhaseComplete ? '-' : submissionBasicInfo.finalScore}
94+
</div>
95+
<div
96+
styleName="modal.details-item"
97+
>
98+
{(!submissionBasicInfo.provisionalScore && submissionBasicInfo.provisionalScore !== 0) ? '-' : submissionBasicInfo.provisionalScore}
99+
</div>
100+
<div styleName="modal.details-item">
101+
{moment(submissionBasicInfo.submissionTime)
102+
.format('DD MMM YYYY')} {moment(submissionBasicInfo.submissionTime)
103+
.format('HH:mm:ss')}
104+
</div>
105+
</div>
106+
</div>
107+
</div>
108+
) : (
109+
<div styleName="modal.submission-information-error">
110+
You don&#39;t have permission to view the advanced details for this submission
111+
</div>
112+
)
113+
}
114+
{
115+
testcases.length > 0 && (
116+
<React.Fragment>
117+
<div styleName="modal.testcase-title">
118+
Test cases executed
119+
</div>
120+
{
121+
_.map(testcases, (item, index) => (
122+
<div styleName="modal.testcase-items" key={`Test case #${index + 1}`}>
123+
<div styleName="modal.testcase-header">
124+
<div>Test case #{index + 1}</div>
125+
<span onClick={() => toggleTestcase(index)} role="button" tabIndex={0}>
126+
{
127+
this.getTestCaseOpen(index) ? <ArrowUp /> : <ArrowDown />
128+
}
129+
</span>
130+
</div>
131+
{
132+
_.keys(item).length > 0 && (
133+
<div styleName={`modal.testcase-grid ${this.getTestCaseOpen(index) ? 'active' : ''}`}>
134+
{
135+
_.map(_.keys(item), (key, caseIndex) => (
136+
<div styleName="modal.testcase-row" key={`case-${caseIndex}-${key}`}>
137+
{
138+
this.renderCase(key, item[key])
139+
}
140+
</div>
141+
))
142+
}
143+
</div>
144+
)
145+
}
146+
</div>
147+
))
148+
}
149+
</React.Fragment>
150+
)
151+
}
152+
<div styleName="modal.submission-information-buttons">
153+
<div styleName="modal.submission-information-button-close">
154+
<PrimaryButton onClick={() => onClose(false)}>Dismiss</PrimaryButton>
155+
</div>
156+
</div>
157+
</React.Fragment>
158+
)
159+
}
160+
{
161+
isLoadingSubmissionInformation && (
162+
<LoadingIndicator />
163+
)
164+
}
165+
</Modal>
166+
);
167+
}
168+
}
169+
170+
SubmissionInformationModal.defaultProps = {
171+
isLoadingSubmissionInformation: false,
172+
submissionInformation: null,
173+
};
174+
175+
SubmissionInformationModal.propTypes = {
176+
isLoadingSubmissionInformation: PT.bool,
177+
submissionInformation: PT.shape(),
178+
onClose: PT.func.isRequired,
179+
toggleTestcase: PT.func.isRequired,
180+
openTestcase: PT.shape({}).isRequired,
181+
clearTestcaseOpen: PT.func.isRequired,
182+
submission: PT.shape().isRequired,
183+
isReviewPhaseComplete: PT.bool.isRequired,
184+
};
185+
186+
export default SubmissionInformationModal;

0 commit comments

Comments
 (0)