Challenge Overview
CONTEXT
PROJECT CONTEXT
We’re building an internal crowdsourcing tool to post simple and moderately complex tasks and ideas; where qualified contacts from the company can pick the tasks and deliver them in a timely manner. The requestor can create the tasks on the tool and the worker can pick the tasks from the pool and deliver them.
CHALLENGE CONTEXT
You are responsible for integrating the required pages with the backend APIs.
CHALLENGE DETAILS
TECHNOLOGY
-
React.js
-
API Integration
-
OKTA
INDIVIDUAL REQUIREMENTS
Integrate with Okta
-
it should integrate with Okta SAML login, please refer to the backend/demo to see how it should be integrated.
-
After the user is logged from Okta Login Page, the user is redirected back to the app with the token.
-
Then the app should call the /me API to get the user info as well as unread notification count
General Logic and Note
-
The app supports both requestor and worker role, and by default the worker role is displayed
-
User can switch between requestor and worker role by clicking the role in the header
-
The page will be rendered differently based upon user’s selected role. Please redirect user to the dashboard page when switching roles.
-
when calling the APIs, the current role should be passed in the request header, and the API will return data corresponding to the current role.
Integrate Dashboard Page
-
It’s the landing page of the application
-
both roles should be supported
-
for requestor role, an action dropdown is displayed for the challenge
-
requestor can only activate draft challenge
-
requestor can only deactivate active challenge
-
requestor can only edit draft and active challenge
-
requestor can only delete draft challenge
-
the completed and failed challenges are readonly
-
Integrate Create Task Page
-
it’s for requestor role only
-
Input validation should be implemented
-
All fields are required if the task is active
-
Only title is required if the task is draft
-
Integrate Task Details Page
-
both roles should be supported
-
all actions on this page for both roles are in scope
-
completed and failed tasks are readonly
-
requestor can edit draft and active tasks.
-
Input validation
-
when editing the active task, the edited fields are required
-
when editing the draft task, the edited fields are optional
-
-
when listing the submissions (for non draft task), the submission status is also displayed
-
Don’t show the icon if the submission is waiting for review
-
Requestor can mark awaiting-review submission as accepted or rejected, or delete it
-
Requestor cannot delete / accept / reject accepted or rejected submission again
-
-
-
worker can only register in active task whose availableSlot > 0
-
worker can unregister from registered active task if deadline is not reached
-
worker cannot remove the submission if it’s accepted or rejected
-
worker can submit in the registered active task if
-
the deadline is not reached
-
the previous submission is not accepted
-
The following flow should be implemented correctly:
-
requestor creates a task
-
two or more workers register into the task and submit
-
requestor accepts one submission and rejects the other one
-
The worker whose submission is rejected can resubmit the submission.
requestor accepts the 2nd submission, and finally accept or reject the task.
Note
-
All the navigation and actions on the page should work.
-
Show loading indicator when API call is in progress
-
You should only show the buttons if user is allowed to perform the corresponding actions.
-
You are responsible for fixing any UI bugs to make the page work properly
-
Please check the UI mapping document to see what apis should be called on each page (in the backend/
-
Please show success / error snackbar like below for the user actions on the page:
-
Settings, Notifications, User Help, Profile pages are not in scope
Submission Guidelines
-
Patch file
-
Verification Guide