@nualang/nualang-ui-components 0.1.1140 → 0.1.1142

package/dist/Cards/Course/Course.js

@@ -22,6 +22,7 @@ var _MoreVert = _interopRequireDefault(require("@mui/icons-material/MoreVert"));
 var _FileCopy = _interopRequireDefault(require("@mui/icons-material/FileCopy"));
 var _OndemandVideo = _interopRequireDefault(require("@mui/icons-material/OndemandVideo"));
 var _PictureAsPdf = _interopRequireDefault(require("@mui/icons-material/PictureAsPdf"));
+var _School = _interopRequireDefault(require("@mui/icons-material/School"));
 var _Reviews = _interopRequireDefault(require("../../Dialogs/Reviews"));
 var _Members = _interopRequireDefault(require("../../Dialogs/Members"));
 var _CourseOutline = _interopRequireDefault(require("../../Dialogs/CourseOutline"));
@@ -278,6 +279,7 @@ function CourseCard({
     courseId,
     courseName,
     description,
+    difficulty,
     picture,
     cardPicture,
     pictureXs,
@@ -404,7 +406,14 @@ function CourseCard({
     alignItems: "center",
     flexWrap: "wrap",
     gap: 1
-  }, (course?.pdf || course.topicsWithPdf && Object.keys(course?.topicsWithPdf)?.length > 0) && /*#__PURE__*/_react.default.createElement(_CardElements.CardInfoSectionItem, {
+  }, course?.difficulty && /*#__PURE__*/_react.default.createElement(_material.Box, {
+    mr: 2
+  }, /*#__PURE__*/_react.default.createElement(_CardElements.CardInfoSectionItem, {
+    variant: "body2",
+    component: "span"
+  }, /*#__PURE__*/_react.default.createElement(_School.default, {
+    sx: _CardElements.classes.infoIcon
+  }), t(`card_${course.difficulty}`))), (course?.pdf || course.topicsWithPdf && Object.keys(course?.topicsWithPdf)?.length > 0) && /*#__PURE__*/_react.default.createElement(_CardElements.CardInfoSectionItem, {
     variant: "body2",
     component: "span",
     sx: {
@@ -544,6 +553,7 @@ MemoizedCourse.propTypes = {
   courseId: _propTypes.default.string.isRequired,
   courseName: _propTypes.default.string.isRequired,
   description: _propTypes.default.string.isRequired,
+  difficulty: _propTypes.default.string,
   picture: _propTypes.default.string.isRequired,
   learnLang: _propTypes.default.string.isRequired,
   forLang: _propTypes.default.string.isRequired,

package/dist/Cards/Course/Course.stories.js

@@ -191,6 +191,7 @@ const course = exports.course = {
   t: () => {},
   courseName: "Learn Greetings",
   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+  difficulty: "A1",
   learnLang: "english",
   forLang: "spanish",
   visibility: "private",

package/dist/Dialogs/LiveGameTutorial/LiveGameTutorial.js

@@ -153,11 +153,11 @@ function LiveGameTutorial({
     t: t
   }, /*#__PURE__*/_react.default.createElement(_material.Box, {
     sx: {
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      width: '100%',
-      height: '100%'
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      width: "100%",
+      height: "100%"
     }
   }, /*#__PURE__*/_react.default.createElement(DotsMobileStepper, {
     images: images,

package/dist/Dialogs/ReportProblem/ReportProblem.js

@@ -27,6 +27,7 @@ function ReportProblem({
   handleReportProblem,
   currentPhrase,
   isQuestion,
+  parentClassroom,
   ...otherProps
 }) {
   const [problem, setProblem] = (0, _react.useState)(initialProblem);
@@ -68,7 +69,13 @@ function ReportProblem({
     label: "other",
     value: "other"
   }];
-  const problemTypeOptions = problemTypes.map((pType, idx) => {
+  const filteredProblemTypes = problemTypes.filter(pType => {
+    if (pType.value === "equipment_problem" && (!parentClassroom || Object.keys(parentClassroom).length === 0 && parentClassroom.constructor === Object)) {
+      return false;
+    }
+    return true;
+  });
+  const problemTypeOptions = filteredProblemTypes.map((pType, idx) => {
     const keyId = `problemtypes_${idx}`;
     return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
       key: keyId,

package/dist/Dialogs/UploadVideo/UploadVideo.js

@@ -33,14 +33,17 @@ function UploadVideo({
   } = useStyles();
   const [video, setVideo] = (0, _react.useState)();
   const [errors, setErrors] = (0, _react.useState)([]);
+  const [isVideoSubmitting, setIsVideoSubmitting] = (0, _react.useState)(false);
   const handleSubmit = async () => {
     try {
+      setIsVideoSubmitting(true);
       await onSubmit({
         video
       });
     } catch (error) {
       console.error(error);
     }
+    setIsVideoSubmitting(false);
     handleClose();
   };
   return /*#__PURE__*/_react.default.createElement(_ResponsiveDialog.default, {
@@ -52,7 +55,7 @@ function UploadVideo({
     handleSubmit: handleSubmit,
     submitText: t("add_video"),
     dialogTitle: t("upload_video"),
-    isSubmitDisabled: !video || video.length === 0 || errors.length > 0
+    isSubmitDisabled: !video || video.length === 0 || errors.length > 0 || isVideoSubmitting
   }, /*#__PURE__*/_react.default.createElement(_Box.default, null, /*#__PURE__*/_react.default.createElement(_VideoUploader.default, {
     t: t,
     file: video,

package/dist/Exercises/Bot/Bot.js

@@ -96,7 +96,8 @@ function Bot({
   placeholder,
   courseSettings,
   clearQueue,
-  stopAudio
+  stopAudio,
+  parentClassroom
 }) {
   const theme = (0, _styles.useTheme)();
   const {
@@ -377,7 +378,8 @@ function Bot({
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
-    currentPhrase: currentPhrase
+    currentPhrase: currentPhrase,
+    parentClassroom: parentClassroom
   }));
   const beforeElements = /*#__PURE__*/_react.default.createElement(_material.Box, {
     mb: 2

package/dist/Exercises/Listener/Listener.js

@@ -227,7 +227,8 @@ function Listener({
   handleTranslate,
   languageTag,
   siteLanguage,
-  courseSettings
+  courseSettings,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Listening",
@@ -550,7 +551,8 @@ function Listener({
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
-    currentPhrase: currentPhrase
+    currentPhrase: currentPhrase,
+    parentClassroom: parentClassroom
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar

package/dist/Exercises/Pronouncer/Pronouncer.js

@@ -160,7 +160,8 @@ function Pronouncer({
   languageInformation,
   uploadAudioAttempt,
   languageTag,
-  trackRecommendedEvent
+  trackRecommendedEvent,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Pronunciation",
@@ -489,7 +490,8 @@ function Pronouncer({
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
-    currentPhrase: currentPhrase
+    currentPhrase: currentPhrase,
+    parentClassroom: parentClassroom
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar

package/dist/Exercises/Roleplay/Games/ActItOutGame/ActItOutGame.js

@@ -186,7 +186,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   languageInformation,
-  translationEnabled
+  translationEnabled,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Act it out",
@@ -392,7 +393,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: beforeElements,
     afterElements: afterElements,

package/dist/Exercises/Roleplay/Games/ActItOutGameListening/ActItOutGameListening.js

@@ -189,7 +189,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   languageInformation,
-  translationEnabled
+  translationEnabled,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Act it out listening",
@@ -397,7 +398,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: beforeElements,
     afterElements: afterElements,

package/dist/Exercises/Roleplay/Games/ActItOutGameListeningAndSpeaking/ActItOutGame.js

@@ -276,7 +276,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   translationEnabled,
-  trackRecommendedEvent
+  trackRecommendedEvent,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Act it out listening and speaking",
@@ -580,7 +581,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: beforeElements,
     afterElements: afterElements,

package/dist/Exercises/Roleplay/Games/ActItOutGameSpeaking/ActItOutGame.js

@@ -272,7 +272,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   translationEnabled,
-  trackRecommendedEvent
+  trackRecommendedEvent,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Act it out speaking",
@@ -579,7 +580,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: beforeElements,
     afterElements: afterElements,

package/dist/Exercises/Roleplay/Games/FillInTheBlanksGame/FillInTheBlanksGame.js

@@ -70,7 +70,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   languageInformation,
-  translationEnabled
+  translationEnabled,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Fill in the blanks",
@@ -271,7 +272,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: /*#__PURE__*/_react.default.createElement(_BeforeElements.default, {
       t: t,

package/dist/Exercises/Roleplay/Games/StoryGame/StoryGame.js

@@ -61,7 +61,8 @@ function RoleplayGame({
   clearQueue,
   stopAudio,
   languageInformation,
-  translationEnabled
+  translationEnabled,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Story",
@@ -256,7 +257,8 @@ function RoleplayGame({
       disableSkip: disableSkip,
       handleEditRoleplay: handleEditRoleplay,
       handleRestart: handleRestart,
-      handleShareRoleplay: handleShareRoleplay
+      handleShareRoleplay: handleShareRoleplay,
+      parentClassroom: parentClassroom
     }),
     beforeElements: /*#__PURE__*/_react.default.createElement(_BeforeElements.default, {
       t: t,

package/dist/Exercises/Roleplay/Games/TopBarActions.js

@@ -128,7 +128,8 @@ function OverflowMenu({
   handleReportProblem,
   handleRestart,
   setRestartRoleplayDialog,
-  currentMessages
+  currentMessages,
+  parentClassroom
 }) {
   const {
     classes
@@ -188,7 +189,8 @@ function OverflowMenu({
     mode: "menuitem",
     menuIconClassname: classes.menuIcon,
     currentPhrase: currentPhrase,
-    isQuestion: isQuestion
+    isQuestion: isQuestion,
+    parentClassroom: parentClassroom
   })));
 }
 const TopBarActions = ({
@@ -212,7 +214,8 @@ const TopBarActions = ({
   handleEditRoleplay,
   handleRestart,
   handleShareRoleplay,
-  isRoleplayPreview
+  isRoleplayPreview,
+  parentClassroom
 }) => {
   const {
     classes
@@ -262,7 +265,8 @@ const TopBarActions = ({
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
     currentPhrase: currentPhrase,
-    isQuestion: isQuestion
+    isQuestion: isQuestion,
+    parentClassroom: parentClassroom
   })), /*#__PURE__*/_react.default.createElement(_material.Hidden, {
     smUp: true
   }, /*#__PURE__*/_react.default.createElement(_VoiceSpeed.default, {
@@ -282,7 +286,8 @@ const TopBarActions = ({
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
-    currentMessages: currentMessages
+    currentMessages: currentMessages,
+    parentClassroom: parentClassroom
   }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, handleShareRoleplay && /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
     title: t("share")
   }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {

package/dist/Exercises/Roleplay/Roleplay.js

@@ -64,7 +64,8 @@ function Roleplay({
   authenticated,
   handleSignIn,
   courseSettings,
-  trackRecommendedEvent
+  trackRecommendedEvent,
+  parentClassroom
 }) {
   const theme = (0, _styles.useTheme)();
   const isLgScreen = (0, _useMediaQuery.default)(theme.breakpoints.up("md"));
@@ -336,7 +337,8 @@ function Roleplay({
         },
         clearQueue: clearQueue,
         stopAudio: stopAudio,
-        trackRecommendedEvent: trackRecommendedEvent
+        trackRecommendedEvent: trackRecommendedEvent,
+        parentClassroom: parentClassroom
       }));
     }
     return null;

package/dist/Exercises/Translator/Translator.js

@@ -7,6 +7,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactJoyride = _interopRequireWildcard(require("react-joyride"));
 var _material = require("@mui/material");
+var _colors = require("@mui/material/colors");
 var _mui = require("tss-react/mui");
 var _Check = _interopRequireDefault(require("@mui/icons-material/Check"));
 var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
@@ -115,7 +116,6 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
     margin: theme.spacing(1, 2, 1, 2),
     borderRadius: theme.spacing(),
     borderWidth: "2px",
-    borderColor: theme.palette.primary.main,
     borderStyle: "solid",
     textAlign: "center",
     color: theme.palette.primary.main,
@@ -235,7 +235,8 @@ function Translator({
   languageTag,
   siteLanguage,
   courseSettings = {},
-  isKeyboardHiddenTranslation
+  isKeyboardHiddenTranslation,
+  parentClassroom
 }) {
   (0, _useExerciseDocumentTitle.default)({
     exerciseTitle: "Translation",
@@ -397,10 +398,21 @@ function Translator({
       handleTranslationTourFinished();
     }
   };
+  const [incomplete, setIncomplete] = (0, _react.useState)(false);
+  const checkCompletionAndNotify = () => {
+    let correctCount = translationWords.filter((word, index) => (0, _index.removeAllSymbols)(word.text) === (0, _index.removeAllSymbols)(translationWordList[index])).length;
+    if (correctCount === translationWords.length && translationWords.length < translationWordList.length) {
+      setIncomplete(true);
+    }
+  };
   (0, _react.useEffect)(() => {
     setCheckAnswer(false);
     setIsWordBankAttemptChanged(true);
+    setIncomplete(false);
   }, [translationWords]);
+  (0, _react.useEffect)(() => {
+    checkAnswer && checkCompletionAndNotify();
+  }, [checkAnswer]);
   (0, _react.useEffect)(() => {
     if (open && !run && !localStorage.getItem(`translation-exercise-tour-completed`)) {
       setJoyrideState(prevState => ({
@@ -544,7 +556,8 @@ function Translator({
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
-    currentPhrase: currentPhrase
+    currentPhrase: currentPhrase,
+    parentClassroom: parentClassroom
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar
@@ -658,7 +671,7 @@ function Translator({
   }, /*#__PURE__*/_react.default.createElement(_reactBeautifulDnd.Droppable, {
     droppableId: "translationWords",
     direction: "horizontal"
-  }, provided => /*#__PURE__*/_react.default.createElement(_material.Grid, _extends({
+  }, provided => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Grid, _extends({
     container: true,
     spacing: 1,
     className: classes.wordsContainer,
@@ -666,7 +679,8 @@ function Translator({
   }, provided.droppableProps, {
     sx: {
       display: "flex",
-      flexDirection: "row"
+      flexDirection: "row",
+      borderColor: incomplete ? _colors.red[800] : theme.palette.primary.main
     }
   }), translationWords.map((word, index) => /*#__PURE__*/_react.default.createElement(_reactBeautifulDnd.Draggable, {
     key: word.id.toString(),
@@ -693,7 +707,21 @@ function Translator({
     ref: setAnswerBoxRef(index),
     checkAnswer: checkAnswer,
     isDragging: snapshot.isDragging
-  })))), provided.placeholder))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_material.Box, {
+  })))), provided.placeholder), /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      minHeight: "24px",
+      // Adjust this based on the Typography height
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      textAlign: "center"
+    }
+  }, incomplete && /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    sx: {
+      color: _colors.red[800],
+      fontWeight: "bold"
+    }
+  }, t("incomplete_translation")))))), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_material.Box, {
     component: "fieldset",
     sx: {
       borderWidth: 0

package/dist/Forms/CreateCourse/CreateCourse.js

@@ -5,8 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _material = require("@mui/material");
 var _Steps = require("./Steps");
 var _index = _interopRequireDefault(require("../../utils/placeholder-images/index"));
+var _index2 = require("../../utils/index");
 var _MultiStepForm = _interopRequireDefault(require("../MultiStepForm"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 // components
@@ -17,12 +19,20 @@ function getSteps() {
 function CreateCourse({
   t,
   onSubmit,
+  difficulties,
   languages = {},
   fileSizeLimit,
   userImage,
   subscription,
   learnLang
 }) {
+  const difficultyOptions = difficulties.map((d, idx) => {
+    const keyId = `crearolax${(0, _index2.randomId)()}${idx}`;
+    return /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+      key: keyId,
+      value: d
+    }, t(d));
+  });
   return /*#__PURE__*/_react.default.createElement(_MultiStepForm.default, {
     initialValues: {
       courseName: "",
@@ -41,6 +51,7 @@ function CreateCourse({
     getSteps: getSteps,
     onSubmit: onSubmit,
     t: t,
+    difficultyOptions: difficultyOptions,
     languageOptions: languages,
     fileSizeLimit: fileSizeLimit,
     subscription: subscription
@@ -49,6 +60,7 @@ function CreateCourse({
 CreateCourse.propTypes = {};
 CreateCourse.defaultProps = {
   t: text => text,
+  difficulties: ["A1", "A2", "B1", "B2", "C1", "C2"],
   subscription: {
     isUpgradePossible: true
   }

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

@@ -16,6 +16,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function CourseInformation({
   t,
+  difficultyOptions,
   languageOptions,
   handleChange,
   handleBlur,
@@ -26,6 +27,7 @@ function CourseInformation({
   const {
     courseName,
     description,
+    difficulty,
     learnLang,
     forLang,
     tags
@@ -84,6 +86,24 @@ function CourseInformation({
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12
+  }, /*#__PURE__*/_react.default.createElement(_material.TextField, {
+    select: true,
+    id: "difficulty",
+    name: "difficulty",
+    "data-cy": "difficulty",
+    label: t("difficulty"),
+    value: difficulty,
+    onChange: handleChange,
+    onBlur: handleBlur,
+    helperText: touched.difficulty ? errors.difficulty : "",
+    error: touched.difficulty && Boolean(errors.difficulty),
+    margin: "normal",
+    variant: "outlined",
+    fullWidth: true,
+    required: true
+  }, difficultyOptions)), "        ", /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    item: true,
+    xs: 12
   }, /*#__PURE__*/_react.default.createElement(_LanguageSelector.default, {
     id: "learnLang",
     name: "learnLang",
@@ -147,6 +167,7 @@ CourseInformation.label = "course_information";
 CourseInformation.validationSchema = Yup.object().shape({
   courseName: Yup.string().required("required").test("noSpecialChars", "no_special_characters", value => !(0, _utils.containsInvalidSymbols)(value)),
   description: Yup.string().required("required").test("noSpecialChars", "no_special_characters", value => !(0, _utils.containsInvalidSymbols)(value)),
+  difficulty: Yup.string().required("required"),
   learnLang: Yup.string().required("required"),
   forLang: Yup.string().required("required"),
   tags: Yup.array(Yup.string().test("noSpecialChars", "no_special_characters", value => !(0, _utils.containsInvalidSymbols)(value))).nullable()

package/dist/Forms/CreateRoleplay/CreateRoleplay.js

@@ -19,7 +19,7 @@ function CreateRoleplay({
   t,
   onSubmit,
   handleSpeak,
-  difficulties = [],
+  difficulties,
   voices = {},
   forLang,
   learnLang,

package/dist/Forms/UpdateCourse/UpdateCourse.js

@@ -9,6 +9,7 @@ var _material = require("@mui/material");
 var _mui = require("tss-react/mui");
 var _formik = require("formik");
 var _Steps = require("../CreateCourse/Steps");
+var _index = require("../../utils/index");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const useStyles = (0, _mui.makeStyles)()(theme => ({
@@ -22,18 +23,27 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
 function UpdateCourse({
   t,
   initialValues,
+  difficulties,
   onSubmit,
   enableReinitialize,
   languages,
   fileSizeLimit,
   subscription
 }) {
+  const difficultyOptions = difficulties.map((d, idx) => {
+    const keyId = `crearolax${(0, _index.randomId)()}${idx}`;
+    return /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+      key: keyId,
+      value: d
+    }, t(d));
+  });
   const {
     classes
   } = useStyles();
   const {
     courseName,
     description,
+    difficulty,
     learnLang,
     forLang,
     visibility,
@@ -49,6 +59,7 @@ function UpdateCourse({
     initialValues: {
       courseName,
       description,
+      difficulty,
       learnLang,
       forLang,
       tags,
@@ -83,6 +94,7 @@ function UpdateCourse({
     }, /*#__PURE__*/_react.default.createElement(_Steps.CourseInformation, _extends({
       t: t,
       languageOptions: languages,
+      difficultyOptions: difficultyOptions,
       handleChange: handleChange,
       handleSubmit: handleSubmit,
       isSubmitting: isSubmitting,
@@ -196,9 +208,11 @@ function UpdateCourse({
 }
 UpdateCourse.defaultProps = {
   t: text => text,
+  difficulties: ["A1", "A2", "B1", "B2", "C1", "C2"],
   initialValues: {
     courseName: "",
     description: "",
+    difficulty: "",
     learnLang: "",
     forLang: "",
     visibility: "",

package/dist/Forms/UpdateCourse/UpdateCourse.stories.js

@@ -25,6 +25,7 @@ const props = exports.props = {
     courseId: "12345",
     courseName: "Learn Greetings",
     description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+    difficulty: "A2",
     learnLang: "english",
     forLang: "spanish",
     visibility: "private",

package/dist/Lists/Courses/Courses.js

@@ -8,6 +8,8 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _material = require("@mui/material");
 var _mui = require("tss-react/mui");
+var _ProgressiveCardMedia = _interopRequireDefault(require("../../Misc/ProgressiveCardMedia"));
+var _index = _interopRequireDefault(require("../../utils/placeholder-images/index"));
 var _Course = _interopRequireDefault(require("../../Cards/Course"));
 var _useListScroll = _interopRequireDefault(require("../../hooks/useListScroll"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/Lists/Exercises/Exercises.js

@@ -740,7 +740,8 @@ function Exercises(props) {
     courseSettings,
     handleToggleKeyboardTranslation,
     isKeyboardHiddenTranslation,
-    trackRecommendedEvent
+    trackRecommendedEvent,
+    parentClassroom
   } = props;
   const navigate = (0, _reactRouterDom.useNavigate)();
   const location = (0, _reactRouterDom.useLocation)();
@@ -1459,7 +1460,8 @@ function Exercises(props) {
     uploadAudioAttempt: uploadAudioAttempt,
     languageTag: languageTag,
     siteLanguage: siteLanguage,
-    trackRecommendedEvent: trackRecommendedEvent
+    trackRecommendedEvent: trackRecommendedEvent,
+    parentClassroom: parentClassroom
   }, pronunciationProgress)), /*#__PURE__*/_react.default.createElement(_Translator.default, _extends({
     t: t,
     handleTranslate: handleTranslate,
@@ -1494,7 +1496,8 @@ function Exercises(props) {
     languageTag: languageTag,
     siteLanguage: siteLanguage,
     courseSettings: courseSettings,
-    isKeyboardHiddenTranslation: isKeyboardHiddenTranslation
+    isKeyboardHiddenTranslation: isKeyboardHiddenTranslation,
+    parentClassroom: parentClassroom
   }, translationProgress)), /*#__PURE__*/_react.default.createElement(_Listener.default, _extends({
     t: t,
     handleTranslate: handleTranslate,
@@ -1529,7 +1532,8 @@ function Exercises(props) {
     languageInformation: languageInformation,
     languageTag: languageTag,
     siteLanguage: siteLanguage,
-    courseSettings: courseSettings
+    courseSettings: courseSettings,
+    parentClassroom: parentClassroom
   }, listeningProgress)), /*#__PURE__*/_react.default.createElement(_SelectClassroom.default, {
     t: t,
     open: isSelectClassroomDialogOpen,

package/dist/Misc/ReportProblem/ReportProblem.js

@@ -22,7 +22,8 @@ function ReportProblem({
   mode,
   menuIconClassname,
   currentPhrase,
-  isQuestion
+  isQuestion,
+  parentClassroom
 }) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ReportProblem.default, {
     t: t,
@@ -30,7 +31,8 @@ function ReportProblem({
     handleClose: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
     currentPhrase: currentPhrase,
-    isQuestion: isQuestion
+    isQuestion: isQuestion,
+    parentClassroom: parentClassroom
   }), mode === "icon" && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
     title: t("report_problem")
   }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {

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

@@ -149,7 +149,9 @@ function OverflowMenu({
   trackRecommendedEvent,
   mainSiteUrl,
   members,
-  handleOpenInviteDialog
+  handleOpenInviteDialog,
+  refreshClassroomCourses,
+  selectedCourses
 }) {
   const isMediumScreen = (0, _useMediaQuery.default)("(max-width:600px)");
   const [isShareDrawerOpen, setIsShareDrawerOpen] = (0, _react.useState)(false);
@@ -185,7 +187,9 @@ function OverflowMenu({
     onClick: joinClassroom
   }, t("join_classroom")), !isCreator && isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: leaveClassroom
-  }, t("leave_classroom")), isCreator && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+  }, t("leave_classroom")), isCreator && selectedCourses.length > 0 && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+    onClick: refreshClassroomCourses
+  }, t("refresh_courses")), isCreator && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: handleOpenCoursesModal
   }, t("manage_courses")), isCreator && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     "data-cy": "delete-classroom",
@@ -285,6 +289,8 @@ function Classroom({
   createdGame,
   isNualangLiveEnabled,
   handleCreateCourse,
+  refreshClassroomCourses,
+  selectedCourses,
   ...otherProps
 }) {
   const {
@@ -1048,7 +1054,9 @@ function Classroom({
     mainSiteUrl: mainSiteUrl,
     members: members,
     handleOpenInviteDialog: handleOpenInviteDialog,
-    handleOpenUpgradeSubscriptionModal: true
+    handleOpenUpgradeSubscriptionModal: true,
+    refreshClassroomCourses: refreshClassroomCourses,
+    selectedCourses: selectedCourses
   }), /*#__PURE__*/_react.default.createElement(_UpgradeSubscription.default, {
     key: "UpgradeSubscription",
     t: t,

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

@@ -508,6 +508,7 @@ function Topic({
   loading,
   handleDeleteTopicVideo,
   verificationStatus,
+  parentClassroom,
   ...otherProps
 }) {
   const {
@@ -1056,7 +1057,8 @@ function Topic({
     courseSettings: courseSettings,
     handleToggleKeyboardTranslation: handleToggleKeyboardTranslation,
     isKeyboardHiddenTranslation: isKeyboardHiddenTranslation,
-    trackRecommendedEvent: trackRecommendedEvent
+    trackRecommendedEvent: trackRecommendedEvent,
+    parentClassroom: parentClassroom
   })), !(isMember || isCreator) && /*#__PURE__*/_react.default.createElement(_Overlay.default, {
     description: !authenticated ? t("course_sign_in_to_access") : t("join_course_to_access"),
     buttonText: !authenticated ? t("sign_in") : t("join"),
@@ -1242,6 +1244,7 @@ function ViewTopic({
   handleDeleteTopicVideo,
   verificationStatus,
   trackRecommendedEvent,
+  parentClassroom,
   ...otherProps
 }) {
   const {
@@ -1268,7 +1271,8 @@ function ViewTopic({
     courseSettings: courseSettings,
     videoUrl: videoUrl,
     verificationStatus: verificationStatus,
-    trackRecommendedEvent: trackRecommendedEvent
+    trackRecommendedEvent: trackRecommendedEvent,
+    parentClassroom: parentClassroom
   }, otherProps))), !isLoading && !topic && /*#__PURE__*/_react.default.createElement(_Topic.default, {
     t: t,
     isLoading: isLoading,

package/dist/Tables/Progress/ProgressTable.js

@@ -542,6 +542,8 @@ function TableRow({
     component: "th",
     scope: "row",
     sx: theme => ({
+      position: "sticky",
+      zIndex: 3,
       display: "flex",
       padding: `${theme.spacing(2)} !important`,
       minWidth: `250px !important`,

package/package.json

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