@nualang/nualang-ui-components 0.1.1164 → 0.1.1166

package/dist/Dialogs/GenerateBot/GenerateBot.js

@@ -236,7 +236,8 @@ function GenerateBotDialog({
     id: "topicGoal",
     name: "topicGoal",
     "data-cy": "topicGoal",
-    label: t("enter_a_topic_goal"),
+    label: t("topic_goal"),
+    placeholder: t("topic_goal_placeholder"),
     value: topicGoal,
     type: "text",
     margin: "normal",

package/dist/Dialogs/GeneratePhrases/GeneratePhrases.js

@@ -200,7 +200,8 @@ function GeneratePhrases({
     id: "topicGoal",
     name: "topicGoal",
     "data-cy": "topicGoal",
-    label: t("enter_a_topic_goal"),
+    label: t("topic_goal"),
+    placeholder: t("topic_goal_placeholder"),
     value: values.topicGoal,
     type: "text",
     margin: "normal",

package/dist/Dialogs/GenerateRoleplay/GenerateRoleplay.js

@@ -368,7 +368,8 @@ function GenerateRoleplayDialog({
   }, /*#__PURE__*/_react.default.createElement(_material.TextField, {
     id: "topicGoal",
     name: "topicGoal",
-    label: t("enter_a_topic_goal"),
+    label: t("topic_goal"),
+    placeholder: t("topic_goal_placeholder"),
     value: topicGoal,
     type: "text",
     margin: "normal",

package/dist/Dialogs/Listener/Listener.js

@@ -75,7 +75,8 @@ function Listener({
     onClick: addVoice
   }, t("add_voice")), audioURL && /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     src: audioURL,
-    theme: theme
+    theme: theme,
+    controls: true
   })) : null, /*#__PURE__*/_react.default.createElement(_Voices.default, _extends({
     t: t,
     isCreator: isCreator,

package/dist/Dialogs/WaveformDialog/WaveformDialog.js

@@ -96,7 +96,8 @@ function WaveformDialog({
   }, /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     src: attempt.voiceAttempt,
     autoPlay: true,
-    theme: theme
+    theme: theme,
+    controls: true
   }))));
 }
 var _default = exports.default = WaveformDialog;

package/dist/Editors/Phrases/Phrases.js

@@ -56,7 +56,6 @@ const useStyles = (0, _mui.makeStyles)()(theme => ({
     paddingRight: theme.spacing()
   },
   actionButton: {
-    marginLeft: theme.spacing(),
     marginTop: theme.spacing(0.5),
     marginBottom: theme.spacing(0.5),
     marginRight: theme.spacing()
@@ -435,16 +434,28 @@ function PhrasesEditor(props) {
     size: "small",
     onClick: deleteSelectedRow,
     endIcon: /*#__PURE__*/_react.default.createElement(_Delete.default, null),
-    disabled: !Number.isInteger(selectedRow)
+    disabled: !Number.isInteger(selectedRow),
+    sx: {
+      ml: 1
+    }
   }, t("delete_selected_row"))), /*#__PURE__*/_react.default.createElement(_material.Box, {
     className: classes.toggleBox
   }, (isCreator || isCreator && isMember) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, subscription?.isPaidUser && /*#__PURE__*/_react.default.createElement(_material.Button, {
+    className: classes.actionButton,
     onClick: handleOpenGeneratePhrases,
     color: "secondary",
     variant: "contained",
-    startIcon: /*#__PURE__*/_react.default.createElement(_AutoFixHigh.default, null),
+    endIcon: /*#__PURE__*/_react.default.createElement(_AutoFixHigh.default, null),
+    size: "small"
+  }, t("generate_phrases")), isCreator && mode === Modes.NORMAL && /*#__PURE__*/_react.default.createElement(_material.Button, {
+    className: classes.actionButton,
+    color: "primary",
+    "data-cy": "add-phrase",
+    onClick: () => setIsCreatePhraseDialogOpen(true),
+    variant: "contained",
+    endIcon: /*#__PURE__*/_react.default.createElement(_Add.default, null),
     size: "small"
-  }, t("generate_phrases")), /*#__PURE__*/_react.default.createElement(_DefaultColourButton.default, {
+  }, t("add_phrase")), /*#__PURE__*/_react.default.createElement(_DefaultColourButton.default, {
     className: classes.actionButton,
     size: "small",
     variant: "contained",
@@ -456,15 +467,7 @@ function PhrasesEditor(props) {
     size: "small",
     onClick: handleScriptDownload,
     endIcon: /*#__PURE__*/_react.default.createElement(_GetApp.default, null)
-  }, t("download"))), isCreator && mode === Modes.NORMAL && /*#__PURE__*/_react.default.createElement(_material.Button, {
-    className: classes.actionButton,
-    color: "primary",
-    "data-cy": "add-phrase",
-    onClick: () => setIsCreatePhraseDialogOpen(true),
-    variant: "contained",
-    endIcon: /*#__PURE__*/_react.default.createElement(_Add.default, null),
-    size: "small"
-  }, t("add_phrase")), /*#__PURE__*/_react.default.createElement(_material.ToggleButtonGroup, {
+  }, t("download"))), /*#__PURE__*/_react.default.createElement(_material.ToggleButtonGroup, {
     className: classes.actionButton,
     size: "medium",
     value: mode,

package/dist/Exercises/Pronouncer/Pronouncer.js

@@ -708,7 +708,8 @@ function Pronouncer({
     "aria-labelledby": finalTranscript
   }, attemptAudioURL && /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     src: attemptAudioURL,
-    theme: theme
+    theme: theme,
+    controls: true
   }))), /*#__PURE__*/_react.default.createElement(_ExerciseBottomBar.default, {
     t: t,
     handleSubmit: () => handleContinue(false, currentPhrase),

package/dist/Forms/CreateTopic/Steps/TopicInformation/TopicInformation.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _material = require("@mui/material");
+var _Info = _interopRequireDefault(require("@mui/icons-material/Info"));
 var Yup = _interopRequireWildcard(require("yup"));
 var _InputHelper = _interopRequireDefault(require("../../../../Forms/InputHelper"));
 var _ChipInput = _interopRequireDefault(require("../../../../Forms/ChipInput"));
@@ -100,12 +101,13 @@ function TopicInformation({
   }, difficultyOptions)), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12
-  }, /*#__PURE__*/_react.default.createElement(_InputHelper.default, {
+  }, /*#__PURE__*/_react.default.createElement(_material.TextField, {
     t: t,
     id: "topicGoal",
     name: "topicGoal",
     "data-cy": "topicGoal",
     label: t("topic_goal"),
+    placeholder: t("topic_goal_placeholder"),
     value: topicGoal,
     onChange: handleChange,
     onBlur: handleBlur,
@@ -116,7 +118,20 @@ function TopicInformation({
     variant: "outlined",
     multiline: true,
     fullWidth: true,
-    maxLength: 1000
+    maxLength: 1000,
+    InputProps: {
+      endAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {
+        position: "end"
+      }, /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
+        title: t("topic_goal_info_text"),
+        placement: "top"
+      }, /*#__PURE__*/_react.default.createElement(_Info.default, {
+        fontSize: "small",
+        style: {
+          color: "lightgrey"
+        }
+      })))
+    }
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12

package/dist/Lists/Exercises/Exercises.js

@@ -48,9 +48,8 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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); } // styles
-const sxRoot = theme => ({
-  width: "100%",
-  backgroundColor: theme.palette.background.paper
+const sxRoot = () => ({
+  width: "100%"
 });
 const sxNested = theme => ({
   paddingLeft: theme.spacing(9)

package/dist/Lists/Phrases/Phrases.js

@@ -27,8 +27,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return 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 => ({
   root: {
-    width: "100%",
-    backgroundColor: theme.palette.background.paper
+    width: "100%"
   },
   phraseText: {
     width: "80%",

package/dist/Lists/Voices/Voices.js

@@ -88,10 +88,12 @@ function Voice(props) {
   };
   const Wave = src || base64 ? src ? /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     src: src,
-    theme: theme
+    theme: theme,
+    controls: true
   }) : /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     base64: base64,
-    theme: theme
+    theme: theme,
+    controls: true
   }) : null;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ListItem.default, {
     disableGutters: disableGutters

package/dist/Misc/AnswerResult/AnswerResult.js

@@ -440,7 +440,8 @@ function AnswerResult({
     }), " ");
   }) : null), attemptAudioURL && /*#__PURE__*/_react.default.createElement(_Waveform.default, {
     src: attemptAudioURL,
-    theme: theme
+    theme: theme,
+    controls: true
   })), (exercise === "pronunciation" || exercise === "roleplay") && attemptAudioURL ? /*#__PURE__*/_react.default.createElement(_material.FormGroup, {
     className: classes.checkBox
   }, /*#__PURE__*/_react.default.createElement(_material.FormControlLabel, {

package/dist/Screens/Courses/SearchCourses/SearchCourses.js

@@ -94,7 +94,15 @@ function SearchFilters({
   }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
+    md: 9.5
+  }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    container: true,
+    direction: "row",
+    alignItems: "center",
+    spacing: 1
+  }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    item: true,
+    xs: 12,
     md: 2
   }, /*#__PURE__*/_react.default.createElement(_LanguageSelector.default, {
     id: "learnLang",
@@ -110,7 +118,6 @@ function SearchFilters({
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: 2
   }, /*#__PURE__*/_react.default.createElement(_LanguageSelector.default, {
     id: "forLang",
@@ -126,7 +133,6 @@ function SearchFilters({
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: 2
   }, /*#__PURE__*/_react.default.createElement(_material.TextField, {
     select: true,
@@ -142,7 +148,6 @@ function SearchFilters({
   }, difficultyOptions)), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: 2
   }, /*#__PURE__*/_react.default.createElement(_SortBySelector.default, {
     id: "sortBy",
@@ -159,7 +164,6 @@ function SearchFilters({
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: searchText ? 3.35 : 2.5,
     sx: theme => ({
       transition: theme.transitions.create("all", {
@@ -189,7 +193,6 @@ function SearchFilters({
   })), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: searchText ? 0.15 : 1,
     sx: theme => ({
       transition: theme.transitions.create("all", {
@@ -197,11 +200,18 @@ function SearchFilters({
         duration: theme.transitions.duration.leavingScreen
       })
     })
-  }), /*#__PURE__*/_react.default.createElement(_material.Grid, {
+  }))), /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12,
-    sm: 12,
     md: 2.5
+  }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    container: true,
+    direction: "row",
+    alignItems: "center",
+    spacing: 1
+  }, /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    item: true,
+    xs: 12
   }, /*#__PURE__*/_react.default.createElement(_material.Button, {
     onClick: handleCreateCourse,
     variant: "contained",
@@ -209,7 +219,7 @@ function SearchFilters({
     endIcon: /*#__PURE__*/_react.default.createElement(_Add.default, null),
     fullWidth: true,
     role: "link"
-  }, t("create_course"))))));
+  }, t("create_course"))))))));
 }
 function SearchCourses({
   t = text => text,

package/dist/Tables/Progress/Progress.js

@@ -90,7 +90,7 @@ const TableToolbar = ({
     margin: "dense",
     variant: "outlined",
     sx: {
-      width: 350
+      width: 300
     }
   }, reportFilterOptions)))), filter !== "discuss" && /*#__PURE__*/_react.default.createElement(_Grid.default, {
     item: true
@@ -104,31 +104,34 @@ const TableToolbar = ({
   }, /*#__PURE__*/_react.default.createElement(_DefaultColourButton.default, {
     variant: "contained",
     color: "primary",
-    startIcon: /*#__PURE__*/_react.default.createElement(_Download.default, null),
-    onClick: () => generateOverview(filter)
-  }, t("download"))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    startIcon: /*#__PURE__*/_react.default.createElement(_Refresh.default, null),
+    size: "small",
+    onClick: () => {
+      queryClient.invalidateQueries({
+        queryKey: ["memberCourseProgress"]
+      });
+    }
+  }, t("refresh"))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
     item: true,
     mb: 2,
     mr: 1
   }, /*#__PURE__*/_react.default.createElement(_DefaultColourButton.default, {
     variant: "contained",
     color: "primary",
-    startIcon: /*#__PURE__*/_react.default.createElement(_Print.default, null),
-    onClick: () => window.print()
-  }, t("print"))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    startIcon: /*#__PURE__*/_react.default.createElement(_Download.default, null),
+    size: "small",
+    onClick: () => generateOverview(filter)
+  }, t("download"))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
     item: true,
     mb: 2,
     mr: 1
   }, /*#__PURE__*/_react.default.createElement(_DefaultColourButton.default, {
     variant: "contained",
     color: "primary",
-    startIcon: /*#__PURE__*/_react.default.createElement(_Refresh.default, null),
-    onClick: () => {
-      queryClient.invalidateQueries({
-        queryKey: ["memberCourseProgress"]
-      });
-    }
-  }, t("refresh"))))));
+    startIcon: /*#__PURE__*/_react.default.createElement(_Print.default, null),
+    size: "small",
+    onClick: () => window.print()
+  }, t("print"))))));
 };
 function Progress({
   t = text => text,

package/dist/Tables/Progress/SelectMembers.js

@@ -56,7 +56,7 @@ function SelectMembers({
       primary: option.username
     })),
     style: {
-      width: 350
+      width: 300
     },
     renderInput: params => /*#__PURE__*/_react.default.createElement(_material.TextField, _extends({}, params, {
       label: "Search student name"

package/package.json

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