fix: enhance spotlight quiz functionality and clean up FormCoordinates component

- Improved the spotlight quiz logic to handle reveal mode for different question types, ensuring the correct reference/explanation is displayed for 'draw_image', 'pin_image', and 'coordinates'.
- Removed unnecessary field value assignment in the FormCoordinates component to streamline the code and improve readability.
- Added a null check for the option in FormCoordinates to prevent rendering issues when no option is available.

Author: saadman30

assets/src/js/front/course/_spotlight-quiz.js

@@ -105,8 +105,11 @@ window.jQuery(document).ready($ => {
         // Reveal mode for draw_image & coordinates: show reference/explanation.
         if (is_reveal_mode() && ['draw_image', 'coordinates'].includes($question_wrap.data('question-type'))) {
             $question_wrap.find('.tutor-quiz-explanation-wrapper').removeClass('tutor-d-none');
-            if ($question_wrap.data('question-type') === 'draw_image') {
+            const qType = $question_wrap.data('question-type');
+            if (qType === 'draw_image') {
                 $question_wrap.find('.tutor-draw-image-reference-wrapper').removeClass('tutor-d-none');
+            } else if (qType === 'coordinates') {
+                $question_wrap.find('.tutor-coordinates-reference-wrapper').removeClass('tutor-d-none');
             }
             goNext = true;
         }

assets/src/js/v3/entries/course-builder/components/curriculum/question-types/Coordinates.tsx

@@ -58,10 +58,6 @@ const Coordinates = () => {
         render={(controllerProps) => (
           <FormCoordinates
             {...controllerProps}
-            field={{
-              ...controllerProps.field,
-              value: controllerProps.field.value as QuizQuestionOption,
-            }}
             questionId={activeQuestionId}
             validationError={validationError}
             setValidationError={setValidationError}

assets/src/js/v3/shared/components/fields/quiz/questions/FormCoordinates.tsx

@@ -219,6 +219,10 @@ const FormCoordinates = ({ field }: FormCoordinatesProps) => {
     [option, updateOption],
   );
 
+  if (!option) {
+    return null;
+  }
+
   return (
     <div css={styles.wrapper}>
       <div css={styles.card}>