@nualang/nualang-ui-components 0.1.1252 → 0.1.1253

package/dist/Assignments/AssignmentCard/AssignmentCard.js

@@ -224,7 +224,7 @@ function AssignmentCard({
               children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
                   variant: "h4",
-                  children: assignment.assignedStudents.length
+                  children: assignment.assignedStudents?.length
                 }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
                   variant: "body2",
                   color: "text.secondary",

package/dist/Screens/Classrooms/ViewClassroom/ViewClassroom.js

@@ -324,6 +324,111 @@ function OverflowMenu({
     }, "UpgradeSubscription")]
   });
 }
+function ClassroomLoading({
+  t = text => text
+}) {
+  const {
+    classes
+  } = useStyles();
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: classes.cardTop,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
+        variant: "rectangular",
+        sx: theme => ({
+          [theme.breakpoints.up("md")]: {
+            paddingTop: "15%"
+          },
+          height: 0,
+          paddingTop: "25%",
+          borderRadius: theme.spacing(2),
+          marginBottom: theme.spacing(4)
+        })
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: classes.header,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: classes.headerText,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+          variant: "h5",
+          component: "h1",
+          gutterBottom: true,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
+            variant: "rectangular",
+            height: 32,
+            width: 150
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+          variant: "body2",
+          color: "textSecondary",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
+            variant: "rectangular",
+            height: 20,
+            width: 250
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+          display: "flex",
+          alignItems: "center",
+          mt: 2,
+          mb: 1,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+            mr: 1,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
+              variant: "contained",
+              color: "primary",
+              startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PersonAdd.default, {}),
+              size: "small",
+              disabled: true,
+              children: t("join")
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultColourButton.default, {
+            startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MoreVert.default, {}),
+            size: "small",
+            className: classes.moreOptions,
+            disabled: true,
+            children: t("more_options")
+          })]
+        })]
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveTabs.default, {
+      t: t,
+      tabs: [{
+        label: t("courses"),
+        id: "Courses"
+      }, {
+        label: t("assignments"),
+        id: "Assignments"
+      }, {
+        label: t("progress"),
+        id: "Discuss"
+      }, {
+        label: t("members"),
+        id: "Members"
+      }, {
+        label: t("settings"),
+        id: "Settings",
+        disabled: true
+      }],
+      centered: true,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+        py: 1,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Courses.default, {
+          t: t,
+          courses: null
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+        py: 1,
+        children: [t("loading"), "..."]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+        py: 1,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Members.default, {
+          t: t,
+          members: null
+        })
+      })]
+    })]
+  });
+}
 function Classroom({
   t = text => text,
   classroom,
@@ -659,99 +764,6 @@ function Classroom({
     setIsCreatorNotSubscribedUpgradeOpen(false);
   };
   const [avatarOptionClicked, setAvatarOptionClicked] = (0, _react.useState)(false);
-  if (!classroom) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: classes.cardTop,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
-          variant: "rectangular",
-          sx: theme => ({
-            [theme.breakpoints.up("md")]: {
-              paddingTop: "15%"
-            },
-            height: 0,
-            paddingTop: "25%",
-            borderRadius: theme.spacing(2),
-            marginBottom: theme.spacing(4)
-          })
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: classes.header,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: classes.headerText,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-            variant: "h5",
-            component: "h1",
-            gutterBottom: true,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
-              variant: "rectangular",
-              height: 32,
-              width: 150
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-            variant: "body2",
-            color: "textSecondary",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
-              variant: "rectangular",
-              height: 20,
-              width: 250
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-            display: "flex",
-            alignItems: "center",
-            mt: 2,
-            mb: 1,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-              mr: 1,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
-                variant: "contained",
-                color: "primary",
-                startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PersonAdd.default, {}),
-                size: "small",
-                disabled: true,
-                children: t("join")
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultColourButton.default, {
-              startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MoreVert.default, {}),
-              size: "small",
-              className: classes.moreOptions,
-              disabled: true,
-              children: t("more_options")
-            })]
-          })]
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveTabs.default, {
-        t: t,
-        tabs: [{
-          label: t("courses")
-        }, {
-          label: t("progress")
-        }, {
-          label: t("members")
-        }, {
-          label: t("settings"),
-          disabled: true
-        }],
-        centered: true,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-          py: 1,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Courses.default, {
-            t: t,
-            courses: null
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-          py: 1,
-          children: [t("loading"), "..."]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-          py: 1,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Members.default, {
-            t: t,
-            members: null
-          })
-        })]
-      })]
-    });
-  }
   const {
     classroomId,
     classroomName,
@@ -1167,19 +1179,20 @@ function Classroom({
     tabIndex: tabs.findIndex(tab => tab.id === "Courses"),
     variant: "circular"
   }, vchatFab, assignmentsFab]];
-  let initialTabValue;
-  if (window.location.hash) {
-    const selectedTab = window.location.hash;
-    initialTabValue = tabs.findIndex(tab => tab.id === selectedTab.replace("#", ""));
-    if (initialTabValue === 3 || initialTabValue === 4 && !isCreator) {
-      initialTabValue = 0;
-    }
-    if (initialTabValue < 0) {
-      initialTabValue = 0;
+  const initialTabValue = (0, _react.useMemo)(() => {
+    if (window.location.hash) {
+      const selectedTabId = window.location.hash.slice(1);
+      const index = tabs.findIndex(tab => tab.id === selectedTabId);
+      const tab = tabs[index];
+      const isDisabled = tab?.disabled;
+      const isRestricted = (tab?.id === "Settings" || tab?.id === "Members") && !isCreator;
+      if (index >= 0 && !isDisabled && !isRestricted) {
+        return index;
+      }
     }
-  } else {
-    initialTabValue = 0;
-  }
+    return 0;
+  }, [isCreator.tabs?.length]); // only recompute if isCreator or tabs change
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: classes.cardTop,
@@ -1543,7 +1556,7 @@ function ViewClassroom({
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: classes.root,
     children: [isLoading && !classroom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Classroom, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ClassroomLoading, {
         t: t
       })
     }), !isLoading && classroom && Object.keys(classroom).length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {

package/dist/Tables/Progress/Progress.js

@@ -238,11 +238,16 @@ function Progress({
   (0, _react.useEffect)(() => {
     if ("URLSearchParams" in window) {
       const searchParams = (0, _utils2.searchStringToObj)(window.location.search);
-      const courseId = searchParams.courseId;
-      const assignmentId = searchParams.assignmentId;
-      if (searchParams.reportType && !reportType && reportTypes.includes(searchParams.reportType) && reportType !== searchParams.reportType) {
+      if (searchParams.reportType && searchParams.reportType !== reportTypes[0] && reportTypes.includes(searchParams.reportType) && reportType !== searchParams.reportType) {
         setReportType(searchParams.reportType);
       }
+    }
+  }, []);
+  (0, _react.useEffect)(() => {
+    if ("URLSearchParams" in window) {
+      const searchParams = (0, _utils2.searchStringToObj)(window.location.search);
+      const courseId = searchParams.courseId;
+      const assignmentId = searchParams.assignmentId;
       if (assignmentId && !selectedAssignment && assignments && assignments.length) {
         const assignmentIndex = assignments.findIndex(a => a.assignmentId === assignmentId);
         const assignment = assignments[assignmentIndex];

package/dist/Tables/Progress/ProgressTable.js

@@ -598,7 +598,7 @@ function TableRow({
   fetchMemberCourseCompletions,
   filter,
   index,
-  featureFlags,
+  featureFlags = {},
   selectedAssignment,
   reportType,
   tableExercises,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1252",
+  "version": "0.1.1253",
   "main": "dist/index.js",
   "files": [
     "dist",