@nualang/nualang-ui-components 0.1.1139 → 0.1.1140

package/dist/Dialogs/LiveGameTutorial/LiveGameTutorial.js

@@ -54,13 +54,14 @@ function DotsMobileStepper({
   }, Math.abs(activeStep - index) <= 2 ? /*#__PURE__*/_react.default.createElement(_material.Box, {
     component: "img",
     sx: {
-      height: 500,
       display: "block",
       maxWidth: 720,
       overflow: "hidden",
       width: "100%",
       margin: "auto",
-      borderRadius: "10px"
+      borderRadius: "10px",
+      marginTop: 1,
+      marginBottom: 1
     },
     src: step.imgPath,
     alt: step.label
@@ -150,8 +151,16 @@ function LiveGameTutorial({
     handleClose: handleClose,
     dialogTitle: t(exerciseName),
     t: t
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center',
+      width: '100%',
+      height: '100%'
+    }
   }, /*#__PURE__*/_react.default.createElement(DotsMobileStepper, {
     images: images,
     t: t
-  }));
+  })));
 }

package/dist/Dialogs/ReportProblem/ReportProblem.js

@@ -25,6 +25,8 @@ function ReportProblem({
   open,
   handleClose,
   handleReportProblem,
+  currentPhrase,
+  isQuestion,
   ...otherProps
 }) {
   const [problem, setProblem] = (0, _react.useState)(initialProblem);
@@ -45,7 +47,9 @@ function ReportProblem({
     } = event.target;
     setProblem(prevProblem => ({
       ...prevProblem,
-      [name]: value
+      [name]: value,
+      currentPhrase: currentPhrase,
+      isQuestion: isQuestion ? isQuestion : false
     }));
   };
   const problemTypes = [{

package/dist/Exercises/Bot/Bot.js

@@ -212,6 +212,7 @@ function Bot({
     isSpeaking,
     isSpeakingTextContainer
   } = exerciseState;
+  const currentPhrase = botMessages.length > 0 ? botMessages[botMessages.length - 1].text : "N/A";
   const joyrideSteps = [{
     content: /*#__PURE__*/_react.default.createElement("h2", null, t("bot_exercise_welcome")),
     placement: "center",
@@ -375,7 +376,8 @@ function Bot({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase
   }));
   const beforeElements = /*#__PURE__*/_react.default.createElement(_material.Box, {
     mb: 2

package/dist/Exercises/Listener/Listener.js

@@ -549,7 +549,8 @@ function Listener({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar

package/dist/Exercises/Pronouncer/Pronouncer.js

@@ -488,7 +488,8 @@ function Pronouncer({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar

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

@@ -127,7 +127,8 @@ function OverflowMenu({
   handleCloseReportProblem,
   handleReportProblem,
   handleRestart,
-  setRestartRoleplayDialog
+  setRestartRoleplayDialog,
+  currentMessages
 }) {
   const {
     classes
@@ -139,6 +140,8 @@ function OverflowMenu({
   const handleCloseMenu = () => {
     setAnchorEl(null);
   };
+  const currentPhrase = currentMessages.length > 0 ? currentMessages[currentMessages.length - 1].text ? currentMessages[currentMessages.length - 1].text : currentMessages[currentMessages.length - 1].question : "N/A";
+  const isQuestion = currentMessages.length > 0 && currentMessages[currentMessages.length - 1].hasOwnProperty("question");
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
     title: t("more_options")
   }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
@@ -183,7 +186,9 @@ function OverflowMenu({
     handleCloseReportProblem: handleCloseReportProblem,
     handleReportProblem: handleReportProblem,
     mode: "menuitem",
-    menuIconClassname: classes.menuIcon
+    menuIconClassname: classes.menuIcon,
+    currentPhrase: currentPhrase,
+    isQuestion: isQuestion
   })));
 }
 const TopBarActions = ({
@@ -212,6 +217,8 @@ const TopBarActions = ({
   const {
     classes
   } = useStyles();
+  const currentPhrase = currentMessages.length > 0 ? currentMessages[currentMessages.length - 1].text ? currentMessages[currentMessages.length - 1].text : currentMessages[currentMessages.length - 1].question : "N/A";
+  const isQuestion = currentMessages.length > 0 && currentMessages[currentMessages.length - 1].hasOwnProperty("question");
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, roleplayHasStarted || isRoleplayPreview ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !isRoleplayPreview && /*#__PURE__*/_react.default.createElement("div", {
     className: classes.progress
   }, /*#__PURE__*/_react.default.createElement(RoundedLinearProgress, {
@@ -253,7 +260,9 @@ const TopBarActions = ({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase,
+    isQuestion: isQuestion
   })), /*#__PURE__*/_react.default.createElement(_material.Hidden, {
     smUp: true
   }, /*#__PURE__*/_react.default.createElement(_VoiceSpeed.default, {
@@ -272,7 +281,8 @@ const TopBarActions = ({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentMessages: currentMessages
   }))) : /*#__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/Translator/Translator.js

@@ -543,7 +543,8 @@ function Translator({
     isReportProblemOpen: isReportProblemOpen,
     handleOpenReportProblem: handleOpenReportProblem,
     handleCloseReportProblem: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase
   })), /*#__PURE__*/_react.default.createElement(_material.Toolbar, {
     variant: "dense",
     className: classes.mobileAdditionalToolbar

package/dist/Misc/ReportProblem/ReportProblem.js

@@ -20,13 +20,17 @@ function ReportProblem({
   handleReportProblem,
   edge,
   mode,
-  menuIconClassname
+  menuIconClassname,
+  currentPhrase,
+  isQuestion
 }) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ReportProblem.default, {
     t: t,
     open: isReportProblemOpen,
     handleClose: handleCloseReportProblem,
-    handleReportProblem: handleReportProblem
+    handleReportProblem: handleReportProblem,
+    currentPhrase: currentPhrase,
+    isQuestion: isQuestion
   }), mode === "icon" && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
     title: t("report_problem")
   }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {

package/dist/Screens/Dashboard/Dashboard.js

@@ -48,8 +48,6 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
 }));
 function Dashboard({
   t,
-  learnCourses = [],
-  teachCourses = [],
   completions = [],
   avatars = [],
   newRoleplays = [],
@@ -62,11 +60,12 @@ function Dashboard({
   handlePlayRoleplay,
   newCourses = [],
   recommendedCourses = [],
-  isMyCoursesLoading,
+  popularCourses = [],
   isNewCoursesLoading,
   isRecommendedCoursesLoading,
   isNewRoleplaysLoading,
   isNewBotsLoading,
+  isPopularCoursesLoading,
   handleDuplicateBot,
   handleDuplicateRoleplay,
   singleLineGrid = true,
@@ -175,7 +174,7 @@ function Dashboard({
   }, /*#__PURE__*/_react.default.createElement(_material.ListItemIcon, null, /*#__PURE__*/_react.default.createElement(_Face.default, null)), t("bot")), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: handleCreateCourse,
     role: "link"
-  }, /*#__PURE__*/_react.default.createElement(_material.ListItemIcon, null, /*#__PURE__*/_react.default.createElement(_BubbleChart.default, null)), t("course")))))), isMyCoursesLoading || learnCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+  }, /*#__PURE__*/_react.default.createElement(_material.ListItemIcon, null, /*#__PURE__*/_react.default.createElement(_BubbleChart.default, null)), t("course")))))), isPopularCoursesLoading || popularCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: classes.header
@@ -184,7 +183,7 @@ function Dashboard({
   }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
     variant: "h5",
     component: "h2"
-  }, learnCourses.length > 0 ? t("continue_learning") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
+  }, popularCourses.length > 0 ? t("popular_courses") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
     variant: "rectangular",
     height: 32,
     width: 250
@@ -210,14 +209,14 @@ function Dashboard({
     t: t,
     reviewPlaceholderImageUrl: reviewPlaceholderImageUrl,
     memberPlaceholderImageUrl: memberPlaceholderImageUrl,
-    courses: Array.isArray(learnCourses) && learnCourses.length ? learnCourses : null,
+    courses: Array.isArray(popularCourses) && popularCourses.length ? popularCourses : null,
     completions: completions,
     handleStartCourse: handleStartCourse,
     handleLeaveCourse: handleLeaveCourse,
+    handleViewCourseTopic: handleViewCourseTopic,
     handleViewCourse: handleViewCourse,
     handleViewUserProfile: handleViewUserProfile,
     membersProps: membersProps,
-    handleViewCourseTopic: handleViewCourseTopic,
     getMemberDetails: getMemberDetails,
     getMemberInfo: getMemberInfo,
     getUserReviews: getUserReviews,
@@ -230,11 +229,10 @@ function Dashboard({
     getCourseMembers: getCourseMembers,
     memberId: memberId,
     username: username,
-    handleDuplicateCourse: handleDuplicateCourse,
-    ariaText: "Continue learning "
+    handleDuplicateCourse: handleDuplicateCourse
   })), /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
-  }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null, isMyCoursesLoading || teachCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+  }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null, isRecommendedCoursesLoading || recommendedCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: classes.header
@@ -243,7 +241,7 @@ function Dashboard({
   }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
     variant: "h5",
     component: "h2"
-  }, teachCourses.length > 0 ? t("continue_teaching") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
+  }, recommendedCourses.length > 0 ? t("recommended_courses") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
     variant: "rectangular",
     height: 32,
     width: 250
@@ -269,7 +267,7 @@ function Dashboard({
     t: t,
     reviewPlaceholderImageUrl: reviewPlaceholderImageUrl,
     memberPlaceholderImageUrl: memberPlaceholderImageUrl,
-    courses: Array.isArray(teachCourses) && teachCourses.length ? teachCourses : null,
+    courses: Array.isArray(recommendedCourses) && recommendedCourses.length ? recommendedCourses : null,
     completions: completions,
     handleStartCourse: handleStartCourse,
     handleLeaveCourse: handleLeaveCourse,
@@ -289,11 +287,10 @@ function Dashboard({
     getCourseMembers: getCourseMembers,
     memberId: memberId,
     username: username,
-    handleDuplicateCourse: handleDuplicateCourse,
-    ariaText: "Continue teaching "
+    handleDuplicateCourse: handleDuplicateCourse
   })), /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
-  }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null, isRecommendedCoursesLoading || recommendedCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+  }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null, isNewCoursesLoading || newCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: classes.header
@@ -302,7 +299,7 @@ function Dashboard({
   }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
     variant: "h5",
     component: "h2"
-  }, newCourses.length > 0 ? t("recommended_courses") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
+  }, newCourses.length > 0 ? t("new_courses") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
     variant: "rectangular",
     height: 32,
     width: 250
@@ -328,7 +325,7 @@ function Dashboard({
     t: t,
     reviewPlaceholderImageUrl: reviewPlaceholderImageUrl,
     memberPlaceholderImageUrl: memberPlaceholderImageUrl,
-    courses: Array.isArray(recommendedCourses) && recommendedCourses.length ? recommendedCourses : null,
+    courses: Array.isArray(newCourses) && newCourses.length ? newCourses : null,
     completions: completions,
     handleStartCourse: handleStartCourse,
     handleLeaveCourse: handleLeaveCourse,
@@ -444,64 +441,6 @@ function Dashboard({
     disablePreview: true
   })), /*#__PURE__*/_react.default.createElement(_material.Box, {
     pb: 2
-  }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null, isNewCoursesLoading || newCourses.length > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
-    pb: 2
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.header
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.headerText
-  }, /*#__PURE__*/_react.default.createElement(_material.Typography, {
-    variant: "h5",
-    component: "h2"
-  }, newCourses.length > 0 ? t("new_courses") : /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
-    variant: "rectangular",
-    height: 32,
-    width: 250
-  }))), /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
-    title: t("find_course")
-  }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
-    onClick: handleSearchCourses,
-    "aria-label": t("find_course"),
-    color: "inherit",
-    "data-cy": "search-course-fab",
-    size: "large",
-    role: "link"
-  }, /*#__PURE__*/_react.default.createElement(_Search.default, null))), /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
-    title: t("create_course")
-  }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
-    onClick: handleCreateCourse,
-    "aria-label": t("create_course"),
-    color: "inherit",
-    "data-cy": "add-course-fab",
-    size: "large",
-    role: "link"
-  }, /*#__PURE__*/_react.default.createElement(_Add.default, null)))), /*#__PURE__*/_react.default.createElement(_Courses.default, {
-    t: t,
-    reviewPlaceholderImageUrl: reviewPlaceholderImageUrl,
-    memberPlaceholderImageUrl: memberPlaceholderImageUrl,
-    courses: Array.isArray(newCourses) && newCourses.length ? newCourses : null,
-    completions: completions,
-    handleStartCourse: handleStartCourse,
-    handleLeaveCourse: handleLeaveCourse,
-    handleViewCourseTopic: handleViewCourseTopic,
-    handleViewCourse: handleViewCourse,
-    handleViewUserProfile: handleViewUserProfile,
-    membersProps: membersProps,
-    getMemberDetails: getMemberDetails,
-    getMemberInfo: getMemberInfo,
-    getUserReviews: getUserReviews,
-    avatars: avatars,
-    singleLineGrid: singleLineGrid,
-    singleLineGridCols: singleLineGridCols,
-    getCourseSections: getCourseSections,
-    getCourseReviews: getCourseReviews,
-    getCourseMember: getCourseMember,
-    getCourseMembers: getCourseMembers,
-    memberId: memberId,
-    username: username,
-    handleDuplicateCourse: handleDuplicateCourse
-  })), /*#__PURE__*/_react.default.createElement(_material.Box, {
-    pb: 2
   }, /*#__PURE__*/_react.default.createElement(_material.Divider, null))) : null);
 }
 Dashboard.defaultProps = {

package/dist/Screens/Dashboard/Dashboard.stories.js

@@ -79,8 +79,9 @@ Loading.storyName = "loading";
 const Loaded = exports.Loaded = Template.bind({});
 Loaded.args = {
   ...props,
-  learnCourses: _Courses.courses,
-  teachCourses: _Courses.courses,
+  popularCourses: _Courses.courses,
+  recommendedCourses: _Courses.courses,
+  newCourses: _Courses.courses,
   newRoleplays: _Roleplays.roleplays,
   newBots: _Bots.bots
 };