@nualang/nualang-ui-components 0.1.1229 → 0.1.1231

package/dist/Assignments/AssignmentCard/AssignmentCard.js

@@ -6,13 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = AssignmentCard;
 var _react = _interopRequireWildcard(require("react"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
-var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
-var _ExpandLess = _interopRequireDefault(require("@mui/icons-material/ExpandLess"));
 var _material = require("@mui/material");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _AssignmentExerciseSelector = _interopRequireDefault(require("../AssignmentExerciseSelector/AssignmentExerciseSelector"));
 var _Queries = require("@nualang/nualang-api-and-queries/Queries");
 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); }
@@ -29,17 +28,30 @@ function AssignmentCard({
   deleteAssignment,
   handleEditAssignment
 }) {
-  const [expanded, setExpanded] = (0, _react.useState)(false);
   const [confirm] = (0, _useConfirm.default)(t);
   const handleDeleteAssignment = async (classroomId, assignmentId) => {
-    const confirmed = await confirm(t('delete_assignment'), t('delete_assignment_confirmation'));
+    const confirmed = await confirm(t("delete_assignment"), t("delete_assignment_confirmation"));
     if (confirmed) {
       await deleteAssignment(classroomId, assignmentId);
     }
   };
-  const calculateDaysUntilDue = dueDate => {
+  const calculateDaysUntilDue = (dueDate, scheduledDate) => {
     const now = new Date();
     const due = new Date(dueDate);
+    const scheduled = new Date(scheduledDate);
+    console.log('now', now);
+    console.log('due', due);
+    console.log('scheduled', scheduled);
+    if (scheduled > now) {
+      const daysUntilScheduled = Math.ceil((scheduled - now) / (1000 * 60 * 60 * 24));
+      if (daysUntilScheduled === 1) {
+        return t("available_tomorrow");
+      } else if (daysUntilScheduled === 0) {
+        return t("available_today");
+      } else {
+        return `${t("available_in")} ${daysUntilScheduled} ${t("days")}`;
+      }
+    }
     const diffTime = due - now;
     const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
     if (diffDays < 0) {
@@ -52,10 +64,6 @@ function AssignmentCard({
       return `${t("due_in")} ${diffDays} ${t("days")}`;
     }
   };
-  const handleIconClick = event => {
-    event.stopPropagation();
-    setExpanded(prev => !prev);
-  };
   const {
     uniqueCourses
   } = (0, _react.useMemo)(() => {
@@ -135,34 +143,32 @@ function AssignmentCard({
               children: `${Math.round(assignment.completed / assignment.assignedStudents.length * 100)}%`
             })]
           })]
-        }), isCreator && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
-          item: true,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
-            onClick: () => handleEditAssignment(assignment),
-            color: "primary",
-            children: t("edit")
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Button, {
-            color: "primary",
-            onClick: () => {
-              handleDeleteAssignment(assignment.classroomId, assignment.assignmentId);
-            },
-            children: [t("delete"), " "]
-          })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
           item: true,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
             variant: "button",
             color: "text.secondary",
-            children: calculateDaysUntilDue(assignment.dueDate)
+            children: calculateDaysUntilDue(assignment.dueDate, assignment.scheduleDate)
           })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
+        }), isCreator && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
           item: true,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
-            onClick: handleIconClick,
-            children: expanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandLess.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandMore.default, {})
-          })
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+            title: t("edit"),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.IconButton, {
+              onClick: () => handleEditAssignment(assignment),
+              children: [" ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.Edit, {}), " "]
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+            title: t("delete"),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.IconButton, {
+              onClick: () => {
+                handleDeleteAssignment(assignment.classroomId, assignment.assignmentId);
+              },
+              children: [" ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.Delete, {}), " "]
+            })
+          })]
         })]
-      }), expanded && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
         mt: 2,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {
           sx: {
@@ -180,7 +186,7 @@ function AssignmentCard({
               children: assignment.instructions
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
               mt: 2,
-              width: "80%",
+              width: isCreator ? "80%" : "100%",
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AssignmentExerciseSelector.default, {
                 t: t,
                 assignment: assignment,
@@ -197,7 +203,7 @@ function AssignmentCard({
             item: true,
             xs: 3,
             md: 2,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+            children: [isCreator && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
               display: "flex",
               justifyContent: "space-between",
               alignItems: "center",

package/dist/Assignments/AssignmentCardsList/AssignmentCardsList.js

@@ -26,7 +26,6 @@ const AssignmentCardsList = ({
   refreshAssignments
 }) => {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-    mt: 3,
     mb: 1,
     children: assignments.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
@@ -48,14 +47,14 @@ const AssignmentCardsList = ({
           sx: {
             textAlign: "center",
             mt: 2,
-            width: '70%'
+            width: "70%"
           },
           children: t("no_assignments_description")
         }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
           sx: {
             textAlign: "center",
             mt: 2,
-            width: '70%'
+            width: "70%"
           },
           children: t("assignments_description")
         }), isCreator && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
@@ -106,7 +105,11 @@ const AssignmentCardsList = ({
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Refresh.default, {})
           })
         })]
-      }), assignments.map(assignment => /*#__PURE__*/(0, _jsxRuntime.jsx)(_AssignmentCard.default, {
+      }), assignments.filter(assignment => {
+        if (isCreator) return true;
+        if (!assignment.scheduleDate) return true;
+        return new Date(assignment.scheduleDate) <= new Date();
+      }).map(assignment => /*#__PURE__*/(0, _jsxRuntime.jsx)(_AssignmentCard.default, {
         assignment: assignment,
         t: t,
         isCreator: isCreator,
@@ -115,7 +118,7 @@ const AssignmentCardsList = ({
         getRoleplays: getRoleplays,
         deleteAssignment: deleteAssignment,
         handleEditAssignment: handleEditAssignment
-      }, assignment.id))]
+      }, assignment.assignmentId))]
     })
   });
 };

package/dist/Assignments/AssignmentExerciseSelection/AssignmentExerciseSelection.js

@@ -29,12 +29,12 @@ function Exercise({
   section,
   t,
   isExerciseSelected,
-  setIsExerciseSelected,
   roleplays,
   phrases,
   handleSelectExercise = null,
   selectedExercises,
-  useCase
+  useCase,
+  assignment
 }) {
   const [listeningHidden, setListeningHidden] = (0, _react.useState)(false);
   const [translationHidden, setTranslationHidden] = (0, _react.useState)(false);
@@ -49,7 +49,8 @@ function Exercise({
   } = params;
   const [courseId, sectionId, topicId] = courseSectionTopicId.split("|");
   const addSearchParams = () => {
-    navigate(`/classrooms/${classroomId}/${courseId}/${sectionId}/${topicId}?exercise=${name}`);
+    const assignmentParam = encodeURIComponent(JSON.stringify(assignment));
+    navigate(`/classrooms/${classroomId}/${courseId}/${sectionId}/${topicId}?exercise=${name}&assignment=${assignmentParam}`);
   };
   const handleToggleRoleplays = () => {
     setRoleplaysOpen(!roleplaysOpen);
@@ -135,7 +136,8 @@ function Exercise({
           isExerciseSelected: isExerciseSelected,
           handleSelectExercise: handleSelectExercise,
           selectedExercises: selectedExercises,
-          useCase: useCase
+          useCase: useCase,
+          assignment: assignment
         })
       })
     })]

package/dist/Assignments/AssignmentRoleplaySelection/AssignmentRoleplaySelection.js

@@ -12,6 +12,10 @@ var _RateReview = _interopRequireDefault(require("@mui/icons-material/RateReview
 var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
 var _ExpandLess = _interopRequireDefault(require("@mui/icons-material/ExpandLess"));
 var _AutoStories = _interopRequireDefault(require("@mui/icons-material/AutoStories"));
+var _Forum = _interopRequireDefault(require("@mui/icons-material/Forum"));
+var _Headphones = _interopRequireDefault(require("@mui/icons-material/Headphones"));
+var _RecordVoiceOver = _interopRequireDefault(require("@mui/icons-material/RecordVoiceOver"));
+var _SpaceBar = _interopRequireDefault(require("@mui/icons-material/SpaceBar"));
 var _reactRouterDom = require("react-router-dom");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -23,7 +27,8 @@ function Roleplay({
   isExerciseSelected,
   handleSelectExercise = null,
   selectedExercises,
-  useCase
+  useCase,
+  assignment
 }) {
   const navigate = (0, _reactRouterDom.useNavigate)();
   const params = (0, _reactRouterDom.useParams)();
@@ -36,7 +41,8 @@ function Roleplay({
       console.error('Missing required parameters for navigation');
       return;
     }
-    navigate(`/classrooms/${classroomId}/${courseId}/${sectionId}/${topicId}/roleplays/${roleplay?.roleplayId}?game=${encodeURIComponent(exercise)}`);
+    const assignmentParam = encodeURIComponent(JSON.stringify(assignment));
+    navigate(`/classrooms/${classroomId}/${courseId}/${sectionId}/${topicId}/roleplays/${roleplay?.roleplayId}?game=${encodeURIComponent(exercise)}&assignment=${assignmentParam}`);
   };
   const [open, setOpen] = (0, _react.useState)(false);
   const 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"];
@@ -71,6 +77,31 @@ function Roleplay({
   const roleplayHasInteractions = numberOfRoleplayInteractions > 0;
   const roleplayHasQuestions = numberOfRoleplayQuestions > 0;
   const isRoleplayValid = roleplayHasInteractions && roleplayHasQuestions;
+  const ActItOutListeningSpeakingIcon = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Headphones.default, {
+      fontSize: "small"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RecordVoiceOver.default, {
+      fontSize: "small"
+    })]
+  });
+  const getIconForGame = game => {
+    switch (game) {
+      case "roleplay-story":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoStories.default, {});
+      case "roleplay-fill-in-the-blanks":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SpaceBar.default, {});
+      case "roleplay-act-it-out":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Message.default, {});
+      case "roleplay-act-it-out-listening":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Headphones.default, {});
+      case "roleplay-act-it-out-speaking":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RecordVoiceOver.default, {});
+      case "roleplay-act-it-out-listening-speaking":
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(ActItOutListeningSpeakingIcon, {});
+      default:
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Forum.default, {});
+    }
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
       title: !isRoleplayValid ? t("roleplay_not_valid") : "",
@@ -195,10 +226,10 @@ function Roleplay({
             }
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoStories.default, {})
+            children: getIconForGame(game)
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-            primary: t(game),
-            secondary: t("story_description")
+            primary: t(game.replace(/roleplay-/, "").replace(/-/g, "_")),
+            secondary: t(game.replace(/roleplay-/, "").replace(/-/g, "_") + "_description")
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
               checked: selectedExercises?.some(e => e.roleplayId === roleplay.roleplayId && e.game === game)
@@ -218,7 +249,7 @@ function Roleplay({
             }
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoStories.default, {})
+            children: getIconForGame(game)
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
             primary: t(game.replace(/roleplay-/, "").replace(/-/g, "_")),
             secondary: t(game.replace(/roleplay-/, "").replace(/-/g, "_") + "_description")
@@ -239,7 +270,8 @@ function AssignmentRoleplaySelection({
   isExerciseSelected,
   handleSelectExercise,
   selectedExercises,
-  useCase
+  useCase,
+  assignment
 }) {
   const [isRoleplaySelected, setIsRoleplaySelected] = (0, _react.useState)(false);
   return roleplays.map((roleplay, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Roleplay, {
@@ -251,7 +283,8 @@ function AssignmentRoleplaySelection({
     isExerciseSelected: isExerciseSelected,
     handleSelectExercise: handleSelectExercise,
     selectedExercises: selectedExercises,
-    useCase: useCase
+    useCase: useCase,
+    assignment: assignment
   }, index));
 }
 var _default = exports.default = AssignmentRoleplaySelection;

package/dist/Assignments/CreateAssignmentDialog/CreateAssignmentDialog.js

@@ -336,17 +336,17 @@ function CreateAssignmentDialog({
         })
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-      sx: {
+      sx: theme => ({
         position: "fixed",
         bottom: 0,
         width: "100%",
-        backgroundColor: "white",
-        boxShadow: "0 -2px 5px rgba(0,0,0,0.1)",
+        backgroundColor: theme.palette.background.paper,
+        boxShadow: theme.shadows[4],
         p: 2,
         textAlign: "center",
         display: "flex",
         justifyContent: "flex-end"
-      },
+      }),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
         color: "primary",
         sx: {
@@ -407,7 +407,7 @@ function CreateAssignmentDialog({
             color: "primary",
             fullWidth: true,
             onClick: () => {
-              handleCreateAssignment;
+              handleCreateAssignment();
               handleMenuClose();
             },
             children: t("schedule_assignment")

package/dist/Containers/App/App.js

@@ -215,7 +215,8 @@ function App({
   verificationStatus,
   gameAward,
   isCollapsed,
-  setIsCollapsed
+  setIsCollapsed,
+  isUserInternal
 }) {
   const theme = (0, _styles.useTheme)();
   const isLgScreen = (0, _useMediaQuery.default)(theme.breakpoints.up("md"));
@@ -407,7 +408,7 @@ function App({
               "data-cy": "appbar-create-course",
               children: t("course")
             })]
-          }), process.env.REACT_APP_STAGE === "dev" && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.MenuItem, {
+          }), (isUserInternal || process.env.REACT_APP_STAGE === "dev") && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.MenuItem, {
             onClick: handleCreateAssignment,
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Assignment.default, {})

package/dist/Dialogs/ExerciseMenu/Menus/CloseExercise/CloseExercise.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _ExerciseMenu = _interopRequireDefault(require("../../ExerciseMenu"));
+var _reactRouterDom = require("react-router-dom");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function CloseExerciseMenu({
@@ -15,10 +16,14 @@ function CloseExerciseMenu({
   saveProgress,
   finishExercise,
   goBack,
+  goBackToAssignment,
   inTopic = false,
   saveDisabled = false,
   isFinishExerciseDisabled
 }) {
+  const location = (0, _reactRouterDom.useLocation)();
+  const searchParams = new URLSearchParams(location.search);
+  const assignment = JSON.parse(decodeURIComponent(searchParams.get("assignment")));
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExerciseMenu.default, {
     open: open,
     handleClose: close,
@@ -36,13 +41,19 @@ function CloseExerciseMenu({
       color: "primary",
       onClick: saveProgress,
       disabled: isSpeaking
-    }, {
+    }, ...(assignment ? [{
+      dataCypress: "go_back_to_assignments",
+      text: t("go_back_to_assignments"),
+      variant: "",
+      color: "",
+      onClick: goBackToAssignment
+    }] : [{
       dataCypress: "go_back_to_topic",
       text: inTopic ? t("go_back_to_topic") : t("quit"),
       variant: "",
       color: "",
       onClick: goBack
-    }]
+    }])]
   });
 }
 var _default = exports.default = CloseExerciseMenu;

package/dist/Dialogs/ExerciseMenu/Menus/CompletedExcercise/CompletedExcercise.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _ExerciseMenu = _interopRequireDefault(require("../../ExerciseMenu"));
+var _reactRouterDom = require("react-router-dom");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function CompletedExerciseMenu({
@@ -17,8 +18,12 @@ function CompletedExerciseMenu({
   viewReport,
   inTopic = false,
   hasNextGame,
-  handleNextGame
+  handleNextGame,
+  goBackToAssignment
 }) {
+  const location = (0, _reactRouterDom.useLocation)();
+  const searchParams = new URLSearchParams(location.search);
+  const assignment = JSON.parse(decodeURIComponent(searchParams.get("assignment")));
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExerciseMenu.default, {
     open: open,
     handleClose: close,
@@ -43,14 +48,20 @@ function CompletedExerciseMenu({
       color: "primary",
       onClick: viewReport,
       disabled: disableViewReport
-    }, {
+    }, ...(assignment ? [{
+      dataCypress: "go_back_to_assignments",
+      text: t("go_back_to_assignments"),
+      variant: "",
+      color: "",
+      onClick: goBackToAssignment
+    }] : [{
       dataCypress: "go_back_to_topic",
       text: inTopic ? t("go_back_to_topic") : t("quit"),
       variant: "",
       color: "",
       onClick: goBack,
       disabled: false
-    }]
+    }])]
   });
 }
 var _default = exports.default = CompletedExerciseMenu;

package/dist/Dialogs/ExerciseMenu/Menus/InProgressExercise/InProgressExercise.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _ExerciseMenu = _interopRequireDefault(require("../../ExerciseMenu"));
+var _reactRouterDom = require("react-router-dom");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function InProgressExercise({
@@ -14,8 +15,12 @@ function InProgressExercise({
   continueExercise,
   restartExercise,
   goBack,
-  inTopic = false
+  inTopic = false,
+  goBackToAssignment
 }) {
+  const location = (0, _reactRouterDom.useLocation)();
+  const searchParams = new URLSearchParams(location.search);
+  const assignment = JSON.parse(decodeURIComponent(searchParams.get("assignment")));
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExerciseMenu.default, {
     open: open,
     handleClose: close,
@@ -29,12 +34,17 @@ function InProgressExercise({
       variant: "outlined",
       color: "primary",
       onClick: restartExercise
-    }, {
+    }, ...(assignment ? [{
+      text: t("go_back_to_assignments"),
+      variant: "",
+      color: "",
+      onClick: goBackToAssignment
+    }] : [{
       text: inTopic ? t("go_back_to_topic") : t("quit"),
       variant: "",
       color: "",
       onClick: goBack
-    }]
+    }])]
   });
 }
 var _default = exports.default = InProgressExercise;

package/dist/Dialogs/RecordingDialog/RecordingDialog.js

@@ -37,7 +37,7 @@ function TranscriptViewer({
       const attendee = attendeesData.find(item => item.username === identifier);
       const userImage = attendee ? attendee.userImage : null;
       // console.log({ sentence, attendee, userImage, conversation })
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
         "aria-label": "go to time in recording",
         display: "flex",
         alignItems: "center",
@@ -49,27 +49,49 @@ function TranscriptViewer({
             backgroundColor: "#f2f2f2"
           }
         },
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-          display: "flex",
-          alignItems: "center",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
-            alt: sentence?.username,
-            src: userImage,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Grid.default, {
+          container: true,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Grid.default, {
+            item: true,
+            xs: 4,
+            md: 3,
             sx: {
-              width: 24,
-              height: 24,
-              marginRight: "8px"
-            }
-          }), sentence?.user && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            style: {
-              fontWeight: "bold",
-              marginRight: "8px"
+              display: "flex",
+              flexDirection: "column"
             },
-            children: `${sentence.user}:`
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+              display: "flex",
+              alignItems: "center",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
+                alt: sentence?.username,
+                src: userImage,
+                sx: {
+                  width: 24,
+                  height: 24,
+                  marginRight: "8px"
+                }
+              }), sentence?.user && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                style: {
+                  fontWeight: "bold",
+                  marginRight: "8px"
+                },
+                children: `${sentence.user}:`
+              })]
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Grid.default, {
+            item: true,
+            xs: 8,
+            md: 9,
+            sx: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "left"
+            },
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+              children: sentence.text
+            })
           })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-          children: sentence.text
-        })]
+        })
       }, `conversation-${i}`);
     }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
       variant: "body2",

package/dist/Dialogs/SelectExercise/SelectExercise.js

@@ -19,44 +19,16 @@ function SelectExercise({
   getCourseSections,
   getRoleplays,
   handleCreateGame,
-  username,
-  useCase = "live",
-  selectedExercises = [],
-  setSelectedExercises,
-  isAssignment
+  username
 }) {
   const [isExerciseSelected, setIsExerciseSelected] = (0, _react.useState)(false);
-  const handleSelectExercise = (exercises = []) => {
-    setSelectedExercises(prevSelectedExercises => {
-      let updatedExercises = [...prevSelectedExercises];
-      exercises.forEach(exercise => {
-        if (exercise.courseSectionTopicId && updatedExercises.some(e => e.courseSectionTopicId === exercise.courseSectionTopicId && e.name === exercise.name)) {
-          updatedExercises = updatedExercises.filter(e => e.courseSectionTopicId !== exercise.courseSectionTopicId || e.name !== exercise.name);
-        } else if (exercise.roleplayId && updatedExercises.some(e => e.roleplayId === exercise.roleplayId && e.game === exercise.game)) {
-          updatedExercises = updatedExercises.filter(e => e.courseSectionTopicId || e.roleplayId !== exercise.roleplayId || e.game !== exercise.game);
-        } else {
-          updatedExercises.push(exercise);
-        }
-      });
-      return updatedExercises;
-    });
-  };
-  const handleSubmitExercises = () => {
-    setSelectedExercises(selectedExercises);
-    handleClose();
-  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveDialog.default, {
     open: open,
     handleClose: handleClose,
-    dialogTitle: useCase === "live" ? t("play_live") : t("assignment"),
+    dialogTitle: t("play_live"),
     maxWidth: "md",
-    handleSubmit: useCase === "live" ? null : () => {
-      handleSubmitExercises();
-    },
-    submitText: useCase === "live" ? null : t("add_exercises"),
-    isSubmitDisabled: selectedExercises.length === 0,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.DialogContentText, {
-      children: useCase === "live" ? t("live_dialog_description") : t("assign_exercises_description")
+      children: t("live_dialog_description")
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_system.Box, {
       mt: 1,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CourseSelection.default, {
@@ -68,11 +40,7 @@ function SelectExercise({
         t: t,
         isExerciseSelected: isExerciseSelected,
         setIsExerciseSelected: setIsExerciseSelected,
-        isDialogOpen: open,
-        useCase: useCase,
-        selectedExercises: selectedExercises,
-        handleSelectExercise: useCase === "assignment" ? handleSelectExercise : null,
-        isAssignment: isAssignment
+        isDialogOpen: open
       })
     })]
   });