catchup-library-web 2.1.1 → 2.1.3

package/dist/index.d.mts

@@ -135,7 +135,6 @@ interface IOrderingActivityProps {
     changeAnswer: (e: any) => void;
     isPreview: boolean;
     showCorrectAnswer: boolean;
-    isFullScreen: boolean;
 }
 interface IDropdownActivityProps {
     answerMap: any;
@@ -255,7 +254,7 @@ declare const MCSAActivityContent: ({ answerMap, data, canAnswerQuestion, change
 
 declare const OpenEndedActivityContent: ({ answerMap, data, changeAnswer, canAnswerQuestion, showMaterialContent, isPreview, isFullScreen, }: IOpenEndedActivityProps) => react_jsx_runtime.JSX.Element;
 
-declare const OrderingActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, isFullScreen, }: IOrderingActivityProps) => react_jsx_runtime.JSX.Element;
+declare const OrderingActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, }: IOrderingActivityProps) => react_jsx_runtime.JSX.Element;
 
 declare const TrueFalseActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, isFullScreen, }: ITrueFalseActivityProps) => react_jsx_runtime.JSX.Element;
 
@@ -597,7 +596,7 @@ declare const convertToBodyMapString: (type: string, bodyMap: any) => any;
 declare const convertToSolutionMapString: (type: string, solutionMap: any) => any;
 declare const convertToEvaluationRubricMapString: (type: string, evaluationRubricMap: any) => any;
 declare const constructActivityData: (activityTemplateType: string, contentMap: any, bodyMap: any, materialMap: any, solutionMap: any, difficulty: string, evaluationRubricMap: any) => any;
-declare const constructAnswerBasedOnData: (data: any) => any;
+declare const constructAnswerBasedOnData: (type: string, data: any) => any;
 declare const constructActivityItemListBodyOnly: (bodyMap: any) => any;
 declare const constructActivityItemListMaterialOnly: (materialMap: any, type: string) => {
     type: string;

package/dist/index.d.ts

@@ -135,7 +135,6 @@ interface IOrderingActivityProps {
     changeAnswer: (e: any) => void;
     isPreview: boolean;
     showCorrectAnswer: boolean;
-    isFullScreen: boolean;
 }
 interface IDropdownActivityProps {
     answerMap: any;
@@ -255,7 +254,7 @@ declare const MCSAActivityContent: ({ answerMap, data, canAnswerQuestion, change
 
 declare const OpenEndedActivityContent: ({ answerMap, data, changeAnswer, canAnswerQuestion, showMaterialContent, isPreview, isFullScreen, }: IOpenEndedActivityProps) => react_jsx_runtime.JSX.Element;
 
-declare const OrderingActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, isFullScreen, }: IOrderingActivityProps) => react_jsx_runtime.JSX.Element;
+declare const OrderingActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, }: IOrderingActivityProps) => react_jsx_runtime.JSX.Element;
 
 declare const TrueFalseActivityContent: ({ answerMap, data, canAnswerQuestion, changeAnswer, isPreview, showCorrectAnswer, isFullScreen, }: ITrueFalseActivityProps) => react_jsx_runtime.JSX.Element;
 
@@ -597,7 +596,7 @@ declare const convertToBodyMapString: (type: string, bodyMap: any) => any;
 declare const convertToSolutionMapString: (type: string, solutionMap: any) => any;
 declare const convertToEvaluationRubricMapString: (type: string, evaluationRubricMap: any) => any;
 declare const constructActivityData: (activityTemplateType: string, contentMap: any, bodyMap: any, materialMap: any, solutionMap: any, difficulty: string, evaluationRubricMap: any) => any;
-declare const constructAnswerBasedOnData: (data: any) => any;
+declare const constructAnswerBasedOnData: (type: string, data: any) => any;
 declare const constructActivityItemListBodyOnly: (bodyMap: any) => any;
 declare const constructActivityItemListMaterialOnly: (materialMap: any, type: string) => {
     type: string;

package/dist/index.js

@@ -2298,7 +2298,19 @@ var retrieveActivityTemplateDTOOptionList = (activityTemplateSet) => {
 };
 var retrieveDefaultOrderingDataMap = (orderingMaterialMap) => {
   const dataMap = {};
-  Object.keys(orderingMaterialMap).sort(() => 0.5 - Math.random()).forEach((key, index) => {
+  const originalKeys = Object.keys(orderingMaterialMap);
+  const shuffledKeys = [...originalKeys];
+  for (let i = shuffledKeys.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [shuffledKeys[i], shuffledKeys[j]] = [shuffledKeys[j], shuffledKeys[i]];
+  }
+  const isSameOrder = shuffledKeys.every(
+    (key, index) => key === originalKeys[index]
+  );
+  if (isSameOrder && shuffledKeys.length >= 2) {
+    [shuffledKeys[0], shuffledKeys[1]] = [shuffledKeys[1], shuffledKeys[0]];
+  }
+  shuffledKeys.forEach((key, index) => {
     dataMap[index] = key;
   });
   return dataMap;
@@ -2967,56 +2979,35 @@ var constructActivityData = (activityTemplateType, contentMap, bodyMap, material
   }
   return constructedData;
 };
-var constructAnswerBasedOnData = (data) => {
-  if (Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "ORDERING",
-      JSON.parse(JSON.stringify(data))
-    );
+var constructAnswerBasedOnData = (type, data) => {
+  if (type === "ORDERING" && Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")) {
-    return constructActivityAnswerMap(
-      "DROPDOWN",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "DROPDOWN" && Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")) {
-    return constructActivityAnswerMap("MCSA", JSON.parse(JSON.stringify(data)));
+  if (type === "MCSA" && Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")) {
-    return constructActivityAnswerMap("MCMA", JSON.parse(JSON.stringify(data)));
+  if (type === "MCMA" && Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "MATCHING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "MATCHING" && Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "GROUPING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "GROUPING" && Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find(
+  if (type === "FILL_IN_THE_BLANKS" && Object.keys(data).find(
     (dataKey) => dataKey === "fillInTheBlanksMaterialMap"
   )) {
-    return constructActivityAnswerMap(
-      "FILL_IN_THE_BLANKS",
-      JSON.parse(JSON.stringify(data))
-    );
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")) {
-    return constructActivityAnswerMap(
-      "OPEN_ENDED",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "OPEN_ENDED" && Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")) {
-    return constructActivityAnswerMap(
-      "TRUE_FALSE",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "TRUE_FALSE" && Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
   return {};
 };
@@ -5227,7 +5218,6 @@ var GroupingActivityMaterialContent = ({
   const [draggedElement, setDraggedElement] = (0, import_react20.useState)(
     null
   );
-  const [isShuffled, setIsShuffled] = (0, import_react20.useState)(false);
   const [shuffledMaterialList, setShuffledMaterialList] = (0, import_react20.useState)([]);
   const dragElementRef = (0, import_react20.useRef)(null);
   const [mousePosition, setMousePosition] = (0, import_react20.useState)({
@@ -5240,18 +5230,16 @@ var GroupingActivityMaterialContent = ({
   });
   const ref = (0, import_react20.useRef)(null);
   const dropZoneRefs = (0, import_react20.useRef)({});
+  const hasShuffledRef = (0, import_react20.useRef)(false);
   (0, import_react20.useEffect)(() => {
+    if (hasShuffledRef.current) return;
     const shuffleArray2 = (array) => {
-      if (!isShuffled) {
-        const copyArray = JSON.parse(JSON.stringify(array));
-        for (let i = copyArray.length - 1; i > 0; i--) {
-          const j = Math.floor(Math.random() * (i + 1));
-          [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
-        }
-        setIsShuffled(true);
-        return copyArray;
+      const copyArray = JSON.parse(JSON.stringify(array));
+      for (let i = copyArray.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
       }
-      return array;
+      return copyArray;
     };
     const materialList = [];
     Object.keys(materialMap).forEach((materialKey) => {
@@ -5260,7 +5248,8 @@ var GroupingActivityMaterialContent = ({
       }
     });
     setShuffledMaterialList(shuffleArray2(materialList));
-  }, [materialMap, isShuffled]);
+    hasShuffledRef.current = true;
+  }, [materialMap]);
   (0, import_react20.useEffect)(() => {
     if (!showCorrectAnswer) return;
     answerMap = materialMap;
@@ -6825,8 +6814,7 @@ var OrderingActivityContent = ({
   canAnswerQuestion,
   changeAnswer,
   isPreview,
-  showCorrectAnswer,
-  isFullScreen
+  showCorrectAnswer
 }) => {
   const contentMap = parseContentMapFromData(data);
   const orderingBodyMap = parseBodyMapFromData(data, "ORDERING");
@@ -7272,7 +7260,8 @@ var ActivityPreviewByData = ({
     }
   }, [data, lockedType, typeOptionList, showDifficulty]);
   if (!data) return;
-  const answerMap = constructAnswerBasedOnData(data);
+  if (!selectedType) return;
+  const answerMap = constructAnswerBasedOnData(selectedType, data);
   return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { children: [
     showType ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "mb-4", children: [
@@ -7301,8 +7290,7 @@ var ActivityPreviewByData = ({
         },
         data,
         isPreview: true,
-        showCorrectAnswer: true,
-        isFullScreen
+        showCorrectAnswer: true
       }
     ) : selectedType === "DROPDOWN" && data["dropdownBodyMap"] != null && data["dropdownMaterialMap"] != null ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       DropdownActivityContent_default,

package/dist/index.mjs

@@ -2074,7 +2074,19 @@ var retrieveActivityTemplateDTOOptionList = (activityTemplateSet) => {
 };
 var retrieveDefaultOrderingDataMap = (orderingMaterialMap) => {
   const dataMap = {};
-  Object.keys(orderingMaterialMap).sort(() => 0.5 - Math.random()).forEach((key, index) => {
+  const originalKeys = Object.keys(orderingMaterialMap);
+  const shuffledKeys = [...originalKeys];
+  for (let i = shuffledKeys.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [shuffledKeys[i], shuffledKeys[j]] = [shuffledKeys[j], shuffledKeys[i]];
+  }
+  const isSameOrder = shuffledKeys.every(
+    (key, index) => key === originalKeys[index]
+  );
+  if (isSameOrder && shuffledKeys.length >= 2) {
+    [shuffledKeys[0], shuffledKeys[1]] = [shuffledKeys[1], shuffledKeys[0]];
+  }
+  shuffledKeys.forEach((key, index) => {
     dataMap[index] = key;
   });
   return dataMap;
@@ -2743,56 +2755,35 @@ var constructActivityData = (activityTemplateType, contentMap, bodyMap, material
   }
   return constructedData;
 };
-var constructAnswerBasedOnData = (data) => {
-  if (Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "ORDERING",
-      JSON.parse(JSON.stringify(data))
-    );
+var constructAnswerBasedOnData = (type, data) => {
+  if (type === "ORDERING" && Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")) {
-    return constructActivityAnswerMap(
-      "DROPDOWN",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "DROPDOWN" && Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")) {
-    return constructActivityAnswerMap("MCSA", JSON.parse(JSON.stringify(data)));
+  if (type === "MCSA" && Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")) {
-    return constructActivityAnswerMap("MCMA", JSON.parse(JSON.stringify(data)));
+  if (type === "MCMA" && Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "MATCHING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "MATCHING" && Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "GROUPING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "GROUPING" && Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find(
+  if (type === "FILL_IN_THE_BLANKS" && Object.keys(data).find(
     (dataKey) => dataKey === "fillInTheBlanksMaterialMap"
   )) {
-    return constructActivityAnswerMap(
-      "FILL_IN_THE_BLANKS",
-      JSON.parse(JSON.stringify(data))
-    );
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")) {
-    return constructActivityAnswerMap(
-      "OPEN_ENDED",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "OPEN_ENDED" && Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")) {
-    return constructActivityAnswerMap(
-      "TRUE_FALSE",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (type === "TRUE_FALSE" && Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
   return {};
 };
@@ -5003,7 +4994,6 @@ var GroupingActivityMaterialContent = ({
   const [draggedElement, setDraggedElement] = useState19(
     null
   );
-  const [isShuffled, setIsShuffled] = useState19(false);
   const [shuffledMaterialList, setShuffledMaterialList] = useState19([]);
   const dragElementRef = useRef5(null);
   const [mousePosition, setMousePosition] = useState19({
@@ -5016,18 +5006,16 @@ var GroupingActivityMaterialContent = ({
   });
   const ref = useRef5(null);
   const dropZoneRefs = useRef5({});
+  const hasShuffledRef = useRef5(false);
   useEffect10(() => {
+    if (hasShuffledRef.current) return;
     const shuffleArray2 = (array) => {
-      if (!isShuffled) {
-        const copyArray = JSON.parse(JSON.stringify(array));
-        for (let i = copyArray.length - 1; i > 0; i--) {
-          const j = Math.floor(Math.random() * (i + 1));
-          [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
-        }
-        setIsShuffled(true);
-        return copyArray;
+      const copyArray = JSON.parse(JSON.stringify(array));
+      for (let i = copyArray.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
       }
-      return array;
+      return copyArray;
     };
     const materialList = [];
     Object.keys(materialMap).forEach((materialKey) => {
@@ -5036,7 +5024,8 @@ var GroupingActivityMaterialContent = ({
       }
     });
     setShuffledMaterialList(shuffleArray2(materialList));
-  }, [materialMap, isShuffled]);
+    hasShuffledRef.current = true;
+  }, [materialMap]);
   useEffect10(() => {
     if (!showCorrectAnswer) return;
     answerMap = materialMap;
@@ -6601,8 +6590,7 @@ var OrderingActivityContent = ({
   canAnswerQuestion,
   changeAnswer,
   isPreview,
-  showCorrectAnswer,
-  isFullScreen
+  showCorrectAnswer
 }) => {
   const contentMap = parseContentMapFromData(data);
   const orderingBodyMap = parseBodyMapFromData(data, "ORDERING");
@@ -7048,7 +7036,8 @@ var ActivityPreviewByData = ({
     }
   }, [data, lockedType, typeOptionList, showDifficulty]);
   if (!data) return;
-  const answerMap = constructAnswerBasedOnData(data);
+  if (!selectedType) return;
+  const answerMap = constructAnswerBasedOnData(selectedType, data);
   return /* @__PURE__ */ jsxs36("div", { children: [
     showType ? /* @__PURE__ */ jsxs36(Fragment11, { children: [
       /* @__PURE__ */ jsxs36("div", { className: "mb-4", children: [
@@ -7077,8 +7066,7 @@ var ActivityPreviewByData = ({
         },
         data,
         isPreview: true,
-        showCorrectAnswer: true,
-        isFullScreen
+        showCorrectAnswer: true
       }
     ) : selectedType === "DROPDOWN" && data["dropdownBodyMap"] != null && data["dropdownMaterialMap"] != null ? /* @__PURE__ */ jsx47(
       DropdownActivityContent_default,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "catchup-library-web",
-  "version": "2.1.1",
+  "version": "2.1.3",
   "description": "",
   "main": "dist/index.js",
   "scripts": {

package/src/components/activities/ActivityPreviewByData.tsx

@@ -80,7 +80,8 @@ const ActivityPreviewByData = ({
   }, [data, lockedType, typeOptionList, showDifficulty]);
 
   if (!data) return;
-  const answerMap = constructAnswerBasedOnData(data);
+  if (!selectedType) return;
+  const answerMap = constructAnswerBasedOnData(selectedType, data);
 
   return (
     <div key={key}>
@@ -120,7 +121,6 @@ const ActivityPreviewByData = ({
               data={data}
               isPreview={true}
               showCorrectAnswer={true}
-              isFullScreen={isFullScreen}
             />
           ) : selectedType === "DROPDOWN" &&
             data["dropdownBodyMap"] != null &&

package/src/components/activities/OrderingActivityContent.tsx

@@ -15,7 +15,6 @@ const OrderingActivityContent = ({
   changeAnswer,
   isPreview,
   showCorrectAnswer,
-  isFullScreen,
 }: IOrderingActivityProps) => {
   const contentMap = parseContentMapFromData(data);
   const orderingBodyMap = parseBodyMapFromData(data, "ORDERING");

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

@@ -21,7 +21,6 @@ const GroupingActivityMaterialContent = ({
   const [draggedElement, setDraggedElement] = useState<HTMLElement | null>(
     null
   );
-  const [isShuffled, setIsShuffled] = useState(false);
   const [shuffledMaterialList, setShuffledMaterialList] = useState<any[]>([]);
   const dragElementRef = useRef<HTMLDivElement>(null);
   const [mousePosition, setMousePosition] = useState<{ x: number; y: number }>({
@@ -34,28 +33,30 @@ const GroupingActivityMaterialContent = ({
   });
   const ref = useRef<HTMLDivElement>(null);
   const dropZoneRefs = useRef<{ [key: string]: HTMLDivElement | null }>({});
+  const hasShuffledRef = useRef<boolean>(false);
 
   useEffect(() => {
+    if (hasShuffledRef.current) return;
+
     const shuffleArray = (array: any) => {
-      if (!isShuffled) {
-        const copyArray = JSON.parse(JSON.stringify(array));
-        for (let i = copyArray.length - 1; i > 0; i--) {
-          const j = Math.floor(Math.random() * (i + 1));
-          [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
-        }
-        setIsShuffled(true);
-        return copyArray;
+      const copyArray = JSON.parse(JSON.stringify(array));
+      for (let i = copyArray.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];
       }
-      return array;
+      return copyArray;
     };
+
     const materialList: any = [];
     Object.keys(materialMap).forEach((materialKey) => {
       for (const materialValue of materialMap[materialKey]) {
         materialList.push(materialValue);
       }
     });
+
     setShuffledMaterialList(shuffleArray(materialList));
-  }, [materialMap, isShuffled]);
+    hasShuffledRef.current = true;
+  }, [materialMap]);
 
   useEffect(() => {
     if (!showCorrectAnswer) return;
@@ -68,7 +69,6 @@ const GroupingActivityMaterialContent = ({
     const dropZoneElement = dropZoneRefs.current[dropTargetKey];
     if (!dropZoneElement) return;
 
-    // Find the scrollable parent container
     const findScrollableParent = (element: HTMLElement): HTMLElement | null => {
       let parent = element.parentElement;
 
@@ -155,7 +155,6 @@ const GroupingActivityMaterialContent = ({
     return "INCORRECT";
   };
 
-  // Mouse drag handlers
   const handleMouseDown = (
     e: React.MouseEvent,
     materialValue: string
@@ -172,7 +171,6 @@ const GroupingActivityMaterialContent = ({
 
     setMousePosition({ x: e.clientX, y: e.clientY });
 
-    // Find the element under the mouse point
     const elementUnder = document.elementFromPoint(e.clientX, e.clientY);
     const dropZone = elementUnder?.closest("[data-grouping-drop-zone]");
 
@@ -193,7 +191,6 @@ const GroupingActivityMaterialContent = ({
     setMousePosition({ x: 0, y: 0 });
   };
 
-  // Touch drag handlers
   const handleTouchStart = (
     e: React.TouchEvent,
     materialValue: string,
@@ -213,7 +210,6 @@ const GroupingActivityMaterialContent = ({
     const touch = e.touches[0];
     setTouchPosition({ x: touch.clientX, y: touch.clientY });
 
-    // Find the element under the touch point
     const elementUnder = document.elementFromPoint(
       touch.clientX,
       touch.clientY
@@ -238,7 +234,6 @@ const GroupingActivityMaterialContent = ({
     setTouchPosition({ x: 0, y: 0 });
   };
 
-  // Click/tap to select (for easier mobile interaction)
   const handleSelectItem = (materialValue: string): void => {
     if (!checkCanAnswerQuestion()) return;
     setSelectedValue(materialValue);

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

@@ -78,7 +78,6 @@ const OrderingActivityMaterialContent = ({
     return 0;
   };
 
-  // Mouse drag handlers
   const handleMouseDown = (e: React.MouseEvent, materialKey: string): void => {
     if (!checkCanAnswerQuestion()) return;
     e.preventDefault();
@@ -117,7 +116,6 @@ const OrderingActivityMaterialContent = ({
     setMousePosition({ x: 0, y: 0 });
   };
 
-  // Touch drag handlers
   const handleTouchStart = (
     e: React.TouchEvent,
     materialKey: string,
@@ -166,7 +164,6 @@ const OrderingActivityMaterialContent = ({
     setTouchPosition({ x: 0, y: 0 });
   };
 
-  // Click/tap to select (for easier mobile interaction)
   const handleSelectItem = (materialKey: string): void => {
     if (!checkCanAnswerQuestion()) return;
 
@@ -187,7 +184,6 @@ const OrderingActivityMaterialContent = ({
       onMouseMove={handleMouseMove}
       onMouseUp={handleMouseUp}
     >
-      {/* Floating drag preview for mouse */}
       {draggedKey && mousePosition.x > 0 && (
         <div
           className="fixed pointer-events-none z-50 opacity-80"
@@ -233,7 +229,6 @@ const OrderingActivityMaterialContent = ({
         </div>
       )}
 
-      {/* Floating drag preview for touch */}
       {draggedKey && touchPosition.x > 0 && (
         <div
           className="fixed pointer-events-none z-50 opacity-80"

package/src/properties/ActivityProperties.ts

@@ -26,7 +26,6 @@ export interface IOrderingActivityProps {
   changeAnswer: (e: any) => void;
   isPreview: boolean;
   showCorrectAnswer: boolean;
-  isFullScreen: boolean;
 }
 
 export interface IOrderingActivityMaterialProps {

package/src/utilization/CatchtivityUtilization.ts

@@ -1112,11 +1112,25 @@ export const retrieveActivityTemplateDTOOptionList = (
 
 const retrieveDefaultOrderingDataMap = (orderingMaterialMap: any) => {
   const dataMap: any = {};
-  Object.keys(orderingMaterialMap)
-    .sort(() => 0.5 - Math.random())
-    .forEach((key, index) => {
-      dataMap[index] = key;
-    });
+  const originalKeys = Object.keys(orderingMaterialMap);
+  const shuffledKeys = [...originalKeys];
+
+  for (let i = shuffledKeys.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [shuffledKeys[i], shuffledKeys[j]] = [shuffledKeys[j], shuffledKeys[i]];
+  }
+
+  const isSameOrder = shuffledKeys.every(
+    (key, index) => key === originalKeys[index]
+  );
+
+  if (isSameOrder && shuffledKeys.length >= 2) {
+    [shuffledKeys[0], shuffledKeys[1]] = [shuffledKeys[1], shuffledKeys[0]];
+  }
+
+  shuffledKeys.forEach((key, index) => {
+    dataMap[index] = key;
+  });
 
   return dataMap;
 };
@@ -1914,58 +1928,62 @@ export const constructActivityData = (
   return constructedData;
 };
 
-export const constructAnswerBasedOnData = (data: any) => {
-  if (Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "ORDERING",
-      JSON.parse(JSON.stringify(data))
-    );
+export const constructAnswerBasedOnData = (type: string, data: any) => {
+  if (
+    type === "ORDERING" &&
+    Object.keys(data).find((dataKey) => dataKey === "orderingMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")) {
-    return constructActivityAnswerMap(
-      "DROPDOWN",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (
+    type === "DROPDOWN" &&
+    Object.keys(data).find((dataKey) => dataKey === "dropdownMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")) {
-    return constructActivityAnswerMap("MCSA", JSON.parse(JSON.stringify(data)));
+  if (
+    type === "MCSA" &&
+    Object.keys(data).find((dataKey) => dataKey === "MCSAMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")) {
-    return constructActivityAnswerMap("MCMA", JSON.parse(JSON.stringify(data)));
+  if (
+    type === "MCMA" &&
+    Object.keys(data).find((dataKey) => dataKey === "MCMAMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "MATCHING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (
+    type === "MATCHING" &&
+    Object.keys(data).find((dataKey) => dataKey === "matchingMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")) {
-    return constructActivityAnswerMap(
-      "GROUPING",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (
+    type === "GROUPING" &&
+    Object.keys(data).find((dataKey) => dataKey === "groupingMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
   if (
+    type === "FILL_IN_THE_BLANKS" &&
     Object.keys(data).find(
       (dataKey) => dataKey === "fillInTheBlanksMaterialMap"
     )
   ) {
-    return constructActivityAnswerMap(
-      "FILL_IN_THE_BLANKS",
-      JSON.parse(JSON.stringify(data))
-    );
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")) {
-    return constructActivityAnswerMap(
-      "OPEN_ENDED",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (
+    type === "OPEN_ENDED" &&
+    Object.keys(data).find((dataKey) => dataKey === "openEndedMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
-  if (Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")) {
-    return constructActivityAnswerMap(
-      "TRUE_FALSE",
-      JSON.parse(JSON.stringify(data))
-    );
+  if (
+    type === "TRUE_FALSE" &&
+    Object.keys(data).find((dataKey) => dataKey === "trueFalseMaterialMap")
+  ) {
+    return constructActivityAnswerMap(type, JSON.parse(JSON.stringify(data)));
   }
   return {};
 };