mario-education 2.4.511-feedback → 2.4.511-release

package/dist/index.js

@@ -27,7 +27,7 @@ var SearchIcon = _interopDefault(require('@material-ui/icons/Search'));
 var Tabs = _interopDefault(require('@material-ui/core/Tabs'));
 var Tab = _interopDefault(require('@material-ui/core/Tab'));
 var Box = _interopDefault(require('@material-ui/core/Box'));
-var styles$e = require('@material-ui/core/styles');
+var styles$f = require('@material-ui/core/styles');
 var core$2 = require('@dnd-kit/core');
 var sortable = require('@dnd-kit/sortable');
 var toDate = _interopDefault(require('date-fns/toDate'));
@@ -43,7 +43,7 @@ var ArrowForwardIcon = _interopDefault(require('@material-ui/icons/ArrowForward'
 var ArrowUpwardIcon = _interopDefault(require('@material-ui/icons/ArrowUpward'));
 var ArrowDownwardIcon = _interopDefault(require('@material-ui/icons/ArrowDownward'));
 var reactDom = require('react-dom');
-var ArrowBackIcon = _interopDefault(require('@material-ui/icons/ArrowBack'));
+var ArrowBackIcon$1 = _interopDefault(require('@material-ui/icons/ArrowBack'));
 var VisibilityIcon = _interopDefault(require('@material-ui/icons/Visibility'));
 var StarBorderIcon = _interopDefault(require('@material-ui/icons/StarBorder'));
 var StarIcon = _interopDefault(require('@material-ui/icons/Star'));
@@ -87,6 +87,8 @@ var IconButton = _interopDefault(require('@material-ui/core/IconButton'));
 var MenuIcon = _interopDefault(require('@material-ui/icons/Menu'));
 var NotificationsIcon = _interopDefault(require('@material-ui/icons/Notifications'));
 var HelpOutlineIcon = _interopDefault(require('@material-ui/icons/HelpOutline'));
+var generativeAi = require('@google/generative-ai');
+var Markdown = _interopDefault(require('react-markdown'));
 var AddIcon = _interopDefault(require('@material-ui/icons/Add'));
 var MoreVertIcon = _interopDefault(require('@material-ui/icons/MoreVert'));
 
@@ -20856,7 +20858,7 @@ var CustomTabs = function CustomTabs(props) {
     history.push(path);
   };
 
-  var useStyles = styles$e.makeStyles(function (theme) {
+  var useStyles = styles$f.makeStyles(function (theme) {
     return {
       title: {
         fontWeight: 700,
@@ -50469,7 +50471,7 @@ var CustomHeaderComponent = function CustomHeaderComponent(_ref) {
     className: styles["custom-header"] + " " + styles[classFontSize] + " " + (!!isGreyBackground && styles["grey-background"]) + " " + (!!borderNone && styles["border-none"])
   }, React__default.createElement(core$1.Grid, {
     className: "" + styles["custom-header-right"]
-  }, !!isGoback && React__default.createElement(ArrowBackIcon, {
+  }, !!isGoback && React__default.createElement(ArrowBackIcon$1, {
     className: "custom-icon-back-page",
     onClick: function onClick() {
       return !!onHandleGoBack ? onHandleGoBack() : history.goBack();
@@ -51281,7 +51283,7 @@ var useFontStyles = function useFontStyles() {
   }, [defaultFont]);
   var useStyles = React.useMemo(function () {
     if (defaultFont === LARGE_FONT_DEFAULT) {
-      return styles$e.makeStyles({
+      return styles$f.makeStyles({
         fontCustom: {
           fontSize: defaultFont + "px"
         },
@@ -51292,7 +51294,7 @@ var useFontStyles = function useFontStyles() {
       });
     }
 
-    return styles$e.makeStyles({
+    return styles$f.makeStyles({
       fontCustom: {
         fontSize: defaultFont + "px"
       },
@@ -51303,7 +51305,7 @@ var useFontStyles = function useFontStyles() {
   }, [defaultFont]);
   var useSmallStyles = React.useMemo(function () {
     if (defaultFont === LARGE_FONT_DEFAULT) {
-      return styles$e.makeStyles({
+      return styles$f.makeStyles({
         fontCustom: {
           fontSize: "16px"
         }
@@ -51311,14 +51313,14 @@ var useFontStyles = function useFontStyles() {
     }
 
     if (defaultFont === SMALL_FONT_DEFAULT) {
-      return styles$e.makeStyles({
+      return styles$f.makeStyles({
         fontCustom: {
           fontSize: "10px"
         }
       });
     }
 
-    return styles$e.makeStyles({
+    return styles$f.makeStyles({
       fontCustom: {
         fontSize: "inherit"
       }
@@ -51820,7 +51822,7 @@ var CustomButton = function CustomButton(_ref) {
       _ref$fontSize = _ref.fontSize,
       fontSize = _ref$fontSize === void 0 ? "inherit" : _ref$fontSize,
       icon = _ref.icon;
-  var ColorButton = styles$e.withStyles(function () {
+  var ColorButton = styles$f.withStyles(function () {
     return {
       root: {
         backgroundColor: backgroundColor != null ? backgroundColor : BACKGROUND_DEFAULT,
@@ -54670,7 +54672,7 @@ var SurveyDetailAdmin = function SurveyDetailAdmin() {
     className: styles$6['header-survey-detail-container']
   }, React__default.createElement(core$1.Grid, {
     className: "" + styles$6["header-survey-detail"]
-  }, React__default.createElement(ArrowBackIcon, {
+  }, React__default.createElement(ArrowBackIcon$1, {
     className: "" + styles$6["icon-back-page"],
     onClick: function onClick() {
       return onHandleGoBack();
@@ -54899,7 +54901,7 @@ var SurveyDetailAdmin = function SurveyDetailAdmin() {
   })));
 };
 
-var useStyles$5 = styles$e.makeStyles(function (theme) {
+var useStyles$5 = styles$f.makeStyles(function (theme) {
   var _tabLabel;
 
   return {
@@ -54954,8 +54956,8 @@ var useStyles$5 = styles$e.makeStyles(function (theme) {
     }
   };
 });
-var useStyleModelCreate = styles$e.makeStyles(function (theme) {
-  return styles$e.createStyles({
+var useStyleModelCreate = styles$f.makeStyles(function (theme) {
+  return styles$f.createStyles({
     root: {
       width: "100%"
     },
@@ -54974,7 +54976,7 @@ var useStyleModelCreate = styles$e.makeStyles(function (theme) {
     }
   });
 });
-var useStylesDataGrid = styles$e.makeStyles(function () {
+var useStylesDataGrid = styles$f.makeStyles(function () {
   return {
     root: {
       borderBottom: "none",
@@ -55466,7 +55468,7 @@ var ChipButton = function ChipButton(_ref) {
   var color = _ref.color,
       label = _ref.label,
       backgroundColor = _ref.backgroundColor;
-  var StyleChip = styles$e.withStyles({
+  var StyleChip = styles$f.withStyles({
     root: {
       backgroundColor: !!backgroundColor ? backgroundColor : BACKGROUND_COLOR,
       color: color,
@@ -55622,7 +55624,7 @@ var SliderSurveyComponent = function SliderSurveyComponent(_ref) {
     cursor: "default"
   } : {};
   var result = Math.abs(val - (averageOtherRatings || 0));
-  var PrettoSlider = styles$e.withStyles({
+  var PrettoSlider = styles$f.withStyles({
     root: (_root = {
       color: "#EFEFEF",
       height: 8,
@@ -55878,7 +55880,7 @@ var EmotionComponent = function EmotionComponent(_ref) {
   }));
 };
 
-var CustomRadio = styles$e.withStyles({
+var CustomRadio = styles$f.withStyles({
   root: {
     "&$checked": {
       color: "orange"
@@ -64521,7 +64523,7 @@ var _valueLabelFormat$1 = function valueLabelFormat(avatar) {
   });
 };
 
-var PrettoSlider = styles$e.withStyles({
+var PrettoSlider = styles$f.withStyles({
   root: (_root = {
     color: "#EFEFEF",
     height: 8,
@@ -68678,7 +68680,7 @@ var ModelSelectQuestion = function ModelSelectQuestion(_ref) {
     id: "simple-dialog-question"
   }, React__default.createElement(core$1.Grid, {
     className: "" + styles$6["box-header-select"]
-  }, React__default.createElement(ArrowBackIcon, {
+  }, React__default.createElement(ArrowBackIcon$1, {
     className: "" + styles$6["header-select-icon"],
     onClick: function onClick() {
       return handleClose();
@@ -74736,7 +74738,7 @@ var NotificationAlert = function NotificationAlert(_ref) {
   }, React__default.createElement(icons.Close, null))));
 };
 
-var useStyles$j = styles$e.makeStyles(function () {
+var useStyles$j = styles$f.makeStyles(function () {
   return {
     animate: {
       left: function left(_ref2) {
@@ -75219,6 +75221,11 @@ var useHeaderSideBar = function useHeaderSideBar(_navigations) {
       setScreenWidth = _useState2[1];
 
   var params = new URLSearchParams(location.search);
+  var isEnableMarioAi = reactRedux.useSelector(function (state) {
+    var _state$common5;
+
+    return (_state$common5 = state.common) === null || _state$common5 === void 0 ? void 0 : _state$common5.isEnableMarioAi;
+  });
   var isReadOnly = params.get("isReadOnly");
 
   var _useNotificationAlert = useNotificationAlert(),
@@ -75341,6 +75348,7 @@ var useHeaderSideBar = function useHeaderSideBar(_navigations) {
           dispatch(marioCore.setEnableIEP(res.data.isEnableIEP));
           dispatch(marioCore.setConversationOneToOne(res.data.isConversationOneToOne));
           dispatch(marioCore.setEnableSurvey(res.data.isEnableSurvey));
+          dispatch(marioCore.setEnableMarioAi(res.data.isEnableMarioAi));
         });
       }, function (err) {
         console.error(err);
@@ -75448,6 +75456,11 @@ var useHeaderSideBar = function useHeaderSideBar(_navigations) {
   }, {
     name: "External Api",
     icon: React__default.createElement(TokenIcon, null)
+  }, {
+    name: "MarioAI",
+    icon: React__default.createElement("img", {
+      src: "/images/mario-ai.png"
+    })
   }];
   var renderNotificationBadge = React.useCallback(function () {
     if (!unreadNoti) return React__default.createElement(NotificationsIcon, {
@@ -75590,10 +75603,11 @@ var useHeaderSideBar = function useHeaderSideBar(_navigations) {
     handleClose: handleClose,
     renderNavigationItem: renderNavigationItem,
     goToSettings: goToSettings,
-    t: t
+    t: t,
+    isEnableMarioAi: isEnableMarioAi
   };
 };
-var useStyles$k = styles$e.makeStyles(function (theme) {
+var useStyles$k = styles$f.makeStyles(function (theme) {
   var _overlay, _menuButton, _title, _listItem, _drawer, _textPrivacy, _subMenuDrawer, _subDrawerItem, _drawerItem, _drawerContent, _drawerPaper, _drawerPaperMobile, _content;
 
   return {
@@ -75849,7 +75863,7 @@ var TimesIcon = function TimesIcon(_ref) {
 };
 
 var HeaderSideBar = function HeaderSideBar(_ref) {
-  var _handleUserRole, _clsx;
+  var _handleUserRole, _navigations$filter, _clsx;
 
   var children = _ref.children,
       navigations = _ref.navigations,
@@ -75880,7 +75894,8 @@ var HeaderSideBar = function HeaderSideBar(_ref) {
       onChangeFont = _useHeaderSideBar.onChangeFont,
       handleClose = _useHeaderSideBar.handleClose,
       renderNavigationItem = _useHeaderSideBar.renderNavigationItem,
-      t = _useHeaderSideBar.t;
+      t = _useHeaderSideBar.t,
+      isEnableMarioAi = _useHeaderSideBar.isEnableMarioAi;
 
   return React__default.createElement("div", {
     style: {
@@ -76012,9 +76027,13 @@ var HeaderSideBar = function HeaderSideBar(_ref) {
       paddingTop: 0,
       paddingBottom: 50
     }
-  }, !!navigations && navigations.map(function (navigation) {
+  }, !!navigations && (navigations === null || navigations === void 0 ? void 0 : (_navigations$filter = navigations.filter(function (r) {
+    var _r$name;
+
+    return !isEnableMarioAi ? !((_r$name = r.name) !== null && _r$name !== void 0 && _r$name.includes('MarioAI')) : true;
+  })) === null || _navigations$filter === void 0 ? void 0 : _navigations$filter.map(function (navigation) {
     return renderNavigationItem(navigation);
-  }))))), React__default.createElement("main", {
+  })))))), React__default.createElement("main", {
     className: clsx(classes.content, (_clsx = {}, _clsx[classes.contentShift] = isReadOnly ? false : isOpenSideBar, _clsx))
   }, children));
 };
@@ -77641,7 +77660,435 @@ var SurveyQuestion = function SurveyQuestion() {
   }));
 };
 
-var styles$d = {"survey-portal":"_32YVh","create-new-btn":"_2pqkt","survey-portal-dashboard":"_10mFg","dashboard-root":"_ol6v1","dashboard-header":"_1nGwv","header-left":"_3ZVx1","header-left-title":"_3zJ6N","header-left-description":"_aNEzP","dashboard-cards":"_T2QhN","show-blur":"_2k8eW","scroll-btn":"_3LX77","dashboard-card":"_rV_wf","dashboard-card-title":"_1dkjY","dashboard-card-description":"_2N0Jl","learn-more-btn":"_FoRnw","dashboard-surveys":"_y4RMj","dashboard-stats":"_2vCyM","dashboard-stats-title":"_1RtaL","create-template-button":"_1VeM-","create-survey-button":"_2FW07","survey-index":"_1-7Lk","survey-index-left":"_7ASwE","last-survey-index":"_5wgo2","survey-index-right":"_1bOyN","survey-index-card":"_2N-Ie","index-title":"_n24sR","link-view-survey":"_1f6ee","header-link":"_3dWko","active-survey-card":"_bKT0k","index-card-value":"_1O-jW","index-card-description":"_GLrEM","schedule-survey-card":"_1LDJ_","survey-item":"_W9PK3","survey-item-title":"_3c4hi","survey-item-date":"_2EvrJ","survey-item-Active":"_29PJt","survey-item-Close":"_GAmd7","survey-item-more":"_1Gz67","action-wrapper":"_15kTE","action-item":"_3LaNO","template-icon":"_nXa-q"};
+var useGeminiAI = function useGeminiAI() {
+  var dispatch = reactRedux.useDispatch();
+
+  var systemPrompt = function systemPrompt(response) {
+    return "\n            Please analyze the following student feedback and categorize them into two groups:\n            1. Students who have flagged low energy.\n            2. Students who are feeling really happy.\n\n            Return the result in JSON format with the structure:\n            {\n                \"lowEnergyStudents\": [\"name1\", \"name2\", ...],\n                \"happyStudents\": [\"name1\", \"name2\", ...]\n            }\n\n            Here is the input data:\n            " + response.map(function (r, index) {
+      return index + ". " + r.studentName + ": \"" + r.answer + "\"";
+    }) + "\n            ";
+  };
+
+  var _useState = React.useState([]),
+      lowEnergyStudents = _useState[0],
+      setLowEnergyStudents = _useState[1];
+
+  var _useState2 = React.useState([]),
+      happyStudents = _useState2[0],
+      setHappyStudents = _useState2[1];
+
+  var summarizeDataSchema = {
+    description: "Summary of student emotional states",
+    type: generativeAi.SchemaType.OBJECT,
+    properties: {
+      lowEnergyStudents: {
+        type: generativeAi.SchemaType.ARRAY,
+        items: {
+          type: generativeAi.SchemaType.STRING
+        }
+      },
+      happyStudents: {
+        type: generativeAi.SchemaType.ARRAY,
+        items: {
+          type: generativeAi.SchemaType.STRING
+        }
+      }
+    },
+    required: ["lowEnergyStudents", "happyStudents"]
+  };
+
+  var askGeminiAI = function askGeminiAI(summarizeResponses) {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp4 = _catch(function () {
+        var _systemPrompt;
+
+        var genAI = new generativeAi.GoogleGenerativeAI("AIzaSyAb1MebW5BcT__I8WZtbvKkDHYzZDHKZro");
+        var model = genAI.getGenerativeModel({
+          model: "gemini-1.5-flash",
+          generationConfig: {
+            responseMimeType: "application/json",
+            responseSchema: summarizeDataSchema
+          }
+        });
+        var prompt = (_systemPrompt = systemPrompt(summarizeResponses)) != null ? _systemPrompt : "";
+        return Promise.resolve(model.generateContent(prompt)).then(function (result) {
+          var _result$response;
+
+          var rawResponse = result === null || result === void 0 ? void 0 : (_result$response = result.response) === null || _result$response === void 0 ? void 0 : _result$response.text();
+          var parsedResponse = JSON.parse(rawResponse);
+          setLowEnergyStudents(parsedResponse.lowEnergyStudents || []);
+          setHappyStudents(parsedResponse.happyStudents || []);
+        });
+      }, function (err) {
+        var _err$response, _err$response$data;
+
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : _err$response$data.title) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  return {
+    askGeminiAI: askGeminiAI,
+    lowEnergyStudents: lowEnergyStudents,
+    happyStudents: happyStudents
+  };
+};
+
+var SummarizeIcon = function SummarizeIcon() {
+  return React__default.createElement("svg", {
+    width: "34",
+    height: "23",
+    viewBox: "0 0 34 23",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("path", {
+    d: "M4.55029 2.54133C4.55029 2.2868 4.75663 2.08046 5.01117 2.08046H32.4766C32.7542 2.08046 32.9689 2.32414 32.9338 2.59955L30.5144 21.5967C30.4851 21.8268 30.2893 21.9993 30.0572 21.9993H5.0112C4.75667 21.9993 4.55033 21.793 4.55033 21.5385L4.55029 2.54133Z",
+    fill: "#242424",
+    stroke: "#242424",
+    strokeWidth: "1.5"
+  }), React__default.createElement("path", {
+    d: "M1.09091 1.5377C1.04336 1.25646 1.2601 1 1.54533 1H8.79344C8.991 1 9.16658 1.12591 9.22995 1.31303L10.1746 4.10203C10.238 4.28914 10.4135 4.41505 10.6111 4.41505H26.5365C26.7558 4.41505 26.9448 4.56968 26.9882 4.78471L30.3525 21.4479C30.4102 21.7333 30.192 22 29.9008 22H4.93991C4.71503 22 4.52298 21.8377 4.48549 21.616L1.09091 1.5377Z",
+    fill: "white",
+    stroke: "#242424",
+    strokeWidth: "1.5"
+  }), React__default.createElement("rect", {
+    x: "5.95801",
+    y: "15.3038",
+    width: "8.97068",
+    height: "1.1628",
+    rx: "0.581398",
+    fill: "#242424"
+  }), React__default.createElement("rect", {
+    x: "6.3833",
+    y: "17.6296",
+    width: "8.97068",
+    height: "1.1628",
+    rx: "0.581398",
+    fill: "#242424"
+  }));
+};
+
+var UnderstandIcon = function UnderstandIcon() {
+  return React__default.createElement("svg", {
+    width: "34",
+    height: "34",
+    viewBox: "0 0 34 34",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("ellipse", {
+    cx: "17.2416",
+    cy: "10.9215",
+    rx: "5.0863",
+    ry: "5.10915",
+    fill: "white",
+    stroke: "#242424",
+    strokeWidth: "1.5"
+  }), React__default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M27.5707 21.9242C25.8211 19.6208 23.3251 17.9199 20.4453 17.1859C19.5708 17.899 18.456 18.3263 17.2419 18.3263C16.0277 18.3263 14.913 17.899 14.0385 17.1859C11.1587 17.9199 8.66281 19.6206 6.91316 21.9239C9.28534 25.047 13.0294 27.0623 17.2421 27.0623C21.4546 27.0623 25.1985 25.0472 27.5707 21.9242Z",
+    fill: "#242424"
+  }), React__default.createElement("path", {
+    d: "M27.5707 21.9242L28.1679 22.3779L28.5125 21.9243L28.168 21.4706L27.5707 21.9242ZM20.4453 17.1859L20.6305 16.4591L20.2643 16.3658L19.9713 16.6046L20.4453 17.1859ZM14.0385 17.1859L14.5124 16.6046L14.2195 16.3657L13.8532 16.4591L14.0385 17.1859ZM6.91316 21.9239L6.31593 21.4703L5.97134 21.9239L6.31592 22.3776L6.91316 21.9239ZM28.168 21.4706C26.3186 19.0359 23.6791 17.2362 20.6305 16.4591L20.26 17.9127C22.9711 18.6037 25.3235 20.2057 26.9735 22.3779L28.168 21.4706ZM19.9713 16.6046C19.2255 17.2128 18.2768 17.5763 17.2419 17.5763V19.0763C18.6353 19.0763 19.9161 18.5852 20.9193 17.7671L19.9713 16.6046ZM17.2419 17.5763C16.207 17.5763 15.2582 17.2128 14.5124 16.6046L13.5645 17.7671C14.5677 18.5851 15.8485 19.0763 17.2419 19.0763V17.5763ZM13.8532 16.4591C10.8047 17.2361 8.16527 19.0357 6.31593 21.4703L7.5104 22.3776C9.16036 20.2055 11.5127 18.6036 14.2237 17.9126L13.8532 16.4591ZM6.31592 22.3776C8.82331 25.6787 12.7843 27.8123 17.2421 27.8123V26.3123C13.2746 26.3123 9.74737 24.4154 7.51041 21.4703L6.31592 22.3776ZM17.2421 27.8123C21.6997 27.8123 25.6605 25.6788 28.1679 22.3779L26.9735 21.4706C24.7365 24.4155 21.2094 26.3123 17.2421 26.3123V27.8123Z",
+    fill: "#242424"
+  }), React__default.createElement("path", {
+    d: "M8.01468 1H1V8.04619",
+    stroke: "#242424",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  }), React__default.createElement("path", {
+    d: "M8.01468 33H1V25.9538",
+    stroke: "#242424",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  }), React__default.createElement("path", {
+    d: "M25.9853 1H33V8.04619",
+    stroke: "#242424",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  }), React__default.createElement("path", {
+    d: "M25.9853 33H33V25.9538",
+    stroke: "#242424",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  }));
+};
+
+var IdentifyIcon = function IdentifyIcon() {
+  return React__default.createElement("svg", {
+    width: "32",
+    height: "34",
+    viewBox: "0 0 32 34",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("ellipse", {
+    cx: "20.3296",
+    cy: "22.2391",
+    rx: "10.6704",
+    ry: "10.7609",
+    fill: "white",
+    stroke: "#242424",
+    strokeWidth: "1.4"
+  }), React__default.createElement("path", {
+    d: "M26.6513 13.5699C24.8818 12.2552 22.6951 11.4782 20.3286 11.4782C16.3772 11.4782 12.9274 13.6443 11.0831 16.8632C10.1768 18.445 9.6582 20.281 9.6582 22.2391C12.6549 22.8982 20.2488 22.0872 26.6513 13.5699Z",
+    fill: "#242424"
+  }), React__default.createElement("path", {
+    d: "M9.6582 22.2391C12.6549 22.8982 20.2488 22.0872 26.6513 13.5699C24.8818 12.2552 22.6951 11.4782 20.3286 11.4782C16.3772 11.4782 12.9274 13.6443 11.0831 16.8632C10.1768 18.445 9.6582 20.281 9.6582 22.2391ZM9.6582 22.2391L10.5056 26.7454",
+    stroke: "#242424",
+    strokeWidth: "1.4"
+  }), React__default.createElement("path", {
+    d: "M29.1172 27.9828C28.1548 26.9837 25.0222 25.3613 22.2507 26.7542",
+    stroke: "#242424",
+    strokeWidth: "1.4",
+    strokeLinecap: "round"
+  }), React__default.createElement("path", {
+    d: "M1 12.1834L4.25181 14.7912C4.45478 14.954 4.75636 14.8471 4.81296 14.5923L5.40844 11.9119C5.46504 11.6571 5.76662 11.5502 5.96959 11.713L9.46747 14.5181",
+    stroke: "#242424",
+    strokeWidth: "1.4"
+  }), React__default.createElement("path", {
+    d: "M8.70996 3.26892L10.1746 7.19015C10.2658 7.43434 10.5807 7.49719 10.7597 7.30692L12.6297 5.3194C12.8087 5.12913 13.1236 5.19198 13.2149 5.43617L14.7903 9.65411",
+    stroke: "#242424",
+    strokeWidth: "1.4"
+  }), React__default.createElement("path", {
+    d: "M19.7646 1L19.3511 5.17685C19.3256 5.43456 19.5773 5.63142 19.821 5.54443L22.4848 4.59376C22.7286 4.50677 22.9802 4.70362 22.9547 4.96134L22.51 9.45368",
+    stroke: "#242424",
+    strokeWidth: "1.4"
+  }));
+};
+
+var CALENDAR_OPTIONS$2 = [{
+  label: "This week",
+  startDate: moment().startOf("week").weekday(1).valueOf(),
+  endDate: moment().endOf("week").weekday(7).valueOf()
+}, {
+  label: "This month",
+  startDate: moment().startOf("month").valueOf(),
+  endDate: moment().endOf("month").valueOf()
+}, {
+  label: "This school year",
+  startDate: moment().startOf("year").valueOf(),
+  endDate: moment().endOf("year").valueOf()
+}];
+var timeKeywords = ["this month", "this week", "this year", "last month", "last week", "last year", "today"];
+var IDataType;
+
+(function (IDataType) {
+  IDataType[IDataType["QuestionAnswer"] = 0] = "QuestionAnswer";
+  IDataType[IDataType["Total"] = 1] = "Total";
+})(IDataType || (IDataType = {}));
+var THEME = {
+  LIGHT: 'light',
+  DARK: 'dark'
+};
+var MessageRole;
+
+(function (MessageRole) {
+  MessageRole[MessageRole["System"] = 0] = "System";
+  MessageRole[MessageRole["User"] = 1] = "User";
+  MessageRole[MessageRole["Model"] = 2] = "Model";
+})(MessageRole || (MessageRole = {}));
+
+var DEFAULT_START_DATE$3 = moment().subtract(2, 'months').startOf("day").valueOf();
+var DEFAULT_END_DATE$3 = moment().endOf("day").valueOf();
+
+var useSummarizeResponse = function useSummarizeResponse() {
+  var dispatch = reactRedux.useDispatch();
+
+  var _useState = React.useState([]),
+      summarizeResponses = _useState[0],
+      setSummarizeResponses = _useState[1];
+
+  var _useState2 = React.useState({
+    startDate: undefined,
+    endDate: undefined
+  }),
+      filters = _useState2[0],
+      setFilters = _useState2[1];
+
+  var handleChangeFilter = function handleChangeFilter(option) {
+    setFilters({
+      startDate: option.startDate,
+      endDate: option.endDate
+    });
+  };
+
+  var getSummarizeQuestion = React.useCallback(function () {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(getSummarizeReport({
+          startDate: DEFAULT_START_DATE,
+          endDate: DEFAULT_END_DATE
+        })).then(function (res) {
+          if (res.data) {
+            setSummarizeResponses(res.data.items || []);
+          }
+        });
+      }, function (err) {
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [filters]);
+  React.useEffect(function () {
+    if (filters.startDate && filters.endDate) {
+      getSummarizeQuestion();
+    }
+  }, [filters]);
+  return {
+    handleChangeFilter: handleChangeFilter,
+    summarizeResponses: summarizeResponses
+  };
+};
+
+var MarioAi = function MarioAi() {
+  var _useGeminiAI = useGeminiAI(),
+      askGeminiAI = _useGeminiAI.askGeminiAI,
+      lowEnergyStudents = _useGeminiAI.lowEnergyStudents,
+      happyStudents = _useGeminiAI.happyStudents;
+
+  var _useSummarizeResponse = useSummarizeResponse(),
+      handleChangeFilter = _useSummarizeResponse.handleChangeFilter,
+      summarizeResponses = _useSummarizeResponse.summarizeResponses;
+
+  var renderStudentList = function renderStudentList(title, students) {
+    return React__default.createElement(core$1.Grid, {
+      className: "mt-5"
+    }, React__default.createElement(core$1.Typography, null, title), students.map(function (student, index) {
+      return React__default.createElement(core$1.Typography, {
+        key: index
+      }, index + 1 + ". " + student);
+    }));
+  };
+
+  return React__default.createElement(core$1.Grid, null, React__default.createElement(core$1.Grid, {
+    className: "mt-5"
+  }, CALENDAR_OPTIONS$2.map(function (option) {
+    return React__default.createElement(core$1.Button, {
+      key: option.label,
+      onClick: function onClick() {
+        return handleChangeFilter(option);
+      }
+    }, option.label);
+  }), React__default.createElement(core$1.Grid, {
+    className: "my-5"
+  }, React__default.createElement(core$1.Typography, null, "Summarize responses:"), summarizeResponses.map(function (response) {
+    return React__default.createElement(core$1.Grid, null, React__default.createElement(core$1.Typography, null, response.studentName), React__default.createElement(core$1.Typography, null, response.answer));
+  })), React__default.createElement(core$1.Grid, null, renderStudentList("Students have flagged low energy this week:", lowEnergyStudents), renderStudentList("Students are feeling really happy:", happyStudents)), React__default.createElement(core$1.Button, {
+    onClick: function onClick() {
+      return askGeminiAI(summarizeResponses);
+    }
+  }, "Generate")));
+};
+
+var styles$d = {"ai-mario-container":"_1hAN-","ai-mario":"_U4585","ai-mario-header":"_3H3TX","title-welcome":"_2wizn","title-help-question":"_1uejP","card-data-container":"_wXhYW","card":"_3F1f0","content":"_cB_eW","title":"_30saB","description-card":"_6m3YS","icon":"_gG2mp","go-icon":"_1tJEn","list-prompts":"_1O09T","header":"_1lK2v","see-all":"_1Qk2i","text":"_3qcYP","list-item":"_2DkM3","item":"_1FFC5","background":"_rGovp","left":"_1X7t2","right":"_1w2YZ","opacity-footer":"_4kmno","dot-color":"_6K7Pz","dot-color__top":"_3mOqe","dot-color__bottom":"_1LVOo","ai-mario-chat":"_2eGy1","ai-mario-chat__header":"_1_oTD","go-back":"_u-oqg","chat-title":"_PBH_Y","switch-theme":"_31WqA","item___light-btn":"_3Zheb","item___dark-btn":"_7T1lB","ai-mario-chat__header___dark":"__lhBc","ai-mario-chat__content":"_2h1fv","content-container":"_3kxy-","chat-box":"_3gjP5","chat-box__content":"_2x_-F","name":"_2bqyW","message":"_1N1T3","option":"_31bf9","option__item":"_7cV8X","loader":"_2YD7M","loader__dot":"_23N4j","dot":"_3St_4","time":"_CjCyy","chat-box__user":"_ZC3ml","chat-box__user-container":"_2oBqf","ai-mario-chat__content___dark":"_1r1Jl","action-wrapper":"_2o38p","action-item":"_1IcP8","bracketed-input":"_206DV","bracketed-input-block":"_1A9xm","icon-input":"_1Lwom"};
+
+var ArrowRightIcon = function ArrowRightIcon() {
+  return React__default.createElement("svg", {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("path", {
+    d: "M8.75036 3C8.55112 3 8.36007 3.07928 8.21936 3.22034C8.0783 3.36105 7.99902 3.5521 7.99902 3.75134C7.99902 3.95058 8.0783 4.14163 8.21936 4.28234L11.4397 7.50146H2.75C2.33579 7.50146 2 7.83725 2 8.25146C2 8.66568 2.33579 9.00146 2.75 9.00146H11.4395L8.21936 12.2203C7.9261 12.5136 7.9261 12.9891 8.21936 13.2823C8.51263 13.5756 8.9881 13.5756 9.28136 13.2823L13.7814 8.78234C13.9224 8.64163 14.0017 8.45058 14.0017 8.25134C14.0017 8.0521 13.9224 7.86105 13.7814 7.72034L9.28136 3.22034C9.14066 3.07928 8.9496 3 8.75036 3Z",
+    fill: "#316CD9"
+  }));
+};
+
+var CardHeader = function CardHeader(_ref) {
+  var id = _ref.id,
+      name = _ref.name,
+      description = _ref.description,
+      icon = _ref.icon,
+      goToChat = _ref.goToChat;
+  return React__default.createElement("button", {
+    type: 'button',
+    onClick: function onClick() {
+      goToChat(id);
+    },
+    className: styles$d['card']
+  }, React__default.createElement("div", {
+    className: styles$d['content']
+  }, React__default.createElement("div", {
+    className: styles$d['title'],
+    dangerouslySetInnerHTML: {
+      __html: name
+    }
+  }), React__default.createElement("div", {
+    className: styles$d['description-card'],
+    dangerouslySetInnerHTML: {
+      __html: description
+    }
+  })), React__default.createElement("div", {
+    className: styles$d['icon']
+  }, icon), React__default.createElement("div", {
+    className: styles$d['go-icon']
+  }, React__default.createElement(ArrowRightIcon, null)));
+};
+
+var HeaderAI = function HeaderAI(_ref) {
+  var prompts = _ref.prompts,
+      goToChat = _ref.goToChat,
+      generateIcons = _ref.generateIcons;
+  return React__default.createElement("div", {
+    className: styles$d['ai-mario-header']
+  }, React__default.createElement("div", {
+    className: styles$d['title-welcome']
+  }, "Hello, Kathryn. I'm your AI assistant created by MARIO."), React__default.createElement("div", {
+    className: styles$d['title-help-question']
+  }, "How can I help you today?"), React__default.createElement("div", {
+    className: styles$d['card-data-container']
+  }, prompts.map(function (r) {
+    return React__default.createElement(CardHeader, {
+      key: r.name,
+      id: r.id,
+      name: r.name,
+      description: r.description,
+      icon: generateIcons(r.name),
+      goToChat: goToChat
+    });
+  })));
+};
+
+var MoreIcon = function MoreIcon() {
+  return React__default.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("g", {
+    opacity: "0.4"
+  }, React__default.createElement("path", {
+    d: "M12 19.2693C11.5875 19.2693 11.2344 19.1224 10.9408 18.8285C10.6469 18.5349 10.5 18.1818 10.5 17.7693C10.5 17.3568 10.6469 17.0036 10.9408 16.7098C11.2344 16.4161 11.5875 16.2693 12 16.2693C12.4125 16.2693 12.7656 16.4161 13.0592 16.7098C13.3531 17.0036 13.5 17.3568 13.5 17.7693C13.5 18.1818 13.3531 18.5349 13.0592 18.8285C12.7656 19.1224 12.4125 19.2693 12 19.2693ZM12 13.5C11.5875 13.5 11.2344 13.3531 10.9408 13.0593C10.6469 12.7656 10.5 12.4125 10.5 12C10.5 11.5875 10.6469 11.2344 10.9408 10.9408C11.2344 10.6469 11.5875 10.5 12 10.5C12.4125 10.5 12.7656 10.6469 13.0592 10.9408C13.3531 11.2344 13.5 11.5875 13.5 12C13.5 12.4125 13.3531 12.7656 13.0592 13.0593C12.7656 13.3531 12.4125 13.5 12 13.5ZM12 7.73077C11.5875 7.73077 11.2344 7.58394 10.9408 7.29027C10.6469 6.99644 10.5 6.64327 10.5 6.23077C10.5 5.81827 10.6469 5.46519 10.9408 5.17152C11.2344 4.87769 11.5875 4.73077 12 4.73077C12.4125 4.73077 12.7656 4.87769 13.0592 5.17152C13.3531 5.46519 13.5 5.81827 13.5 6.23077C13.5 6.64327 13.3531 6.99644 13.0592 7.29027C12.7656 7.58394 12.4125 7.73077 12 7.73077Z",
+    fill: "#242424"
+  })));
+};
 
 var PopoverCustom$1 = core$1.styled(core$1.Popover)(function () {
   return {
@@ -77651,6 +78098,1097 @@ var PopoverCustom$1 = core$1.styled(core$1.Popover)(function () {
   };
 });
 
+var ListPrompts = function ListPrompts(_ref) {
+  var maxHeight = _ref.maxHeight,
+      historyPrompts = _ref.historyPrompts,
+      handleClickAction = _ref.handleClickAction,
+      handleCloseAction = _ref.handleCloseAction,
+      anchorEl = _ref.anchorEl,
+      popoverId = _ref.popoverId,
+      openPopover = _ref.openPopover,
+      removeData = _ref.removeData,
+      selectId = _ref.selectId,
+      goToViewHistory = _ref.goToViewHistory,
+      generateIcons = _ref.generateIcons;
+  return React__default.createElement("div", {
+    className: styles$d['list-prompts'],
+    style: {
+      maxHeight: maxHeight / 2 + 25
+    }
+  }, React__default.createElement("div", {
+    className: styles$d['header']
+  }, React__default.createElement("div", {
+    className: styles$d['title']
+  }, "Last Prompts"), React__default.createElement("button", {
+    type: 'button',
+    className: styles$d['see-all']
+  }, React__default.createElement("div", {
+    className: styles$d['text'],
+    onClick: function onClick() {
+      console.log('ok');
+    }
+  }, "See all"), React__default.createElement(ArrowRightIcon, null))), React__default.createElement("div", {
+    className: styles$d['list-item']
+  }, historyPrompts.map(function (prompt) {
+    return React__default.createElement("div", {
+      key: prompt.name,
+      className: styles$d['item']
+    }, React__default.createElement("div", {
+      className: styles$d['background']
+    }), React__default.createElement("div", {
+      className: styles$d['left']
+    }, React__default.createElement("div", {
+      className: styles$d['icon']
+    }, generateIcons(prompt.name)), React__default.createElement("div", {
+      className: styles$d['text']
+    }, prompt.name)), React__default.createElement("div", {
+      className: styles$d['right']
+    }, React__default.createElement("div", {
+      className: styles$d['text']
+    }, prompt.createdAt), React__default.createElement("button", {
+      type: 'button',
+      className: styles$d['icon'],
+      onClick: function onClick(event) {
+        return handleClickAction(event, prompt.id);
+      }
+    }, React__default.createElement(MoreIcon, null))));
+  })), React__default.createElement("div", {
+    className: styles$d['opacity-footer']
+  }), React__default.createElement(PopoverCustom$1, {
+    id: popoverId,
+    open: openPopover,
+    anchorEl: anchorEl,
+    onClose: function onClose() {
+      return handleCloseAction();
+    },
+    anchorOrigin: {
+      vertical: "top",
+      horizontal: "left"
+    },
+    transformOrigin: {
+      vertical: "top",
+      horizontal: "left"
+    }
+  }, React__default.createElement("ul", {
+    className: "" + styles$d["action-wrapper"]
+  }, React__default.createElement("li", {
+    onClick: function onClick() {
+      goToViewHistory(selectId);
+    },
+    className: styles$d["action-item"] + " text-nowrap"
+  }, "view"), React__default.createElement("li", {
+    onClick: function onClick() {
+      removeData(selectId);
+    },
+    className: styles$d["action-item"] + " text-nowrap"
+  }, "remove"))));
+};
+
+var PROMPT_URL = marioCore.BASE_URL + "/api/Prompt";
+var getPrompt = function getPrompt() {
+  return marioCore.api.get("" + PROMPT_URL);
+};
+var getById$p = function getById(id) {
+  return marioCore.api.get(PROMPT_URL + "/" + id);
+};
+var getHistoryPrompt = function getHistoryPrompt() {
+  return marioCore.api.get(PROMPT_URL + "/history");
+};
+var getSessionAnswer = function getSessionAnswer(params) {
+  return marioCore.api.get(PROMPT_URL + "/session-data", {
+    params: params
+  });
+};
+var createHistory = function createHistory(data) {
+  return marioCore.api.post(PROMPT_URL + "/create-history", data);
+};
+var removeHistory = function removeHistory(id) {
+  return marioCore.api["delete"](PROMPT_URL + "/history/" + id);
+};
+var getHistoryById = function getHistoryById(id) {
+  return marioCore.api.get(PROMPT_URL + "/history/" + id);
+};
+var getTotalSession = function getTotalSession(params) {
+  return marioCore.api.get(PROMPT_URL + "/session-total-data", {
+    params: params
+  });
+};
+
+var useAIMario = function useAIMario() {
+  var history = reactRouterDom.useHistory();
+  var dispatch = reactRedux.useDispatch();
+  var isOpenSideBar = reactRedux.useSelector(function (state) {
+    var _state$common;
+
+    return (_state$common = state.common) === null || _state$common === void 0 ? void 0 : _state$common.menuBar;
+  });
+
+  var _useState = React.useState(null),
+      anchorEl = _useState[0],
+      setAnchorEl = _useState[1];
+
+  var aiMarioRef = React.useRef(null);
+
+  var _useState2 = React.useState(0),
+      height = _useState2[0],
+      setHeight = _useState2[1];
+
+  var _useState3 = React.useState([]),
+      prompts = _useState3[0],
+      setPrompts = _useState3[1];
+
+  var _useState4 = React.useState([]),
+      historyPrompts = _useState4[0],
+      setHistoryPrompts = _useState4[1];
+
+  var _useState5 = React.useState(null),
+      selectId = _useState5[0],
+      setSelectId = _useState5[1];
+
+  var handleClickAction = function handleClickAction(event, id) {
+    setAnchorEl(event.currentTarget);
+    setSelectId(id);
+  };
+
+  var openPopover = Boolean(anchorEl);
+  var popoverId = openPopover ? "simple-popover" : undefined;
+
+  var handleCloseAction = function handleCloseAction() {
+    setAnchorEl(null);
+  };
+
+  var goToChat = function goToChat(id) {
+    history.push("/admin/mario-ai/chat/" + id);
+  };
+
+  var goToViewHistory = function goToViewHistory(id) {
+    history.push("/admin/mario-ai/history/" + id);
+  };
+
+  var getAllPrompt = React.useCallback(function () {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(getPrompt()).then(function (res) {
+          if (res.data) {
+            setPrompts(res.data || []);
+          }
+        });
+      }, function (err) {
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, []);
+  var getAllHistoryPrompt = React.useCallback(function () {
+    try {
+      var _temp7 = function _temp7() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp8 = _catch(function () {
+        return Promise.resolve(getHistoryPrompt()).then(function (res) {
+          if (res.data) {
+            setHistoryPrompts(res.data || []);
+          }
+        });
+      }, function (err) {
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: err.message
+        }));
+      });
+
+      return Promise.resolve(_temp8 && _temp8.then ? _temp8.then(_temp7) : _temp7(_temp8));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, []);
+  var removeData = React.useCallback(function (id) {
+    try {
+      dispatch(marioCore.setModal({
+        isOpen: true,
+        type: "warning",
+        message: "Do you want to delete this history?",
+        onConfirm: function () {
+          try {
+            var _temp11 = function _temp11() {
+              dispatch(marioCore.setLoading(false));
+            };
+
+            dispatch(marioCore.setLoading(true));
+
+            var _temp12 = _catch(function () {
+              return Promise.resolve(removeHistory(id)).then(function () {
+                return Promise.resolve(getAllHistoryPrompt()).then(function () {
+                  dispatch(marioCore.setAlert({
+                    type: "success",
+                    message: "Delete history successfully"
+                  }));
+                });
+              });
+            }, function (err) {
+              var _err$response;
+
+              dispatch(marioCore.setAlert({
+                type: "danger",
+                message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : _err$response.data) || err.message
+              }));
+            });
+
+            return Promise.resolve(_temp12 && _temp12.then ? _temp12.then(_temp11) : _temp11(_temp12));
+          } catch (e) {
+            return Promise.reject(e);
+          }
+        }
+      }));
+      return Promise.resolve();
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, []);
+  React.useEffect(function () {
+    getAllPrompt();
+    getAllHistoryPrompt();
+
+    if (aiMarioRef.current) {
+      var _height = aiMarioRef.current.offsetHeight;
+      setHeight(_height);
+    }
+  }, []);
+  return {
+    handleClickAction: handleClickAction,
+    handleCloseAction: handleCloseAction,
+    anchorEl: anchorEl,
+    popoverId: popoverId,
+    openPopover: openPopover,
+    goToChat: goToChat,
+    isOpenSideBar: isOpenSideBar,
+    height: height,
+    aiMarioRef: aiMarioRef,
+    prompts: prompts,
+    historyPrompts: historyPrompts,
+    removeData: removeData,
+    selectId: selectId,
+    goToViewHistory: goToViewHistory
+  };
+};
+
+var AIMario = function AIMario() {
+  var _useAIMario = useAIMario(),
+      isOpenSideBar = _useAIMario.isOpenSideBar,
+      height = _useAIMario.height,
+      aiMarioRef = _useAIMario.aiMarioRef,
+      prompts = _useAIMario.prompts,
+      goToChat = _useAIMario.goToChat,
+      historyPrompts = _useAIMario.historyPrompts,
+      handleClickAction = _useAIMario.handleClickAction,
+      handleCloseAction = _useAIMario.handleCloseAction,
+      anchorEl = _useAIMario.anchorEl,
+      popoverId = _useAIMario.popoverId,
+      openPopover = _useAIMario.openPopover,
+      removeData = _useAIMario.removeData,
+      selectId = _useAIMario.selectId,
+      goToViewHistory = _useAIMario.goToViewHistory;
+
+  var generateIcons = function generateIcons(title) {
+    var index = prompts.findIndex(function (r) {
+      return r.name == title;
+    });
+
+    switch (index) {
+      case 0:
+        return React__default.createElement(SummarizeIcon, null);
+
+      case 1:
+        return React__default.createElement(UnderstandIcon, null);
+
+      case 2:
+        return React__default.createElement(IdentifyIcon, null);
+
+      default:
+        return React__default.createElement(IdentifyIcon, null);
+    }
+  };
+
+  return React__default.createElement("div", {
+    className: styles$d["ai-mario-container"],
+    style: isOpenSideBar ? {
+      width: "calc(100vw - 300px)"
+    } : {}
+  }, React__default.createElement("div", {
+    className: styles$d["ai-mario"],
+    id: "ai_mario",
+    ref: aiMarioRef
+  }, React__default.createElement(HeaderAI, {
+    prompts: prompts,
+    goToChat: goToChat,
+    generateIcons: generateIcons
+  }), React__default.createElement(ListPrompts, {
+    maxHeight: height,
+    historyPrompts: historyPrompts,
+    handleClickAction: handleClickAction,
+    handleCloseAction: handleCloseAction,
+    anchorEl: anchorEl,
+    popoverId: popoverId,
+    openPopover: openPopover,
+    removeData: removeData,
+    selectId: selectId,
+    goToViewHistory: goToViewHistory,
+    generateIcons: generateIcons
+  }), React__default.createElement("div", {
+    className: styles$d["dot-color"] + " " + styles$d["dot-color__top"]
+  }), React__default.createElement("div", {
+    className: styles$d["dot-color"] + " " + styles$d["dot-color__bottom"]
+  })));
+};
+
+var ArrowBackIcon = function ArrowBackIcon(_ref) {
+  var _ref$color = _ref.color,
+      color = _ref$color === void 0 ? '#242424' : _ref$color;
+  return React__default.createElement("svg", {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("path", {
+    d: "M7.24964 3C7.44888 3 7.63993 3.07928 7.78064 3.22034C7.9217 3.36105 8.00098 3.5521 8.00098 3.75134C8.00098 3.95058 7.9217 4.14163 7.78064 4.28234L4.5603 7.50146H13.25C13.6642 7.50146 14 7.83725 14 8.25146C14 8.66568 13.6642 9.00146 13.25 9.00146H4.56054L7.78064 12.2203C8.0739 12.5136 8.0739 12.9891 7.78064 13.2823C7.48737 13.5756 7.0119 13.5756 6.71864 13.2823L2.21864 8.78234C2.07757 8.64163 1.99829 8.45058 1.99829 8.25134C1.99829 8.0521 2.07757 7.86105 2.21864 7.72034L6.71864 3.22034C6.85934 3.07928 7.0504 3 7.24964 3Z",
+    fill: color
+  }));
+};
+
+var LightIcon = function LightIcon(_ref) {
+  var _ref$color = _ref.color,
+      color = _ref$color === void 0 ? '#242424' : _ref$color;
+  return React__default.createElement("svg", {
+    width: "20",
+    height: "20",
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("path", {
+    d: "M10.0002 12.4001C10.6669 12.4001 11.2335 12.1667 11.7002 11.7001C12.1669 11.2334 12.4002 10.6667 12.4002 10.0001C12.4002 9.33341 12.1669 8.76674 11.7002 8.30007C11.2335 7.83341 10.6669 7.60007 10.0002 7.60007C9.33353 7.60007 8.76686 7.83341 8.3002 8.30007C7.83353 8.76674 7.60019 9.33341 7.60019 10.0001C7.60019 10.6667 7.83353 11.2334 8.3002 11.7001C8.76686 12.1667 9.33353 12.4001 10.0002 12.4001ZM10.0002 14.0001C8.89353 14.0001 7.9502 13.6101 7.1702 12.8301C6.3902 12.0501 6.0002 11.1067 6.0002 10.0001C6.0002 8.89341 6.3902 7.95007 7.1702 7.17007C7.9502 6.39007 8.89353 6.00007 10.0002 6.00007C11.1069 6.00007 12.0502 6.39007 12.8302 7.17007C13.6102 7.95007 14.0002 8.89341 14.0002 10.0001C14.0002 11.1067 13.6102 12.0501 12.8302 12.8301C12.0502 13.6101 11.1069 14.0001 10.0002 14.0001ZM4.4002 10.8001H1.2002V9.20007H4.4002V10.8001ZM18.8002 10.8001H15.6002V9.20007H18.8002V10.8001ZM9.2002 4.40007V1.20007H10.8002V4.40007H9.2002ZM9.2002 18.8001V15.6001H10.8002V18.8001H9.2002ZM5.5202 6.60007L3.5002 4.66007L4.6402 3.48007L6.56019 5.48007L5.5202 6.60007ZM15.3602 16.5201L13.4202 14.5001L14.4802 13.4001L16.5002 15.3401L15.3602 16.5201ZM13.4002 5.52007L15.3402 3.50007L16.5202 4.64007L14.5202 6.56007L13.4002 5.52007ZM3.4802 15.3601L5.5002 13.4201L6.6002 14.4801L4.6602 16.5001L3.4802 15.3601Z",
+    fill: color
+  }));
+};
+
+var DarkIcon = function DarkIcon(_ref) {
+  var _ref$color = _ref.color,
+      color = _ref$color === void 0 ? '#242424' : _ref$color;
+  return React__default.createElement("svg", {
+    width: "20",
+    height: "20",
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("g", null, React__default.createElement("path", {
+    d: "M10.0008 17.2C8.00078 17.2 6.30078 16.5 4.90078 15.1C3.50078 13.7 2.80078 12 2.80078 10C2.80078 8.00005 3.50078 6.30005 4.90078 4.90005C6.30078 3.50005 8.00078 2.80005 10.0008 2.80005C10.1874 2.80005 10.3708 2.80672 10.5508 2.82005C10.7308 2.83338 10.9074 2.85338 11.0808 2.88005C10.5341 3.26672 10.0974 3.77005 9.77078 4.39005C9.44412 5.01005 9.28078 5.68005 9.28078 6.40005C9.28078 7.60005 9.70078 8.62005 10.5408 9.46005C11.3808 10.3 12.4008 10.72 13.6008 10.72C14.3341 10.72 15.0074 10.5567 15.6208 10.23C16.2341 9.90338 16.7341 9.46672 17.1208 8.92005C17.1474 9.09338 17.1674 9.27005 17.1808 9.45005C17.1941 9.63005 17.2008 9.81338 17.2008 10C17.2008 12 16.5008 13.7 15.1008 15.1C13.7008 16.5 12.0008 17.2 10.0008 17.2ZM10.0008 15.6C11.1741 15.6 12.2274 15.2767 13.1608 14.63C14.0941 13.9834 14.7741 13.14 15.2008 12.1C14.9341 12.1667 14.6674 12.22 14.4008 12.26C14.1341 12.3 13.8674 12.32 13.6008 12.32C11.9608 12.32 10.5641 11.7434 9.41078 10.59C8.25745 9.43672 7.68078 8.04005 7.68078 6.40005C7.68078 6.13338 7.70078 5.86672 7.74078 5.60005C7.78078 5.33338 7.83412 5.06672 7.90078 4.80005C6.86078 5.22672 6.01745 5.90672 5.37078 6.84005C4.72411 7.77338 4.40078 8.82672 4.40078 10C4.40078 11.5467 4.94745 12.8667 6.04078 13.96C7.13411 15.0534 8.45411 15.6 10.0008 15.6Z",
+    fill: color
+  })));
+};
+
+var ChatHeader = function ChatHeader(_ref) {
+  var theme = _ref.theme,
+      setTheme = _ref.setTheme,
+      goBack = _ref.goBack,
+      isOpenSideBar = _ref.isOpenSideBar,
+      name = _ref.name;
+  return React__default.createElement("div", {
+    className: styles$d['ai-mario-chat__header'] + " " + (theme === THEME.DARK ? styles$d['ai-mario-chat__header___dark'] : ''),
+    style: isOpenSideBar ? {} : {
+      width: '100%'
+    }
+  }, React__default.createElement("button", {
+    type: 'button',
+    className: styles$d['go-back'],
+    onClick: goBack
+  }, React__default.createElement(ArrowBackIcon, {
+    color: theme === THEME.DARK ? '#fff' : '#242424'
+  })), React__default.createElement("div", {
+    className: styles$d['chat-title']
+  }, name), React__default.createElement("button", {
+    className: styles$d['switch-theme'],
+    onClick: function onClick() {
+      return setTheme(theme === THEME.LIGHT ? THEME.DARK : THEME.LIGHT);
+    }
+  }, React__default.createElement("div", {
+    className: styles$d['item'] + " " + styles$d['item___light-btn'],
+    style: theme === THEME.LIGHT ? {
+      background: '#fff',
+      color: '#242424'
+    } : {
+      background: 'transparent',
+      color: '#7a778b'
+    }
+  }, React__default.createElement(LightIcon, {
+    color: theme === THEME.DARK ? '#7a778b' : '#242424'
+  })), React__default.createElement("div", {
+    className: styles$d['item'] + " " + styles$d['item___dark-btn'],
+    style: theme === THEME.DARK ? {
+      background: '#fff',
+      color: '#242424'
+    } : {
+      color: '#a6a6a6'
+    }
+  }, React__default.createElement(DarkIcon, {
+    color: theme === THEME.DARK ? '#242424' : '#a6a6a6'
+  }))));
+};
+
+var useAIChat = function useAIChat() {
+  var dispatch = reactRedux.useDispatch();
+  var history = reactRouterDom.useHistory();
+
+  var _useParams = reactRouterDom.useParams(),
+      id = _useParams.id;
+
+  var _useState = React.useState("light"),
+      theme = _useState[0],
+      setTheme = _useState[1];
+
+  var isOpenSideBar = reactRedux.useSelector(function (state) {
+    var _state$common;
+
+    return (_state$common = state.common) === null || _state$common === void 0 ? void 0 : _state$common.menuBar;
+  });
+
+  var _useState2 = React.useState(),
+      prompt = _useState2[0],
+      setPrompt = _useState2[1];
+
+  var _useState3 = React.useState([]),
+      chats = _useState3[0],
+      setChats = _useState3[1];
+
+  var _useState4 = React.useState(null),
+      historyId = _useState4[0],
+      setHistoryId = _useState4[1];
+
+  var _useState5 = React.useState([]),
+      answers = _useState5[0],
+      setAnswers = _useState5[1];
+
+  var _useState6 = React.useState(""),
+      inputString = _useState6[0],
+      setInputString = _useState6[1];
+
+  var _useState7 = React.useState({
+    checkInCompleteCount: 0,
+    checkInCount: 0,
+    oneToOneCompleteCount: 0,
+    oneToOneCount: 0,
+    studentNotDoneCheckIns: [],
+    studentNotDoneConversations: []
+  }),
+      totalCheckIns = _useState7[0],
+      setTotalCheckIns = _useState7[1];
+
+  var goBack = function goBack() {
+    history.goBack();
+  };
+
+  var getBracketedText = function getBracketedText(text) {
+    return (text.match(/\[\[(.*?)\]\]/) || [])[1] || null;
+  };
+
+  var submitPromptMessage = function submitPromptMessage() {
+    if (!inputString) return;
+    setChats(chats.map(function (r) {
+      return _extends({}, r, {
+        message: r.message.replace(/\[\[(.*?)\]\]/, inputString)
+      });
+    }));
+  };
+
+  var getPromptDetail = React.useCallback(function () {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(getById$p(parseInt(id))).then(function (res) {
+          var promptResponse = res.data;
+
+          if (promptResponse) {
+            var _promptResponse$messa;
+
+            setPrompt(promptResponse);
+            var regex = /\{{(.*?)}}/;
+            setChats((promptResponse === null || promptResponse === void 0 ? void 0 : (_promptResponse$messa = promptResponse.messages) === null || _promptResponse$messa === void 0 ? void 0 : _promptResponse$messa.filter(function (i) {
+              var _i$role;
+
+              return ((_i$role = i.role) === null || _i$role === void 0 ? void 0 : _i$role.toString()) != "System";
+            }).map(function (r) {
+              var _r$role, _r$message, _r$message$match, _r$message$match$, _r$message$match$$spl, _r$message$match$$spl2;
+
+              return {
+                message: r.message.replace(/\$\{\{/g, ""),
+                text: r.message.replace(/\$\{\{/g, ""),
+                time: "",
+                isUser: ((_r$role = r.role) === null || _r$role === void 0 ? void 0 : _r$role.toString()) == "User",
+                options: (_r$message = r.message) === null || _r$message === void 0 ? void 0 : (_r$message$match = _r$message.match(regex)) === null || _r$message$match === void 0 ? void 0 : (_r$message$match$ = _r$message$match[1]) === null || _r$message$match$ === void 0 ? void 0 : (_r$message$match$$spl = _r$message$match$.split(" || ")) === null || _r$message$match$$spl === void 0 ? void 0 : (_r$message$match$$spl2 = _r$message$match$$spl[1]) === null || _r$message$match$$spl2 === void 0 ? void 0 : _r$message$match$$spl2.split("/")
+              };
+            })) || []);
+          }
+        });
+      }, function (err) {
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [id]);
+
+  var handleChoiceOption = function handleChoiceOption(option) {
+    try {
+      var responses = chats.concat([{
+        isUser: true,
+        message: option,
+        time: ""
+      }, {
+        time: "",
+        isUser: false,
+        message: ""
+      }]);
+      setChats(responses);
+      var startDate;
+      var endDate;
+
+      switch (option.toLowerCase()) {
+        case "this month":
+          startDate = !(prompt !== null && prompt !== void 0 && prompt.isCompareDataTime) ? moment().startOf("month").valueOf() : moment().subtract(1, "month").startOf("month").valueOf();
+          endDate = moment().endOf("month").valueOf();
+          break;
+
+        case "this week":
+          startDate = !(prompt !== null && prompt !== void 0 && prompt.isCompareDataTime) ? moment().startOf("week").valueOf() : moment().subtract(1, "week").startOf("week").valueOf();
+          endDate = moment().endOf("week").valueOf();
+          break;
+
+        case "last month":
+          startDate = !(prompt !== null && prompt !== void 0 && prompt.isCompareDataTime) ? moment().subtract(1, "month").startOf("month").valueOf() : moment().subtract(2, "month").startOf("month").valueOf();
+          endDate = moment().subtract(1, "month").endOf("month").valueOf();
+          break;
+
+        case "last year":
+          startDate = !(prompt !== null && prompt !== void 0 && prompt.isCompareDataTime) ? moment().subtract(1, "year").startOf("year").valueOf() : moment().subtract(2, "year").startOf("year").valueOf();
+          endDate = moment().subtract(1, "year").endOf("year").valueOf();
+          break;
+
+        case "today":
+          startDate = !(prompt !== null && prompt !== void 0 && prompt.isCompareDataTime) ? moment().startOf("day").valueOf() : moment().subtract(1, "day").startOf("day").valueOf();
+          endDate = moment().endOf("day").valueOf();
+          break;
+
+        default:
+          break;
+      }
+
+      if (startDate && endDate) {
+        !!prompt && getSessionAnswerData(startDate, endDate, prompt, option, responses);
+      } else {
+        if ((prompt === null || prompt === void 0 ? void 0 : prompt.dataType) == IDataType.Total) {
+          var dataInputPrompt = "Here is the data summary:  \n                    - Total check-ins: " + totalCheckIns.checkInCount + "  \n                    - Completed check-ins: " + totalCheckIns.checkInCompleteCount + "  \n                    - Total one-on-one sessions: " + totalCheckIns.oneToOneCount + "  \n                    - Completed one-on-one sessions: " + totalCheckIns.oneToOneCompleteCount + "  \n\n                    The following students and teachers have not completed their tasks:  \n                    - Pending check-ins: " + totalCheckIns.studentNotDoneCheckIns.join(", ") + "  \n                    - Pending one-on-one conversations: " + totalCheckIns.studentNotDoneConversations.join(", ");
+          !!prompt && askGeminiAI(dataInputPrompt, prompt, "", responses);
+        } else {
+          var _dataInputPrompt = "This is the data:\n" + (!(answers !== null && answers !== void 0 && answers.length) ? "No data available for analysis." : answers.map(function (r) {
+            return "Student name: " + r.fullName + ", \n                        Answer: " + r.answer + ", \n                        Student grade: " + r.grade + ", \n                        Start time: " + r.startTime + ", \n                        Question: " + r.question + ", \n                        Teacher name: " + r.teacherName + ";";
+          }).join("\n"));
+
+          !!prompt && askGeminiAI(_dataInputPrompt, prompt, "", responses);
+        }
+      }
+    } catch (err) {
+      var _err$response;
+
+      dispatch(marioCore.setAlert({
+        type: "danger",
+        message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : _err$response.data) || err.message
+      }));
+    }
+  };
+
+  var getSessionAnswerData = React.useCallback(function (startDate, endDate, prompt, labelTime, responses) {
+    try {
+      var _temp6 = _catch(function () {
+        var filters = {
+          startDate: startDate,
+          endDate: endDate,
+          question: prompt.question,
+          instruction: prompt.instruction,
+          studentName: inputString
+        };
+        return Promise.resolve(prompt.dataType != IDataType.Total ? getSessionAnswer(filters) : getTotalSession(filters)).then(function (res) {
+          if (prompt.dataType == IDataType.Total) {
+            setTotalCheckIns(res.data);
+            var totals = res.data;
+            var dataInputPrompt = "Here is the data summary:  \n                        - Total check-ins: " + totals.checkInCount + "  \n                        - Completed check-ins: " + totals.checkInCompleteCount + "  \n                        - Total one-on-one sessions: " + totals.oneToOneCount + "  \n                        - Completed one-on-one sessions: " + totals.oneToOneCompleteCount + "  \n\n                        The following students and teachers have not completed their tasks:  \n                        - Pending check-ins: " + totals.studentNotDoneCheckIns.join(", ") + "  \n                        - Pending one-on-one conversations: " + totals.studentNotDoneConversations.join(", ");
+            askGeminiAI(dataInputPrompt, prompt, labelTime, responses);
+          } else {
+            var _answers = res.data || [];
+
+            setAnswers(_answers);
+
+            var _dataInputPrompt2 = "This is the data:\n" + (!(_answers !== null && _answers !== void 0 && _answers.length) ? "No data available for analysis." : _answers.map(function (r) {
+              return "Student name: " + r.fullName + ", \n                            Answer: " + r.answer + ", \n                            Student grade: " + r.grade + ", \n                            Start time: " + r.startTime + ", \n                            Question: " + r.question + ", \n                            Teacher name: " + r.teacherName + ";";
+            }).join("\n"));
+
+            askGeminiAI(_dataInputPrompt2, prompt, labelTime, responses);
+          }
+        });
+      }, function (err) {
+        var _err$response2;
+
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: ((_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : _err$response2.data) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [prompt, historyId, inputString]);
+  var saveHistoryPrompt = React.useCallback(function (data) {
+    try {
+      var _temp8 = _catch(function () {
+        return Promise.resolve(createHistory(data)).then(function (res) {
+          setHistoryId(res.data);
+        });
+      }, function (err) {
+        var _err$response3;
+
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: ((_err$response3 = err.response) === null || _err$response3 === void 0 ? void 0 : _err$response3.data) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp8 && _temp8.then ? _temp8.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [historyId]);
+
+  var askGeminiAI = function askGeminiAI(dataInputPrompt, prompt, labelTime, responses) {
+    try {
+      var _temp10 = _catch(function () {
+        var genAI = new generativeAi.GoogleGenerativeAI("AIzaSyDLvLHpaqW2M7teNlTwN_0aFOTBvzL2yIM");
+        var model = genAI.getGenerativeModel({
+          model: prompt.aiModel
+        });
+        var userMessages = prompt.messages.filter(function (r) {
+          var _r$role2;
+
+          return ((_r$role2 = r.role) === null || _r$role2 === void 0 ? void 0 : _r$role2.toString()) != "System";
+        }).map(function (i) {
+          var _i$role2, _i$message;
+
+          return {
+            role: (_i$role2 = i.role) === null || _i$role2 === void 0 ? void 0 : _i$role2.toString().toLowerCase(),
+            parts: [{
+              text: (_i$message = i.message) === null || _i$message === void 0 ? void 0 : _i$message.replace(/{time}/g, labelTime)
+            }]
+          };
+        });
+        var updatedChatHistory = responses.filter(function (r) {
+          return r.message;
+        }).reduce(function (acc, i) {
+          acc.push({
+            role: i.isUser ? "user" : "model",
+            parts: [{
+              text: i.message
+            }]
+          });
+
+          if (timeKeywords.includes(i.message.toLowerCase())) {
+            acc.push({
+              role: "user",
+              parts: [{
+                text: dataInputPrompt
+              }]
+            });
+          }
+
+          return acc;
+        }, []);
+        var systemMessages = prompt.messages.filter(function (r) {
+          var _r$role3;
+
+          return ((_r$role3 = r.role) === null || _r$role3 === void 0 ? void 0 : _r$role3.toString()) == "System";
+        }).map(function (i) {
+          var _i$message2;
+
+          return {
+            text: (_i$message2 = i.message) === null || _i$message2 === void 0 ? void 0 : _i$message2.replace(/{time}/g, labelTime)
+          };
+        });
+        var contents = [].concat(userMessages, updatedChatHistory);
+        return Promise.resolve(model.generateContent({
+          contents: contents,
+          systemInstruction: {
+            role: "system",
+            parts: [].concat(systemMessages, [{
+              text: dataInputPrompt
+            }])
+          },
+          generationConfig: {
+            temperature: prompt.temperature,
+            topP: prompt.topP,
+            topK: prompt.topK,
+            maxOutputTokens: prompt.maxOutputTokens,
+            frequencyPenalty: prompt.frequencyPenalty,
+            presencePenalty: prompt.presencePenalty,
+            responseMimeType: "text/plain"
+          }
+        })).then(function (result) {
+          var _result$response;
+
+          var partialText = result === null || result === void 0 ? void 0 : (_result$response = result.response) === null || _result$response === void 0 ? void 0 : _result$response.text();
+
+          if (!!partialText) {
+            var aiChats = [];
+            setChats(function (prevChats) {
+              var _match$1$split$;
+
+              var regex = /\{{(.*?)}}/;
+              var match = partialText.match(regex);
+              var messageText = partialText.replace(regex, "").trim();
+              var updatedChats = [].concat(prevChats, [{
+                isUser: false,
+                message: messageText,
+                time: "",
+                text: ""
+              }], match ? [{
+                isUser: false,
+                message: match[1],
+                time: "",
+                text: "",
+                options: (_match$1$split$ = match[1].split(" || ")[1]) === null || _match$1$split$ === void 0 ? void 0 : _match$1$split$.split("/")
+              }] : []).filter(function (r) {
+                return r.message;
+              });
+              aiChats = updatedChats;
+              return updatedChats;
+            });
+            saveHistoryPrompt(_extends({}, prompt, {
+              messages: aiChats,
+              output: "",
+              promptId: prompt.id,
+              grade: "",
+              calendar: "",
+              createdAt: "",
+              id: historyId != null ? historyId : undefined
+            }));
+          }
+        });
+      }, function (err) {
+        var _err$response4, _err$response4$data;
+
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: ((_err$response4 = err.response) === null || _err$response4 === void 0 ? void 0 : (_err$response4$data = _err$response4.data) === null || _err$response4$data === void 0 ? void 0 : _err$response4$data.title) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp10 && _temp10.then ? _temp10.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  React.useEffect(function () {
+    id && getPromptDetail();
+  }, [id]);
+  return {
+    theme: theme,
+    setTheme: setTheme,
+    goBack: goBack,
+    isOpenSideBar: isOpenSideBar,
+    prompt: prompt,
+    chats: chats,
+    handleChoiceOption: handleChoiceOption,
+    getBracketedText: getBracketedText,
+    submitPromptMessage: submitPromptMessage,
+    inputString: inputString,
+    setInputString: setInputString
+  };
+};
+
+var MarioAIIcon = function MarioAIIcon() {
+  return React__default.createElement("svg", {
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React__default.createElement("circle", {
+    cx: "16",
+    cy: "16",
+    r: "16",
+    fill: "url(#paint0_linear_11446_18038)"
+  }), React__default.createElement("path", {
+    d: "M15.7334 17.5834C15.6051 17.9753 15.0615 17.9753 14.9332 17.5834L14.1807 15.2832C14.0151 14.7776 13.7361 14.3182 13.3658 13.9414C12.9954 13.5646 12.544 13.2808 12.0471 13.1125L9.78872 12.3465C9.40376 12.2159 9.40376 11.6625 9.78872 11.5319L12.0483 10.766C12.545 10.5974 12.9963 10.3133 13.3665 9.93633C13.7366 9.55933 14.0154 9.09975 14.1808 8.59402L14.9332 6.29501C14.9608 6.2092 15.0144 6.13448 15.0863 6.0815C15.1581 6.02852 15.2446 6 15.3333 6C15.422 6 15.5085 6.02852 15.5803 6.0815C15.6522 6.13448 15.7058 6.2092 15.7334 6.29501L16.4858 8.59521C16.6513 9.10072 16.9302 9.56006 17.3003 9.93684C17.6705 10.3136 18.1217 10.5975 18.6183 10.766L20.8779 11.5319C20.9622 11.5601 21.0356 11.6146 21.0876 11.6878C21.1396 11.7609 21.1677 11.8489 21.1677 11.9392C21.1677 12.0295 21.1396 12.1175 21.0876 12.1907C21.0356 12.2638 20.9622 12.3184 20.8779 12.3465L18.6183 13.1125C18.1217 13.281 17.6705 13.5648 17.3003 13.9416C16.9302 14.3184 16.6513 14.7777 16.4858 15.2832L15.7334 17.5834ZM20.2398 23.6385C20.223 23.6899 20.1908 23.7347 20.1477 23.7664C20.1045 23.7981 20.0527 23.8152 19.9995 23.8152C19.9462 23.8152 19.8944 23.7981 19.8512 23.7664C19.8081 23.7347 19.7759 23.6899 19.7592 23.6385L19.3077 22.2586C19.1059 21.6435 18.6323 21.1614 18.028 20.9559L16.6725 20.4964C16.622 20.4794 16.578 20.4466 16.5468 20.4026C16.5157 20.3587 16.4989 20.3059 16.4989 20.2518C16.4989 20.1976 16.5157 20.1448 16.5468 20.1009C16.578 20.057 16.622 20.0242 16.6725 20.0071L18.028 19.5476C18.326 19.4465 18.5968 19.2761 18.8189 19.05C19.0411 18.8239 19.2084 18.5483 19.3077 18.2449L19.7592 16.865C19.7759 16.8136 19.8081 16.7688 19.8512 16.7371C19.8944 16.7054 19.9462 16.6883 19.9995 16.6883C20.0527 16.6883 20.1045 16.7054 20.1477 16.7371C20.1908 16.7688 20.223 16.8136 20.2398 16.865L20.6912 18.2449C20.7905 18.5483 20.9578 18.8239 21.18 19.05C21.4021 19.2761 21.6729 19.4465 21.9709 19.5476L23.3264 20.0071C23.377 20.0242 23.4209 20.057 23.4521 20.1009C23.4832 20.1448 23.5 20.1976 23.5 20.2518C23.5 20.3059 23.4832 20.3587 23.4521 20.4026C23.4209 20.4466 23.377 20.4794 23.3264 20.4964L21.9709 20.9559C21.6729 21.057 21.4021 21.2274 21.18 21.4535C20.9578 21.6796 20.7905 21.9553 20.6912 22.2586L20.2398 23.6385ZM11.9935 24.8842C11.982 24.918 11.9604 24.9473 11.9317 24.9681C11.9031 24.9888 11.8688 25 11.8337 25C11.7985 25 11.7642 24.9888 11.7356 24.9681C11.7069 24.9473 11.6854 24.918 11.6739 24.8842L11.3729 23.9651C11.2387 23.5542 10.9226 23.2324 10.519 23.0958L9.61607 22.7895C9.58286 22.7777 9.55405 22.7558 9.53367 22.7266C9.51328 22.6975 9.50233 22.6626 9.50233 22.6268C9.50233 22.591 9.51328 22.5561 9.53367 22.5269C9.55405 22.4978 9.58286 22.4758 9.61607 22.4641L10.519 22.1577C10.7179 22.0903 10.8986 21.9767 11.0469 21.8258C11.1951 21.6749 11.3067 21.4909 11.3729 21.2884L11.6739 20.3693C11.6854 20.3355 11.7069 20.3062 11.7356 20.2854C11.7642 20.2647 11.7985 20.2535 11.8337 20.2535C11.8688 20.2535 11.9031 20.2647 11.9317 20.2854C11.9604 20.3062 11.982 20.3355 11.9935 20.3693L12.2945 21.2884C12.3606 21.4909 12.4723 21.6749 12.6205 21.8258C12.7687 21.9767 12.9495 22.0903 13.1484 22.1577L14.0501 22.4641C14.0833 22.4758 14.1121 22.4978 14.1325 22.5269C14.1529 22.5561 14.1638 22.591 14.1638 22.6268C14.1638 22.6626 14.1529 22.6975 14.1325 22.7266C14.1121 22.7558 14.0833 22.7777 14.0501 22.7895L13.1472 23.0958C12.7436 23.2324 12.4274 23.5542 12.2933 23.9651L11.9935 24.8842Z",
+    fill: "white"
+  }), React__default.createElement("defs", null, React__default.createElement("linearGradient", {
+    id: "paint0_linear_11446_18038",
+    x1: "0",
+    y1: "16",
+    x2: "32",
+    y2: "16",
+    gradientUnits: "userSpaceOnUse"
+  }, React__default.createElement("stop", {
+    stopColor: "#346DDA"
+  }), React__default.createElement("stop", {
+    offset: "1",
+    stopColor: "#844DE1"
+  }))));
+};
+
+var ChatContent = function ChatContent(_ref) {
+  var theme = _ref.theme,
+      chats = _ref.chats,
+      onSelectOption = _ref.onSelectOption,
+      getBracketedText = _ref.getBracketedText,
+      submitPromptMessage = _ref.submitPromptMessage,
+      inputString = _ref.inputString,
+      setInputString = _ref.setInputString;
+  return React__default.createElement("div", {
+    className: (theme === THEME.DARK ? styles$d["ai-mario-chat__content___dark"] : "") + " " + styles$d["ai-mario-chat__content"] + " "
+  }, React__default.createElement("div", {
+    className: "" + styles$d["content-container"]
+  }, function () {
+    var stopIndex = chats.findIndex(function (r) {
+      return getBracketedText(r.message || "") !== null;
+    });
+    if (stopIndex === -1) stopIndex = chats.length;
+    return chats.slice(0, stopIndex + 1).map(function (item, i) {
+      var _item$message, _item$message$split, _item$message$split$, _item$text, _item$text$split, _item$text$split$;
+
+      var bracketedText = getBracketedText(item.message || "");
+      return bracketedText ? React__default.createElement("div", {
+        className: styles$d["bracketed-input-block"] + " d-flex align-items-center"
+      }, React__default.createElement(core$1.TextField, {
+        variant: "outlined",
+        key: "input-" + i,
+        type: "text",
+        className: styles$d["bracketed-input"],
+        label: "Please enter " + (bracketedText === null || bracketedText === void 0 ? void 0 : bracketedText.toLowerCase()) + "...",
+        value: inputString,
+        onChange: function onChange(e) {
+          return setInputString === null || setInputString === void 0 ? void 0 : setInputString(e.target.value);
+        }
+      }), inputString && React__default.createElement(SendIcon, {
+        className: styles$d["icon-input"],
+        onClick: function onClick() {
+          return submitPromptMessage === null || submitPromptMessage === void 0 ? void 0 : submitPromptMessage();
+        }
+      })) : React__default.createElement("div", {
+        key: i,
+        className: styles$d["chat-box"] + " " + (item.isUser ? styles$d["chat-box__user-container"] : "")
+      }, !item.isUser && React__default.createElement("div", {
+        className: styles$d["chat-box__avatar"]
+      }, React__default.createElement(MarioAIIcon, null)), React__default.createElement("div", {
+        className: styles$d["chat-box__content"] + " " + (item.isUser ? styles$d["chat-box__user"] : "")
+      }, !item.isUser && React__default.createElement("div", {
+        className: styles$d["name"]
+      }, "Mario AI"), React__default.createElement("div", {
+        className: styles$d["message"],
+        style: !item.message && !item.text ? {
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center",
+          padding: "14px 24px 12px 24px",
+          width: 80
+        } : {}
+      }, item.message || item.text ? React__default.createElement(React.Fragment, null, React__default.createElement(Markdown, null, ((_item$message = item.message) === null || _item$message === void 0 ? void 0 : (_item$message$split = _item$message.split(" || ")) === null || _item$message$split === void 0 ? void 0 : (_item$message$split$ = _item$message$split[0]) === null || _item$message$split$ === void 0 ? void 0 : _item$message$split$.trim()) || ((_item$text = item.text) === null || _item$text === void 0 ? void 0 : (_item$text$split = _item$text.split(" || ")) === null || _item$text$split === void 0 ? void 0 : (_item$text$split$ = _item$text$split[0]) === null || _item$text$split$ === void 0 ? void 0 : _item$text$split$.trim()) || ""), item.options && React__default.createElement("div", {
+        className: styles$d["option"]
+      }, item.options.map(function (option) {
+        return React__default.createElement("button", {
+          key: option,
+          onClick: function onClick() {
+            return onSelectOption === null || onSelectOption === void 0 ? void 0 : onSelectOption(option);
+          },
+          className: styles$d["option__item"]
+        }, option);
+      }))) : React__default.createElement("div", {
+        className: styles$d["loader"]
+      }, React__default.createElement("span", {
+        className: styles$d["loader__dot"]
+      }), React__default.createElement("span", {
+        className: styles$d["loader__dot"]
+      }), React__default.createElement("span", {
+        className: styles$d["loader__dot"]
+      }))), (item.message || item.text) && React__default.createElement("div", {
+        className: styles$d["time"]
+      }, item.time)));
+    });
+  }()));
+};
+
+var ChatWithAI = function ChatWithAI() {
+  var _prompt$name;
+
+  var _useAIChat = useAIChat(),
+      theme = _useAIChat.theme,
+      setTheme = _useAIChat.setTheme,
+      goBack = _useAIChat.goBack,
+      isOpenSideBar = _useAIChat.isOpenSideBar,
+      prompt = _useAIChat.prompt,
+      chats = _useAIChat.chats,
+      handleChoiceOption = _useAIChat.handleChoiceOption,
+      getBracketedText = _useAIChat.getBracketedText,
+      submitPromptMessage = _useAIChat.submitPromptMessage,
+      inputString = _useAIChat.inputString,
+      setInputString = _useAIChat.setInputString;
+
+  return React__default.createElement("div", {
+    className: styles$d['ai-mario-chat']
+  }, React__default.createElement(ChatHeader, {
+    theme: theme,
+    setTheme: setTheme,
+    goBack: goBack,
+    isOpenSideBar: isOpenSideBar,
+    name: (_prompt$name = prompt === null || prompt === void 0 ? void 0 : prompt.name) != null ? _prompt$name : ""
+  }), React__default.createElement(ChatContent, {
+    theme: theme,
+    chats: chats,
+    onSelectOption: handleChoiceOption,
+    getBracketedText: getBracketedText,
+    submitPromptMessage: submitPromptMessage,
+    inputString: inputString,
+    setInputString: setInputString
+  }));
+};
+
+var useHistoryPrompt = function useHistoryPrompt() {
+  var dispatch = reactRedux.useDispatch();
+  var history = reactRouterDom.useHistory();
+
+  var _useParams = reactRouterDom.useParams(),
+      id = _useParams.id;
+
+  var _useState = React.useState("light"),
+      theme = _useState[0],
+      setTheme = _useState[1];
+
+  var isOpenSideBar = reactRedux.useSelector(function (state) {
+    var _state$common;
+
+    return (_state$common = state.common) === null || _state$common === void 0 ? void 0 : _state$common.menuBar;
+  });
+
+  var _useState2 = React.useState(),
+      prompt = _useState2[0],
+      setPrompt = _useState2[1];
+
+  var goBack = function goBack() {
+    history.goBack();
+  };
+
+  var getBracketedText = function getBracketedText(text) {
+    return (text.match(/\[\[(.*?)\]\]/) || [])[1] || null;
+  };
+
+  var getPromptDetail = React.useCallback(function () {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(marioCore.setLoading(false));
+      };
+
+      dispatch(marioCore.setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(getHistoryById(parseInt(id))).then(function (res) {
+          if (res.data) {
+            setPrompt(res.data);
+          }
+        });
+      }, function (err) {
+        dispatch(marioCore.setAlert({
+          type: "danger",
+          message: err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [id]);
+  React.useEffect(function () {
+    id && getPromptDetail();
+  }, [id]);
+  return {
+    theme: theme,
+    setTheme: setTheme,
+    goBack: goBack,
+    isOpenSideBar: isOpenSideBar,
+    prompt: prompt,
+    getBracketedText: getBracketedText
+  };
+};
+
+var ViewHistoryPrompt = function ViewHistoryPrompt() {
+  var _prompt$name;
+
+  var _useHistoryPrompt = useHistoryPrompt(),
+      goBack = _useHistoryPrompt.goBack,
+      isOpenSideBar = _useHistoryPrompt.isOpenSideBar,
+      prompt = _useHistoryPrompt.prompt,
+      setTheme = _useHistoryPrompt.setTheme,
+      theme = _useHistoryPrompt.theme,
+      getBracketedText = _useHistoryPrompt.getBracketedText;
+
+  return React__default.createElement("div", {
+    className: styles$d["ai-mario-chat"]
+  }, React__default.createElement(ChatHeader, {
+    theme: theme,
+    setTheme: setTheme,
+    goBack: goBack,
+    isOpenSideBar: isOpenSideBar,
+    name: (_prompt$name = prompt === null || prompt === void 0 ? void 0 : prompt.name) != null ? _prompt$name : ""
+  }), React__default.createElement(ChatContent, {
+    theme: theme,
+    chats: (prompt === null || prompt === void 0 ? void 0 : prompt.messages) || [],
+    getBracketedText: getBracketedText,
+    inputString: ""
+  }));
+};
+
+var styles$e = {"survey-portal":"_32YVh","create-new-btn":"_2pqkt","survey-portal-dashboard":"_10mFg","dashboard-root":"_ol6v1","dashboard-header":"_1nGwv","header-left":"_3ZVx1","header-left-title":"_3zJ6N","header-left-description":"_aNEzP","dashboard-cards":"_T2QhN","show-blur":"_2k8eW","scroll-btn":"_3LX77","dashboard-card":"_rV_wf","dashboard-card-title":"_1dkjY","dashboard-card-description":"_2N0Jl","learn-more-btn":"_FoRnw","dashboard-surveys":"_y4RMj","dashboard-stats":"_2vCyM","dashboard-stats-title":"_1RtaL","create-template-button":"_1VeM-","create-survey-button":"_2FW07","survey-index":"_1-7Lk","survey-index-left":"_7ASwE","last-survey-index":"_5wgo2","survey-index-right":"_1bOyN","survey-index-card":"_2N-Ie","index-title":"_n24sR","link-view-survey":"_1f6ee","header-link":"_3dWko","active-survey-card":"_bKT0k","index-card-value":"_1O-jW","index-card-description":"_GLrEM","schedule-survey-card":"_1LDJ_","survey-item":"_W9PK3","survey-item-title":"_3c4hi","survey-item-date":"_2EvrJ","survey-item-Active":"_29PJt","survey-item-Close":"_GAmd7","survey-item-more":"_1Gz67","action-wrapper":"_15kTE","action-item":"_3LaNO","template-icon":"_nXa-q"};
+
+var PopoverCustom$2 = core$1.styled(core$1.Popover)(function () {
+  return {
+    "& .MuiPopover-paper": {
+      boxShadow: "0px 0px 32px 0px rgba(64, 95, 152, 0.32)"
+    }
+  };
+});
+
 var SurveyPortal = function SurveyPortal() {
   var _listTotal$find, _listTotal$find2, _listSurvey$items;
 
@@ -77746,22 +79284,22 @@ var SurveyPortal = function SurveyPortal() {
     };
   }, [questionCateList]);
   return React__default.createElement(core$1.Grid, {
-    className: styles$d["dashboard-root"] + " "
+    className: styles$e["dashboard-root"] + " "
   }, React__default.createElement(core$1.Grid, {
-    className: styles$d["dashboard-header"] + "  " + styles$d[isScrollable ? "show-blur" : ""] + " d-flex justify-content-between shadow-lg"
+    className: styles$e["dashboard-header"] + "  " + styles$e[isScrollable ? "show-blur" : ""] + " d-flex justify-content-between shadow-lg"
   }, React__default.createElement(core$1.Grid, {
-    className: "" + styles$d["header-left"]
+    className: "" + styles$e["header-left"]
   }, React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["header-left-title"]
+    className: "" + styles$e["header-left-title"]
   }, "Empower student well being with ready-to-use survey templates"), React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["header-left-description"]
+    className: "" + styles$e["header-left-description"]
   }, "Our templates are research-based and designed to track and support emotional, social, and academic health in schools.")), React__default.createElement(core$1.Grid, {
     ref: cardsRef,
-    className: styles$d["dashboard-cards"]
+    className: styles$e["dashboard-cards"]
   }, questionCateList === null || questionCateList === void 0 ? void 0 : questionCateList.map(function (r, index) {
     return React__default.createElement(core$1.Grid, {
       key: index,
-      className: styles$d["dashboard-card"]
+      className: styles$e["dashboard-card"]
     }, React__default.createElement(core$1.Grid, null, React__default.createElement(core$1.Grid, {
       container: true,
       spacing: 2
@@ -77772,40 +79310,40 @@ var SurveyPortal = function SurveyPortal() {
       arrow: true,
       title: r.name || ""
     }, React__default.createElement(core$1.Typography, {
-      className: styles$d["dashboard-card-title"]
+      className: styles$e["dashboard-card-title"]
     }, r.name))), React__default.createElement(core$1.Grid, {
       item: true,
       xs: 4,
       className: "d-flex justify-content-end"
     }, React__default.createElement("img", {
-      className: "" + styles$d["template-icon"],
+      className: "" + styles$e["template-icon"],
       src: "/images/" + templateIcons[index]
     }))), React__default.createElement(CustomTooltip, {
       arrow: true,
       title: r.description || ""
     }, React__default.createElement(core$1.Typography, {
-      className: styles$d["dashboard-card-description"]
+      className: styles$e["dashboard-card-description"]
     }, r.description))), React__default.createElement(reactstrap.Button, {
       onClick: function onClick() {
         return goToTemplateSurvey();
       },
-      className: styles$d["learn-more-btn"]
+      className: styles$e["learn-more-btn"]
     }, React__default.createElement(core$1.Typography, null, "Learn More"), React__default.createElement(ArrowForwardIcon, null)));
   })), React__default.createElement("img", {
     onClick: function onClick() {
       return handleScroll();
     },
-    className: "" + styles$d["scroll-btn"],
+    className: "" + styles$e["scroll-btn"],
     src: imageSrc,
     alt: "scroll",
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave
   })), React__default.createElement(core$1.Grid, {
-    className: styles$d["dashboard-surveys"] + " shadow-lg"
+    className: styles$e["dashboard-surveys"] + " shadow-lg"
   }, React__default.createElement(core$1.Grid, {
-    className: styles$d["dashboard-stats"]
+    className: styles$e["dashboard-stats"]
   }, React__default.createElement(core$1.Typography, {
-    className: styles$d["dashboard-stats-title"]
+    className: styles$e["dashboard-stats-title"]
   }, "Surveys"), React__default.createElement(core$1.Grid, {
     className: "d-flex align-items-center"
   }, React__default.createElement("button", {
@@ -77813,85 +79351,85 @@ var SurveyPortal = function SurveyPortal() {
       localStorage.setItem("OPEN_DEFAULT_MODEL", "true");
       goToTemplateSurvey();
     },
-    className: styles$d["create-template-button"]
+    className: styles$e["create-template-button"]
   }, React__default.createElement(AddIcon, null), React__default.createElement(core$1.Typography, null, "CREATE NEW TEMPLATE")), React__default.createElement("button", {
     onClick: function onClick() {
       return handleChangePageCreate();
     },
-    className: styles$d["create-survey-button"]
+    className: styles$e["create-survey-button"]
   }, React__default.createElement(AddIcon, null), React__default.createElement(core$1.Typography, null, "CREATE NEW SURVEY")))), React__default.createElement(core$1.Grid, {
-    className: styles$d["survey-index"] + " d-flex"
+    className: styles$e["survey-index"] + " d-flex"
   }, React__default.createElement(core$1.Grid, {
-    className: styles$d["survey-index-left"] + " d-flex flex-column"
+    className: styles$e["survey-index-left"] + " d-flex flex-column"
   }, React__default.createElement(core$1.Grid, {
-    className: "d-flex align-items-center " + styles$d["header-link"]
+    className: "d-flex align-items-center " + styles$e["header-link"]
   }, React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-title"]
+    className: "" + styles$e["index-title"]
   }, "Survey Dashboard"), React__default.createElement(core$1.Grid, {
     onClick: function onClick() {
       return goToDashboardSurvey();
     },
-    className: "d-flex align-items-center " + styles$d["link-view-survey"]
+    className: "d-flex align-items-center " + styles$e["link-view-survey"]
   }, React__default.createElement(core$1.Typography, null, "View"), React__default.createElement(ArrowForwardIcon, null))), React__default.createElement(core$1.Grid, {
-    className: "d-flex justify-content-between align-items-center " + styles$d["active-survey-card"] + " " + styles$d["survey-index-card"]
+    className: "d-flex justify-content-between align-items-center " + styles$e["active-survey-card"] + " " + styles$e["survey-index-card"]
   }, React__default.createElement(core$1.Grid, {
     className: "d-flex flex-column"
   }, React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-card-value"]
+    className: "" + styles$e["index-card-value"]
   }, ((_listTotal$find = listTotal.find(function (r) {
     return r.title == "active_surveys";
   })) === null || _listTotal$find === void 0 ? void 0 : _listTotal$find.value) || 0), React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-card-description"]
+    className: "" + styles$e["index-card-description"]
   }, "Active Surveys")), React__default.createElement(core$1.Grid, {
     className: "full-height"
   }, React__default.createElement("img", {
     src: "/images/active-surveys.png",
     alt: "total-card"
   }))), React__default.createElement(core$1.Grid, {
-    className: "d-flex justify-content-between align-items-center " + styles$d["schedule-survey-card"] + " " + styles$d["survey-index-card"]
+    className: "d-flex justify-content-between align-items-center " + styles$e["schedule-survey-card"] + " " + styles$e["survey-index-card"]
   }, React__default.createElement(core$1.Grid, {
     className: "d-flex flex-column"
   }, React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-card-value"]
+    className: "" + styles$e["index-card-value"]
   }, ((_listTotal$find2 = listTotal.find(function (r) {
     return r.title == "scheduled_sessions";
   })) === null || _listTotal$find2 === void 0 ? void 0 : _listTotal$find2.value) || 0), React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-card-description"]
+    className: "" + styles$e["index-card-description"]
   }, "Scheduled Session")), React__default.createElement(core$1.Grid, {
     className: "full-height"
   }, React__default.createElement("img", {
     src: "/images/scheduled-session.png",
     alt: "total-card"
   })))), React__default.createElement(core$1.Grid, {
-    className: styles$d["survey-index-right"]
+    className: styles$e["survey-index-right"]
   }, React__default.createElement(core$1.Grid, {
-    className: "d-flex align-items-center " + styles$d["header-link"]
+    className: "d-flex align-items-center " + styles$e["header-link"]
   }, React__default.createElement(core$1.Typography, {
-    className: "" + styles$d["index-title"]
+    className: "" + styles$e["index-title"]
   }, "Last Surveys"), React__default.createElement(core$1.Grid, {
     onClick: function onClick() {
       return goToSurveyList();
     },
-    className: "d-flex align-items-center " + styles$d["link-view-survey"]
+    className: "d-flex align-items-center " + styles$e["link-view-survey"]
   }, React__default.createElement(core$1.Typography, null, "See All"), React__default.createElement(ArrowForwardIcon, null))), React__default.createElement(core$1.Grid, {
-    className: styles$d["last-survey-index"]
+    className: styles$e["last-survey-index"]
   }, listSurvey === null || listSurvey === void 0 ? void 0 : (_listSurvey$items = listSurvey.items) === null || _listSurvey$items === void 0 ? void 0 : _listSurvey$items.map(function (r) {
     return React__default.createElement(core$1.Grid, {
-      className: "d-flex align-items-center " + styles$d["survey-item"]
+      className: "d-flex align-items-center " + styles$e["survey-item"]
     }, React__default.createElement(CustomTooltip, {
       arrow: true,
       title: r.title || ""
     }, React__default.createElement(core$1.Typography, {
-      className: "" + styles$d["survey-item-title"]
+      className: "" + styles$e["survey-item-title"]
     }, r.title)), React__default.createElement(core$1.Typography, {
-      className: "" + styles$d["survey-item-date"]
+      className: "" + styles$e["survey-item-date"]
     }, React__default.createElement(ConvertTime, {
       time: r.createdDate,
       line: true
     })), React__default.createElement(core$1.Grid, {
-      className: "" + styles$d["survey-item-" + r.status]
+      className: "" + styles$e["survey-item-" + r.status]
     }, React__default.createElement(core$1.Typography, null, r.status)), React__default.createElement(core$1.Grid, {
-      className: "" + styles$d["survey-item-more"]
+      className: "" + styles$e["survey-item-more"]
     }, React__default.createElement(reactstrap.Button, {
       "aria-describedby": popoverId,
       variant: "text",
@@ -77901,7 +79439,7 @@ var SurveyPortal = function SurveyPortal() {
         return handleClickAction(event, r.id, (_r$studentIds = r.studentIds) === null || _r$studentIds === void 0 ? void 0 : _r$studentIds[0]);
       }
     }, React__default.createElement(MoreVertIcon, null))));
-  }))))), React__default.createElement(PopoverCustom$1, {
+  }))))), React__default.createElement(PopoverCustom$2, {
     id: popoverId,
     open: openPopover,
     anchorEl: anchorEl,
@@ -77914,26 +79452,26 @@ var SurveyPortal = function SurveyPortal() {
       vertical: "top",
       horizontal: "left"
     },
-    className: styles$d[classFontSize]
+    className: styles$e[classFontSize]
   }, React__default.createElement("ul", {
-    className: "" + styles$d["action-wrapper"]
+    className: "" + styles$e["action-wrapper"]
   }, React__default.createElement("li", {
     onClick: function onClick() {
       return open(TYPE_SURVEY_OPTION.VIEW_RESPONSE, itemSelectedId);
     },
-    className: styles$d["action-item"] + " text-nowrap"
+    className: styles$e["action-item"] + " text-nowrap"
   }, t("view_responses")), React__default.createElement("li", {
     onClick: function onClick() {
       return open(TYPE_SURVEY_OPTION.VIEW_PREVIEW, itemSelectedId);
     },
-    className: styles$d["action-item"] + " text-nowrap"
+    className: styles$e["action-item"] + " text-nowrap"
   }, t("preview_survey")), React__default.createElement("li", {
     onClick: function onClick() {
       return open(TYPE_SURVEY_OPTION.ANONYMOUS, itemSelectedId);
     },
-    className: styles$d["action-item"] + " text-nowrap"
+    className: styles$e["action-item"] + " text-nowrap"
   }, t("anonymous_link")), React__default.createElement("li", {
-    className: styles$d["action-item"] + " text-nowrap",
+    className: styles$e["action-item"] + " text-nowrap",
     onClick: function onClick() {
       return handleDownloadCsvSurvey(itemSelectedId);
     }
@@ -77941,7 +79479,7 @@ var SurveyPortal = function SurveyPortal() {
     onClick: function onClick() {
       return open(TYPE_SURVEY_OPTION.DELETE, itemSelectedId);
     },
-    className: styles$d["action-item"] + " text-nowrap"
+    className: styles$e["action-item"] + " text-nowrap"
   }, t("delete")))), React__default.createElement(ModelLinkSurvey, {
     open: !!anonymousKey,
     onClose: handleCloseModelLink,
@@ -77952,6 +79490,7 @@ var SurveyPortal = function SurveyPortal() {
 
 core.LicenseManager.setLicenseKey(marioCore.LICENSE_AGGRID);
 
+exports.AIMario = AIMario;
 exports.AdminTraining = AdminTraining;
 exports.AssessmentAssignmentContainer = AssessmentAssignmentContainer;
 exports.AssessmentList = AssessmentList;
@@ -77959,6 +79498,7 @@ exports.AssetLog = AssetLog;
 exports.AssignmentList = AssignmentList;
 exports.BadgeList = BadgeList;
 exports.CertificateContainer = CertificateContainer;
+exports.ChatWithAI = ChatWithAI;
 exports.ClassList = ClassList;
 exports.CompareTeacher = CompareTeacher;
 exports.ConferenceRubricDetail = ConferenceRubricDetail;
@@ -77975,6 +79515,7 @@ exports.HomePage = HomePage;
 exports.LearningStrategyList = LearningStrategyList;
 exports.LearningSupportCategoryList = LearningSupportCategoryList;
 exports.MainLayoutAdmin = MainLayoutAdmin;
+exports.MarioAi = MarioAi;
 exports.OneRosterContainer = OneRosterContainer;
 exports.PreviewSurveyAdmin = PreviewSurveyAdmin;
 exports.QuestionBankContainer = QuestionBankContainer;
@@ -78008,5 +79549,6 @@ exports.TemplateBuilderPage = TemplateBuilderPage;
 exports.TemplateContainer = TemplateContainer;
 exports.TemplateStartBuild = TemplateStartBuild;
 exports.TutorialScreenContainer = TutorialScreenContainer;
+exports.ViewHistoryPrompt = ViewHistoryPrompt;
 exports.WeeklyQuest = WeeklyQuest;
 //# sourceMappingURL=index.js.map