@nualang/nualang-ui-components 0.1.1386 → 0.1.1388

package/dist/Assignments/CreateAssignmentDialog/CreateAssignmentDialog.js

@@ -45,7 +45,6 @@ export default function CreateAssignmentDialog({
   createAssignment,
   username,
   getMemberDetails,
-  getClassroom,
   getCourses,
   initialData = {},
   dialogTitle,
@@ -74,45 +73,11 @@ export default function CreateAssignmentDialog({
   });
   const [isTitleEdited, setIsTitleEdited] = useState(Boolean(initialData.title));
   const [isCreating, setIsCreating] = useState(false);
-  const classroomQuery = useQueries({
-    queries: (Array.isArray(assignment.classroomId) ? assignment.classroomId : [assignment.classroomId]).map(cId => ({
-      queryKey: classroomQuerys.classroomKeys.item(cId, username),
-      queryFn: () => getClassroom(cId, filters),
-      queryOptions: {
-        enabled: !!(Array.isArray(assignment.classroomId) ? assignment.classroomId.length > 0 : assignment.classroomId)
-      }
-    })),
-    combine: results => {
-      const normalizedData = results.map(result => {
-        const data = result.data;
-        if (data?.classroomId) {
-          return data;
-        }
-        if (data?.Item?.classroomId) {
-          return data.Item;
-        }
-        return null;
-      }).filter(Boolean);
-      return {
-        data: normalizedData,
-        pending: results.some(result => result.isPending)
-      };
-    }
-  });
   const selectedClassroomCourses = useMemo(() => {
-    if (!classroomQuery.pending && classroomQuery.data.length > 0) {
-      const allCourses = classroomQuery.data.flatMap(classroom => classroom.courses || []);
-      const seen = new Set();
-      const uniqueCourses = allCourses.filter(courseId => {
-        if (seen.has(courseId)) return false;
-        seen.add(courseId);
-        return true;
-      });
-      return uniqueCourses;
-    } else {
-      return [];
-    }
-  }, [classroomQuery.data, classroomQuery.pending]);
+    const selectedIds = Array.isArray(assignment.classroomId) ? assignment.classroomId : [assignment.classroomId];
+    const allCourses = (classrooms || []).filter(c => selectedIds.includes(c.classroomId)).flatMap(c => c.courses || []);
+    return [...new Set(allCourses)];
+  }, [classrooms, assignment.classroomId]);
   const coursesQuery = courseQuerys.useCourses(async filters => {
     const response = await getCourses(filters);
     return response;

package/dist/Editors/Phrases/Phrases.js

@@ -296,6 +296,7 @@ function PhrasesEditor(props) {
     type: "include",
     ids: new Set()
   });
+  const selectedRows = Array.from(selectionModel.ids);
   const [spreadsheetPhrases, setSpreadsheetPhrases] = useState(Object.keys(phrases).length > 0 ? phrases : [rowTemplate]);
   const isRowEmpty = row => {
     let rowEmpty = true;
@@ -366,8 +367,6 @@ function PhrasesEditor(props) {
     addRow,
     isDirty,
     hasTrailingEmptyRow,
-    selectedRow,
-    deleteSelectedRow,
     processRowUpdate
   } = useSpreadsheetState({
     rowTemplate,
@@ -439,6 +438,15 @@ function PhrasesEditor(props) {
       console.error(error);
     }
   };
+  const deleteSelectedRows = () => {
+    if (selectedRows.length === 0) return;
+    const updatedRows = rows.filter(r => !selectionModel.ids.has(r.id));
+    handleSpreadsheetSaveChanges(phrases, formatRowsToPhrases(updatedRows));
+    setSelectionModel({
+      type: "include",
+      ids: new Set()
+    });
+  };
   return /*#__PURE__*/_jsxs(Box, {
     className: classes.centeredContainer,
     children: [isCreator && mode === Modes.SPREADSHEET && /*#__PURE__*/_jsx(Box, {
@@ -449,9 +457,9 @@ function PhrasesEditor(props) {
       children: /*#__PURE__*/_jsx(DefaultButton, {
         variant: "contained",
         size: "small",
-        onClick: deleteSelectedRow,
+        onClick: deleteSelectedRows,
         endIcon: /*#__PURE__*/_jsx(DeleteIcon, {}),
-        disabled: !Number.isInteger(selectedRow),
+        disabled: selectedRows.length === 0,
         children: t("delete_selected_row")
       })
     }), isMember && !isCreator && /*#__PURE__*/_jsx(NormalModeComponent, {
@@ -521,7 +529,9 @@ function PhrasesEditor(props) {
       isDirty: isDirty,
       hasTrailingEmptyRow: hasTrailingEmptyRow,
       hasNonEmptyRows: hasNonEmptyRows,
-      processRowUpdate: processRowUpdate
+      processRowUpdate: processRowUpdate,
+      selectionModel: selectionModel,
+      onRowSelectionModelChange: setSelectionModel
     }) : /*#__PURE__*/_jsx(EmptyPhraseList, {
       t: t,
       siteLanguage: siteLanguage,

package/dist/Forms/CreateClassroom/Steps/ClassroomSettings/ClassroomSettings.js

@@ -4,7 +4,7 @@ import * as Yup from "yup";
 import Tooltip from "@mui/material/Tooltip";
 import ChipInput from "../../../../Forms/ChipInput/ChipInput";
 import { domainPattern } from "../../../../utils/index";
-import { containsInvalidSymbols } from "../../../../utils/index";
+import { containsInvalidSymbols, containsInvalidCollaboratorSymbols } from "../../../../utils/index";
 import HelpIcon from "@mui/icons-material/Help";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 function ClassroomSettings({
@@ -396,6 +396,6 @@ ClassroomSettings.validationSchema = Yup.object().shape({
     otherwise: () => Yup.string().nullable()
   }),
   allowedDomains: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidSymbols(value)).matches(domainPattern, "Must be a valid domain e.g 'schooldomain.com'")).nullable(),
-  collaborators: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidSymbols(value))).nullable()
+  collaborators: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidCollaboratorSymbols(value))).nullable()
 });
 export default ClassroomSettings;

package/dist/Forms/CreateCourse/Steps/CourseSettings/CourseSettings.js

@@ -4,7 +4,7 @@ import * as Yup from "yup";
 import Tooltip from "@mui/material/Tooltip";
 import ChipInput from "../../../../Forms/ChipInput/ChipInput";
 import { domainPattern } from "../../../../utils/index";
-import { containsInvalidSymbols } from "../../../../utils/index";
+import { containsInvalidSymbols, containsInvalidCollaboratorSymbols } from "../../../../utils/index";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 function CourseSettings({
   t,
@@ -250,7 +250,7 @@ CourseSettings.validationSchema = Yup.object().shape({
     otherwise: () => Yup.string().nullable()
   }),
   allowedDomains: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidSymbols(value)).matches(domainPattern, "Must be a valid domain e.g 'schooldomain.com'")).nullable(),
-  collaborators: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidSymbols(value))).nullable(),
+  collaborators: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !containsInvalidCollaboratorSymbols(value))).nullable(),
   isShareable: Yup.string().required("required"),
   duplicated: Yup.bool()
 });

package/dist/Live/Misc/StudentAnswerDrawer/StudentAnswerDrawer.js

@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, useRef } from "react";
 import { Drawer, List, ListSubheader, ListItemText, ListItemButton, ListItemIcon, IconButton, Tooltip } from "@mui/material";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import { useTheme } from "@mui/material/styles";
@@ -25,10 +25,15 @@ function StudentAnswerDrawer({
   const theme = useTheme();
   const [selectedIndex, setSelectedIndex] = useState();
   const isSmallScreen = useMediaQuery("(max-width:959px)");
+  const committedAnswerRef = useRef(null);
+  const handleContinueRef = useRef(handleContinue);
+  useEffect(() => {
+    handleContinueRef.current = handleContinue;
+  });
   useEffect(() => {
     if (isTimeUp) {
       setIsAnswered(true);
-      handleContinue();
+      handleContinueRef.current(committedAnswerRef.current);
     }
   }, [isTimeUp]);
   useEffect(() => {
@@ -41,6 +46,7 @@ function StudentAnswerDrawer({
       setSelectedIndex(i);
       setCurrentAnswer(value);
       setIsAnswered(true);
+      committedAnswerRef.current = value;
     }
   };
   const listItemIconStyle = {

package/dist/Misc/ExerciseBottomBar/ExerciseBottomBar.js

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import Button from "@mui/material/Button";
 import Grid from "@mui/material/Grid";
 import { makeStyles } from "tss-react/mui";
@@ -33,9 +33,13 @@ function ExerciseBottomBar({
   const {
     classes
   } = useStyles();
+  const handleSubmitRef = useRef(handleSubmit);
+  useEffect(() => {
+    handleSubmitRef.current = handleSubmit;
+  });
   useEffect(() => {
     if (isTimeUp) {
-      handleSubmit();
+      handleSubmitRef.current();
       setIsAnswered(true);
     }
   }, [isTimeUp]);

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

@@ -120,7 +120,8 @@ function OverflowMenu({
   handleUploadVideo,
   isTeacher,
   video,
-  setVideo
+  setVideo,
+  handleCloseMenu
 }) {
   const [isShareDrawerOpen, setIsShareDrawerOpen] = useState(false);
   const [isUploadVideoOpen, setIsUploadVideoOpen] = useState(false);
@@ -245,7 +246,10 @@ function OverflowMenu({
       title: courseName,
       url: window.location.href,
       open: isShareDrawerOpen,
-      handleClose: () => setIsShareDrawerOpen(false),
+      handleClose: () => {
+        setIsShareDrawerOpen(false);
+        handleCloseMenu();
+      },
       subscription: subscription,
       trackRecommendedEvent: trackRecommendedEvent,
       itemId: courseId,
@@ -933,7 +937,8 @@ function Course({
       handleUploadVideo: handleUploadVideo,
       isTeacher: !isStudent,
       video: video,
-      setVideo: setVideo
+      setVideo: setVideo,
+      handleCloseMenu: handleCloseMenu
     }), /*#__PURE__*/_jsx(UpgradeSubscription, {
       t: t,
       open: isUpgradeSubscriptionOpen,

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

@@ -515,7 +515,7 @@ function Topic({
       total: 0,
       percentage: 0
     };
-  }, [isMember, topic?.topicId, topic?.completions?.length, isChallengeModeStudent, isReadWriteModeStudent]);
+  }, [isMember, topic?.topicId, topic?.completions?.length, topic?.roleplays?.length, topic?.bots?.length, isChallengeModeStudent, isReadWriteModeStudent]);
   const {
     percentage,
     completed,

package/dist/utils/index.js

@@ -24,6 +24,16 @@ export const containsInvalidSymbols = input => {
   }
   return false;
 };
+
+// Same as containsInvalidSymbols but allows underscores
+export const containsInvalidCollaboratorSymbols = input => {
+  const invalidChars = /[`#^*\[\];\\|<>\/~]/; // !()@,.'$%&+={}?:"_ allowed
+
+  if (invalidChars.test(input)) {
+    return true;
+  }
+  return false;
+};
 export const removeExtraWhiteSpaces = (str = "") => str.replace(/\s+/g, " ").trim();
 export const removeAllSymbols = (str = "") => {
   const removedEmojis = removeEmojis(str);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1386",
+  "version": "0.1.1388",
   "type": "module",
   "main": "dist/index.js",
   "files": [
@@ -101,7 +101,7 @@
     "@mui/system": "^7.0.2",
     "@mui/x-date-pickers": "^8.27.2",
     "@nualang/eslint-config-nualang": "0.2.0-alpha-5",
-    "@nualang/nualang-api-and-queries": "^1.1.42",
+    "@nualang/nualang-api-and-queries": "^1.1.51",
     "@react-theming/storybook-addon": "^1.1.10",
     "@storybook/addon-docs": "^10.0.2",
     "@storybook/addon-links": "^10.0.2",