Skip to content

Conversation

@bryanjenningz
Copy link
Collaborator

@bryanjenningz bryanjenningz commented Sep 26, 2022

Changes:

  • User's answers get saved on the frontend.
  • Exercise preview get displayed differently based on whether the user answered that question.
  • Fixed exercise list styling bug that occurred when there were only 1 or 2 exercises.

How to test:

  • Create a DOJO module at /admin/lessons/js0/modules
  • Create a DOJO exercise at /curriculum/js0/mentor
  • Go to the DOJO exercises page at /exercises/js0
  • Click on "SOLVE EXERCISES" button.
  • Answer an exercise.
  • Click back arrow and verify that the exercise is now marked as answered.

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

@vercel
Copy link

vercel bot commented Sep 26, 2022

@bryanjenningz is attempting to deploy a commit to the c0d3-prod Team on Vercel.

A member of the Team first needs to authorize it.

@vercel
Copy link

vercel bot commented Sep 26, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
c0d3-app ✅ Ready (Inspect) Visit Preview Sep 26, 2022 at 11:37PM (UTC)

@codecov
Copy link

codecov bot commented Sep 26, 2022

Codecov Report

Merging #2351 (2cc2338) into master (bd435cd) will not change coverage.
The diff coverage is 100.00%.

❗ Current head 2cc2338 differs from pull request most recent head 2e5e117. Consider uploading reports for the commit 2e5e117 to get more accurate results

Impacted file tree graph

@@            Coverage Diff            @@
##            master     #2351   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          181       181           
  Lines         3184      3186    +2     
  Branches       841       842    +1     
=========================================
+ Hits          3184      3186    +2     
Impacted Files Coverage Δ
__dummy__/getExercisesData.ts 100.00% <ø> (ø)
components/ExerciseCard/ExerciseCard.tsx 100.00% <100.00%> (ø)
pages/exercises/[lessonSlug].tsx 100.00% <100.00%> (ø)
pages/api/graphql.ts 100.00% <0.00%> (ø)

{ moduleName: 'Variables', state: 'NOT ANSWERED', problem: exampleProblem },
{ moduleName: 'Variables', state: 'ANSWERED', problem: exampleProblem }
]

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed the mock exercise previews, we're now using the backend exercises for the previews.

const { lessons, alerts, exercises } = queryData
const router = useRouter()
const [exerciseIndex, setExerciseIndex] = useState(-1)
const [userAnswers, setUserAnswers] = useState<Record<number, string>>({})
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

hasPrevious={exerciseIndex > 0}
hasNext={exerciseIndex < currentExercises.length - 1}
submitUserAnswer={(userAnswer: string) =>
setUserAnswers({ ...userAnswers, [exercise.id]: userAnswer })
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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'}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 bryanjenningz merged commit e0863c8 into garageScript:master Sep 26, 2022
@bryanjenningz bryanjenningz deleted the mark-exercise-answered-based-on-user-answers branch September 26, 2022 23:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants