catchup-library-web 2.0.6 → 2.0.8

package/src/components/activities/MCSAActivityContent.tsx

@@ -10,7 +10,7 @@ import DividerLine from "../dividers/DividerLine";
 import VerticalDividerLine from "../dividers/VerticalDividerLine";
 
 const MCSAActivityContent = ({
-  answer,
+  answerMap,
   data,
   canAnswerQuestion,
   changeAnswer,
@@ -21,14 +21,14 @@ const MCSAActivityContent = ({
   const MCSABodyMap = parseBodyMapFromData(data, "MCSA");
   const MCSAMaterialMap = parseMaterialMapFromData(data, "MCSA");
 
-  const handleMCSAAnswerOnChange = (answer: any, key: any, value: string) => {
+  const handleMCSAAnswerOnChange = (
+    answerMap: any,
+    key: any,
+    value: string
+  ) => {
     if (isPreview) return;
-    let foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "MCSA"
-    );
-    const answerMap = answer.data[foundIndex].answerMap;
     answerMap[key] = value;
-    changeAnswer(answer);
+    changeAnswer(answerMap);
   };
 
   return (
@@ -45,7 +45,7 @@ const MCSAActivityContent = ({
       <div className={`${isFullScreen ? "w-full" : "w-full md:flex-1"}`}>
         <MCSAActivityMaterialContent
           uniqueValue={JSON.stringify(data.contentMap)}
-          answer={answer}
+          answerMap={answerMap}
           materialMap={MCSAMaterialMap}
           contentMap={contentMap}
           checkCanAnswerQuestion={canAnswerQuestion}

package/src/components/activities/MatchingActivityContent.tsx

@@ -9,7 +9,7 @@ import ActivityBodyContent from "./body-contents/ActivityBodyContent";
 import MatchingActivityMaterialContent from "./material-contents/MatchingActivityMaterialContent";
 
 const MatchingActivityContent = ({
-  answer,
+  answerMap,
   data,
   canAnswerQuestion,
   changeAnswer,
@@ -21,17 +21,13 @@ const MatchingActivityContent = ({
   const matchingMaterialMap = parseMaterialMapFromData(data, "MATCHING");
 
   const handleMatchingAnswerOnChange = (
-    answer: any,
+    answerMap: any,
     key: any,
     value: string | null
   ) => {
     if (isPreview) return;
-    let foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "MATCHING"
-    );
-    const answerMap = answer.data[foundIndex].answerMap;
     answerMap[key] = value;
-    changeAnswer(answer);
+    changeAnswer(answerMap);
   };
 
   return (
@@ -43,7 +39,7 @@ const MatchingActivityContent = ({
       <DividerLine />
       <MatchingActivityMaterialContent
         uniqueValue={JSON.stringify(data.contentMap)}
-        answer={answer}
+        answerMap={answerMap}
         materialMap={matchingMaterialMap}
         contentMap={contentMap}
         checkCanAnswerQuestion={canAnswerQuestion}

package/src/components/activities/OpenEndedActivityContent.tsx

@@ -9,7 +9,7 @@ import DividerLine from "../dividers/DividerLine";
 import VerticalDividerLine from "../dividers/VerticalDividerLine";
 
 const OpenEndedActivityContent = ({
-  answer,
+  answerMap,
   data,
   changeAnswer,
   canAnswerQuestion,
@@ -20,14 +20,10 @@ const OpenEndedActivityContent = ({
   const contentMap = parseContentMapFromData(data);
   const openEndedBodyMap = parseBodyMapFromData(data, "OPEN_ENDED");
 
-  const handleOpenEndedAnswerOnChange = (answer: any, value: string) => {
+  const handleOpenEndedAnswerOnChange = (answerMap: any, value: string) => {
     if (isPreview) return;
-    let foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "OPEN_ENDED"
-    );
-    const answerMap = answer.data[foundIndex].answerMap;
     answerMap["ANSWER"] = value;
-    changeAnswer(answer);
+    changeAnswer(answerMap);
   };
 
   return (
@@ -59,7 +55,7 @@ const OpenEndedActivityContent = ({
           </div>
           <div className={`${isFullScreen ? "w-full" : "w-full md:flex-1"}`}>
             <OpenEndedActivityMaterialContent
-              answer={answer}
+              answerMap={answerMap}
               contentMap={contentMap}
               checkCanAnswerQuestion={canAnswerQuestion}
               onChange={handleOpenEndedAnswerOnChange}

package/src/components/activities/OrderingActivityContent.tsx

@@ -9,7 +9,7 @@ import ActivityBodyContent from "./body-contents/ActivityBodyContent";
 import OrderingActivityMaterialContent from "./material-contents/OrderingActivityMaterialContent";
 
 const OrderingActivityContent = ({
-  answer,
+  answerMap,
   data,
   canAnswerQuestion,
   changeAnswer,
@@ -22,19 +22,15 @@ const OrderingActivityContent = ({
   const orderingMaterialMap = parseMaterialMapFromData(data, "ORDERING");
 
   const handleOrderingAnswerOnChange = (
-    answer: any,
+    answerMap: any,
     primaryKey: any,
     secondaryKey: any
   ) => {
     if (isPreview) return;
-    let foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "ORDERING"
-    );
-    const answerMap = answer.data[foundIndex].answerMap;
     const prevValue = answerMap[primaryKey];
     answerMap[primaryKey] = answerMap[secondaryKey];
     answerMap[secondaryKey] = prevValue;
-    changeAnswer(answer);
+    changeAnswer(answerMap);
   };
 
   return (
@@ -46,7 +42,7 @@ const OrderingActivityContent = ({
       <DividerLine />
       <OrderingActivityMaterialContent
         uniqueValue={JSON.stringify(data.contentMap)}
-        answer={answer}
+        answerMap={answerMap}
         materialMap={orderingMaterialMap}
         contentMap={contentMap}
         checkCanAnswerQuestion={canAnswerQuestion}

package/src/components/activities/TrueFalseActivityContent.tsx

@@ -10,7 +10,7 @@ import DividerLine from "../dividers/DividerLine";
 import VerticalDividerLine from "../dividers/VerticalDividerLine";
 
 const TrueFalseActivityContent = ({
-  answer,
+  answerMap,
   data,
   canAnswerQuestion,
   changeAnswer,
@@ -22,20 +22,12 @@ const TrueFalseActivityContent = ({
   const trueFalseBodyMap = parseBodyMapFromData(data, "TRUE_FALSE");
   const trueFalseMaterialMap = parseMaterialMapFromData(data, "TRUE_FALSE");
 
-  const retrieveCurrentAnswerMap = () => {
-    let foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "TRUE_FALSE"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
-
   const handleTrueFalseAnswerOnChange = (
-    answer: any,
+    answerMap: any,
     key: any,
     value: string
   ) => {
     if (isPreview) return;
-    const answerMap = retrieveCurrentAnswerMap();
     if (key === "TRUE") {
       const foundFalseIndex = answerMap.falseList.findIndex(
         (item: string) => item === value
@@ -63,7 +55,7 @@ const TrueFalseActivityContent = ({
         answerMap.falseList.push(value);
       }
     }
-    changeAnswer(answer);
+    changeAnswer(answerMap);
   };
 
   return (
@@ -84,7 +76,7 @@ const TrueFalseActivityContent = ({
       <div className={`${isFullScreen ? "w-full" : "w-full md:flex-1"}`}>
         <TrueFalseActivityMaterialContent
           uniqueValue={JSON.stringify(data.contentMap)}
-          answer={answer}
+          answerMap={answerMap}
           materialMap={trueFalseMaterialMap}
           contentMap={contentMap}
           checkCanAnswerQuestion={canAnswerQuestion}

package/src/components/activities/material-contents/DropdownActivityMaterialContent.tsx

@@ -13,7 +13,7 @@ import ShowMaterialMediaByContentType from "./ShowMaterialMediaByContentType";
 
 const DropdownActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   materialMap,
   contentMap,
   checkCanAnswerQuestion,
@@ -25,15 +25,10 @@ const DropdownActivityMaterialContent = ({
 
   useEffect(() => {
     if (!showCorrectAnswer) return;
-    const foundAnswer = answer.data.find(
-      (answerData: any) => answerData.type === "DROPDOWN"
-    );
-    if (foundAnswer.answerMap.length === 0) return;
-    if (Object.keys(materialMap).length === 0) return;
-    foundAnswer.answerMap = Object.keys(materialMap).map(
+    answerMap = Object.keys(materialMap).map(
       (materialMapKey, index) => Object.keys(materialMap[materialMapKey])[0]
     );
-    onChange(answer, 0, Object.keys(materialMap[0])[0]);
+    onChange(answerMap, 0, Object.keys(materialMap[0])[0]);
     setUpdated(true);
   }, [showCorrectAnswer]);
 
@@ -42,13 +37,6 @@ const DropdownActivityMaterialContent = ({
     setUpdated(false);
   }, [updated]);
 
-  const retrieveAnswerMap = () => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "DROPDOWN"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
-
   const checkAnswerState = (correctAnswer: string, learnerAnswer: string) => {
     if (!isPreview) return null;
     if (correctAnswer === learnerAnswer) {
@@ -57,8 +45,6 @@ const DropdownActivityMaterialContent = ({
     return "INCORRECT";
   };
 
-  const answerMap = retrieveAnswerMap();
-
   return (
     <div className="flex flex-row flex-wrap items-center">
       <div className="hidden md:block">
@@ -125,7 +111,11 @@ const DropdownActivityMaterialContent = ({
                                 value: materialOption,
                               }))}
                               onChange={(e) => {
-                                onChange(answer, materialKey, e.target.value);
+                                onChange(
+                                  answerMap,
+                                  materialKey,
+                                  e.target.value
+                                );
                               }}
                             />
                           </div>
@@ -165,7 +155,7 @@ const DropdownActivityMaterialContent = ({
                                 ),
                                 onClick: (e: any) => {
                                   onChange(
-                                    answer,
+                                    answerMap,
                                     materialKey,
                                     e.target.currentSrc
                                   );

package/src/components/activities/material-contents/FillInTheBlanksActivityMaterialContent.tsx

@@ -11,7 +11,7 @@ import { constructInputWithSpecialExpressionList } from "../../../utilization/Ca
 
 const FillInTheBlanksActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   optionList,
   materialMap,
   contentMap,
@@ -43,24 +43,11 @@ const FillInTheBlanksActivityMaterialContent = ({
 
   useEffect(() => {
     if (!showCorrectAnswer) return;
-    const foundAnswer = answer.data.find(
-      (answerData: any) => answerData.type === "FILL_IN_THE_BLANKS"
-    );
-    if (!foundAnswer || foundAnswer.answerMap.length === 0) return;
-    if (Object.keys(materialMap).length === 0) return;
-    foundAnswer.answerMap = Object.keys(materialMap).map(
+    answerMap = Object.keys(materialMap).map(
       (materialMapKey) => JSON.parse(materialMap[materialMapKey])[0]
     );
-
-    onChange(answer, 0, JSON.parse(materialMap[0])[0]);
-  }, [showCorrectAnswer, answer, materialMap, onChange]);
-
-  const retrieveAnswerMap = (): Record<string, any> => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "FILL_IN_THE_BLANKS"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
+    onChange(answerMap, 0, JSON.parse(materialMap[0])[0]);
+  }, [showCorrectAnswer]);
 
   const checkAnswerState = (
     correctAnswerList: any[],
@@ -113,7 +100,7 @@ const FillInTheBlanksActivityMaterialContent = ({
 
   const handleMouseUp = (): void => {
     if (dropTargetIndex !== null && draggedOption !== null) {
-      onChange(answer, dropTargetIndex, draggedOption);
+      onChange(answerMap, dropTargetIndex, draggedOption);
     }
     setDraggedOption(null);
     setDropTargetIndex(null);
@@ -156,7 +143,7 @@ const FillInTheBlanksActivityMaterialContent = ({
 
   const handleTouchEnd = (): void => {
     if (dropTargetIndex !== null && draggedOption !== null) {
-      onChange(answer, dropTargetIndex, draggedOption);
+      onChange(answerMap, dropTargetIndex, draggedOption);
     }
     setDraggedOption(null);
     setDropTargetIndex(null);
@@ -172,13 +159,11 @@ const FillInTheBlanksActivityMaterialContent = ({
 
   const handleDropZoneClick = (index: string): void => {
     if (selectedOption !== null) {
-      onChange(answer, index, selectedOption);
+      onChange(answerMap, index, selectedOption);
       setSelectedOption(null);
     }
   };
 
-  const answerMap = retrieveAnswerMap();
-
   return (
     <div
       className="flex flex-row flex-wrap items-center"
@@ -352,7 +337,7 @@ const FillInTheBlanksActivityMaterialContent = ({
                                 onClick={(e) => {
                                   if (answerMap[materialKey]) {
                                     e.stopPropagation();
-                                    onChange(answer, materialKey, "");
+                                    onChange(answerMap, materialKey, "");
                                   }
                                 }}
                               >
@@ -404,7 +389,7 @@ const FillInTheBlanksActivityMaterialContent = ({
                             className="flex-1 cursor-pointer"
                             onClick={(e) => {
                               e.stopPropagation();
-                              onChange(answer, materialKey, "");
+                              onChange(answerMap, materialKey, "");
                             }}
                           >
                             <ShowMaterialMediaByContentType

package/src/components/activities/material-contents/GroupingActivityMaterialContent.tsx

@@ -7,7 +7,7 @@ import { IGroupingActivityMaterialProps } from "../../../properties/ActivityProp
 
 const GroupingActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   materialMap,
   contentMap,
   checkCanAnswerQuestion,
@@ -59,10 +59,8 @@ const GroupingActivityMaterialContent = ({
 
   useEffect(() => {
     if (!showCorrectAnswer) return;
-    answer.data.find(
-      (answerData: any) => answerData.type === "GROUPING"
-    ).answerMap = materialMap;
-  }, [showCorrectAnswer, answer, materialMap]);
+    answerMap = materialMap;
+  }, [showCorrectAnswer, answerMap, materialMap]);
 
   useEffect(() => {
     if (!dropTargetKey || !dropZoneRefs.current[dropTargetKey]) return;
@@ -130,14 +128,6 @@ const GroupingActivityMaterialContent = ({
     requestAnimationFrame(animate);
   }, [dropTargetKey]);
 
-  const retrieveAnswerMap = () => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "GROUPING"
-    );
-    const answerMap = answer.data[foundIndex].answerMap;
-    return answerMap;
-  };
-
   const retrieveFilteredMaterialList = (answerMap: any) => {
     const selectedValueList: any = [];
     Object.keys(answerMap).forEach((key) => {
@@ -196,7 +186,7 @@ const GroupingActivityMaterialContent = ({
 
   const handleMouseUp = (): void => {
     if (dropTargetKey !== null && draggedValue !== null) {
-      onChange(answer, dropTargetKey, draggedValue, null);
+      onChange(answerMap, dropTargetKey, draggedValue, null);
     }
     setDraggedValue(null);
     setDropTargetKey(null);
@@ -240,7 +230,7 @@ const GroupingActivityMaterialContent = ({
 
   const handleTouchEnd = (): void => {
     if (dropTargetKey !== null && draggedValue !== null) {
-      onChange(answer, dropTargetKey, draggedValue, null);
+      onChange(answerMap, dropTargetKey, draggedValue, null);
     }
     setDraggedValue(null);
     setDropTargetKey(null);
@@ -257,12 +247,11 @@ const GroupingActivityMaterialContent = ({
 
   const handleDropZoneClick = (answerMapKey: string): void => {
     if (selectedValue !== null) {
-      onChange(answer, answerMapKey, selectedValue, null);
+      onChange(answerMap, answerMapKey, selectedValue, null);
       setSelectedValue(null);
     }
   };
 
-  const answerMap = retrieveAnswerMap();
   const filteredMaterialList = retrieveFilteredMaterialList(answerMap);
 
   return (
@@ -518,7 +507,7 @@ const GroupingActivityMaterialContent = ({
                                   e.stopPropagation();
                                   if (checkCanAnswerQuestion()) {
                                     onChange(
-                                      answer,
+                                      answerMap,
                                       answerMapKey,
                                       null,
                                       answerMapIndex

package/src/components/activities/material-contents/MCMAActivityMaterialContent.tsx

@@ -8,20 +8,13 @@ import DividerLine from "../../dividers/DividerLine";
 
 const MCMAActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   materialMap,
   contentMap,
   checkCanAnswerQuestion,
   onChange,
   isPreview,
 }: IMCMAActivityMaterialProps) => {
-  const retrieveAnswerMap = () => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "MCMA"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
-
   const retrieveCorrectAnswerList = () => {
     return JSON.parse(Object.keys(materialMap)[0]);
   };
@@ -42,7 +35,6 @@ const MCMAActivityMaterialContent = ({
     return "INCORRECT";
   };
 
-  const answerMap = retrieveAnswerMap();
   const correctAnswerList = retrieveCorrectAnswerList();
 
   return Object.keys(materialMap).map((materialKey, index) => {
@@ -84,7 +76,7 @@ const MCMAActivityMaterialContent = ({
                           : ""
                       }`}
                       onClick={() => {
-                        onChange(answer, materialKey, materialSubKey);
+                        onChange(answerMap, materialKey, materialSubKey);
                       }}
                     >
                       <BaseImage

package/src/components/activities/material-contents/MCSAActivityMaterialContent.tsx

@@ -8,20 +8,13 @@ import DividerLine from "../../dividers/DividerLine";
 
 const MCSAActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   materialMap,
   contentMap,
   checkCanAnswerQuestion,
   onChange,
   isPreview,
 }: IMCSAActivityMaterialProps) => {
-  const retrieveAnswerMap = () => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "MCSA"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
-
   const retrieveCorrectAnswer = () => {
     return Object.keys(materialMap)[0];
   };
@@ -39,7 +32,6 @@ const MCSAActivityMaterialContent = ({
     return "INCORRECT";
   };
 
-  const answerMap = retrieveAnswerMap();
   const correctAnswer = retrieveCorrectAnswer();
 
   return Object.keys(materialMap).map((materialKey, index) => {
@@ -83,7 +75,7 @@ const MCSAActivityMaterialContent = ({
                           : ""
                       }`}
                       onClick={() => {
-                        onChange(answer, materialKey, materialSubKey);
+                        onChange(answerMap, materialKey, materialSubKey);
                       }}
                     >
                       <BaseImage

package/src/components/activities/material-contents/MatchingActivityMaterialContent.tsx

@@ -7,7 +7,7 @@ import DividerLine from "../../dividers/DividerLine";
 
 const MatchingActivityMaterialContent = ({
   uniqueValue,
-  answer,
+  answerMap,
   materialMap,
   contentMap,
   checkCanAnswerQuestion,
@@ -57,10 +57,8 @@ const MatchingActivityMaterialContent = ({
 
   useEffect(() => {
     if (!showCorrectAnswer) return;
-    answer.data.find(
-      (answerData: any) => answerData.type === "MATCHING"
-    ).answerMap = materialMap;
-  }, [showCorrectAnswer, answer, materialMap]);
+    answerMap = materialMap;
+  }, [showCorrectAnswer]);
 
   useEffect(() => {
     if (!dropTargetKey || !dropZoneRefs.current[dropTargetKey]) return;
@@ -128,13 +126,6 @@ const MatchingActivityMaterialContent = ({
     requestAnimationFrame(animate);
   }, [dropTargetKey]);
 
-  const retrieveAnswerMap = () => {
-    const foundIndex = answer.data.findIndex(
-      (answerData: any) => answerData.type === "MATCHING"
-    );
-    return answer.data[foundIndex].answerMap;
-  };
-
   const retrieveFilteredMaterialList = (answerMap: any) => {
     const selectedValueList: any = [];
     Object.keys(answerMap).forEach((key) => {
@@ -188,7 +179,7 @@ const MatchingActivityMaterialContent = ({
 
   const handleMouseUp = (): void => {
     if (dropTargetKey !== null && draggedValue !== null) {
-      onChange(answer, dropTargetKey, draggedValue);
+      onChange(answerMap, dropTargetKey, draggedValue);
     }
     setDraggedValue(null);
     setDropTargetKey(null);
@@ -232,7 +223,7 @@ const MatchingActivityMaterialContent = ({
 
   const handleTouchEnd = (): void => {
     if (dropTargetKey !== null && draggedValue !== null) {
-      onChange(answer, dropTargetKey, draggedValue);
+      onChange(answerMap, dropTargetKey, draggedValue);
     }
     setDraggedValue(null);
     setDropTargetKey(null);
@@ -249,12 +240,11 @@ const MatchingActivityMaterialContent = ({
 
   const handleDropZoneClick = (answerMapKey: string): void => {
     if (selectedValue !== null) {
-      onChange(answer, answerMapKey, selectedValue);
+      onChange(answerMap, answerMapKey, selectedValue);
       setSelectedValue(null);
     }
   };
 
-  const answerMap = retrieveAnswerMap();
   const filteredMaterialList = retrieveFilteredMaterialList(answerMap);
 
   return (
@@ -513,7 +503,7 @@ const MatchingActivityMaterialContent = ({
                   onClick={(e) => {
                     e.stopPropagation();
                     if (checkCanAnswerQuestion() && answerMap[answerMapKey]) {
-                      onChange(answer, answerMapKey, null);
+                      onChange(answerMap, answerMapKey, null);
                       setSelectedValue(null);
                     }
                   }}

package/src/components/activities/material-contents/OpenEndedActivityMaterialContent.tsx

@@ -7,28 +7,11 @@ import BaseImage from "../../images/BaseImage";
 import BasePDF from "../../pdfs/BasePDF";
 
 const OpenEndedActivityMaterialContent = ({
-  answer,
+  answerMap,
   contentMap,
   checkCanAnswerQuestion,
   onChange,
 }: IOpenEndedActivityMaterialProps) => {
-  const retrieveAnswer = () => {
-    if (!answer)
-      return {
-        answerMap: {
-          ANSWER: "",
-        },
-      };
-    return answer.data.find(
-      (answerData: any) => answerData.type === "OPEN_ENDED"
-    );
-  };
-
-  const retrieveAnswerMap = () => {
-    const { answerMap } = retrieveAnswer();
-    return answerMap;
-  };
-
   const RenderTextContent = (answerMap: any) => {
     const answerMapAnswer = answerMap["ANSWER"];
     let documentType: string = "TEXT";
@@ -71,7 +54,7 @@ const OpenEndedActivityMaterialContent = ({
           useMinHeight={true}
           onChange={(e) => {
             if (checkCanAnswerQuestion()) {
-              onChange(answer, e.target.value);
+              onChange(answerMap, e.target.value);
             }
           }}
         />
@@ -117,8 +100,6 @@ const OpenEndedActivityMaterialContent = ({
     );
   };
 
-  const answerMap = retrieveAnswerMap();
-
   return (
     <>
       <div className="">