fix: gate guide lesson advance on checkpoints

Author: jderochervlk

apps/guide/__tests__/GuideHome_.test.res

@@ -2,6 +2,7 @@ open Vitest
 
 let firstLesson = GuideTestFixtures.firstLesson
 let secondLesson = GuideTestFixtures.secondLesson
+let guideLessonsWithFinal = GuideTestFixtures.guideLessonsWithFinal
 let renderGuideHome = GuideTestFixtures.renderGuideHome
 let renderGuideHomeWithDocsIntroNavigation = GuideTestFixtures.renderGuideHomeWithDocsIntroNavigation
 let renderGuideHomeInBrowser = GuideTestFixtures.renderGuideHomeInBrowser
@@ -124,6 +125,24 @@ test("enables Done on a completed final lesson", async () => {
   GuideLayout.clearExerciseCode(secondLesson.exercise.id)
 })
 
+test("keeps Next disabled until the current checkpoint is complete", async () => {
+  await viewport(1440, 900)
+  GuideLayout.clearCompletedExercises()
+  GuideLayout.clearExerciseCode(secondLesson.exercise.id)
+
+  let screen = await render(
+    <ReactRouter.MemoryRouter initialEntries=["/#functions"]>
+      <GuideHome lessons=guideLessonsWithFinal />
+    </ReactRouter.MemoryRouter>,
+  )
+  let nextButton = await screen->getByText("Next")
+
+  await nextButton->element->toBeDisabled
+
+  GuideLayout.clearCompletedExercises()
+  GuideLayout.clearExerciseCode(secondLesson.exercise.id)
+})
+
 test("Done on a completed final lesson opens the ReScript docs intro", async () => {
   await viewport(1440, 900)
   GuideLayout.clearCompletedExercises()

apps/guide/__tests__/GuideTestFixtures.res

@@ -38,7 +38,24 @@ let greeting = greet("ReScript")`,
   },
 }
 
+let finalLesson: GuideLesson.t = {
+  id: "final-check",
+  position: 3,
+  sourcePath: "app/lessons/03-final-check.mdx",
+  missionLabel: "Mission 03",
+  title: "Final Check",
+  description: "Finish the guide.",
+  content: `Complete the final checkpoint.`,
+  exercise: {
+    id: "final-check/done",
+    title: "Finish",
+    initialCode: `let done = true`,
+    check: ExpectedOutput("true"),
+  },
+}
+
 let guideLessons = [firstLesson, secondLesson]
+let guideLessonsWithFinal = [firstLesson, secondLesson, finalLesson]
 
 let renderGuideHome = (~initialEntries=["/"], ()) =>
   render(

apps/guide/app/GuideLessonNavigationHook.res

@@ -58,7 +58,7 @@ let useLessonNavigation = (~lessons, ~goToDocsIntro): t => {
   let hasNextLesson = GuideLesson.hasNextLesson(~lessons, lessonIndex)
   let exercisePassed = GuideLesson.isExerciseComplete(~exercise, ~output)
   let checkpointComplete = exercisePassed || GuideLayout.isExerciseCompleted(exercise.id)
-  let forwardActionEnabled = hasNextLesson || checkpointComplete
+  let forwardActionEnabled = checkpointComplete
 
   React.useEffect(() => {
     if exercisePassed {
@@ -75,7 +75,7 @@ let useLessonNavigation = (~lessons, ~goToDocsIntro): t => {
   }
 
   let goToNextLesson = _event => {
-    if hasNextLesson {
+    if hasNextLesson && checkpointComplete {
       let nextLessonIndex = lessonIndex + 1
       navigateToLesson(~goToHash, ~setLessonIndex, ~setOutput, ~lessons, nextLessonIndex)
     } else if checkpointComplete {