Fix Course curriculum page level presenter in preview mode (pupilfirs…

…t#803) Co-authored-by: Bodhish Thomas <[email protected]>
Inosuke200 · Oct 12, 2021 · abbf7ec · abbf7ec
1 parent 196e02d
commit abbf7ec
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 9 deletions.
diff --git a/app/javascript/courses/curricula/components/CoursesCurriculum.res b/app/javascript/courses/curricula/components/CoursesCurriculum.res
@@ -354,10 +354,9 @@ let make = (
 
   let (state, setState) = React.useState(() => {
     let statusOfTargets = computeTargetStatus(submissions)
-
     {
       selectedLevelId: switch (preview, targetLevelId, levelZero) {
-      | (true, None, None) => Level.first(levels) |> Level.id
+      | (true, None, _levelZero) => Level.first(levels)->Level.id
       | (_, Some(targetLevelId), Some(levelZero)) =>
         levelZero |> Level.id == targetLevelId ? teamLevelId : targetLevelId
       | (_, Some(targetLevelId), None) => targetLevelId
@@ -467,6 +466,7 @@ let make = (
             levels
             teamLevel
             selectedLevel
+            preview
             setSelectedLevelId={selectedLevelId =>
               setState(state => {...state, selectedLevelId: selectedLevelId})}
             showLevelZero=state.showLevelZero

diff --git a/app/javascript/courses/curricula/components/CoursesCurriculum__LevelSelector.res b/app/javascript/courses/curricula/components/CoursesCurriculum__LevelSelector.res
@@ -12,13 +12,15 @@ let levelZeroSelectorClasses = isSelected => {
 let levelName = level =>
   LevelLabel.format(~short=true, ~name=level |> Level.name, level |> Level.number |> string_of_int)
 
-let selectableLevels = (orderedLevels, teamLevel, setSelectedLevelId) => {
+let selectableLevels = (orderedLevels, teamLevel, setSelectedLevelId, preview) => {
   let teamLevelNumber = teamLevel |> Level.number
 
   orderedLevels |> Js.Array.map(level => {
     let levelNumber = level |> Level.number
 
-    let icon = if levelNumber < teamLevelNumber {
+    let icon = if preview {
+      "fas fa-eye"
+    } else if levelNumber < teamLevelNumber {
       "fas fa-check text-green-500"
     } else if levelNumber == teamLevelNumber {
       "fas fa-map-marker-alt text-blue-400"
@@ -38,7 +40,13 @@ let selectableLevels = (orderedLevels, teamLevel, setSelectedLevelId) => {
   })
 }
 
-let untabbedLevelSelector = (selectedLevel, orderedLevels, teamLevel, setSelectedLevelId) => {
+let untabbedLevelSelector = (
+  selectedLevel,
+  orderedLevels,
+  teamLevel,
+  setSelectedLevelId,
+  preview,
+) => {
   let selected =
     <button className="font-semibold w-full px-2 h-10 flex items-center justify-between">
       <span className="flex-grow text-center truncate w-0">
@@ -49,7 +57,7 @@ let untabbedLevelSelector = (selectedLevel, orderedLevels, teamLevel, setSelecte
 
   <Dropdown
     selected
-    contents={selectableLevels(orderedLevels, teamLevel, setSelectedLevelId)}
+    contents={selectableLevels(orderedLevels, teamLevel, setSelectedLevelId, preview)}
     className="flex-grow cursor-pointer rounded-lg bg-primary-100 hover:bg-gray-200 hover:text-primary-500"
   />
 }
@@ -62,6 +70,7 @@ let tabbedLevelSelector = (
   showLevelZero,
   setShowLevelZero,
   levelZero,
+  preview,
 ) => {
   let selected = hideCaret =>
     <button
@@ -81,7 +90,7 @@ let tabbedLevelSelector = (
     : <Dropdown
         key="numbered-level-selector"
         selected={selected(false)}
-        contents={selectableLevels(orderedLevels, teamLevel, setSelectedLevelId)}
+        contents={selectableLevels(orderedLevels, teamLevel, setSelectedLevelId, preview)}
         className="cursor-pointer flex-grow rounded-l-lg bg-primary-100 hover:bg-gray-200 hover:text-primary-500"
       />
 
@@ -102,6 +111,7 @@ let make = (
   ~levels,
   ~teamLevel,
   ~selectedLevel,
+  ~preview,
   ~setSelectedLevelId,
   ~showLevelZero,
   ~setShowLevelZero,
@@ -122,8 +132,10 @@ let make = (
           showLevelZero,
           setShowLevelZero,
           levelZero,
+          preview,
         )
-      | None => untabbedLevelSelector(selectedLevel, orderedLevels, teamLevel, setSelectedLevelId)
+      | None =>
+        untabbedLevelSelector(selectedLevel, orderedLevels, teamLevel, setSelectedLevelId, preview)
       }}
     </div>
   </div>

diff --git a/app/javascript/courses/curricula/types/CoursesCurriculum__Level.res b/app/javascript/courses/curricula/types/CoursesCurriculum__Level.res
@@ -30,7 +30,12 @@ let isLocked = t => !(t |> isUnlocked)
 
 let sort = levels => levels |> ArrayUtils.copyAndSort((x, y) => x.number - y.number)
 
-let first = levels => levels->sort->Js.Array.unsafe_get(0)
+let first = levels =>
+  ArrayUtils.unsafeFind(
+    level => level.number == 1,
+    "Unable to find level one at CoursesCurriculum__Level",
+    levels,
+  )
 
 let unlockDateString = t =>
   switch t.unlockAt {

diff --git a/spec/system/courses/public_preview_spec.rb b/spec/system/courses/public_preview_spec.rb
@@ -137,6 +137,22 @@
     expect(page).to have_text('You can access the content on')
   end
 
+  context 'when the course has level zero enabled' do
+    let(:level_0) { create :level, :zero, course: public_course_1 }
+    let(:target_group_l0) { create :target_group, level: level_0 }
+
+    before do
+      create :target, target_group: target_group_l0, role: Target::ROLE_TEAM
+    end
+
+    scenario 'user can preview level zero' do
+      visit curriculum_course_path(public_course_1)
+
+      expect(page).to have_button(level_0.name)
+      expect(page).to have_content("L1: #{level_1.name}")
+    end
+  end
+
   context 'when the user is a student in another course' do
     let(:student) { create :founder }
     let(:enrolled_course) { student.course }