@nualang/nualang-ui-components 0.1.1243 → 0.1.1245

package/dist/Assignments/AssignmentBotSelection/AssignmentBotSelection.js

@@ -112,7 +112,8 @@ function Bot({
           flexDirection: {
             xs: "column",
             sm: "row"
-          }
+          },
+          marginLeft: "60px"
         },
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
           display: "flex",

package/dist/Assignments/AssignmentCard/AssignmentCard.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = AssignmentCard;
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _material = require("@mui/material");
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -14,8 +14,6 @@ var _useConfirm = _interopRequireDefault(require("../../hooks/useConfirm"));
 var _iconsMaterial = require("@mui/icons-material");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function AssignmentCard({
   t = text => text,
   index = 0,
@@ -36,6 +34,7 @@ function AssignmentCard({
   handleViewProgress,
   lastAssignmentFetch
 }) {
+  console.log(assignment);
   const [confirm] = (0, _useConfirm.default)(t);
   const {
     useQuery
@@ -46,7 +45,7 @@ function AssignmentCard({
       await deleteAssignment(classroomId, assignmentId);
     }
   };
-  const calculateDaysUntilDue = (dueDate, scheduledDate) => {
+  const calculateDaysUntilDue = (dueDate, scheduledDate, t) => {
     const now = new Date();
     const due = new Date(dueDate);
     const scheduled = new Date(scheduledDate);
@@ -130,8 +129,7 @@ function AssignmentCard({
         spacing: 2,
         alignItems: "center",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
-          item: true,
-          xs: true,
+          size: "grow",
           flexDirection: "column",
           display: "flex",
           children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
@@ -157,10 +155,9 @@ function AssignmentCard({
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
             variant: "button",
             color: "text.secondary",
-            children: calculateDaysUntilDue(assignment.dueDate, assignment.scheduleDate)
+            children: calculateDaysUntilDue(assignment.dueDate, assignment.scheduleDate, t)
           })
         }), isCreator && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
-          item: true,
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
             title: t("edit"),
             children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.IconButton, {
@@ -190,7 +187,7 @@ function AssignmentCard({
           spacing: 2,
           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
             size: {
-              md: 6,
+              md: 10,
               xs: 12
             },
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
@@ -216,9 +213,10 @@ function AssignmentCard({
               })
             })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
-            item: true,
-            xs: 3,
-            md: 2,
+            size: {
+              xs: 3,
+              md: 2
+            },
             children: isCreator && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
               display: "flex",
               flexDirection: "column",

package/dist/Assignments/AssignmentCardsList/AssignmentCardsList.js

@@ -13,8 +13,7 @@ var _teacherCreate = _interopRequireDefault(require("../../img/teacher-create-2.
 var _Add = _interopRequireDefault(require("@mui/icons-material/Add"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const AssignmentCardsList = ({
   t = text => text,
   assignments = [],

package/dist/Assignments/AssignmentCourseSelection/AssignmentCourseSelection.js

@@ -78,8 +78,15 @@ function Course({
     }
   }, [courseSections, selectedSectionIds, viewOnly]);
   (0, _react.useEffect)(() => {
+    const assignedSectionIds = new Set();
+    assignment?.exercises?.forEach(exercise => {
+      if (exercise.courseSectionTopicId) {
+        const sectionId = exercise.courseSectionTopicId.split("|")[1];
+        assignedSectionIds.add(sectionId);
+      }
+    });
     if (courseSections && memberCourseCompletions && selectedExercises) {
-      const sectionsWithProgress = (0, _utils.calcCompletions)(courseSections, memberCourseCompletions, selectedExercises);
+      const sectionsWithProgress = (0, _utils.calcCompletions)(courseSections.filter(section => assignedSectionIds.has(section.sectionId)), memberCourseCompletions, selectedExercises);
       const percentCompletion = (0, _utils.calcPercentageCompletion)(sectionsWithProgress);
       setCourseSectionCompletion(percentCompletion);
     }
@@ -240,7 +247,7 @@ function AssignmentCourseSelection({
       memberCourseCompletions: memberCourseCompletions,
       progressHelpers: progressHelpers,
       lastClickedExerciseId: lastClickedExerciseId
-    }))
+    }, course.courseId || index))
   });
 }
 var _default = exports.default = AssignmentCourseSelection;

package/dist/Assignments/AssignmentExerciseSelection/AssignmentExerciseSelection.js

@@ -146,7 +146,7 @@ function Exercise({
     return null;
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Tooltip, {
-    title: name === "roleplays" && noRoleplays ? t("topic_no_roleplays") : !isValidExercise ? t("minimum_two_phrases") : "",
+    title: isCreator ? name === "roleplays" && noRoleplays ? t("topic_no_roleplays") : !isValidExercise ? t("minimum_two_phrases") : "" : null,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.ListItemButton, {
       onClick: () => {
         if (name.toLowerCase() === "roleplays") {
@@ -168,7 +168,7 @@ function Exercise({
       disabled: isExerciseSelected || !isValidExercise || noRoleplays || noBots,
       sx: theme => ({
         [theme.breakpoints.up("sm")]: {
-          ml: 3.5
+          ml: "60px"
         }
       }),
       children: [name.toLowerCase() === "listening" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
@@ -451,42 +451,50 @@ function Topic({
       games = ["roleplay-story", "roleplay-fill-in-the-blanks", "roleplay-act-it-out", "roleplay-act-it-out-listening", "roleplay-act-it-out-speaking", "roleplay-act-it-out-listening-speaking"];
   }
   (0, _react.useEffect)(() => {
-    const exerciseCount = selectedExercises?.filter(exercise => !exercise.roleplayId && exercise.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}`).length;
-    const roleplayCount = selectedExercises?.filter(exercise => exercise.roleplayId && roleplays?.some(roleplay => roleplay.roleplayId === exercise.roleplayId)).length;
-    const botCount = selectedExercises?.filter(exercise => exercise.botId && bots?.some(bot => bot.botId === exercise.botId)).length;
-    const total = roleplays.length * 6 + 3;
-    if (exerciseCount + roleplayCount + botCount === total) {
-      setIsWholeTopicSelected(true);
-    } else {
-      setIsWholeTopicSelected(false);
-    }
-  }, [selectedExercises]);
+    const expectedRegularCount = exercises?.filter(e => e.name !== "roleplays" && !selectedExercises?.some(sel => sel.name === e.name && sel.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}`)).length || 0;
+    const expectedRoleplayCount = roleplays?.length * games?.length || 0;
+    const expectedBotCount = bots?.length || 0;
+    const totalExpected = (exercises?.filter(e => e.name !== "roleplays").length || 0) + expectedRoleplayCount + expectedBotCount;
+    const selectedRegular = selectedExercises?.filter(exercise => !exercise.roleplayId && !exercise.botId && exercise.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}`).length || 0;
+    const selectedRoleplays = selectedExercises?.filter(exercise => exercise.roleplayId && roleplays?.some(roleplay => roleplay.roleplayId === exercise.roleplayId)).length || 0;
+    const selectedBots = selectedExercises?.filter(exercise => exercise.botId && bots?.some(bot => bot.botId === exercise.botId)).length || 0;
+    const totalSelected = selectedRegular + selectedRoleplays + selectedBots;
+    setIsWholeTopicSelected(totalSelected === totalExpected);
+  }, [selectedExercises, exercises, roleplays, bots, courseId, sectionId, topicId, games]);
   const handleSelectAll = () => {
     if (isWholeTopicSelected) {
-      const removeExercises = selectedExercises?.filter(exercise => exercise.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}` || exercise.roleplayId && roleplays?.some(roleplay => roleplay.roleplayId === exercise.roleplayId));
+      const removeExercises = selectedExercises?.filter(exercise => exercise.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}` || exercise.roleplayId && roleplays?.some(roleplay => roleplay.roleplayId === exercise.roleplayId) || exercise.botId && bots?.some(bot => bot.botId === exercise.botId));
       handleSelectExercise(removeExercises);
     } else {
       let exercisesToAdd = [];
       exercises?.filter(e => e.name !== "roleplays").forEach(exercise => {
         if (!selectedExercises?.some(e => e.courseSectionTopicId === `${courseId}|${sectionId}|${topicId}` && e.name === exercise.name)) {
-          exercisesToAdd = [...exercisesToAdd, {
+          exercisesToAdd.push({
             courseSectionTopicId: `${courseId}|${sectionId}|${topicId}`,
             name: exercise.name
-          }];
+          });
         }
       });
       roleplays.forEach(roleplay => {
         games.forEach(name => {
           if (!selectedExercises?.some(e => e.roleplayId === roleplay.roleplayId && e.name === name)) {
-            exercisesToAdd = [...exercisesToAdd, {
+            exercisesToAdd.push({
               roleplayId: roleplay.roleplayId,
               name: name,
               courseSectionTopicId: `${courseId}|${sectionId}|${topicId}`,
               roleplayName: roleplay.roleplayName
-            }];
+            });
           }
         });
       });
+      bots?.forEach(bot => {
+        if (!selectedExercises?.some(e => e.botId === bot.botId)) {
+          exercisesToAdd.push({
+            botId: bot.botId,
+            courseSectionTopicId: `${courseId}|${sectionId}|${topicId}`
+          });
+        }
+      });
       handleSelectExercise(exercisesToAdd);
     }
   };

package/dist/Assignments/AssignmentRoleplaySelection/AssignmentRoleplaySelection.js

@@ -30,14 +30,7 @@ function ProgressBadge({
   t,
   gameName
 }) {
-  let completionCounter = 0;
-  if (completions && completions.length > 0) {
-    for (let i = 0; i < completions.length; i++) {
-      if (completions[i].exercise === gameName) {
-        completionCounter += 1;
-      }
-    }
-  }
+  const completionCounter = completions?.filter(completion => completion.exercise === gameName).length || 0;
   return completionCounter > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Badge, {
     sx: sxGreenColor,
     badgeContent: completionCounter,
@@ -129,7 +122,7 @@ function Roleplay({
     setIsSelectAllChecked(count === games.length);
     const roleplayNames = selectedExercises?.filter(ex => ex.roleplayId === roleplay.roleplayId).map(ex => ex.name);
     setSelectedGames(roleplayNames);
-  }, [selectedExercises, roleplay.roleplayId, games.length]);
+  }, [selectedExercises, roleplay.roleplayId]);
   const handleSelectAll = () => {
     if (isSelectAllChecked) {
       const removeExercises = games.map(name => ({
@@ -198,7 +191,8 @@ function Roleplay({
             flexDirection: {
               xs: "column",
               sm: "row"
-            }
+            },
+            marginLeft: "60px"
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
             display: "flex",
@@ -305,7 +299,8 @@ function Roleplay({
             flexDirection: {
               xs: "column",
               sm: "row"
-            }
+            },
+            marginLeft: "95px"
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
             children: getIconAndStatusForGame(name)[0]
@@ -331,7 +326,8 @@ function Roleplay({
             flexDirection: {
               xs: "column",
               sm: "row"
-            }
+            },
+            marginLeft: "95px"
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
             children: getIconAndStatusForGame(name)[0]
@@ -370,7 +366,8 @@ function AssignmentRoleplaySelection({
   lastClickedExerciseId
 }) {
   const [isRoleplaySelected, setIsRoleplaySelected] = (0, _react.useState)(false);
-  return roleplays.map((roleplay, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Roleplay, {
+  const filteredCompletions = memberCourseCompletions.filter(completion => completion.courseSectionTopicId === courseSectionTopicId);
+  return roleplays.map(roleplay => /*#__PURE__*/(0, _jsxRuntime.jsx)(Roleplay, {
     roleplay: roleplay,
     isRoleplaySelected: isRoleplaySelected,
     setIsRoleplaySelected: setIsRoleplaySelected,
@@ -381,11 +378,11 @@ function AssignmentRoleplaySelection({
     selectedExercises: selectedExercises,
     useCase: useCase,
     assignment: assignment,
-    memberCourseCompletions: memberCourseCompletions,
+    memberCourseCompletions: filteredCompletions,
     topicProgress: topicProgress,
     topics: topics,
     isCreator: isCreator,
     lastClickedExerciseId: lastClickedExerciseId
-  }, index));
+  }, roleplay.roleplayId));
 }
 var _default = exports.default = AssignmentRoleplaySelection;

package/dist/Assignments/CreateAssignmentDialog/CreateAssignmentDialog.js

@@ -21,8 +21,7 @@ var _Queries = require("@nualang/nualang-api-and-queries/Queries");
 var _AssignmentExerciseSelector = _interopRequireDefault(require("../AssignmentExerciseSelector/AssignmentExerciseSelector"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const useStyles = (0, _mui.makeStyles)()(theme => ({
   appBar: {
     position: "relative"
@@ -56,7 +55,8 @@ function CreateAssignmentDialog({
   getClassroom,
   getCourses,
   initialData = {},
-  dialogTitle
+  dialogTitle,
+  userEmail = ''
 }) {
   const {
     classes
@@ -65,7 +65,7 @@ function CreateAssignmentDialog({
   const [submittedExercises, setSubmittedExercises] = (0, _react.useState)(initialData.exercises ? initialData.exercises : []);
   const [members, setMembers] = (0, _react.useState)([]);
   const [assignment, setAssignment] = (0, _react.useState)({
-    classroomId: "",
+    classroomId: classroom?.length > 0 ? [classroom] : [],
     assignedStudents: members?.map(member => member.memberId),
     title: "",
     instructions: "",
@@ -76,34 +76,67 @@ function CreateAssignmentDialog({
     ...initialData
   });
   const classroomQuery = _Queries.classrooms.useClassroom(async classroomId => {
-    const response = await getClassroom(classroomId);
-    return response;
+    const allClassroomsCourses = [];
+    await Promise.all(classroomId.map(async cId => {
+      if (!cId) return;
+      const response = await getClassroom(cId);
+      allClassroomsCourses.push(response?.Item?.courses || []);
+    }));
+    const flatClassrooms = allClassroomsCourses.flat();
+    const seen = new Set();
+    const uniqueClassroomsCourses = flatClassrooms.filter(classR => {
+      if (seen.has(classR)) return false;
+      seen.add(classR);
+      return true;
+    });
+    return uniqueClassroomsCourses;
   }, {
-    classroomId: assignment.classroomId
+    classroomId: assignment?.classroomId
   }, {
-    enabled: !!assignment.classroomId
+    enabled: !!(assignment.classroomId.length > 0)
   });
-  const selectedClassroom = (0, _react.useMemo)(() => classroomQuery.isSuccess && classroomQuery.data.Item ? classroomQuery.data.Item : {}, [classroomQuery.data, classroomQuery.isSuccess]);
+  const selectedClassroom = (0, _react.useMemo)(() => classroomQuery.isSuccess && classroomQuery.data ? classroomQuery.data : {}, [classroomQuery.data, classroomQuery.isSuccess]);
   const coursesQuery = _Queries.courses.useCourses(async filters => {
     const response = await getCourses(filters);
     return response;
   }, {
     filters: {
-      courseIds: selectedClassroom?.courses?.toString()
+      courseIds: selectedClassroom?.toString()
     }
   }, {
     enabled: !!assignment.classroomId
   });
   const membersQuery = _Queries.classrooms.useClassroomMembers(async (classroomId, username) => {
-    const response = await getClassroomMembers(classroomId, username);
-    return response;
+    const allMembers = [];
+    await Promise.all(classroomId.map(async cId => {
+      const response = await getClassroomMembers(cId, username);
+      allMembers.push(response?.Items || []);
+    }));
+    const flatMembers = allMembers.flat();
+    const seen = new Set();
+    const uniqueMembers = flatMembers.filter(member => {
+      if (seen.has(member.memberId)) return false;
+      seen.add(member.memberId);
+      return true;
+    });
+    return uniqueMembers;
   }, {
-    classroomId: assignment.classroomId,
+    classroomId: assignment?.classroomId,
     username: username
   }, {
-    enabled: !!assignment.classroomId
+    enabled: !!(assignment.classroomId.length > 0)
   });
-  const selectedCourses = (0, _react.useMemo)(() => coursesQuery.isSuccess && Array.isArray(coursesQuery.data.Items) && coursesQuery.data.Items.length ? coursesQuery.data.Items : [], [coursesQuery.data, coursesQuery.isSuccess]);
+  const selectedCourses = (0, _react.useMemo)(() => {
+    if (!coursesQuery.isSuccess || !Array.isArray(coursesQuery.data.Items)) {
+      return [];
+    }
+    const rawCourses = coursesQuery.data.Items;
+    const allowedCourses = (classrooms || []).filter(c => assignment.classroomId.includes(c.classroomId)).map(c => c.courses || []).filter(arr => Array.isArray(arr)); // Ensure valid arrays
+
+    const commonCourses = allowedCourses.length === 0 ? [] : allowedCourses.reduce((acc, arr) => acc.filter(str => arr.includes(str)));
+    const filtered = rawCourses.filter(course => (commonCourses || []).includes(course?.courseId));
+    return filtered;
+  }, [coursesQuery.data, coursesQuery.isSuccess, classrooms, assignment.classroomId]);
   (0, _react.useEffect)(() => {
     let filteredCourses = selectedCourses.filter(course => submittedExercises.some(exercise => exercise.courseSectionTopicId?.split("|")[0] === course.courseId));
     setAssignment({
@@ -111,7 +144,7 @@ function CreateAssignmentDialog({
       courses: filteredCourses
     });
   }, [selectedCourses, submittedExercises]);
-  const selectedMembers = (0, _react.useMemo)(() => membersQuery.isSuccess && Array.isArray(membersQuery.data.Items) && membersQuery.data.Items.length ? membersQuery.data.Items : [], [membersQuery.data, membersQuery.isSuccess]);
+  const selectedMembers = (0, _react.useMemo)(() => membersQuery.isSuccess && Array.isArray(membersQuery.data) && membersQuery.data.length ? membersQuery.data : [], [membersQuery.data, membersQuery.isSuccess]);
   const classroomMembers = async selectedMembers => {
     const formattedMembers = await getMemberDetails(selectedMembers);
     setMembers(formattedMembers);
@@ -134,7 +167,7 @@ function CreateAssignmentDialog({
   (0, _react.useEffect)(() => {
     setAssignment(prev => ({
       ...prev,
-      classroomId: classroom
+      classroomId: [classroom]
     }));
   }, [classroom]);
   const [isSelectExerciseOpen, setIsSelectExerciseOpen] = (0, _react.useState)(false);
@@ -157,6 +190,12 @@ function CreateAssignmentDialog({
           assignedStudents: typeof value === "string" ? value.split(",") : value
         };
       }
+      if (field === "classroomId") {
+        return {
+          ...prev,
+          classroomId: typeof value === "string" ? value.split(",") : value
+        };
+      }
       if (field === "classroom") {
         return {
           ...prev,
@@ -170,9 +209,21 @@ function CreateAssignmentDialog({
       };
     });
   };
-  const handleCreateAssignment = () => {
-    createAssignment(assignment);
-    handleClose();
+  const handleCreateAssignment = async () => {
+    try {
+      await Promise.all(assignment.classroomId.map(async cId => {
+        const selectedClassroomMembers = selectedMembers.filter(member => member.classroomId === cId).map(student => student.memberId).filter(studentId => assignment?.assignedStudents.includes(studentId));
+        const formattedAssignment = {
+          ...assignment,
+          classroomId: cId,
+          assignedStudents: selectedClassroomMembers
+        };
+        return createAssignment(formattedAssignment);
+      }));
+      handleClose();
+    } catch (error) {
+      console.error("Error creating assignments:", error);
+    }
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Dialog, {
     fullScreen: true,
@@ -223,14 +274,16 @@ function CreateAssignmentDialog({
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
               labelId: "classroom-label",
               id: "classroom",
+              multiple: true,
               "data-cy": "select-classroom-dropdown",
               value: assignment.classroomId,
               label: t("select_classroom"),
               onChange: handleChange("classroomId"),
               required: true,
-              disabled: classroom,
-              children: classrooms?.map(classroom => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
-                value: classroom.classroomId,
+              renderValue: selected => selected?.map(classroomId => classrooms?.find(c => c.classroomId === classroomId))?.map(c => c?.classroomName)?.filter(n => n).join(", "),
+              children: classrooms.filter(c => c.createdBy === username || c.collaborators.includes(userEmail)).map(c => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
+                value: c.classroomId,
+                disabled: c.classroomId === classroom,
                 children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
                   sx: {
                     display: "flex",
@@ -239,13 +292,16 @@ function CreateAssignmentDialog({
                   },
                   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemAvatar, {
                     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
-                      src: classroom.picture
+                      src: c.picture
                     })
                   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-                    primary: classroom.classroomName
+                    primary: c.classroomName
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
+                    disabled: c.classroomId === classroom,
+                    checked: assignment.classroomId?.includes(c.classroomId) || c.classroomId === classroom
                   })]
                 })
-              }, classroom.classroomId))
+              }, c.classroomId))
             })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
             "data-cy": "assignment-title-input",
@@ -262,16 +318,28 @@ function CreateAssignmentDialog({
             rows: 3,
             value: assignment.instructions,
             onChange: handleChange("instructions")
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
-            "data-cy": "assignment-exercise-selector-button",
-            variant: "outlined",
-            color: "primary",
-            sx: {
-              width: "fit-content"
-            },
-            startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Add.default, {}),
-            onClick: () => setIsSelectExerciseOpen(true),
-            children: t("add_exercise")
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+            disableHoverListener: selectedCourses?.length > 0,
+            disableFocusListener: selectedCourses?.length > 0,
+            disableTouchListener: selectedCourses?.length > 0,
+            title: t("no_shared_courses"),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              style: {
+                display: 'inline-block'
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
+                "data-cy": "assignment-exercise-selector-button",
+                variant: "outlined",
+                color: "primary",
+                disabled: selectedCourses?.length === 0,
+                sx: {
+                  width: "fit-content"
+                },
+                startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Add.default, {}),
+                onClick: () => setIsSelectExerciseOpen(true),
+                children: t("add_exercise")
+              })
+            })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AssignmentExerciseSelector.default, {
             selectedExercises: submittedExercises,
             t: t,
@@ -371,7 +439,7 @@ function CreateAssignmentDialog({
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
           "data-cy": "assignment-assign-button",
           disabled: !assignment.assignedStudents?.length || !assignment.scheduleDate || !assignment.dueDate || !assignment.title || !assignment.classroomId || !assignment.exercises?.length,
-          onClick: handleCreateAssignment,
+          onClick: async () => await handleCreateAssignment(),
           children: t("assign")
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
           color: "primary",
@@ -416,8 +484,8 @@ function CreateAssignmentDialog({
             color: "primary",
             fullWidth: true,
             "data-cy": "assignment-schedule-button",
-            onClick: () => {
-              handleCreateAssignment();
+            onClick: async () => {
+              await handleCreateAssignment();
               handleMenuClose();
             },
             children: t("schedule_assignment")

package/dist/Cards/SubscriptionPlan/SubscriptionPlan.js

@@ -18,8 +18,7 @@ var _plus = _interopRequireDefault(require("./plus.svg"));
 var _nuala = _interopRequireDefault(require("./nuala.svg"));
 var _index = require("../../utils/index");
 var _jsxRuntime = require("react/jsx-runtime");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const PREFIX = "SubscriptionPlan";
 const classes = {