Challenge Overview
Challenge Objectives
-
Integrate the challenge details page with the backend.
-
Integrate the submission details page with the backend.
Tech Stack
-
React.js
-
Redux
Project Background
We’re in the process of creating a new app to help challenge members to view their submissions and their associated review results in order to improve the overall user experience in our platform.
Code Access
Frontend:
Repo: https://github.com/topcoder-platform/submission-review-ui
Branch: develop
Backend: https://github.com/topcoder-platform/submission-review-api
Repo: develop
Detailed requirements
1. Challenge Details page
-
Use the /v4/challenges/{challengeId} endpoint to fetch challenge information.
-
Use the v4/members/{memberHandle}/challenges?filter=id={challengeId} endpoint (from the provided backend) to fetch the user’s roles on the challenge.
-
Use the /challengeSubmissions endpoint (from the provided backend) to fetch challenge submissions. All challenge types can have a submission history. Not just MMs.
-
If there are no submissions returned by the backend or if there is an authentication error, show the message from this screen https://tc-sub-review-app-design.herokuapp.com/#artboard5
2. Submission Details page
-
Use the /v4/challenges/{challengeId} endpoint to fetch challenge information.
-
Use the v4/members/{memberHandle}/challenges?filter=id={challengeId} endpoint to fetch the user’s roles on the challenge.
-
Use the /challengeSubmissions/:submissionId/reviews endpoint (from the provided backend) to fetch submission reviews.
-
If there are no reviews returned by the backend or if there is an authentication error, show the message from this screen https://tc-sub-review-app-design.herokuapp.com/#artboard7
-
The download submission link must be integrated with the /challengeSubmissions/:submissionId/download endpoint (from the provided backend).
Documentation
Update the existing README.md if there are any new prerequisites or steps needed to run the app after your changes.
Important notes
-
Follow the best practices for React.js applications.
-
Properly use Redux.
-
Properly use PropTypes.
-
Follow the https://standardjs.com/ for code formatting.
What to Submit
Submit a git patch for the latest commit in the develop branch and provide instruction on how to apply your patch. Make sure to mention the exact commit to help reviewers apply your patch file.