@nualang/nualang-ui-components 0.1.1283 → 0.1.1285

package/dist/Chat/BottomBar/BottomBar.js

@@ -100,7 +100,7 @@ function BottomBar({
   finalTranscript,
   inputRef,
   authenticated,
-  isAdvancedBot = false
+  isChallengeBot = false
 }) {
   const {
     classes
@@ -133,7 +133,7 @@ function BottomBar({
       onKeyPress: handleKeyPress,
       placeholder: placeholder,
       inputProps: {
-        maxLength: isAdvancedBot ? 600 : 200,
+        maxLength: isChallengeBot ? 600 : 200,
         sx: theme => ({
           "&::placeholder": {
             color: theme.palette.mode === "light" ? _colors.grey[200] : _colors.grey[800],
@@ -143,7 +143,7 @@ function BottomBar({
       },
       disableUnderline: true,
       multiline: true,
-      rows: isAdvancedBot ? 3 : 1,
+      rows: isChallengeBot ? 3 : 1,
       autoComplete: autoComplete,
       inputRef: activeRef,
       onClick: handleSelectCurrentInput,
@@ -158,12 +158,12 @@ function BottomBar({
           variant: "caption",
           sx: {
             color: "inherit",
-            opacity: inputValue.length >= (isAdvancedBot ? 600 : 200) ? 1 : 0.7,
+            opacity: inputValue.length >= (isChallengeBot ? 600 : 200) ? 1 : 0.7,
             marginRight: 1,
             fontWeight: 700,
             fontSize: "0.75rem"
           },
-          children: `${inputValue.length}/${isAdvancedBot ? 600 : 200}`
+          children: `${inputValue.length}/${isChallengeBot ? 600 : 200}`
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputHelper.Adornment, {
           t: t,
           emoji: true,

package/dist/Chat/Chat.js

@@ -100,7 +100,7 @@ function Chat({
   noAnswerCounts,
   isDynamicResponsesEnabled,
   isUserInternal,
-  isAdvancedBot = false
+  isChallengeBot = false
 }) {
   const {
     classes
@@ -202,7 +202,7 @@ function Chat({
       inputRef: inputRef,
       authenticated: authenticated,
       placeholder: placeholder,
-      isAdvancedBot: isAdvancedBot
+      isChallengeBot: isChallengeBot
     })]
   });
 }

package/dist/Editors/Bot/Editor/BotDesigner/VarList.js

@@ -203,7 +203,15 @@ function VarListItem({
       type: "text",
       multiline: true,
       fullWidth: true,
-      onChange: handleUpdateVariable,
+      onChange: e => {
+        const cleaned = e.target.value.replace(/\s+/g, " ").trim();
+        handleUpdateVariable({
+          target: {
+            name: varName,
+            value: cleaned
+          }
+        });
+      },
       onBlur: handleOnBlur,
       onFocus: handleSelectCurrentInput,
       inputProps: {

package/dist/Exercises/Bot/Bot.js

@@ -648,7 +648,7 @@ function Bot({
         isSpeakingTextContainer: isSpeakingTextContainer,
         isDynamicResponsesEnabled: isDynamicResponsesClassroomEnabled,
         isUserInternal: isUserInternal,
-        isAdvancedBot: bot.isAdvancedBot
+        isChallengeBot: bot.isChallengeBot
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ResponsiveDialog.default, {
         open: instructionDialogOpen,
         handleClose: handleCloseInstructions,

package/dist/Exercises/Listener/Listener.js

@@ -400,7 +400,7 @@ function Listener({
       })]
     }),
     spotlightPadding: 8,
-    target: "#listeningText"
+    target: "#listeningTextAnchor"
   }, {
     content: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
@@ -420,7 +420,8 @@ function Listener({
       })]
     }),
     spotlightPadding: 8,
-    target: "#skipButton"
+    target: "#skipButton",
+    disableScrollParentFix: false
   }, {
     content: /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
       children: t("change_voice_speed")
@@ -842,30 +843,36 @@ function Listener({
               width: "100%",
               maxWidth: `250px !important`
             },
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputHelper.default, {
-              t: t,
-              value: listeningText,
-              onChange: handleInputChange,
-              onKeyDown: e => {
-                if (e.key === "Enter") {
-                  handleContinue(false);
-                  e.stopPropagation();
-                }
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              id: "listeningTextAnchor",
+              style: {
+                position: "relative"
               },
-              id: "listeningText",
-              name: "listeningText",
-              label: t("language_phrase", {
-                language: (0, _index.capitalize)(t(learnLang.toLowerCase()))
-              }),
-              type: "text",
-              role: "textbox",
-              "aria-multiline": "true",
-              "aria-labelledby": "what-do-you-hear",
-              variant: "outlined",
-              fullWidth: true,
-              multiline: true,
-              autoComplete: "off",
-              characters: learnLangCharacters ? learnLangCharacters : null
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputHelper.default, {
+                t: t,
+                value: listeningText,
+                onChange: handleInputChange,
+                onKeyDown: e => {
+                  if (e.key === "Enter") {
+                    handleContinue(false);
+                    e.stopPropagation();
+                  }
+                },
+                id: "listeningText",
+                name: "listeningText",
+                label: t("language_phrase", {
+                  language: (0, _index.capitalize)(t(learnLang.toLowerCase()))
+                }),
+                type: "text",
+                role: "textbox",
+                "aria-multiline": "true",
+                "aria-labelledby": "what-do-you-hear",
+                variant: "outlined",
+                fullWidth: true,
+                multiline: true,
+                autoComplete: "off",
+                characters: learnLangCharacters ? learnLangCharacters : null
+              })
             })
           }), isWordBankEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
@@ -989,6 +996,7 @@ function Listener({
       showSkipButton: true,
       steps: steps,
       scrollOffset: 100,
+      disableScrollParentFix: true,
       styles: {
         options: {
           zIndex: 10000,

package/dist/Exercises/Translator/Translator.js

@@ -61,7 +61,8 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
     },
     flexGrow: 1,
     width: "100%",
-    padding: theme.spacing(4)
+    padding: theme.spacing(4),
+    boxSizing: "border-box"
   },
   progress: {
     width: "100%",
@@ -383,7 +384,7 @@ function Translator({
       })]
     }),
     spotlightPadding: 8,
-    target: "#translationText"
+    target: "#translationTextAnchor"
   }, {
     content: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
@@ -403,7 +404,8 @@ function Translator({
       })]
     }),
     spotlightPadding: 8,
-    target: "#skipButton"
+    target: "#skipButton",
+    disableScrollParentFix: false
   }, {
     content: /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
       children: t("change_voice_speed")
@@ -862,43 +864,49 @@ function Translator({
             })]
           })]
         }), !isKeyboardHidden && !useWordBank && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
             sx: {
               width: "100%",
               maxWidth: `250px !important`
             },
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-              className: classes.srOnly,
-              children: translationText
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputHelper.default, {
-              t: t,
-              value: translationText,
-              onChange: handleInputChange,
-              onKeyDown: e => {
-                if (e.key === "Enter") {
-                  handleContinue(false);
-                  e.stopPropagation();
-                }
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              id: "translationTextAnchor",
+              style: {
+                position: "relative"
               },
-              id: "translationText",
-              name: "translationText",
-              "aria-label": t("language_translation", {
-                language: (0, _index.capitalize)(t(forLang.toLowerCase()))
-              }),
-              "data-cy": "translationText",
-              label: t("language_translation", {
-                language: (0, _index.capitalize)(t(forLang.toLowerCase()))
-              }),
-              type: "text",
-              role: "textbox",
-              "aria-multiline": "true",
-              "aria-autocomplete": "none",
-              variant: "outlined",
-              multiline: true,
-              fullWidth: true,
-              autoComplete: "off",
-              characters: forLangCharacters ? forLangCharacters : null
-            })]
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                className: classes.srOnly,
+                children: translationText
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputHelper.default, {
+                t: t,
+                value: translationText,
+                onChange: handleInputChange,
+                onKeyDown: e => {
+                  if (e.key === "Enter") {
+                    handleContinue(false);
+                    e.stopPropagation();
+                  }
+                },
+                id: "translationText",
+                name: "translationText",
+                "aria-label": t("language_translation", {
+                  language: (0, _index.capitalize)(t(forLang.toLowerCase()))
+                }),
+                "data-cy": "translationText",
+                label: t("language_translation", {
+                  language: (0, _index.capitalize)(t(forLang.toLowerCase()))
+                }),
+                type: "text",
+                role: "textbox",
+                "aria-multiline": "true",
+                "aria-autocomplete": "none",
+                variant: "outlined",
+                multiline: true,
+                fullWidth: true,
+                autoComplete: "off",
+                characters: forLangCharacters ? forLangCharacters : null
+              })]
+            })
           }), isWordBankEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
               title: t("use_wordbank_if_stuck"),
@@ -995,6 +1003,7 @@ function Translator({
       showSkipButton: true,
       steps: steps,
       scrollOffset: 100,
+      disableScrollParentFix: true,
       styles: {
         options: {
           zIndex: 10000,

package/dist/Forms/CreateBot/CreateBot.js

@@ -43,7 +43,7 @@ function CreateBot({
     botAvatar: "",
     tags: [],
     phrasesToBoost: [],
-    isAdvancedBot: false,
+    isChallengeBot: false,
     isDynamicResponsesEnabled: "enable"
   },
   learnLang,

package/dist/Forms/CreateBot/Steps/BotSettings/BotSettings.js

@@ -32,7 +32,7 @@ function BotSettings({
   const {
     visibility,
     translationEnabled,
-    isAdvancedBot,
+    isChallengeBot,
     isDynamicResponsesEnabled
   } = values;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
@@ -113,26 +113,25 @@ function BotSettings({
             })]
           })]
         })
-      }), process.env.REACT_APP_STAGE === "dev" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
         size: 12,
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
           component: "fieldset",
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
             component: "legend",
-            children: t("advanced_bot")
+            children: t("challenge_bot")
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
             color: "textSecondary",
-            children: t("advanced_bot_desc")
+            children: t("challenge_bot_desc")
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
             row: true,
             className: classes.group,
-            "aria-label": "advancedBot",
-            name: "isAdvancedBot",
-            value: isAdvancedBot,
+            name: "isChallengeBot",
+            value: isChallengeBot,
             onChange: handleChange,
             onBlur: handleBlur,
-            helperText: touched.isAdvancedBot ? errors.isAdvancedBot : "",
-            error: touched.isAdvancedBot && Boolean(errors.isAdvancedBot),
+            helperText: touched.isChallengeBot ? errors.isChallengeBot : "",
+            error: touched.isChallengeBot && Boolean(errors.isChallengeBot),
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
               value: true,
               control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {}),

package/dist/Forms/CreateBot/Steps/Confirmation/Confirmation.js

@@ -59,7 +59,7 @@ function Confirmation({
     visibility,
     translationEnabled,
     studentInstructions,
-    isAdvancedBot,
+    isChallengeBot,
     isDynamicResponsesEnabled
   } = values;
   const [open, setOpen] = (0, _react.useState)(false);
@@ -151,17 +151,16 @@ function Confirmation({
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
               gutterBottom: true,
               display: "block",
-              children: t("advanced_bot_desc")
-            }), process.env.REACT_APP_STAGE === "dev" && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
+              children: t("challenge_bot_desc")
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
               component: "fieldset",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
                 component: "legend",
-                children: t("advanced_bot")
+                children: t("challenge_bot")
               }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
                 className: classes.group,
-                "aria-label": "advancedBot",
-                name: "isAdvancedBot",
-                value: isAdvancedBot,
+                name: "isChallengeBot",
+                value: isChallengeBot,
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
                   disabled: true,
                   value: true,

package/dist/Forms/UpdateBot/UpdateBot.js

@@ -45,7 +45,7 @@ function UpdateBot({
     tags: [],
     phrasesToBoost: [],
     isDynamicResponsesEnabled: "enable",
-    isAdvancedBot: false
+    isChallengeBot: false
   },
   verificationStatus,
   onSubmit,
@@ -83,7 +83,7 @@ function UpdateBot({
     tags,
     phrasesToBoost,
     isDynamicResponsesEnabled,
-    isAdvancedBot
+    isChallengeBot
   } = initialValues;
   const difficultyOptions = difficulties.map((d, idx) => {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, {
@@ -178,7 +178,7 @@ function UpdateBot({
         translationEnabled,
         picture,
         isDynamicResponsesEnabled,
-        isAdvancedBot
+        isChallengeBot
       },
       enableReinitialize: enableReinitialize,
       validationSchema: _Steps.BotSettings.validationSchema,

package/dist/Lists/Exercises/Exercises.js

@@ -509,11 +509,11 @@ function BotListItem({
   } = params;
   const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
   const [isBotHiddenState, setIsBotHiddenState] = (0, _react.useState)(bot.isBotHidden);
-  const [isBotAdvanced, setIsBotAdvanced] = (0, _react.useState)(bot.isAdvancedBot || false);
+  const [isBotChallenge, setIsBotChallenge] = (0, _react.useState)(bot.isChallengeBot || false);
   const [isSelectClassroomDialogOpen, setIsSelectClassroomDialogOpen] = (0, _react.useState)(false);
   (0, _react.useEffect)(() => {
-    setIsBotAdvanced(bot.isAdvancedBot);
-  }, [bot.isAdvancedBot]);
+    setIsBotChallenge(bot.isChallengeBot);
+  }, [bot.isChallengeBot]);
   const ref = (0, _react.useRef)(null);
   const [{
     handlerId
@@ -608,15 +608,15 @@ function BotListItem({
       isBotHidden: !isBotHidden
     });
   };
-  const markBotAsAdvanced = async () => {
+  const markBotAsChallenge = async () => {
     await handleUpdateBot(bot, {
-      isAdvancedBot: !isBotAdvanced
+      isChallengeBot: !isBotChallenge
     });
-    setIsBotAdvanced(!isBotAdvanced);
+    setIsBotChallenge(!isBotChallenge);
   };
   const botCompletions = numberOfBotCompletions(completions, bot.botId);
   const navigate = (0, _reactRouterDom.useNavigate)();
-  const AdvancedBotHtmlTooltip = (0, _system.styled)(({
+  const ChallengeBotHtmlTooltip = (0, _system.styled)(({
     className,
     ...props
   }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
@@ -635,7 +635,7 @@ function BotListItem({
         style: {
           marginBottom: "8px"
         },
-        children: t("advanced_bot_desc")
+        children: t("challenge_bot_desc")
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         style: {
           fontSize: "12px"
@@ -712,14 +712,14 @@ function BotListItem({
               children: isBotHiddenState ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_VisibilityOff.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Visibility.default, {})
             })
           })
-        }), isCreator && isLargeScreen && process.env.REACT_APP_STAGE === "dev" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
-          title: isBotAdvanced ? t("unmark_as_advanced_bot") : t("mark_as_advanced_bot"),
+        }), isCreator && isLargeScreen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+          title: isBotChallenge ? t("unmark_as_challenge_bot") : t("mark_as_challenge_bot"),
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
-            "data-cy": "mark_advanced_bot",
-            onClick: markBotAsAdvanced,
-            "aria-label": isBotAdvanced ? "Unmark bot as advanced" : "Mark bot as advanced",
+            "data-cy": "mark_challenge_bot",
+            onClick: markBotAsChallenge,
+            "aria-label": isBotChallenge ? t("unmark_as_challenge_bot") : t("mark_as_challenge_bot"),
             disabled: isCreator ? false : true,
-            children: isBotAdvanced ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_FlashOn.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_FlashOff.default, {})
+            children: isBotChallenge ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_FlashOn.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_FlashOff.default, {})
           })
         }) : null, isCreator && isLargeScreen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
           title: t("move_bot"),
@@ -757,11 +757,11 @@ function BotListItem({
             alt: ""
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-          primary: isLargeScreen ? !isBotAdvanced ? bot.botName || "" : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+          primary: isLargeScreen ? !isBotChallenge ? bot.botName || "" : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
             display: "flex",
             alignItems: "center",
             gap: "8px",
-            children: [bot.botName || "", /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedBotHtmlTooltip, {
+            children: [bot.botName || "", /*#__PURE__*/(0, _jsxRuntime.jsx)(ChallengeBotHtmlTooltip, {
               placement: "right",
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
                 label: t("challenge_mode"),
@@ -770,7 +770,7 @@ function BotListItem({
                 color: "primary"
               })
             })]
-          }) : !isBotAdvanced ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          }) : !isBotChallenge ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
               mb: 1,
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
@@ -791,7 +791,7 @@ function BotListItem({
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
               variant: "body1",
               children: bot.botName || ""
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedBotHtmlTooltip, {
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ChallengeBotHtmlTooltip, {
               placement: "right",
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
                 label: t("challenge_mode"),
@@ -954,7 +954,7 @@ function Exercises(props) {
     trackRecommendedEvent,
     parentClassroom,
     isHeritageSpeaker,
-    isAdvancedStudent
+    isChallengeModeStudent
   } = props;
   const params = (0, _reactRouterDom.useParams)();
   const {
@@ -1140,10 +1140,10 @@ function Exercises(props) {
     }
   }, [bots, botsStringified]);
   (0, _react.useEffect)(() => {
-    if (!isAdvancedStudent && !isCreator) {
-      setBotsArray(bots.filter(bot => !bot.isAdvancedBot || bot.isAdvancedBot === false));
+    if (!isChallengeModeStudent && !isCreator) {
+      setBotsArray(bots.filter(bot => !bot.isChallengeBot || bot.isChallengeBot === false));
     }
-  }, [bots, isAdvancedStudent, isCreator]);
+  }, [bots, isChallengeModeStudent, isCreator]);
   const moveBot = (0, _react.useCallback)((dragIndex, hoverIndex) => {
     const dragBot = botsArray[dragIndex];
     const newBots = (0, _immutabilityHelper.default)(botsArray, {

package/dist/Lists/Members/Members.js

@@ -137,7 +137,7 @@ function Member(props) {
       marginBottom: theme.spacing(0.5)
     }
   }));
-  const AdvancedStudentHtmlTooltip = (0, _styles.styled)(({
+  const ChallengeModeHtmlTooltip = (0, _styles.styled)(({
     className,
     ...props
   }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
@@ -151,12 +151,12 @@ function Member(props) {
           fontWeight: "bold",
           marginBottom: "8px"
         },
-        children: t("advanced_student")
+        children: t("challenge_student")
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         style: {
           marginBottom: "8px"
         },
-        children: t("advanced_student_desc")
+        children: t("challenge_student_desc")
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         style: {
           fontSize: "12px"
@@ -213,14 +213,14 @@ function Member(props) {
           })
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-        primary: featureFlags.classroomModes.readWrite && featureFlags.classroomModes.challenge && member.isHeritageSpeaker && member.assignedLabels?.isAdvancedStudent ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+        primary: featureFlags.classroomModes.readWrite && featureFlags.classroomModes.challenge && member.isHeritageSpeaker && member.assignedLabels?.isChallengeModeStudent ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
           display: "flex",
           alignItems: "center",
           gap: "8px",
-          children: [member.username, /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedStudentHtmlTooltip, {
+          children: [member.username, /*#__PURE__*/(0, _jsxRuntime.jsx)(ChallengeModeHtmlTooltip, {
             placement: "right",
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
-              label: t("advanced_student"),
+              label: t("challenge_student"),
               size: "small",
               variant: "outlined",
               color: "primary"
@@ -247,14 +247,14 @@ function Member(props) {
               color: "primary"
             })
           })]
-        }) : featureFlags.classroomModes.challenge && member.assignedLabels?.isAdvancedStudent ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+        }) : featureFlags.classroomModes.challenge && member.assignedLabels?.isChallengeModeStudent ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
           display: "flex",
           alignItems: "center",
           gap: "8px",
-          children: [member.username, /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedStudentHtmlTooltip, {
+          children: [member.username, /*#__PURE__*/(0, _jsxRuntime.jsx)(ChallengeModeHtmlTooltip, {
             placement: "right",
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Chip, {
-              label: t("advanced_student"),
+              label: t("challenge_student"),
               size: "small",
               variant: "outlined",
               color: "primary"
@@ -299,31 +299,31 @@ function Member(props) {
             primary: t("mark_as_heritage_speaker")
           })
         })
-      })), featureFlags.classroomModes.challenge && (member.assignedLabels?.isAdvancedStudent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
+      })), featureFlags.classroomModes.challenge && (member.assignedLabels?.isChallengeModeStudent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
         onClick: () => {
           handleUpdateClassroomMember(member.classroomId, member.memberId, {
             assignedLabels: {
-              isAdvancedStudent: false
+              isChallengeModeStudent: false
             }
           });
         },
-        "aria-label": `Unmark as advanced student: ${member.username}`,
+        "aria-label": `Unmark as challenge student: ${member.username}`,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-          primary: t("unmark_as_advanced_student")
+          primary: t("unmark_as_challenge_student")
         })
-      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedStudentHtmlTooltip, {
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(ChallengeModeHtmlTooltip, {
         placement: "right",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
           onClick: () => {
             handleUpdateClassroomMember(member.classroomId, member.memberId, {
               assignedLabels: {
-                isAdvancedStudent: true
+                isChallengeModeStudent: true
               }
             });
           },
-          "aria-label": `Mark as advanced student: ${member.username}`,
+          "aria-label": `Mark as challenge student: ${member.username}`,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
-            primary: t("mark_as_advanced_student")
+            primary: t("mark_as_challenge_student")
           })
         })
       })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {

package/dist/Misc/ExerciseBottomBar/ExerciseBottomBar.js

@@ -14,7 +14,9 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
   footer: {
     padding: theme.spacing(2),
     borderTop: `2px solid ${theme.palette.grey[300]}`,
-    width: "100%"
+    width: "100%",
+    position: "sticky",
+    bottom: 0
   }
 }));
 function ExerciseBottomBar({

package/dist/Navigation/ResponsiveTabs/ResponsiveTabs.js

@@ -112,30 +112,7 @@ function ResponsiveTabs({
       label,
       disabled,
       id
-    }) => id === "Discuss" && !localStorage.getItem("remove-discussion-new-tag") ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tab.default, {
-      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-        src: _NewText.default,
-        style: {
-          width: "45px",
-          marginTop: "-20px",
-          marginLeft: "-5px"
-        },
-        alt: "New Text"
-      }),
-      iconPosition: "end",
-      id: id,
-      label: label,
-      disabled: disabled,
-      onClick: () => {
-        if (!disableHashParams) {
-          window.history.replaceState(null, null, `#${id}`);
-        }
-      },
-      sx: {
-        paddingLeft: "45px"
-      },
-      "data-cy": `${id}-tab`
-    }, `responsivetabs_${id}`) : id === "Assignments" && hasNewAssignments && !isCreator && !localStorage.getItem("remove-assignment-new-tag") ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tab.default, {
+    }) => id === "Assignments" && hasNewAssignments && !isCreator && !localStorage.getItem("remove-assignment-new-tag") ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tab.default, {
       icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
         src: _NewText.default,
         style: {

package/dist/Screens/Classrooms/SearchClassrooms/SearchClassrooms.js

@@ -80,6 +80,7 @@ function SearchFilters({
       }),
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
         container: true,
+        width: "100%",
         direction: "row",
         alignItems: "center",
         spacing: 1,

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

@@ -578,7 +578,7 @@ function Topic({
   topicGoal,
   isUserInternal,
   isHeritageSpeaker = false,
-  isAdvancedStudent = false,
+  isChallengeModeStudent = false,
   ...otherProps
 }) {
   const {
@@ -769,7 +769,7 @@ function Topic({
             courseSettings: courseSettings,
             trackRecommendedEvent: trackRecommendedEvent,
             isHeritageSpeaker: isHeritageSpeaker,
-            isAdvancedStudent: isAdvancedStudent
+            isChallengeModeStudent: isChallengeModeStudent
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
           py: 1,
@@ -1106,7 +1106,7 @@ function Topic({
             handleDuplicateRoleplay: handleDuplicateRoleplay,
             isCreator: isCreator,
             isMember: isMember,
-            isAdvancedStudent: isAdvancedStudent,
+            isChallengeModeStudent: isChallengeModeStudent,
             phrases: phrases,
             completions: completions,
             roleplays: roleplays,
@@ -1395,7 +1395,7 @@ function ViewTopic({
   topicGoal,
   isUserInternal,
   isHeritageSpeaker,
-  isAdvancedStudent,
+  isChallengeModeStudent,
   ...otherProps
 }) {
   const {
@@ -1431,7 +1431,7 @@ function ViewTopic({
         topicGoal: topicGoal,
         isUserInternal: isUserInternal,
         isHeritageSpeaker: isHeritageSpeaker,
-        isAdvancedStudent: isAdvancedStudent,
+        isChallengeModeStudent: isChallengeModeStudent,
         ...otherProps
       })
     }), !isLoading && !topic && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Topic.default, {

package/dist/hooks/useClassroomState.js

@@ -21,7 +21,7 @@ function useClassroomState({
   const queryClient = useQueryClient();
   const classroomMemberData = queryClient.getQueryData(_Queries.classrooms.classroomKeys.itemMember(classroomId, username, memberId));
   const [isMember, setIsMember] = (0, _react.useState)(classroomMemberData?.Item ? true : false);
-  const [isAdvancedStudent, setIsAdvancedStudent] = (0, _react.useState)(classroomMemberData?.Item?.assignedLabels && classroomMemberData?.Item?.assignedLabels.isAdvancedStudent === true);
+  const [isChallengeModeStudent, setisChallengeModeStudent] = (0, _react.useState)(classroomMemberData?.Item?.assignedLabels && classroomMemberData?.Item?.assignedLabels.isChallengeModeStudent === true);
   let filters = {
     limit: _config.config.limits.classroomMembers
   };
@@ -42,15 +42,15 @@ function useClassroomState({
   (0, _react.useEffect)(() => {
     if (memberQuery.isSuccess) {
       const isClassroomMember = memberQuery.data && memberQuery.data.Item ? true : false;
-      const isAdvancedStudent = memberQuery.data?.Item?.assignedLabels && memberQuery.data?.Item?.assignedLabels.isAdvancedStudent === true;
+      const isChallengeModeStudent = memberQuery.data?.Item?.assignedLabels && memberQuery.data?.Item?.assignedLabels.isChallengeModeStudent === true;
       setIsMember(isClassroomMember);
-      setIsAdvancedStudent(isAdvancedStudent);
+      setisChallengeModeStudent(isChallengeModeStudent);
     }
   }, [memberQuery.data, memberQuery.isSuccess, memberId]);
   return {
     isMember,
     membersQuery,
     memberQuery,
-    isAdvancedStudent
+    isChallengeModeStudent
   };
 }

package/dist/utils/index.js

@@ -230,17 +230,19 @@ const calcTopicCompletions = (topic, completions = [], isSectionHidden, assignme
   let completedBots = 0;
   const roleplays = topic.roleplays.map(roleplay => {
     const {
-      isActItOutHidden = false,
-      isActItOutListeningHidden = false,
-      isActItOutListeningSpeakingHidden = false,
-      isActItOutSpeakingHidden = false
+      isFillInTheBlanksHidden = "false",
+      isActItOutHidden = "false",
+      isActItOutListeningHidden = "false",
+      isActItOutListeningSpeakingHidden = "false",
+      isActItOutSpeakingHidden = "false"
     } = roleplay;
     const trueCount = Object.values({
+      isFillInTheBlanksHidden,
       isActItOutHidden,
       isActItOutListeningHidden,
       isActItOutListeningSpeakingHidden,
       isActItOutSpeakingHidden
-    }).filter(Boolean).length;
+    }).filter(value => value === "true").length;
     const numberOfUnhiddenGames = 6 - trueCount;
     const isUnassignedRoleplay = assignmentExercises ? assignmentExercises && !assignmentExercises.some(e => e.roleplayId === roleplay.roleplayId) : false;
     if (isRoleplaysHidden || roleplay.isRoleplayHidden || isSectionHidden || topic.isTopicHidden || isUnassignedRoleplay) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1283",
+  "version": "0.1.1285",
   "main": "dist/index.js",
   "files": [
     "dist",
@@ -20,7 +20,7 @@
     "@hookform/resolvers": "^3.6.0",
     "@json2csv/plainjs": "^7.0.1",
     "@nualang/avatars": "2.0.3",
-    "@nualang/nualang-api-and-queries": "^1.1.5",
+    "@nualang/nualang-api-and-queries": "^1.1.16",
     "@storybook/theming": "^8.6.12",
     "@stripe/react-stripe-js": "^2.1.1",
     "@stripe/stripe-js": "^1.54.2",