@nualang/nualang-ui-components 0.1.1130 → 0.1.1132

package/dist/Cards/SubscriptionPlan/SubscriptionPlan.js

@@ -97,7 +97,7 @@ const PlanButton = (0, _system.styled)(_material.Button)(({
   bgPrimary
 }) => ({
   textTransform: "none",
-  marginTop: theme.spacing(3),
+  marginTop: theme.spacing(1),
   fontSize: "1rem",
   lineHeight: "2.5",
   borderRadius: theme.spacing(),
@@ -288,7 +288,7 @@ function SubscriptionPlan({
     color: plan.button.buttonColor || "primary",
     onClick: () => plan.button.onClick(),
     bgPrimary: plan.bgPrimary
-  }, plan.button.buttonText), plan.planVersions && displayPlan && billingPeriod && currency && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(PlanButton, {
+  }, plan.button.buttonText), plan.planVersions && displayPlan && billingPeriod && currency && /*#__PURE__*/_react.default.createElement("div", null, displayPlan.subButton && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(PlanButton, {
     id: "plan-button",
     fullWidth: true,
     variant: displayPlan.subButton.buttonVariant,
@@ -341,7 +341,7 @@ function SubscriptionPlan({
     sx: {
       fontSize: 15
     }
-  })))), /*#__PURE__*/_react.default.createElement(PlanButton, {
+  }))))), displayPlan.buyButton && /*#__PURE__*/_react.default.createElement(PlanButton, {
     id: "buy-now-button",
     fullWidth: true,
     variant: displayPlan.buyButton.buttonVariant,
@@ -367,7 +367,6 @@ SubscriptionPlan.propTypes = {
 };
 SubscriptionPlan.defaultProps = {
   t: text => text,
-  currency: "usd",
   billingPeriod: "yearly"
 };
 var _default = exports.default = SubscriptionPlan;

package/dist/Chat/Messages/Message/Message.js

@@ -117,11 +117,11 @@ const useStyles = (0, _mui.makeStyles)()((theme, {
     marginTop: -5
   },
   visuallyHidden: {
-    position: "absolute !important",
+    position: "fixed !important",
     width: "1px !important",
     height: "1px !important",
     padding: "0 !important",
-    margin: "-1px !important",
+    margin: "0 !important",
     overflow: "hidden !important",
     clip: "rect(0, 0, 0, 0) !important",
     whiteSpace: "nowrap !important",

package/dist/Dialogs/CreateQuestion/CreateQuestion.js

@@ -16,9 +16,13 @@ var _colors = require("@mui/material/colors");
 var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _reactBeautifulDnd = require("react-beautiful-dnd");
 var _DragHandle = _interopRequireDefault(require("@mui/icons-material/DragHandle"));
+var _material = require("@mui/material");
+var _iconsMaterial = require("@mui/icons-material");
 var _ResponsiveDialog = _interopRequireDefault(require("../ResponsiveDialog"));
 var _InputHelper = _interopRequireDefault(require("../../Forms/InputHelper"));
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _nualas = _interopRequireDefault(require("../../img/nualas.svg"));
+var _reactRouterDom = require("react-router-dom");
 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; }
@@ -52,11 +56,16 @@ function CreateQuestion({
   update,
   forLangCharacters,
   learnLangCharacters,
+  script,
+  makeChatGptApiRequest,
+  values,
   ...otherProps
 }) {
   const [question, setQuestion] = (0, _react.useState)(otherProps.question);
   const [answer, setAnswer] = (0, _react.useState)(initialAnswerState);
   const [answerList, setAnswerList] = (0, _react.useState)(otherProps.answers);
+  const [isMessageGenerating, setIsMessageGenerating] = (0, _react.useState)(false);
+  const [errorMessage, setErrorMessage] = (0, _react.useState)(null);
   const handleAnswerInputChange = event => {
     const target = event.target;
     const value = target.type === "checkbox" ? target.checked : target.value;
@@ -131,6 +140,82 @@ function CreateQuestion({
       handleAddAnswerDebounced();
     }
   };
+  const extractJsonObject = response => {
+    let stack = [];
+    let startIndex = -1;
+    let endIndex = -1;
+    for (let i = 0; i < response.length; i++) {
+      if (response[i] === "{") {
+        if (stack.length === 0) {
+          startIndex = i;
+        }
+        stack.push("{");
+      } else if (response[i] === "}") {
+        stack.pop();
+        if (stack.length === 0) {
+          endIndex = i;
+          break;
+        }
+      }
+    }
+    if (startIndex !== -1 && endIndex !== -1) {
+      return response.substring(startIndex, endIndex + 1);
+    }
+    return "";
+  };
+  function validateResponse(response) {
+    if (typeof response !== "object" || response === null) {
+      return false;
+    }
+    if (typeof response.question !== "string") {
+      return false;
+    }
+    if (!Array.isArray(response.answers)) {
+      return false;
+    }
+    if (response.answers.length === 0) {
+      return false;
+    }
+    let hasCorrectAnswer = false;
+    for (const answer of response.answers) {
+      if (typeof answer !== "object" || answer === null) {
+        return false;
+      }
+      if (typeof answer.text !== "string" || typeof answer.correct !== "boolean" || typeof answer.type !== "string") {
+        return false;
+      }
+      if (answer.correct) {
+        hasCorrectAnswer = true;
+      }
+    }
+    return hasCorrectAnswer;
+  }
+  const handleGenerateAnswer = async () => {
+    try {
+      setIsMessageGenerating(true);
+      setErrorMessage(null);
+      const prompt = `Here is a script: ${JSON.stringify(script)}. Actor 1 is ${values.actor1} and Actor 2 is ${values.actor2} Please generate a new comprehension question based on the script that is completely unique to any existing questions, and provide it in JSON format with the keys 'question' and 'answers'. The 'question' key has the value of the string contraining the question text. The 'answers' key is an array of objects, where each answer object contains 'text', 'correct', and 'type' keys. The type should always be 'multichoice'. Ensure the new question is answered by the script, as the purpose of the question to the test the reader's understanding of the script.`;
+      const chatGptResponse = await makeChatGptApiRequest({
+        model: "gpt-3.5-turbo",
+        prompt
+      });
+      const jsonResponse = extractJsonObject(chatGptResponse);
+      const newQuestion = JSON.parse(jsonResponse);
+      if (!validateResponse(newQuestion)) {
+        throw new Error("Invalid response from GPT-3.5");
+      }
+      onSubmit({
+        question: newQuestion.question.trim(),
+        answers: newQuestion.answers
+      });
+      setIsMessageGenerating(false);
+      handleClose();
+    } catch (error) {
+      console.error(error);
+      setIsMessageGenerating(false);
+      setErrorMessage("There was problem generating the roleplay, please try again.");
+    }
+  };
   const title = update ? t("update_question") : t("add_question");
   const desc = update ? t("update_question_desc") : t("add_question_desc");
   return /*#__PURE__*/_react.default.createElement(_ResponsiveDialog.default, {
@@ -138,8 +223,57 @@ function CreateQuestion({
     handleClose: handleClose,
     handleSubmit: handleSubmit,
     submitText: title,
-    dialogTitle: title
-  }, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, desc), /*#__PURE__*/_react.default.createElement(_InputHelper.default, {
+    dialogTitle: isMessageGenerating ? t("generating_question") : title,
+    isSubmitDisabled: isMessageGenerating
+  }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    item: true,
+    xs: 12,
+    textAlign: "center",
+    sx: {
+      ...(!isMessageGenerating && {
+        display: "none"
+      })
+    },
+    mx: 2
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    src: _nualas.default,
+    style: {
+      maxHeight: 230
+    },
+    alt: ""
+  })), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    item: true,
+    xs: 12,
+    sx: {
+      ...(!isMessageGenerating && {
+        display: "none"
+      })
+    },
+    mt: 2
+  }, /*#__PURE__*/_react.default.createElement(_material.LinearProgress, null)), !isMessageGenerating && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    item: true,
+    xs: 12,
+    mb: 2
+  }, /*#__PURE__*/_react.default.createElement(_material.Alert, {
+    severity: "info"
+  }, t("experimental_feature_desc_answer"), " -", " ", /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
+    to: "/contact"
+  }, t("contact_form"), "."))), /*#__PURE__*/_react.default.createElement(_material.Box, {
+    mb: 2
+  }, /*#__PURE__*/_react.default.createElement(_material.Button, {
+    onClick: handleGenerateAnswer,
+    color: "secondary",
+    variant: "contained",
+    startIcon: /*#__PURE__*/_react.default.createElement(_iconsMaterial.AutoFixHigh, null)
+  }, t("generate_question"))), /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, desc), /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    container: true,
+    direction: "row",
+    justifyContent: "center",
+    alignItems: "flex-end"
+  }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    item: true,
+    xs: 12
+  }, /*#__PURE__*/_react.default.createElement(_InputHelper.default, {
     t: t,
     value: question,
     onChange: e => setQuestion(e.target.value),
@@ -153,12 +287,7 @@ function CreateQuestion({
     variant: "outlined",
     multiline: true,
     characters: learnLangCharacters ? learnLangCharacters : null
-  }), /*#__PURE__*/_react.default.createElement(_Grid.default, {
-    container: true,
-    direction: "row",
-    justifyContent: "center",
-    alignItems: "flex-end"
-  }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
+  })), /*#__PURE__*/_react.default.createElement(_Grid.default, {
     item: true,
     xs: 12
   }, /*#__PURE__*/_react.default.createElement(_InputHelper.default, {
@@ -176,7 +305,13 @@ function CreateQuestion({
     characters: forLangCharacters ? forLangCharacters : null,
     helperText: answer.text && answer.text.trim() !== "" ? t("answer_helper_text") : "",
     multiline: true
-  }))), /*#__PURE__*/_react.default.createElement(_reactBeautifulDnd.DragDropContext, {
+  })), errorMessage && /*#__PURE__*/_react.default.createElement(_Grid.default, {
+    item: true,
+    xs: 12,
+    mt: 2
+  }, /*#__PURE__*/_react.default.createElement(_material.Alert, {
+    severity: "warning"
+  }, errorMessage))), /*#__PURE__*/_react.default.createElement(_reactBeautifulDnd.DragDropContext, {
     onDragEnd: handleOnDragEnd
   }, /*#__PURE__*/_react.default.createElement(_reactBeautifulDnd.Droppable, {
     droppableId: "answers"
@@ -237,7 +372,7 @@ function CreateQuestion({
       name: "correct"
     }),
     label: t("correct_answer")
-  })))))), provided.placeholder))));
+  })))))), provided.placeholder)))));
 }
 CreateQuestion.defaultProps = {
   t: text => text,

package/dist/Dialogs/GenerateRoleplay/GenerateRoleplay.js

@@ -53,6 +53,7 @@ function GenerateRoleplayDialog({
   const [previewMessages, setPreviewMessages] = (0, _react.useState)([]);
   const [values, setValues] = (0, _react.useState)(initialValues);
   const [errorMessage, setErrorMessage] = (0, _react.useState)(null);
+  const [generateQuestions, setGenerateQuestions] = (0, _react.useState)(false);
   const difficultyOptions = difficulties.map((d, idx) => {
     const keyId = `generate-roleplay-difficulty-options-${idx}`;
     return /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
@@ -108,16 +109,43 @@ function GenerateRoleplayDialog({
     }
   }, [generatedRoleplay, generatedRoleplay.script, isGenerateRoleplayDialogOpen]);
   const removeExtraTextFromChatGptResponse = response => {
-    let str = response;
-    str = str.substring(str.indexOf("["));
-    str = str.substring(0, str.indexOf("]") + "]".length);
-    return str;
+    let stack = [];
+    let startIndex = -1;
+    let endIndex = -1;
+    for (let i = 0; i < response.length; i++) {
+      if (response[i] === "[") {
+        if (stack.length === 0) {
+          startIndex = i;
+        }
+        stack.push("[");
+      } else if (response[i] === "]") {
+        stack.pop();
+        if (stack.length === 0) {
+          endIndex = i;
+          break;
+        }
+      }
+    }
+    if (startIndex !== -1 && endIndex !== -1) {
+      return response.substring(startIndex, endIndex + 1);
+    }
+    return "";
   };
+  function fixMissingComma(jsonString) {
+    const fixedJsonString = jsonString.replace(/}\s*{/g, "},{");
+    try {
+      const jsonObject = JSON.parse(fixedJsonString);
+      return jsonObject;
+    } catch (error) {
+      console.error("Invalid JSON after attempting to fix:", error);
+      return null;
+    }
+  }
   const validateScript = script => {
     if (Array.isArray(script) && script.length > 0) {
       for (let index = 0; index < script.length; index++) {
         const scriptLine = script[index];
-        if (!((scriptLine.actor === 1 || scriptLine.actor === 2) && script[0].text)) {
+        if (!((scriptLine.actor === 1 || scriptLine.actor === 2) && script[0].text) && !(scriptLine.question && Array.isArray(scriptLine.answers) && scriptLine.answers.some(answer => answer.correct === true))) {
           return false;
         }
       }
@@ -134,6 +162,7 @@ function GenerateRoleplayDialog({
       setErrorMessage("");
       let response;
       const prompt = usePdfContext ? `Create an informative conversation between 2 people ${values?.actor1?.name && values?.actor2?.name ? `'${values.actor1.name}' and '${values.actor2.name}' ` : ""} about the topic '${values.roleplayTopic}' in the language ${learnLang}.${values.roleplayDifficulty ? ` The conversation should be ${i18nLanguage === "en-US" ? "ACTFL" : "CEFR"} level '${t(values.roleplayDifficulty)}.'` : ""} Return the conversation inside an array, each text in the conversation should be inside an object in the array. Each object should have the keys actor and text. If the text belongs to person 1 then the key actor should equal to 1 else it should equal to 2. The key text should equal to the text in the conversation. Your response should be in JSON.` : `Create a conversation between 2 people ${values?.actor1?.name && values?.actor2?.name ? `'${values.actor1.name}' and '${values.actor2.name}' ` : ""}about the topic '${values.roleplayTopic}' in the language ${learnLang}.${values.roleplayDifficulty ? ` The conversation should be ${i18nLanguage === "en-US" ? "ACTFL" : "CEFR"} level '${t(values.roleplayDifficulty)}.'` : ""} Return the conversation inside an array, each text in the conversation should be inside an object in the array. Each object should have the keys actor and text. If the text belongs to person 1 then the key actor should equal to 1 else it should equal to 2. The key text should equal to the text in the conversation. Your response should be in JSON`;
+      const promptWithQuestions = usePdfContext ? `Create an informative conversation between 2 people ${values?.actor1?.name && values?.actor2?.name ? `'${values.actor1.name}' and '${values.actor2.name}' ` : ""} about the topic '${values.roleplayTopic}' in the language ${learnLang}.${values.roleplayDifficulty ? ` The conversation should be ${i18nLanguage === "en-US" ? "ACTFL" : "CEFR"} level '${t(values.roleplayDifficulty)}.'` : ""} The conversation should be returned inside a single array along with three comprehension questions related to the conversation. Each piece of dialogue and each question should be represented as an object in the array. For dialogue, the objects should have the keys 'actor' and 'text'. The 'actor' key should be set to 1 if the dialogue is spoken by the first actor, and 2 if it is spoken by the second actor. The 'text' key should be set to the dialogue text spoken by that actor. For questions, the objects should have the keys 'question' and 'answers'. The 'question' key should be set to the text of the question being asked. The 'answers' key should be an array of three objects, each representing a different answer to the question where only one is correct and two are incorrect. The objects in the 'answers' array should have the keys 'text', 'correct' and 'type'. The 'text' key should contain the answer text, 'correct' should be true for the correct answer and false for incorrect ones, and 'type' should always be equal to 'multichoice'. The entire output must be in a single JSON array without separating the dialogue and questions into different arrays.` : `Create a conversation between 2 people ${values?.actor1?.name && values?.actor2?.name ? `'${values.actor1.name}' and '${values.actor2.name}' ` : ""}about the topic '${values.roleplayTopic}' in the language ${learnLang}.${values.roleplayDifficulty ? ` The conversation should be ${i18nLanguage === "en-US" ? "ACTFL" : "CEFR"} level '${t(values.roleplayDifficulty)}.'` : ""} The conversation should be returned inside a single array along with three comprehension questions related to the conversation. Each piece of dialogue and each question should be represented as an object in the array. For dialogue, the objects should have the keys 'actor' and 'text'. The 'actor' key should be set to 1 if the dialogue is spoken by the first actor, and 2 if it is spoken by the second actor. The 'text' key should be set to the dialogue text spoken by that actor. For questions, the objects should have the keys 'question' and 'answers'. The 'question' key should be set to the text of the question being asked. The 'answers' key should be an array of three objects, each representing a different answer to the question where only one is correct and two are incorrect. The objects in the 'answers' array should have the keys 'text', 'correct' and 'type'. The 'text' key should contain the answer text, 'correct' should be true for the correct answer and false for incorrect ones, and 'type' should always be equal to 'multichoice'. The entire output must be in a single JSON array without separating the dialogue and questions into different arrays.`;
       const roleplayTemplate = {
         roleplayId: (0, _utils.randomId)(),
         roleplayName: values.roleplayTopic,
@@ -144,10 +173,11 @@ function GenerateRoleplayDialog({
         learnLang: learnLang
       };
       const voices = getAllVoices();
+      const activePrompt = generateQuestions ? promptWithQuestions : prompt;
       if (usePdfContext) {
         const getAiQueryResponse = await makeCandooAIQuery({
           modelName: "gpt-4",
-          customString: prompt,
+          customString: activePrompt,
           createdBy: currentUser.Username,
           email: currentUser.UserAttributes.email,
           source: "nualang",
@@ -166,12 +196,12 @@ function GenerateRoleplayDialog({
       } else {
         const chatGptResponse = await makeChatGptApiRequest({
           model: "gpt-3.5-turbo",
-          prompt
+          prompt: activePrompt
         });
         response = chatGptResponse;
       }
       const jsonResponse = removeExtraTextFromChatGptResponse(response);
-      const roleplayScript = JSON.parse(jsonResponse);
+      const roleplayScript = fixMissingComma(jsonResponse);
       if (validateScript(roleplayScript)) {
         const generatedRoleplay = {
           ...roleplayTemplate,
@@ -327,7 +357,16 @@ function GenerateRoleplayDialog({
     margin: "normal",
     variant: "outlined",
     fullWidth: true
-  }, roleplayLengthOptions)), process.env.REACT_APP_STAGE === "dev" && !isRoleplayGenerating && pdfDetails && pdfVectorStoreCreationStatus === "CREATION_COMPLETE" && /*#__PURE__*/_react.default.createElement(_material.Grid, {
+  }, roleplayLengthOptions)), !isRoleplayGenerating && /*#__PURE__*/_react.default.createElement(_material.FormGroup, null, /*#__PURE__*/_react.default.createElement(_material.Grid, {
+    item: true,
+    xs: 12
+  }, /*#__PURE__*/_react.default.createElement(_material.FormControlLabel, {
+    control: /*#__PURE__*/_react.default.createElement(_material.Checkbox, {
+      checked: generateQuestions,
+      onChange: e => setGenerateQuestions(e.target.checked)
+    }),
+    label: "Generate Questions"
+  }))), process.env.REACT_APP_STAGE === "dev" && !isRoleplayGenerating && pdfDetails && pdfVectorStoreCreationStatus === "CREATION_COMPLETE" && /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     xs: 12
   }, /*#__PURE__*/_react.default.createElement(_material.Typography, null, /*#__PURE__*/_react.default.createElement(_material.Box, {

package/dist/Dialogs/InviteDialog/InviteDialog.js

@@ -17,7 +17,11 @@ var _googleClassroom = _interopRequireDefault(require("../../img/google-classroo
 var _nualangLogoPrimary = _interopRequireDefault(require("../../img/nualang-logo-primary.svg"));
 var _Image = _interopRequireDefault(require("@mui/icons-material/Image"));
 var _ResponsiveDialog = _interopRequireDefault(require("../ResponsiveDialog"));
+var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
+var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
 var _ArrowBack = _interopRequireDefault(require("@mui/icons-material/ArrowBack"));
+var _QrCode = _interopRequireDefault(require("@mui/icons-material/QrCode"));
+var _qrcode = _interopRequireDefault(require("qrcode.react"));
 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; }
@@ -72,6 +76,7 @@ function InviteDialog({
   const [inviteLinkState, setInviteLinkState] = (0, _react.useState)(inviteLink);
   const [classroomEnrolmentKey, setClassroomEnrolmentKey] = (0, _react.useState)(inviteType === "classroom" ? enrolmentKey : null);
   const [teachClassroomsState, setTeachClassroomsState] = (0, _react.useState)(teachClassrooms);
+  const [showQRCode, setShowQRCode] = (0, _react.useState)(false);
   const shareEventParams = {
     method: null,
     content_type: inviteTypeState,
@@ -157,6 +162,9 @@ function InviteDialog({
   const handleChangeTab = (event, newValue) => {
     setTabValue(newValue);
   };
+  const toggleQRCodeDisplay = () => {
+    setShowQRCode(!showQRCode);
+  };
   const tabs = [{
     label: t("classrooms")
   }, {
@@ -300,6 +308,18 @@ function InviteDialog({
       borderRadius: "20px"
     }
   }, /*#__PURE__*/_react.default.createElement(_material.List, null, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, t("or_invite_via")), /*#__PURE__*/_react.default.createElement(_material.ListItem, {
+    button: true,
+    disableGutters: true,
+    onClick: toggleQRCodeDisplay
+  }, /*#__PURE__*/_react.default.createElement(_material.ListItemAvatar, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
+    variant: "rounded"
+  }, /*#__PURE__*/_react.default.createElement(_QrCode.default, {
+    sx: {
+      fontSize: "xx-large"
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
+    primary: "QR Code"
+  })), /*#__PURE__*/_react.default.createElement(_material.ListItem, {
     button: true,
     disableGutters: true,
     onClick: () => openWindow(`mailto:?subject=${t("invite_email_subject")} ${inviteTypeState.toLowerCase()}&body=${studentInstructionsEmailBody()}`)
@@ -347,7 +367,28 @@ function InviteDialog({
     fill: "#fff"
   }))), /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
     primary: "Twitter"
-  }))))) : /*#__PURE__*/_react.default.createElement(_material.List, null, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, t("select_a_classroom")), teachClassroomsState.map((c, i) => {
+  })), /*#__PURE__*/_react.default.createElement(_ResponsiveDialog.default, {
+    open: showQRCode,
+    handleClose: toggleQRCodeDisplay,
+    maxWidth: "md",
+    fullWidth: true,
+    sx: {
+      "& .MuiDialog-paper": {
+        width: "50%",
+        maxHeight: "80%"
+      }
+    }
+  }, /*#__PURE__*/_react.default.createElement(_DialogTitle.default, null, "QR Code", " "), /*#__PURE__*/_react.default.createElement(_DialogContent.default, {
+    dividers: true
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    height: "100%"
+  }, /*#__PURE__*/_react.default.createElement(_qrcode.default, {
+    value: inviteLinkState,
+    size: 384
+  }))))))) : /*#__PURE__*/_react.default.createElement(_material.List, null, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, t("select_a_classroom")), teachClassroomsState.map((c, i) => {
     const {
       classroomId,
       classroomName,
@@ -445,6 +486,18 @@ function InviteDialog({
       borderRadius: "20px"
     }
   }, /*#__PURE__*/_react.default.createElement(_material.List, null, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, t("or_invite_via")), /*#__PURE__*/_react.default.createElement(_material.ListItem, {
+    button: true,
+    disableGutters: true,
+    onClick: toggleQRCodeDisplay
+  }, /*#__PURE__*/_react.default.createElement(_material.ListItemAvatar, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
+    variant: "rounded"
+  }, /*#__PURE__*/_react.default.createElement(_QrCode.default, {
+    sx: {
+      fontSize: "xx-large"
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
+    primary: "QR Code"
+  })), /*#__PURE__*/_react.default.createElement(_material.ListItem, {
     button: true,
     disableGutters: true,
     onClick: () => openWindow(`mailto:?subject=${t("invite_email_subject")} ${inviteTypeState.toLowerCase()}&body=${studentInstructionsEmailBody()}`)
@@ -492,7 +545,28 @@ function InviteDialog({
     fill: "#fff"
   }))), /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
     primary: "Twitter"
-  }))))) : null));
+  })), /*#__PURE__*/_react.default.createElement(_ResponsiveDialog.default, {
+    open: showQRCode,
+    handleClose: toggleQRCodeDisplay,
+    maxWidth: "md",
+    fullWidth: true,
+    sx: {
+      "& .MuiDialog-paper": {
+        width: "50%",
+        maxHeight: "80%"
+      }
+    }
+  }, /*#__PURE__*/_react.default.createElement(_DialogTitle.default, null, "QR Code", " "), /*#__PURE__*/_react.default.createElement(_DialogContent.default, {
+    dividers: true
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    height: "100%"
+  }, /*#__PURE__*/_react.default.createElement(_qrcode.default, {
+    value: inviteLinkState,
+    size: 384
+  }))))))) : null));
 }
 InviteDialog.defaultProps = {
   t: text => text,

package/dist/Dialogs/VideoViewer/VideoViewer.js

@@ -30,6 +30,9 @@ function VideoViewer({
     if (open) {
       setPlaying(true);
     }
+    if (!open) {
+      setPlaying(false);
+    }
   }, [open]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ResponsiveDialog.default, {
     open: open,

package/dist/Editors/Roleplay/Roleplay.js

@@ -723,7 +723,13 @@ function Roleplay({
     open: isCreateQuestionOpen,
     handleClose: handleCloseCreateQuestion,
     handleTranslate: handleTranslate,
-    onSubmit: handleAddQuestion
+    onSubmit: handleAddQuestion,
+    script: roleplay.script,
+    makeChatGptApiRequest: makeChatGptApiRequest,
+    values: {
+      actor1: roleplay.actor1,
+      actor2: roleplay.actor2
+    }
   }), isUpdatingQuestion.status && /*#__PURE__*/_react.default.createElement(_CreateQuestion.default, {
     t: t,
     learnLang: learnLang,

package/dist/Live/Game/Game.js

@@ -251,6 +251,7 @@ function Game({
     }
   };
   const nextScriptLine = roleplayMessages?.length && selectedRoleplay?.script?.[roleplayMessages.length] ? selectedRoleplay.script[roleplayMessages.length] : "";
+  const videoUrl = topicInfo.videoUrl ?? null;
   return /*#__PURE__*/_react.default.createElement(_material.Dialog, {
     fullScreen: true,
     open: open,
@@ -381,7 +382,8 @@ function Game({
     userImage: userImage,
     exerciseName: exerciseName,
     isLiveGameTutorialOpen: isLiveGameTutorialOpen,
-    setIsLiveGameTutorialOpen: setIsLiveGameTutorialOpen
+    setIsLiveGameTutorialOpen: setIsLiveGameTutorialOpen,
+    videoUrl: videoUrl
   }, otherProps)), gameView === GameViewTypes.GameStarting && /*#__PURE__*/_react.default.createElement(_material.Typography, {
     variant: "h1",
     component: "h2",

package/dist/Live/HowToJoin/HowToJoin.js

@@ -4,15 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = HowToJoin;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _material = require("@mui/material");
 var _ChevronLeft = _interopRequireDefault(require("@mui/icons-material/ChevronLeft"));
 var _ChevronRight = _interopRequireDefault(require("@mui/icons-material/ChevronRight"));
 var _SwipeableDrawer = _interopRequireDefault(require("@mui/material/SwipeableDrawer"));
-var _Divider = _interopRequireDefault(require("@mui/material/Divider"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _styles = require("@mui/material/styles");
+var _qrcode = _interopRequireDefault(require("qrcode.react"));
 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 HowToJoin({
   t,
   classroomName,
@@ -21,6 +22,10 @@ function HowToJoin({
   handleClose
 }) {
   const theme = (0, _styles.useTheme)();
+  const [showQRCode, setShowQRCode] = (0, _react.useState)(false);
+  const toggleQRCode = () => {
+    setShowQRCode(!showQRCode);
+  };
   return /*#__PURE__*/_react.default.createElement(_SwipeableDrawer.default, {
     open: isOpen,
     anchor: "right",
@@ -57,11 +62,19 @@ function HowToJoin({
     primary: /*#__PURE__*/_react.default.createElement(_material.Typography, {
       component: "span",
       variant: "body1"
-    }, "Open the classroom", " ", /*#__PURE__*/_react.default.createElement("a", {
+    }, "Open the classroom", " ", /*#__PURE__*/_react.default.createElement(_material.Link, {
       href: classroomURL,
       target: "_blank",
       rel: "noreferrer"
-    }, classroomName))
+    }, classroomName), " ", "or scan its QR Code below", " ")
+  })), /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      pl: 2.5,
+      py: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_qrcode.default, {
+    value: classroomURL,
+    size: 256
   })), /*#__PURE__*/_react.default.createElement(_material.ListItem, null, /*#__PURE__*/_react.default.createElement(_material.ListItemText, {
     primary: /*#__PURE__*/_react.default.createElement(_material.Typography, {
       component: "span",
@@ -74,7 +87,7 @@ function HowToJoin({
     }, "Get ready to play.")
   })))), /*#__PURE__*/_react.default.createElement(_material.Box, {
     flexGrow: 1
-  }), /*#__PURE__*/_react.default.createElement(_Divider.default, null), /*#__PURE__*/_react.default.createElement(_material.Box, {
+  }), /*#__PURE__*/_react.default.createElement(_material.Divider, null), /*#__PURE__*/_react.default.createElement(_material.Box, {
     sx: theme => ({
       display: "flex",
       alignItems: "center",
@@ -82,7 +95,7 @@ function HowToJoin({
       padding: "0 8px",
       ...theme.mixins.toolbar
     })
-  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+  }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
     onClick: handleClose
   }, theme.direction === "ltr" ? /*#__PURE__*/_react.default.createElement(_ChevronRight.default, null) : /*#__PURE__*/_react.default.createElement(_ChevronLeft.default, null))));
 }

package/dist/Live/HowToJoin/HowToJoin.stories.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.props = exports.default = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _HowToJoin = _interopRequireDefault(require("./HowToJoin"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Template = args => /*#__PURE__*/_react.default.createElement(_HowToJoin.default, args);
+const props = exports.props = {
+  t: t => t,
+  classroomName: "Classroom Name",
+  classroomURL: "https://example.com/classroom",
+  isOpen: true,
+  handleClose: () => {}
+};
+const story = {
+  title: "Live/HowToJoin",
+  excludeStories: ["props"],
+  component: _HowToJoin.default
+};
+var _default = exports.default = story;
+const Default = exports.Default = Template.bind({});
+Default.args = {
+  ...props
+};
+Default.storyName = "default";

package/dist/Live/WaitingRoom/WaitingRoom.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = WaitingRoom;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _material = require("@mui/material");
 var _index = _interopRequireDefault(require("../../utils/placeholder-images/index"));
 var _styles = require("@mui/material/styles");
@@ -19,7 +19,11 @@ var _AutoStories = _interopRequireDefault(require("@mui/icons-material/AutoStori
 var _MedalSelector = _interopRequireDefault(require("../../Misc/MedalSelector/MedalSelector"));
 var _LiveGameTutorial = _interopRequireDefault(require("../../Dialogs/LiveGameTutorial/LiveGameTutorial"));
 var _reactHookForm = require("react-hook-form");
+var _OndemandVideo = _interopRequireDefault(require("@mui/icons-material/OndemandVideo"));
+var _VideoViewer = _interopRequireDefault(require("../../Dialogs/VideoViewer/VideoViewer"));
 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 WaitingRoom({
   topicImage,
   t,
@@ -37,11 +41,16 @@ function WaitingRoom({
   handleOpenMembersDrawer,
   exercise,
   selectedRoleplay,
-  gameAward
+  gameAward,
+  videoUrl
 }) {
   const theme = (0, _styles.useTheme)();
   const isLgScreen = (0, _useMediaQuery.default)(theme.breakpoints.up("md"));
-  return /*#__PURE__*/_react.default.createElement(_material.Box, {
+  const [isViewVideoOpen, setIsViewVideoOpen] = (0, _react.useState)(false);
+  const handleOpenViewVideo = () => {
+    setIsViewVideoOpen(true);
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
     sx: {
       margin: 2,
       width: isLgScreen ? "100%" : "auto",
@@ -138,7 +147,15 @@ function WaitingRoom({
       component: "p",
       color: "textSecondary"
     }, t(exerciseDescription)))
-  }))), isCreator && /*#__PURE__*/_react.default.createElement(_material.Grid, {
+  })), isCreator && videoUrl && /*#__PURE__*/_react.default.createElement(_material.Button, {
+    variant: "contained",
+    color: "primary",
+    startIcon: /*#__PURE__*/_react.default.createElement(_OndemandVideo.default, null),
+    onClick: handleOpenViewVideo,
+    sx: {
+      alignSelf: "flex-start"
+    }
+  }, t("play_video"))), isCreator && /*#__PURE__*/_react.default.createElement(_material.Grid, {
     item: true,
     lg: 2,
     md: 2,
@@ -337,5 +354,11 @@ function WaitingRoom({
     sx: {
       fontWeight: "bold"
     }
-  }, username)))));
+  }, username))))), /*#__PURE__*/_react.default.createElement(_VideoViewer.default, {
+    t: t,
+    title: topicName,
+    s3Url: videoUrl,
+    open: isViewVideoOpen,
+    handleClose: () => setIsViewVideoOpen(false)
+  }));
 }

package/dist/Misc/ShareButton/ShareDrawer.js

@@ -13,6 +13,7 @@ var _reactFeather = require("react-feather");
 var _reactCopyToClipboard = require("react-copy-to-clipboard");
 var _googleClassroom = _interopRequireDefault(require("../../img/google-classroom.svg"));
 var _UpgradeSubscription = _interopRequireDefault(require("../../Dialogs/UpgradeSubscription/UpgradeSubscription"));
+var _KeyboardArrowDown = _interopRequireDefault(require("@mui/icons-material/KeyboardArrowDown"));
 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; }
@@ -130,7 +131,18 @@ function ShareDrawer({
     subheader: /*#__PURE__*/_react.default.createElement(_material.ListSubheader, {
       component: "div"
     }, t("share_via"))
-  }, /*#__PURE__*/_react.default.createElement(_material.ListItem, {
+  }, /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
+    title: t("close_drawer"),
+    placement: "bottom"
+  }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+    onClick: handleClose,
+    sx: {
+      position: 'absolute',
+      top: 6,
+      right: 10,
+      zIndex: 1
+    }
+  }, /*#__PURE__*/_react.default.createElement(_KeyboardArrowDown.default, null))), /*#__PURE__*/_react.default.createElement(_material.ListItem, {
     button: true,
     onClick: () => openWindow(facebookLink)
   }, /*#__PURE__*/_react.default.createElement(_material.ListItemAvatar, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {

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

@@ -20,8 +20,7 @@ var _ResponsiveTabs = _interopRequireDefault(require("../../../Navigation/Respon
 var _Timeline = _interopRequireDefault(require("@mui/icons-material/Timeline"));
 var _Courses = _interopRequireDefault(require("../../../Lists/Courses"));
 var _Members = _interopRequireDefault(require("../../../Lists/Members"));
-var _Reviews = _interopRequireDefault(require("../../../Lists/Reviews"));
-var _Reviews2 = _interopRequireDefault(require("../../../Dialogs/Reviews"));
+var _Reviews = _interopRequireDefault(require("../../../Dialogs/Reviews"));
 var _Members2 = _interopRequireDefault(require("../../../Dialogs/Members"));
 var _InviteDialog = _interopRequireDefault(require("../../../Dialogs/InviteDialog"));
 var _ShareDrawer = _interopRequireDefault(require("../../../Misc/ShareButton/ShareDrawer"));
@@ -139,7 +138,6 @@ function OverflowMenu({
   anchorEl,
   handleClose,
   handleClickOpenReviews,
-  handleClickOpenMembers,
   isCreator,
   isMember,
   handleOpenCoursesModal,
@@ -183,9 +181,7 @@ function OverflowMenu({
     "data-cy": "share-classroom"
   }, t("share")), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: handleClickOpenReviews
-  }, t("reviews")), isCreator && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
-    onClick: handleClickOpenMembers
-  }, t("members")), !isCreator && !isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+  }, t("reviews")), !isCreator && !isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: joinClassroom
   }, t("join_classroom")), !isCreator && isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: leaveClassroom
@@ -542,8 +538,6 @@ function Classroom({
         label: t("progress")
       }, {
         label: t("members")
-      }, {
-        label: t("reviews")
       }, {
         label: t("settings"),
         disabled: true
@@ -561,12 +555,6 @@ function Classroom({
     }, /*#__PURE__*/_react.default.createElement(_Members.default, {
       t: t,
       members: null
-    })), /*#__PURE__*/_react.default.createElement(_material.Box, {
-      py: 1
-    }, /*#__PURE__*/_react.default.createElement(_Reviews.default, {
-      t: t,
-      reviews: null,
-      disabled: true
     }))));
   }
   const {
@@ -794,27 +782,7 @@ function Classroom({
       isCreator: isCreator,
       handleDeleteClassroomMember: handleDeleteClassroomMember
     })))
-  }] : []), {
-    label: `${t("reviews")} (${reviews.length})`,
-    disabled: !(isMember || isCreator) || reviewsEnabled === "disabled",
-    id: "Reviews",
-    TabContent: /*#__PURE__*/_react.default.createElement(_material.Box, {
-      py: 1,
-      key: `tab-content-reviews`
-    }, /*#__PURE__*/_react.default.createElement(_Reviews.default, {
-      t: t,
-      reviews: Array.isArray(newReviewsList) && newReviewsList.length ? newReviewsList : [],
-      disableSubheader: true,
-      hasReviewed: hasReviewed,
-      handleCreateReview: handleCreateReview,
-      handleDeleteReview: handleDeleteReview,
-      updateReview: updateReview,
-      isCreator: isCreator,
-      subscription: subscription,
-      placeholderImageUrl: reviewPlaceholderImageUrl,
-      mainSiteUrl: mainSiteUrl
-    }))
-  }, ...(isCreator ? [{
+  }] : []), ...(isCreator ? [{
     label: t("settings"),
     id: "Settings",
     disabled: !isCreator,
@@ -1087,7 +1055,7 @@ function Classroom({
     handleClose: handleCloseUpgradeSubcriptionModal,
     onConfirm: handleSubscriptionPage,
     subscription: subscription
-  }), /*#__PURE__*/_react.default.createElement(_Reviews2.default, {
+  }), /*#__PURE__*/_react.default.createElement(_Reviews.default, {
     t: t,
     dialogTitle: classroomName,
     open: isReviewsOpen,

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

@@ -18,8 +18,7 @@ var _OndemandVideo = _interopRequireDefault(require("@mui/icons-material/Ondeman
 var _Timeline = _interopRequireDefault(require("@mui/icons-material/Timeline"));
 var _ResponsiveTabs = _interopRequireDefault(require("../../../Navigation/ResponsiveTabs"));
 var _Members = _interopRequireDefault(require("../../../Lists/Members"));
-var _Reviews = _interopRequireDefault(require("../../../Lists/Reviews"));
-var _Reviews2 = _interopRequireDefault(require("../../../Dialogs/Reviews"));
+var _Reviews = _interopRequireDefault(require("../../../Dialogs/Reviews"));
 var _Members2 = _interopRequireDefault(require("../../../Dialogs/Members"));
 var _ResponsiveDialog = _interopRequireDefault(require("../../../Dialogs/ResponsiveDialog"));
 var _CreateSection = _interopRequireDefault(require("../../../Dialogs/CreateSection"));
@@ -108,7 +107,6 @@ function OverflowMenu({
   anchorEl,
   handleClose,
   handleClickOpenReviews,
-  handleClickOpenMembers,
   handleClickOpenCreateSection,
   handleOpenAddToClassroom,
   isCreator,
@@ -161,9 +159,7 @@ function OverflowMenu({
     "data-cy": "share-course"
   }, t("share")), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: handleClickOpenReviews
-  }, t("reviews")), isCreator && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
-    onClick: handleClickOpenMembers
-  }, t("members")), !isCreator && !isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+  }, t("reviews")), !isCreator && !isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: joinCourse
   }, t("join_course")), !isCreator && isMember && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: leaveCourse
@@ -431,9 +427,6 @@ function Course({
   }, {
     label: t("members"),
     id: "Members"
-  }, {
-    label: t("reviews"),
-    id: "Reviews"
   }];
   if (!course) {
     let initialTabValue;
@@ -516,12 +509,6 @@ function Course({
       py: 1
     }, /*#__PURE__*/_react.default.createElement(_Members.default, {
       t: t
-    })), /*#__PURE__*/_react.default.createElement(_material.Box, {
-      py: 1
-    }, /*#__PURE__*/_react.default.createElement(_Reviews.default, {
-      t: t,
-      key: "listrev",
-      disabled: true
     }))));
   }
   const {
@@ -672,27 +659,7 @@ function Course({
       isCourseMember: true,
       sections: sections
     })))
-  }] : []), {
-    label: `${t("reviews")} (${reviews.length})`,
-    disabled: !(isMember || isCreator) || reviewsEnabled === "disabled",
-    id: "Reviews",
-    TabContent: /*#__PURE__*/_react.default.createElement(_material.Box, {
-      py: 1,
-      key: `tab-content-reviews`
-    }, /*#__PURE__*/_react.default.createElement(_Reviews.default, {
-      t: t,
-      reviews: Array.isArray(newReviewsList) && newReviewsList.length ? newReviewsList : [],
-      disableSubheader: true,
-      hasReviewed: hasReviewed,
-      updateReview: updateReview,
-      handleCreateReview: handleCreateReview,
-      handleDeleteReview: handleDeleteReview,
-      isCreator: isCreator,
-      subscription: subscription,
-      placeholderImageUrl: reviewPlaceholderImageUrl,
-      mainSiteUrl: mainSiteUrl
-    }))
-  }, ...(isCreator ? [{
+  }] : []), ...(isCreator ? [{
     label: t("settings"),
     disabled: isCreator ? false : true,
     id: "Settings",
@@ -915,7 +882,7 @@ function Course({
     handleClose: handleCloseUpgradeSubcriptionModal,
     onConfirm: handleSubscriptionPage,
     subscription: subscription
-  }), /*#__PURE__*/_react.default.createElement(_Reviews2.default, {
+  }), /*#__PURE__*/_react.default.createElement(_Reviews.default, {
     t: t,
     dialogTitle: courseName,
     open: isReviewsOpen,

package/dist/Screens/Pricing/Pricing.js

@@ -109,16 +109,17 @@ function Pricing({
     align: "center",
     color: "textPrimary"
   }, t("pricing_page_title")), /*#__PURE__*/_react.default.createElement(_Typography.default, {
-    sx: () => ({
+    sx: theme => ({
       fontWeight: "normal",
       fontSize: "20px",
-      lineHeight: "32px"
+      lineHeight: "32px",
+      marginBottom: theme.spacing(4)
     }),
     variant: "h1",
     component: "h1",
     align: "center",
     color: "textSecondary"
-  }, t("pricing_page_subtitle")), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+  }, t("pricing_page_subtitle")), currencies && currencies.length > 1 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
     component: "div",
     sx: theme => ({
       marginTop: theme.spacing(),
@@ -194,19 +195,25 @@ Pricing.defaultProps = {
   t: text => text,
   plans: [],
   initialCurrency: "eur",
-  currencies: [{
-    value: "usd",
-    label: "$ USD"
-  }, {
-    value: "eur",
-    label: "€ EUR"
-  }, {
-    value: "gbp",
-    label: "£ GBP"
-  }, {
-    value: "cad",
-    label: "$ CAD"
-  }],
+  // disable currency selection
+  // currencies: [
+  //   {
+  //     value: "usd",
+  //     label: "$ USD",
+  //   },
+  //   {
+  //     value: "eur",
+  //     label: "€ EUR",
+  //   },
+  //   {
+  //     value: "gbp",
+  //     label: "£ GBP",
+  //   },
+  //   {
+  //     value: "cad",
+  //     label: "$ CAD",
+  //   },
+  // ],
   freeTrial: {
     isAvailable: false,
     title: "Try for Free for 30 days",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1130",
+  "version": "0.1.1132",
   "main": "dist/index.js",
   "files": [
     "dist",
@@ -51,6 +51,7 @@
     "n2words": "^1.19.1",
     "pixabay-api": "^1.0.4",
     "pre-commit": "^1.2.2",
+    "qrcode.react": "^3.1.0",
     "rdndmb-html5-to-touch": "^8.0.0",
     "react-beautiful-dnd": "^13.1.1",
     "react-chartjs-2": "^5.2.0",