Mark exercise answered based on user answers #2351
Conversation
|
@bryanjenningz is attempting to deploy a commit to the c0d3-prod Team on Vercel. A member of the Team first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Codecov Report
@@ Coverage Diff @@
## master #2351 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 181 181
Lines 3184 3186 +2
Branches 841 842 +1
=========================================
+ Hits 3184 3186 +2
|
| { moduleName: 'Variables', state: 'NOT ANSWERED', problem: exampleProblem }, | ||
| { moduleName: 'Variables', state: 'ANSWERED', problem: exampleProblem } | ||
| ] | ||
|
|
There was a problem hiding this comment.
Removed the mock exercise previews, we're now using the backend exercises for the previews.
| const Exercises: React.FC<QueryDataProps<GetExercisesQuery>> = ({ | ||
| queryData | ||
| }) => { | ||
| const { lessons, alerts, exercises } = queryData | ||
| const router = useRouter() | ||
| const [exerciseIndex, setExerciseIndex] = useState(-1) | ||
| const [userAnswers, setUserAnswers] = useState<Record<number, string>>({}) |
There was a problem hiding this comment.
We store the user's answers on the frontend for now. They go away when you refresh the page. This is good for testing. In the next pull request, we'll get the user's answers from the backend.
| @@ -78,12 +64,21 @@ const Exercises: React.FC<QueryDataProps<GetExercisesQuery>> = ({ | |||
| lessonTitle={currentLesson.title} | |||
| hasPrevious={exerciseIndex > 0} | |||
| hasNext={exerciseIndex < currentExercises.length - 1} | |||
| submitUserAnswer={(userAnswer: string) => | |||
| setUserAnswers({ ...userAnswers, [exercise.id]: userAnswer }) | |||
There was a problem hiding this comment.
Here we add the user's answer to our userAnswers object which stores all the user's answers by exercise ID.
| state={exercisePreview.state} | ||
| problem={exercisePreview.problem} | ||
| moduleName={exercise.moduleName} | ||
| state={exercise.userAnswer === null ? 'NOT ANSWERED' : 'ANSWERED'} |
There was a problem hiding this comment.
Right now there are only 2 states, but I think there should be a third state in the future called "ANSWERED INCORRECTLY" or something similar. Maybe we can make "ANSWERED INCORRECTLY" red and then "NOT ANSWERED" can be gray or some neutral color.
bryanjenningz
deleted the
mark-exercise-answered-based-on-user-answers
branch
Changes:
How to test:
This pull request doesn't actually save the user's answers. If they refresh the page then their answers are cleared. We will store the user's answers on the backend in a subsequent pull request.
This pull request is a part of #2253 and #2251