ENCOA-311

src/components/ExamEditor/Exercises/MatchSentences/index.tsx

@@ -1,10 +1,10 @@
-import React, { useState, useMemo, useEffect } from 'react';
+import React, { useState, useMemo, useEffect, useCallback } from 'react';
 import {
   MdAdd,
   MdVisibility,
   MdVisibilityOff
 } from 'react-icons/md';
-import { MatchSentencesExercise, ReadingPart } from '@/interfaces/exam';
+import { Difficulty, MatchSentencesExercise, ReadingPart } from '@/interfaces/exam';
 import Alert, { AlertItem } from '../Shared/Alert';
 import ReferenceViewer from './ParagraphViewer';
 import Header from '../../Shared/Header';
@@ -21,6 +21,7 @@ import PromptEdit from '../Shared/PromptEdit';
 
 const MatchSentences: React.FC<{ exercise: MatchSentencesExercise, sectionId: number }> = ({ exercise, sectionId }) => {
   const { currentModule, dispatch } = useExamEditorStore();
+  const difficulty = useExamEditorStore((state) => state.modules[currentModule].difficulty);
   const { state } = useExamEditorStore(
     (state) => state.modules[currentModule].sections.find((section) => section.sectionId === sectionId)!
   );
@@ -147,12 +148,24 @@ const MatchSentences: React.FC<{ exercise: MatchSentencesExercise, sectionId: nu
     updateLocal(handleMatchSentencesReorder(event, local));
   }
 
+  const saveDifficulty = useCallback((diff: Difficulty) => {
+    if (!difficulty.includes(diff)) {
+        dispatch({ type: 'UPDATE_MODULE', payload: { updates: { difficulty: [...difficulty, diff]} } });
+    }
+    const updatedExercise = { ...exercise, difficulty: diff };
+    const newState = { ...section };
+    newState.exercises = newState.exercises.map((ex) => ex.id === exercise.id ? updatedExercise : ex );
+    dispatch({ type: 'UPDATE_SECTION_STATE', payload: { sectionId, update: newState, module: currentModule } });
+}, [currentModule, difficulty, dispatch, exercise, section, sectionId]);
+
   return (
     <div className="flex flex-col mx-auto p-2">
       <Header
         title={exercise.variant && exercise.variant == "ideaMatch" ? "Idea Match" : "Paragraph Match"}
         description={`Edit ${exercise.variant && exercise.variant == "ideaMatch" ? "ideas/opinions" : "headings"} and their matches`}
         editing={editing}
+        difficulty={exercise.difficulty}
+        saveDifficulty={saveDifficulty}
         handleSave={handleSave}
         handleDelete={handleDelete}
         handleDiscard={handleDiscard}