@nualang/nualang-ui-components 0.1.1377 → 0.1.1379

package/dist/Assignments/AssignmentBotSelection/AssignmentBotSelection.js

@@ -227,23 +227,46 @@ function AssignmentBotSelection({
     return true;
   });
   const filteredBots = useCase === "assignment-view" || useCase === "assignment-start" ? visibleBots.filter(bot => selectedExercises.some(ex => ex.botId === bot.botId && ex.courseSectionTopicId === courseSectionTopicId)) : visibleBots;
-  return filteredBots.map((bot, index) => /*#__PURE__*/_jsx(Bot, {
-    bot: bot,
-    courseSectionTopicId: courseSectionTopicId,
-    t: t,
-    isExerciseSelected: isExerciseSelected,
-    handleSelectExercise: handleSelectExercise,
-    selectedExercises: selectedExercises,
-    useCase: useCase,
-    assignment: assignment,
-    lastClickedExerciseId: lastClickedExerciseId,
-    memberCourseCompletions: memberCourseCompletions,
-    topicProgress: topicProgress,
-    handleRemoveExercise: handleRemoveExercise,
-    isPreview: isPreview,
-    isChallengeModeStudent: isChallengeModeStudent,
-    isCreator: isCreator,
-    isCreateMode: isCreateMode
-  }, index));
+  const existingBotIds = new Set(visibleBots.map(b => b.botId));
+  const orphanedBotIds = useCase === "assignment-view" || useCase === "assignment-start" ? [...new Set(selectedExercises.filter(ex => ex.botId && ex.courseSectionTopicId === courseSectionTopicId && !existingBotIds.has(ex.botId)).map(ex => ex.botId))] : [];
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [filteredBots.map((bot, index) => /*#__PURE__*/_jsx(Bot, {
+      bot: bot,
+      courseSectionTopicId: courseSectionTopicId,
+      t: t,
+      isExerciseSelected: isExerciseSelected,
+      handleSelectExercise: handleSelectExercise,
+      selectedExercises: selectedExercises,
+      useCase: useCase,
+      assignment: assignment,
+      lastClickedExerciseId: lastClickedExerciseId,
+      memberCourseCompletions: memberCourseCompletions,
+      topicProgress: topicProgress,
+      handleRemoveExercise: handleRemoveExercise,
+      isPreview: isPreview,
+      isChallengeModeStudent: isChallengeModeStudent,
+      isCreator: isCreator,
+      isCreateMode: isCreateMode
+    }, index)), orphanedBotIds.map(id => /*#__PURE__*/_jsx(Box, {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        pl: 2,
+        py: 1.5,
+        ml: {
+          xs: "16px",
+          sm: "72px",
+          md: "76px"
+        },
+        borderLeft: "3px solid",
+        borderColor: "warning.main"
+      },
+      children: /*#__PURE__*/_jsx(Typography, {
+        variant: "body2",
+        color: "text.secondary",
+        children: t("exercise_no_longer_available")
+      })
+    }, id))]
+  });
 }
 export default AssignmentBotSelection;

package/dist/Assignments/AssignmentCard/AssignmentCard.js

@@ -29,7 +29,8 @@ export default function AssignmentCard({
   handleViewProgress,
   lastAssignmentFetch,
   assignedStudents = [],
-  isChallengeModeStudent
+  isChallengeModeStudent,
+  isReadWriteModeStudent
 }) {
   const [confirm] = useConfirm(t);
   const {
@@ -223,7 +224,8 @@ export default function AssignmentCard({
                 completionHelpers: completionHelpers,
                 memberCourseCompletions: memberCourseCompletions,
                 lastClickedExerciseId: lastClickedExerciseId,
-                isChallengeModeStudent: isChallengeModeStudent
+                isChallengeModeStudent: isChallengeModeStudent,
+                isReadWriteModeStudent: isReadWriteModeStudent
               })
             })]
           }), /*#__PURE__*/_jsx(Grid, {

package/dist/Assignments/AssignmentCardsList/AssignmentCardsList.js

@@ -29,6 +29,7 @@ const AssignmentCardsList = ({
   assignmentMembersById = {},
   isLoadingAssignments,
   isChallengeModeStudent,
+  isReadWriteModeStudent,
   scrollableTarget = null
 }) => {
   const [lastClickedExerciseId, setLastClickedExerciseId] = useState(null);
@@ -345,7 +346,8 @@ const AssignmentCardsList = ({
         memberId: memberId,
         handleViewProgress: handleViewProgress,
         assignedStudents: assignmentMembersById[assignment.assignmentId] || [],
-        isChallengeModeStudent: isChallengeModeStudent
+        isChallengeModeStudent: isChallengeModeStudent,
+        isReadWriteModeStudent: isReadWriteModeStudent
       }, assignment.assignmentId))
     })]
   });

package/dist/Assignments/AssignmentCourseSelection/AssignmentCourseSelection.js

@@ -32,7 +32,8 @@ function Course({
   lastClickedExerciseId,
   handleRemoveExercise,
   isPreview,
-  isChallengeModeStudent
+  isChallengeModeStudent,
+  isReadWriteModeStudent
 }) {
   const numOfIds = lastClickedExerciseId ? lastClickedExerciseId.split("|") : [];
   const [open, setOpen] = useState(false);
@@ -88,11 +89,11 @@ function Course({
       }
     });
     if (courseSections && memberCourseCompletions && selectedExercises) {
-      const sectionsWithProgress = calcCompletions(courseSections.filter(section => assignedSectionIds.has(section.sectionId)), memberCourseCompletions, selectedExercises, isChallengeModeStudent);
+      const sectionsWithProgress = calcCompletions(courseSections.filter(section => assignedSectionIds.has(section.sectionId)), memberCourseCompletions, selectedExercises, isChallengeModeStudent, isReadWriteModeStudent);
       const percentCompletion = calcPercentageCompletion(sectionsWithProgress);
       setCourseSectionCompletion(percentCompletion);
     }
-  }, [courseSections, memberCourseCompletions, selectedExercises]);
+  }, [courseSections, memberCourseCompletions, selectedExercises, isChallengeModeStudent, isReadWriteModeStudent]);
   return /*#__PURE__*/_jsx(_Fragment, {
     children: useCase === "assignment-select" ? /*#__PURE__*/_jsxs(List, {
       disablePadding: true,
@@ -178,7 +179,8 @@ function Course({
             completionHelpers: completionHelpers,
             memberCourseCompletions: memberCourseCompletions,
             lastClickedExerciseId: lastClickedExerciseId,
-            isChallengeModeStudent: isChallengeModeStudent
+            isChallengeModeStudent: isChallengeModeStudent,
+            isReadWriteModeStudent: isReadWriteModeStudent
           })
         })
       })]
@@ -209,7 +211,8 @@ function Course({
         course: course,
         handleRemoveExercise: handleRemoveExercise,
         isPreview: isPreview,
-        isChallengeModeStudent: isChallengeModeStudent
+        isChallengeModeStudent: isChallengeModeStudent,
+        isReadWriteModeStudent: isReadWriteModeStudent
       })
     })
   });
@@ -237,7 +240,8 @@ function AssignmentCourseSelection({
   lastClickedExerciseId,
   handleRemoveExercise,
   isPreview,
-  isChallengeModeStudent
+  isChallengeModeStudent,
+  isReadWriteModeStudent
 }) {
   return /*#__PURE__*/_jsx("div", {
     children: courses.map((course, index) => /*#__PURE__*/_jsx(Course, {
@@ -264,7 +268,8 @@ function AssignmentCourseSelection({
       lastClickedExerciseId: lastClickedExerciseId,
       handleRemoveExercise: handleRemoveExercise,
       isPreview: isPreview,
-      isChallengeModeStudent: isChallengeModeStudent
+      isChallengeModeStudent: isChallengeModeStudent,
+      isReadWriteModeStudent: isReadWriteModeStudent
     }, course.courseId || index))
   });
 }

package/dist/Assignments/AssignmentExerciseSelection/AssignmentExerciseSelection.js

@@ -888,15 +888,16 @@ function SectionList({
   handleRemoveExercise,
   isPreview,
   isChallengeModeStudent,
+  isReadWriteModeStudent,
   ...otherProps
 }) {
   const [courseSectionWithProgress, setCourseSectionWithProgress] = useState([]);
   useEffect(() => {
     if (sections && memberCourseCompletions && selectedExercises) {
-      const sectionsWithProgress = calcCompletions(sections, memberCourseCompletions, selectedExercises, isChallengeModeStudent);
+      const sectionsWithProgress = calcCompletions(sections, memberCourseCompletions, selectedExercises, isChallengeModeStudent, isReadWriteModeStudent);
       setCourseSectionWithProgress(sectionsWithProgress);
     }
-  }, [sections, memberCourseCompletions, selectedExercises, isChallengeModeStudent]);
+  }, [sections, memberCourseCompletions, selectedExercises, isChallengeModeStudent, isReadWriteModeStudent]);
   const courseSections = courseSectionWithProgress && courseSectionWithProgress.length ? courseSectionWithProgress : sections;
   return /*#__PURE__*/_jsx(_Fragment, {
     children: courseSections.length > 0 ? courseSections.map((section, index) => {
@@ -967,6 +968,7 @@ function AssignmentExerciseSelection({
   handleRemoveExercise,
   isPreview,
   isChallengeModeStudent,
+  isReadWriteModeStudent,
   ...otherProps
 }) {
   if (isLoading) {
@@ -998,6 +1000,7 @@ function AssignmentExerciseSelection({
         handleRemoveExercise: handleRemoveExercise,
         isPreview: isPreview,
         isChallengeModeStudent: isChallengeModeStudent,
+        isReadWriteModeStudent: isReadWriteModeStudent,
         ...otherProps
       })
     });
@@ -1030,6 +1033,7 @@ function AssignmentExerciseSelection({
       handleRemoveExercise: handleRemoveExercise,
       isPreview: isPreview,
       isChallengeModeStudent: isChallengeModeStudent,
+      isReadWriteModeStudent: isReadWriteModeStudent,
       ...otherProps
     })
   });

package/dist/Assignments/AssignmentExerciseSelector/AssignmentExerciseSelector.js

@@ -21,7 +21,8 @@ function AssignmentExerciseSelector({
   lastClickedExerciseId,
   handleRemoveExercise,
   isPreview,
-  isChallengeModeStudent
+  isChallengeModeStudent,
+  isReadWriteModeStudent
 }) {
   return /*#__PURE__*/_jsx(Box, {
     children: /*#__PURE__*/_jsx(AssignmentCourseSelection, {
@@ -44,7 +45,8 @@ function AssignmentExerciseSelector({
       lastClickedExerciseId: lastClickedExerciseId,
       handleRemoveExercise: handleRemoveExercise,
       isPreview: isPreview,
-      isChallengeModeStudent: isChallengeModeStudent
+      isChallengeModeStudent: isChallengeModeStudent,
+      isReadWriteModeStudent: isReadWriteModeStudent
     })
   });
 }

package/dist/Assignments/AssignmentPhraseListSelection/AssignmentPhraseListSelection.js

@@ -418,23 +418,46 @@ export default function AssignmentPhraseListSelection({
   preferred_username,
   isCreator
 }) {
-  const selectedPhraseLists = new Set(selectedExercises?.map(exercise => exercise.phraseListId) || []);
-  const filteredPhraseLists = !viewOnly ? phraseLists : phraseLists.filter(phraseList => selectedPhraseLists.has(phraseList.phraseListId));
-  return filteredPhraseLists.map((phraseList, index) => /*#__PURE__*/_jsx(PhraseList, {
-    t: t,
-    phraseList: phraseList,
-    courseSectionTopicId: courseSectionTopicId,
-    assignment: assignment,
-    useCase: useCase,
-    selectedExercises: selectedExercises,
-    handleSelectExercise: handleSelectExercise,
-    handleRemoveExercise: handleRemoveExercise,
-    isPreview: isPreview,
-    viewOnly: viewOnly,
-    progressHelpers: progressHelpers,
-    completionHelpers: completionHelpers,
-    username: username,
-    preferred_username: preferred_username,
-    isCreator: isCreator
-  }, index));
+  const selectedPhraseListIds = new Set(selectedExercises?.map(exercise => exercise.phraseListId) || []);
+  const filteredPhraseLists = !viewOnly ? phraseLists : phraseLists.filter(phraseList => selectedPhraseListIds.has(phraseList.phraseListId));
+  const existingPhraseListIds = new Set(phraseLists.map(pl => pl.phraseListId));
+  const orphanedPhraseListIds = useCase === "assignment-view" || useCase === "assignment-start" ? [...new Set((selectedExercises || []).filter(e => e.phraseListId && e.courseSectionTopicId === courseSectionTopicId && !existingPhraseListIds.has(e.phraseListId)).map(e => e.phraseListId))] : [];
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [filteredPhraseLists.map((phraseList, index) => /*#__PURE__*/_jsx(PhraseList, {
+      t: t,
+      phraseList: phraseList,
+      courseSectionTopicId: courseSectionTopicId,
+      assignment: assignment,
+      useCase: useCase,
+      selectedExercises: selectedExercises,
+      handleSelectExercise: handleSelectExercise,
+      handleRemoveExercise: handleRemoveExercise,
+      isPreview: isPreview,
+      viewOnly: viewOnly,
+      progressHelpers: progressHelpers,
+      completionHelpers: completionHelpers,
+      username: username,
+      preferred_username: preferred_username,
+      isCreator: isCreator
+    }, index)), orphanedPhraseListIds.map(id => /*#__PURE__*/_jsx(Box, {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        pl: 2,
+        py: 1.5,
+        ml: {
+          xs: "16px",
+          sm: "72px",
+          md: "76px"
+        },
+        borderLeft: "3px solid",
+        borderColor: "warning.main"
+      },
+      children: /*#__PURE__*/_jsx(Typography, {
+        variant: "body2",
+        color: "text.secondary",
+        children: t("exercise_no_longer_available")
+      })
+    }, id))]
+  });
 }

package/dist/Assignments/AssignmentRoleplaySelection/AssignmentRoleplaySelection.js

@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import { Box, ListItemText, ListItemButton, Avatar, ListItemIcon, Tooltip, Collapse, Checkbox, Badge, IconButton } from "@mui/material";
+import { Box, ListItemText, ListItemButton, Avatar, ListItemIcon, Tooltip, Collapse, Checkbox, Badge, IconButton, Typography } from "@mui/material";
 import ClearIcon from "@mui/icons-material/Clear";
 import MessageIcon from "@mui/icons-material/Message";
 import RateReviewIcon from "@mui/icons-material/RateReview";
@@ -440,24 +440,47 @@ function AssignmentRoleplaySelection({
   const filteredCompletions = Array.isArray(memberCourseCompletions) && memberCourseCompletions.length > 0 ? memberCourseCompletions.filter(completion => completion.courseSectionTopicId === courseSectionTopicId) : [];
   const selectedRoleplayIds = new Set(selectedExercises.map(sE => sE.roleplayId));
   const filteredRoleplays = !viewOnly ? roleplays : roleplays.filter(e => selectedRoleplayIds.has(e.roleplayId));
-  return filteredRoleplays.map(roleplay => /*#__PURE__*/_jsx(Roleplay, {
-    roleplay: roleplay,
-    isRoleplaySelected: isRoleplaySelected,
-    setIsRoleplaySelected: setIsRoleplaySelected,
-    courseSectionTopicId: courseSectionTopicId,
-    t: t,
-    isExerciseSelected: isExerciseSelected,
-    handleSelectExercise: handleSelectExercise,
-    selectedExercises: selectedExercises,
-    useCase: useCase,
-    assignment: assignment,
-    memberCourseCompletions: filteredCompletions,
-    topicProgress: topicProgress,
-    topics: topics,
-    isCreator: isCreator,
-    lastClickedExerciseId: lastClickedExerciseId,
-    handleRemoveExercise: handleRemoveExercise,
-    isPreview: isPreview
-  }, roleplay.roleplayId));
+  const existingRoleplayIds = new Set(roleplays.map(r => r.roleplayId));
+  const orphanedRoleplayIds = useCase === "assignment-view" || useCase === "assignment-start" ? [...new Set(selectedExercises.filter(e => e.roleplayId && e.courseSectionTopicId === courseSectionTopicId && !existingRoleplayIds.has(e.roleplayId)).map(e => e.roleplayId))] : [];
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [filteredRoleplays.map(roleplay => /*#__PURE__*/_jsx(Roleplay, {
+      roleplay: roleplay,
+      isRoleplaySelected: isRoleplaySelected,
+      setIsRoleplaySelected: setIsRoleplaySelected,
+      courseSectionTopicId: courseSectionTopicId,
+      t: t,
+      isExerciseSelected: isExerciseSelected,
+      handleSelectExercise: handleSelectExercise,
+      selectedExercises: selectedExercises,
+      useCase: useCase,
+      assignment: assignment,
+      memberCourseCompletions: filteredCompletions,
+      topicProgress: topicProgress,
+      topics: topics,
+      isCreator: isCreator,
+      lastClickedExerciseId: lastClickedExerciseId,
+      handleRemoveExercise: handleRemoveExercise,
+      isPreview: isPreview
+    }, roleplay.roleplayId)), orphanedRoleplayIds.map(id => /*#__PURE__*/_jsx(Box, {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        pl: 2,
+        py: 1.5,
+        ml: {
+          xs: "16px",
+          sm: "72px",
+          md: "76px"
+        },
+        borderLeft: "3px solid",
+        borderColor: "warning.main"
+      },
+      children: /*#__PURE__*/_jsx(Typography, {
+        variant: "body2",
+        color: "text.secondary",
+        children: t("exercise_no_longer_available")
+      })
+    }, id))]
+  });
 }
 export default AssignmentRoleplaySelection;

package/dist/Assignments/AssignmentSelectExercise/AssignmentSelectExercise.js

@@ -22,7 +22,8 @@ function AssignmentSelectExercise({
   completionHelpers,
   isCreator,
   memberCourseCompletions,
-  isChallengeModeStudent
+  isChallengeModeStudent,
+  isReadWriteModeStudent
 }) {
   const [isExerciseSelected, setIsExerciseSelected] = useState(false);
   const handleSelectExercise = (exercises = []) => {
@@ -101,7 +102,8 @@ function AssignmentSelectExercise({
         completionHelpers: completionHelpers,
         isCreator: isCreator,
         memberCourseCompletions: memberCourseCompletions,
-        isChallengeModeStudent: isChallengeModeStudent
+        isChallengeModeStudent: isChallengeModeStudent,
+        isReadWriteModeStudent: isReadWriteModeStudent
       })
     })]
   });

package/dist/Exercises/Translator/Translator.js

@@ -743,10 +743,10 @@ function Translator({
                   wordList: currentPhrase ? removeExtraWhiteSpaces(currentPhrase.phrase).split(" ") : [],
                   disableTranslation: false,
                   isMessage: false,
-                  muteSound: isReadWriteModeStudent ? true : muteSound,
+                  muteSound: muteSound,
                   t: t,
                   languageTag: languageTag
-                }), learnLang !== "irish" && !isReadWriteModeStudent && /*#__PURE__*/_jsx(Box, {
+                }), learnLang !== "irish" && /*#__PURE__*/_jsx(Box, {
                   children: /*#__PURE__*/_jsx(WaveFormLite, {
                     src: pollyResult ? pollyResult : "",
                     controls: false,

package/dist/Forms/CreateTopic/CreateTopic.js

@@ -21,10 +21,6 @@ function CreateTopic({
     learnLang: "",
     tags: [],
     visibility: "private",
-    shuffleEnabled: "enabled",
-    voice: "",
-    voiceLanguageCode: "",
-    voicePitch: "",
     topicCode: "",
     notes: ""
   },

package/dist/Forms/UpdateTopic/UpdateTopic.js

@@ -18,9 +18,6 @@ const useStyles = makeStyles()(theme => ({
   },
   formContent: {
     padding: theme.spacing(3)
-  },
-  group: {
-    flexDirection: "row"
   }
 }));
 export default function UpdateTopic({
@@ -31,10 +28,6 @@ export default function UpdateTopic({
     description: "",
     difficulty: "",
     visibility: "",
-    shuffleEnabled: "enabled",
-    voice: "",
-    voiceLanguageCode: "",
-    voicePitch: "",
     notes: "",
     topicGoal: "",
     tags: []
@@ -45,10 +38,6 @@ export default function UpdateTopic({
   subscription = {
     isUpgradePossible: true
   },
-  voices = {},
-  handleSpeak,
-  learnLang,
-  isUserInternal,
   verificationStatus
 }) {
   const {
@@ -59,10 +48,6 @@ export default function UpdateTopic({
     description,
     difficulty,
     visibility,
-    shuffleEnabled,
-    voice,
-    voicePitch,
-    voiceLanguageCode,
     picture,
     banner,
     tags,
@@ -81,7 +66,6 @@ export default function UpdateTopic({
         description,
         difficulty,
         visibility,
-        shuffleEnabled,
         picture,
         topicGoal,
         tags
@@ -142,11 +126,7 @@ export default function UpdateTopic({
       })
     }), /*#__PURE__*/_jsx("br", {}), /*#__PURE__*/_jsx(Formik, {
       initialValues: {
-        visibility,
-        shuffleEnabled,
-        voice,
-        voiceLanguageCode,
-        voicePitch
+        visibility
       },
       enableReinitialize: enableReinitialize,
       validationSchema: TopicSettings.validationSchema,
@@ -186,12 +166,7 @@ export default function UpdateTopic({
                   dirty: dirty,
                   values: values,
                   ...otherProps,
-                  isUpdating: true,
-                  subscription: subscription,
-                  voiceOptions: voices,
-                  handleSpeak: handleSpeak,
-                  learnLang: learnLang,
-                  isUserInternal: isUserInternal
+                  subscription: subscription
                 })
               }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(CardActions, {
                 className: classes.padding,

package/dist/Screens/Courses/ViewCourse/ViewTopic/ViewTopic.js

@@ -1019,10 +1019,6 @@ function Topic({
           onSubmit: handleUpdateTopic,
           fileSizeLimit: fileSizeLimit,
           subscription: subscription,
-          voices: voices,
-          handleSpeak: handleSpeak,
-          learnLang: learnLang,
-          isUserInternal: isUserInternal,
           verificationStatus: verificationStatus
         })
       })]

package/dist/Tables/Progress/ProgressTableRow.js

@@ -48,6 +48,8 @@ export default function ProgressTableRow(props) {
     assignedLabels
   } = member;
   const isChallengeModeStudent = assignedLabels?.isChallengeModeStudent;
+  const isReadWriteModeStudent = assignedLabels?.isReadWriteModeStudent;
+  const assignmentDueDateMs = selectedAssignment?.dueDate ? new Date(selectedAssignment.dueDate).getTime() : null;
   const memberCourseCompletionsQuery = useQuery({
     queryKey: ["memberCourseProgress", memberId, courseIds],
     queryFn: async () => {
@@ -61,8 +63,8 @@ export default function ProgressTableRow(props) {
     error,
     isLoading
   } = memberCourseCompletionsQuery;
-  const data = useMemo(() => memberCourseCompletionsQuery.isSuccess && Array.isArray(memberCourseCompletionsQuery.data.Items) && memberCourseCompletionsQuery.data.Items.length ? formatMemberCourseCompletions(courses, memberCourseCompletionsQuery.data.Items, reportType === "assignments" && selectedAssignment ? selectedAssignment?.exercises : null, isChallengeModeStudent, selectedAssignment, reportType) : {}, [memberCourseCompletionsQuery.data, memberCourseCompletionsQuery.isSuccess, courses, reportType, selectedAssignment, isChallengeModeStudent]);
-  const assignmentsTableData = useMemo(() => memberCourseCompletionsQuery.isSuccess && Array.isArray(memberCourseCompletionsQuery.data.Items) && memberCourseCompletionsQuery.data.Items.length && assignments && assignments.length ? formatMemberAssignmentCompletions(assignments, courses, memberCourseCompletionsQuery.data.Items, isChallengeModeStudent) : {}, [memberCourseCompletionsQuery.data, memberCourseCompletionsQuery.isSuccess, courses, assignments, isChallengeModeStudent]);
+  const data = useMemo(() => memberCourseCompletionsQuery.isSuccess && Array.isArray(memberCourseCompletionsQuery.data.Items) && memberCourseCompletionsQuery.data.Items.length ? formatMemberCourseCompletions(courses, memberCourseCompletionsQuery.data.Items, reportType === "assignments" && selectedAssignment ? selectedAssignment?.exercises : null, isChallengeModeStudent, selectedAssignment, reportType, isReadWriteModeStudent) : {}, [memberCourseCompletionsQuery.data, memberCourseCompletionsQuery.isSuccess, courses, reportType, selectedAssignment, isChallengeModeStudent, isReadWriteModeStudent]);
+  const assignmentsTableData = useMemo(() => memberCourseCompletionsQuery.isSuccess && Array.isArray(memberCourseCompletionsQuery.data.Items) && memberCourseCompletionsQuery.data.Items.length && assignments && assignments.length ? formatMemberAssignmentCompletions(assignments, courses, memberCourseCompletionsQuery.data.Items, isChallengeModeStudent, isReadWriteModeStudent) : {}, [memberCourseCompletionsQuery.data, memberCourseCompletionsQuery.isSuccess, courses, assignments, isChallengeModeStudent, isReadWriteModeStudent]);
   let memberActivityLink = `/classrooms/${classroomId}/activity/member/${member.memberId}`;
   if (currentView === "course") {
     memberActivityLink = `${memberActivityLink}/${selectedCourse.courseId}`;
@@ -205,7 +207,8 @@ export default function ProgressTableRow(props) {
         phraseListId: phraseList.phraseListId,
         isLoading: isLoading,
         error: error,
-        index: i
+        index: i,
+        assignmentDueDateMs: assignmentDueDateMs
       }, `phrase-list-cell-${i}`);
     }), (currentView === "phrase-list" || currentView === "assignment-phrase-list") && ["translation", "listening", "pronunciation"].map((exercise, i) => {
       const topicData = getTopicData(data, selectedTopic, selectedCourse, selectedSection);
@@ -220,7 +223,8 @@ export default function ProgressTableRow(props) {
         sectionId: selectedSection?.sectionId || selectedTopic?.courseSectionId?.split("|")[1],
         topicId: selectedTopic?.topicId,
         memberId: member.memberId,
-        index: i
+        index: i,
+        assignmentDueDateMs: assignmentDueDateMs
       }, `phrase-list-exercise-cell-${i}`);
     }), (currentView === "topic" || currentView === "assignment-topic") && tableRoleplays.map((roleplay, i) => {
       const topicData = getTopicData(data, selectedTopic, selectedCourse, selectedSection);
@@ -235,7 +239,9 @@ export default function ProgressTableRow(props) {
         sectionId: selectedSection?.sectionId || selectedTopic?.courseSectionId?.split("|")[1],
         topicId: selectedTopic?.topicId,
         memberId: member.memberId,
-        index: i
+        index: i,
+        assignmentDueDateMs: assignmentDueDateMs,
+        showDaysLate: false
       }, `roleplay-cell-${i}`);
     }), (currentView === "topic" || currentView === "assignment-topic") && tableBots.map((bot, i) => {
       const topicData = getTopicData(data, selectedTopic, selectedCourse, selectedSection);
@@ -252,7 +258,9 @@ export default function ProgressTableRow(props) {
         sectionId: selectedSection?.sectionId || selectedTopic?.courseSectionId?.split("|")[1],
         topicId: selectedTopic?.topicId,
         memberId: member.memberId,
-        index: i
+        index: i,
+        assignmentDueDateMs: assignmentDueDateMs,
+        showDaysLate: false
       }, `bot-cell-${i}`);
     }), (currentView === "roleplay" || currentView === "assignment-roleplay") && tableRoleplayGames?.length > 0 && tableRoleplayGames.map((game, i) => {
       const topicData = getTopicData(data, selectedTopic, selectedCourse, selectedSection);
@@ -267,7 +275,8 @@ export default function ProgressTableRow(props) {
         sectionId: selectedSection?.sectionId || selectedTopic?.courseSectionId?.split("|")[1],
         topicId: selectedTopic?.topicId,
         memberId: member.memberId,
-        index: i
+        index: i,
+        assignmentDueDateMs: assignmentDueDateMs
       }, `roleplay-game-cell-${i}`);
     }), currentView === "assignments" && assignments.map((assignment, i) => /*#__PURE__*/_jsx(AssignmentCellData, {
       t: t,

package/dist/Tables/Progress/cells/index.js

@@ -18,6 +18,7 @@ export function ExerciseCell({
   backgroundColor,
   submittedLate = false,
   daysLate = 0,
+  showDaysLate = true,
   t
 }) {
   return /*#__PURE__*/_jsx(Box, {
@@ -41,9 +42,9 @@ export function ExerciseCell({
             fontWeight: "bold"
           }),
           size: "small",
-          label: t("days_late", {
+          label: showDaysLate ? t("days_late", {
             count: daysLate
-          })
+          }) : t("late_submission")
         })
       })]
     })
@@ -219,6 +220,12 @@ export function AssignmentCellData(props) {
     index
   } = props;
   const cellData = getCellDataForFilter(data, filter);
+  let submittedLate = false;
+  let daysLate = null;
+  if (data?.submittedLate?.isLate === true) {
+    submittedLate = true;
+    daysLate = data.submittedLate.daysLate;
+  }
   return /*#__PURE__*/_jsx(DataCellContainer, {
     t: t,
     data: cellData,
@@ -226,7 +233,9 @@ export function AssignmentCellData(props) {
     isNotAssigned: isNotAssigned,
     error: error,
     memberActivityLink: memberActivityLink,
-    index: index
+    index: index,
+    submittedLate: submittedLate,
+    daysLate: daysLate
   });
 }
 export function CourseCellData(props) {
@@ -268,13 +277,21 @@ export function SectionCellData(props) {
     index
   } = props;
   const cellData = getCellDataForFilter(data, filter);
+  let submittedLate = false;
+  let daysLate = null;
+  if (data?.submittedLate?.isLate === true) {
+    submittedLate = true;
+    daysLate = data.submittedLate.daysLate;
+  }
   return /*#__PURE__*/_jsx(DataCellContainer, {
     t: t,
     data: cellData,
     isLoading: isLoading,
     error: error,
     memberActivityLink: memberActivityLink,
-    index: index
+    index: index,
+    submittedLate: submittedLate,
+    daysLate: daysLate
   });
 }
 export function TopicCellData(props) {
@@ -321,7 +338,9 @@ export function ExerciseCellData(props) {
     phraseListId,
     index,
     isChallengeModeStudent = false,
-    botIsChallengeModeOnly = false
+    botIsChallengeModeOnly = false,
+    assignmentDueDateMs = null,
+    showDaysLate = true
   } = props;
   let icon = null;
   let type = null;
@@ -329,10 +348,6 @@ export function ExerciseCellData(props) {
   let memberActivityLink = null;
   let submittedLate = false;
   let daysLate = null;
-  if (data?.submittedLate?.isLate === true) {
-    submittedLate = true;
-    daysLate = data.submittedLate.daysLate;
-  }
   if (isLoading) return /*#__PURE__*/_jsx(DataCell, {
     t: t,
     data: "",
@@ -360,6 +375,13 @@ export function ExerciseCellData(props) {
     } else {
       completions = data?.completions.filter(completion => completion.exercise === exercise);
     }
+    if (assignmentDueDateMs && completions?.length > 0) {
+      const earliestCompletion = [...completions].sort((a, b) => a.createdAt - b.createdAt)[0];
+      if (earliestCompletion.createdAt > assignmentDueDateMs) {
+        submittedLate = true;
+        daysLate = Math.max(1, Math.ceil((earliestCompletion.createdAt - assignmentDueDateMs) / (1000 * 60 * 60 * 24)));
+      }
+    }
     if (exercise === "roleplays" && roleplayId && completions?.length > 0) {
       const roleplayCompletionData = data?.percentComplete["roleplays"].completedCounts.find(c => c.roleplayId === roleplayId);
       icon = /*#__PURE__*/_jsx(Typography, {
@@ -418,7 +440,8 @@ export function ExerciseCellData(props) {
     memberActivityLink: memberActivityLink,
     index: index,
     submittedLate: submittedLate,
-    daysLate: daysLate
+    daysLate: daysLate,
+    showDaysLate: showDaysLate
   });
 }
 export function RoleplayCellData({
@@ -461,7 +484,8 @@ export function PhraseListCellData({
   phraseListId,
   isLoading,
   error,
-  index
+  index,
+  assignmentDueDateMs = null
 }) {
   if (isLoading) return /*#__PURE__*/_jsx(DataCell, {
     t: t,
@@ -474,8 +498,10 @@ export function PhraseListCellData({
     index: index
   });
   const phraseListExercises = ["translation", "listening", "pronunciation"];
-  const completedCount = phraseListExercises.filter(exercise => data?.completions?.some(c => c.exercise === exercise && (c.phraseListId === phraseListId || !c.phraseListId && phraseListId?.startsWith('leg-')))).length;
+  const phraseListCompletions = data?.completions?.filter(c => phraseListExercises.includes(c.exercise) && (c.phraseListId === phraseListId || !c.phraseListId && phraseListId?.startsWith('leg-'))) ?? [];
+  const completedCount = phraseListExercises.filter(exercise => phraseListCompletions.some(c => c.exercise === exercise)).length;
   const total = phraseListExercises.length;
+  const submittedLate = assignmentDueDateMs != null && phraseListCompletions.some(c => c.createdAt > assignmentDueDateMs);
   let color;
   if (completedCount === total) color = green[400];else if (completedCount > 0) color = yellow[400];else color = red[400];
   return /*#__PURE__*/_jsx(ExerciseCell, {
@@ -485,6 +511,8 @@ export function PhraseListCellData({
       children: `${completedCount} / ${total}`
     }),
     backgroundColor: color,
-    index: index
+    index: index,
+    submittedLate: submittedLate,
+    showDaysLate: false
   });
 }

package/dist/Tables/Progress/cells/index.test.js

@@ -268,71 +268,60 @@ describe("TopicCellData", () => {
 });
 
 // ---------------------------------------------------------------------------
-// ExerciseCellData — reads submittedLate from data.submittedLate; shows
-// the daysLate count chip inside ExerciseCell (not the "late_submission" string)
+// ExerciseCellData — computes submittedLate from assignmentDueDateMs vs
+// completion timestamps; shows the daysLate count chip inside ExerciseCell
 // ---------------------------------------------------------------------------
 describe("ExerciseCellData", () => {
   const baseCourseId = "1";
   const baseSectionId = "54321";
   const baseTopicId = "154321";
-  const makeData = submittedLate => ({
+  const completionAt = 1578268085029;
+  const dueDateBefore = completionAt - 5 * 24 * 60 * 60 * 1000; // 5 days before completion
+  const dueDateAfter = completionAt + 1 * 24 * 60 * 60 * 1000; // 1 day after completion
+
+  const makeData = () => ({
     completions: [{
       exercise: "translation",
-      createdAt: 1578268085029
+      createdAt: completionAt
     }],
     percentComplete: {
       translation: {
         completedCount: 1
       }
-    },
-    submittedLate
+    }
   });
-  it("shows days_late chip when data.submittedLate.isLate is true", () => {
+  it("shows days_late chip when completion is after assignmentDueDateMs", () => {
     wrap(/*#__PURE__*/_jsx(ExerciseCellData, {
       t: t,
-      data: makeData({
-        isLate: true,
-        daysLate: 5
-      }),
+      data: makeData(),
       exercise: "translation",
       courseId: baseCourseId,
       sectionId: baseSectionId,
       topicId: baseTopicId,
       memberId: "490230",
-      index: 0
+      index: 0,
+      assignmentDueDateMs: dueDateBefore
     }));
     expect(screen.getByText("5 days_late")).toBeTruthy();
   });
-  it("does not show days_late chip when data.submittedLate.isLate is false", () => {
+  it("does not show days_late chip when completion is before assignmentDueDateMs", () => {
     wrap(/*#__PURE__*/_jsx(ExerciseCellData, {
       t: t,
-      data: makeData({
-        isLate: false
-      }),
+      data: makeData(),
       exercise: "translation",
       courseId: baseCourseId,
       sectionId: baseSectionId,
       topicId: baseTopicId,
       memberId: "490230",
-      index: 0
+      index: 0,
+      assignmentDueDateMs: dueDateAfter
     }));
     expect(screen.queryByText(/days_late/i)).toBeNull();
   });
-  it("does not show days_late chip when data has no submittedLate field", () => {
-    const data = {
-      completions: [{
-        exercise: "translation",
-        createdAt: 1578268085029
-      }],
-      percentComplete: {
-        translation: {
-          completedCount: 1
-        }
-      }
-    };
+  it("does not show days_late chip when assignmentDueDateMs is not provided", () => {
     wrap(/*#__PURE__*/_jsx(ExerciseCellData, {
       t: t,
-      data: data,
+      data: makeData(),
       exercise: "translation",
       courseId: baseCourseId,
       sectionId: baseSectionId,

package/dist/Tables/Progress/sorting.js

@@ -30,12 +30,12 @@ export function descendingComparator(a, b, property, opts = {}) {
       const aCompletions = queryClient.getQueryData(["memberCourseProgress", a.memberId, currentCourseIds])?.Items ?? [];
       const bCompletions = queryClient.getQueryData(["memberCourseProgress", b.memberId, currentCourseIds])?.Items ?? [];
       if (currentView === "assignments") {
-        a.completions = opts.formatMemberAssignmentCompletions(assignments, courses, aCompletions, a?.assignedLabels?.isChallengeModeStudent);
-        b.completions = opts.formatMemberAssignmentCompletions(assignments, courses, bCompletions, b?.assignedLabels?.isChallengeModeStudent);
+        a.completions = opts.formatMemberAssignmentCompletions(assignments, courses, aCompletions, a?.assignedLabels?.isChallengeModeStudent, a?.assignedLabels?.isReadWriteModeStudent);
+        b.completions = opts.formatMemberAssignmentCompletions(assignments, courses, bCompletions, b?.assignedLabels?.isChallengeModeStudent, b?.assignedLabels?.isReadWriteModeStudent);
       } else {
         const assignmentEx = reportType === "assignments" && selectedAssignment ? selectedAssignment?.exercises : null;
-        a.completions = opts.formatMemberCourseCompletions(courses, aCompletions, assignmentEx, a?.assignedLabels?.isChallengeModeStudent);
-        b.completions = opts.formatMemberCourseCompletions(courses, bCompletions, assignmentEx, b?.assignedLabels?.isChallengeModeStudent);
+        a.completions = opts.formatMemberCourseCompletions(courses, aCompletions, assignmentEx, a?.assignedLabels?.isChallengeModeStudent, null, "course", a?.assignedLabels?.isReadWriteModeStudent);
+        b.completions = opts.formatMemberCourseCompletions(courses, bCompletions, assignmentEx, b?.assignedLabels?.isChallengeModeStudent, null, "course", b?.assignedLabels?.isReadWriteModeStudent);
       }
       if (currentView === "all_courses" || currentView === "assignments") {
         a1 = a.completions[property][percentageAccessor].percentage;

package/dist/Tables/Progress/utils.js

@@ -6,7 +6,7 @@ function calculateDaysLate(submissionTimestamp, dueDateMs) {
   if (daysDifference <= 0) return 0; // Not actually late
   return Math.max(1, Math.ceil(daysDifference)); // Round up, minimum 1 day
 }
-export const formatMemberCourseCompletions = (courses = [], completions = [], assignmentExercises, isChallengeModeStudent = false, selectedAssignment = null, reportType = "course") => {
+export const formatMemberCourseCompletions = (courses = [], completions = [], assignmentExercises, isChallengeModeStudent = false, selectedAssignment = null, reportType = "course", isReadWriteModeStudent = false) => {
   const dueDateMs = selectedAssignment?.dueDate ? new Date(selectedAssignment.dueDate).getTime() : null;
   const initialStatsObject = courses.reduce((obj, v) => {
     const scoreValues = getScoreValues("course", v.courseId, completions);
@@ -25,7 +25,7 @@ export const formatMemberCourseCompletions = (courses = [], completions = [], as
     return obj;
   }, {});
   const stats = courses.reduce((previousValue, currentValue) => {
-    const sectionsWithProgress = calcCompletions(currentValue.sections, completions, assignmentExercises, isChallengeModeStudent);
+    const sectionsWithProgress = calcCompletions(currentValue.sections, completions, assignmentExercises, isChallengeModeStudent, isReadWriteModeStudent);
     const percentCompletion = calcPercentageCompletion(sectionsWithProgress);
     previousValue[currentValue.courseId].percentComplete = percentCompletion;
     const initialSectionsObject = sectionsWithProgress.reduce((sectionObj, sectionVal) => {
@@ -79,10 +79,21 @@ export const formatMemberCourseCompletions = (courses = [], completions = [], as
               if (!dueDateMs) return {
                 isLate: false
               };
-              const earliestCompletion = topicCompletions.reduce((earliest, c) => !earliest || c.createdAt < earliest.createdAt ? c : earliest, null);
-              return earliestCompletion && earliestCompletion.createdAt > dueDateMs ? {
+              const courseSectionTopicId = `${topicVal.courseSectionId}|${topicVal.topicId}`;
+              const topicAssignmentExercises = assignmentExercises?.filter(e => e.courseSectionTopicId === courseSectionTopicId);
+              if (!topicAssignmentExercises?.length) return {
+                isLate: false
+              };
+              const relevantCompletions = topicCompletions.filter(c => topicAssignmentExercises.some(e => {
+                if (e.name && c.exercise !== e.name) return false;
+                if (e.roleplayId && c.roleplayId !== e.roleplayId) return false;
+                if (e.botId && c.botId !== e.botId) return false;
+                return true;
+              }));
+              const lateCompletion = relevantCompletions.find(c => c.createdAt > dueDateMs);
+              return lateCompletion ? {
                 isLate: true,
-                daysLate: calculateDaysLate(earliestCompletion.createdAt, dueDateMs)
+                daysLate: calculateDaysLate(lateCompletion.createdAt, dueDateMs)
               } : {
                 isLate: false
               };
@@ -131,7 +142,7 @@ export const formatMemberCourseCompletions = (courses = [], completions = [], as
   }, initialStatsObject);
   return stats;
 };
-export const formatMemberAssignmentCompletions = (assignments = [], courses = [], completions = [], isChallengeModeStudent = false) => {
+export const formatMemberAssignmentCompletions = (assignments = [], courses = [], completions = [], isChallengeModeStudent = false, isReadWriteModeStudent = false) => {
   const stats = assignments.reduce((obj, assignment) => {
     const assignmentCompletions = completions.filter(completion => assignment.exercises?.some(e => {
       if (!e.name && !e.roleplayId && !e.botId && !e.courseSectionTopicId) return false;
@@ -141,7 +152,7 @@ export const formatMemberAssignmentCompletions = (assignments = [], courses = []
       if (e.courseSectionTopicId && `${completion.courseSectionId}|${completion.topicId}` !== e.courseSectionTopicId) return false;
       return true;
     }));
-    const assignmentCourseCompletions = formatMemberCourseCompletions(courses, assignmentCompletions, assignment?.exercises, isChallengeModeStudent);
+    const assignmentCourseCompletions = formatMemberCourseCompletions(courses, assignmentCompletions, assignment?.exercises, isChallengeModeStudent, null, "course", isReadWriteModeStudent);
     const accumulator = {
       percentComplete: {
         completed: 0,

package/dist/hooks/useExerciseState.js

@@ -275,7 +275,7 @@ export default function useExerciseState({
     }
   }, [exerciseName, questions]);
   useEffect(() => {
-    if (open && currentPhrase && currentPhrase.phrase !== "" && !isCompletionModalOpen && learnLang && learnLang !== "irish" && isTourFinished && !isReadWriteModeStudent && exerciseName !== "meaning") {
+    if (open && currentPhrase && currentPhrase.phrase !== "" && !isCompletionModalOpen && learnLang && learnLang !== "irish" && isTourFinished && exerciseName !== "meaning") {
       const {
         voice,
         voiceLanguageCode,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1377",
+  "version": "0.1.1379",
   "type": "module",
   "main": "dist/index.js",
   "files": [