catchup-library-web 1.0.17 → 1.0.19

package/dist/index.js

@@ -5930,15 +5930,22 @@ var ActivityPreviewByData = ({
 }) => {
   const [selectedType, setSelectedType] = (0, import_react24.useState)(null);
   const [optionList, setOptionList] = (0, import_react24.useState)([]);
+  console.log("inner selected type: ", selectedType);
   (0, import_react24.useEffect)(() => {
     if (!typeOptionList) return;
     if (typeOptionList.length === 0) return;
-    const foundTypeOption = typeOptionList.find(
-      (typeOption) => typeOption.id === lockedType
-    );
-    if (!foundTypeOption) return;
-    setSelectedType(foundTypeOption.id);
-  }, [typeOptionList]);
+    let foundTypeOption;
+    if (lockedType) {
+      foundTypeOption = typeOptionList.find(
+        (typeOption) => typeOption.id === lockedType
+      );
+    }
+    if (foundTypeOption) {
+      setSelectedType(foundTypeOption.id);
+    } else {
+      setSelectedType(typeOptionList[0].id);
+    }
+  }, [typeOptionList, lockedType]);
   (0, import_react24.useEffect)(() => {
     const retrieveTaxonomyNameByActivityTypeFromData = (type) => {
       let taxonomyMap = {
@@ -5981,7 +5988,7 @@ var ActivityPreviewByData = ({
   if (!data) return;
   const answer = constructAnswerBasedOnData(data);
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
-    showType ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    showType ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       SelectionBox_default,
       {
         optionList,
@@ -5990,7 +5997,7 @@ var ActivityPreviewByData = ({
           setSelectedType(itemId);
         }
       }
-    ) : null,
+    ) }) : null,
     selectedType ? selectedType === "ORDERING" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       OrderingActivityContent_default,
       {
@@ -6105,13 +6112,13 @@ var ActivityPreviewByData = ({
         showCorrectAnswer: true
       }
     ) : null : null,
-    selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    selectedType && showSolution ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "my-4", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       ActivitySolutionContent_default,
       {
         activityTemplateType: selectedType,
         data
       }
-    ) : null
+    ) }) : null
   ] });
 };
 var ActivityPreviewByData_default = ActivityPreviewByData;

package/dist/index.mjs

@@ -5756,15 +5756,22 @@ var ActivityPreviewByData = ({
 }) => {
   const [selectedType, setSelectedType] = useState19(null);
   const [optionList, setOptionList] = useState19([]);
+  console.log("inner selected type: ", selectedType);
   useEffect11(() => {
     if (!typeOptionList) return;
     if (typeOptionList.length === 0) return;
-    const foundTypeOption = typeOptionList.find(
-      (typeOption) => typeOption.id === lockedType
-    );
-    if (!foundTypeOption) return;
-    setSelectedType(foundTypeOption.id);
-  }, [typeOptionList]);
+    let foundTypeOption;
+    if (lockedType) {
+      foundTypeOption = typeOptionList.find(
+        (typeOption) => typeOption.id === lockedType
+      );
+    }
+    if (foundTypeOption) {
+      setSelectedType(foundTypeOption.id);
+    } else {
+      setSelectedType(typeOptionList[0].id);
+    }
+  }, [typeOptionList, lockedType]);
   useEffect11(() => {
     const retrieveTaxonomyNameByActivityTypeFromData = (type) => {
       let taxonomyMap = {
@@ -5807,7 +5814,7 @@ var ActivityPreviewByData = ({
   if (!data) return;
   const answer = constructAnswerBasedOnData(data);
   return /* @__PURE__ */ jsxs32(Fragment9, { children: [
-    showType ? /* @__PURE__ */ jsx41(
+    showType ? /* @__PURE__ */ jsx41("div", { className: "mb-4", children: /* @__PURE__ */ jsx41(
       SelectionBox_default,
       {
         optionList,
@@ -5816,7 +5823,7 @@ var ActivityPreviewByData = ({
           setSelectedType(itemId);
         }
       }
-    ) : null,
+    ) }) : null,
     selectedType ? selectedType === "ORDERING" ? /* @__PURE__ */ jsx41(
       OrderingActivityContent_default,
       {
@@ -5931,13 +5938,13 @@ var ActivityPreviewByData = ({
         showCorrectAnswer: true
       }
     ) : null : null,
-    selectedType && showSolution ? /* @__PURE__ */ jsx41(
+    selectedType && showSolution ? /* @__PURE__ */ jsx41("div", { className: "my-4", children: /* @__PURE__ */ jsx41(
       ActivitySolutionContent_default,
       {
         activityTemplateType: selectedType,
         data
       }
-    ) : null
+    ) }) : null
   ] });
 };
 var ActivityPreviewByData_default = ActivityPreviewByData;

package/package.json

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

package/src/components/activities/ActivityPreviewByData.tsx

@@ -24,15 +24,23 @@ const ActivityPreviewByData = ({
   const [selectedType, setSelectedType] = useState<string | null>(null);
   const [optionList, setOptionList] = useState<any[]>([]);
 
+  console.log("inner selected type: ", selectedType);
+
   useEffect(() => {
     if (!typeOptionList) return;
     if (typeOptionList.length === 0) return;
-    const foundTypeOption = typeOptionList.find(
-      (typeOption) => typeOption.id === lockedType
-    );
-    if (!foundTypeOption) return;
-    setSelectedType(foundTypeOption.id);
-  }, [typeOptionList]);
+    let foundTypeOption;
+    if (lockedType) {
+      foundTypeOption = typeOptionList.find(
+        (typeOption) => typeOption.id === lockedType
+      );
+    }
+    if (foundTypeOption) {
+      setSelectedType(foundTypeOption.id);
+    } else {
+      setSelectedType(typeOptionList[0].id);
+    }
+  }, [typeOptionList, lockedType]);
 
   useEffect(() => {
     const retrieveTaxonomyNameByActivityTypeFromData = (type: string) => {
@@ -81,13 +89,15 @@ const ActivityPreviewByData = ({
   return (
     <>
       {showType ? (
-        <SelectionBox
-          optionList={optionList}
-          selectedId={selectedType}
-          handleSelectOnClick={(itemId) => {
-            setSelectedType(itemId);
-          }}
-        />
+        <div className="mb-4">
+          <SelectionBox
+            optionList={optionList}
+            selectedId={selectedType}
+            handleSelectOnClick={(itemId) => {
+              setSelectedType(itemId);
+            }}
+          />
+        </div>
       ) : null}
       {selectedType ? (
         selectedType === "ORDERING" ? (
@@ -188,10 +198,12 @@ const ActivityPreviewByData = ({
         ) : null
       ) : null}
       {selectedType && showSolution ? (
-        <ActivitySolutionContent
-          activityTemplateType={selectedType}
-          data={data}
-        />
+        <div className="my-4">
+          <ActivitySolutionContent
+            activityTemplateType={selectedType}
+            data={data}
+          />
+        </div>
       ) : null}
     </>
   );