mario-core 2.9.245-release → 2.9.301-release

package/dist/index.modern.js

@@ -2,7 +2,7 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import i18n from 'i18next';
 import { initReactI18next, useTranslation } from 'react-i18next';
 export { I18nextProvider, useTranslation } from 'react-i18next';
-import React, { useState, useCallback, useEffect, forwardRef, useRef, useMemo, Suspense, memo, Fragment, useImperativeHandle } from 'react';
+import React, { useState, useCallback, useEffect, forwardRef, useRef, Suspense, memo, Fragment, useImperativeHandle, useMemo } from 'react';
 import { Input, Modal, ModalHeader, ModalBody, ModalFooter, Button, Form, FormGroup, Row, Col, Navbar, NavbarBrand, Collapse, Nav, NavItem, NavLink, Dropdown, DropdownToggle, DropdownMenu, DropdownItem, Alert, Pagination, PaginationItem, PaginationLink, Table, Label, Popover, PopoverBody, TabContent, TabPane, CardText, CustomInput, Card, CardImg, CardBody, CardTitle, CardHeader } from 'reactstrap';
 import { useHistory, Link, useLocation, Switch, Route, Prompt, useParams } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
@@ -17,7 +17,7 @@ import { useGoogleReCaptcha, GoogleReCaptcha, GoogleReCaptchaProvider } from 're
 import GoogleLogin from 'react-google-login';
 import Select from 'react-select';
 import { GiHamburgerMenu } from 'react-icons/gi';
-import { CSidebar, CSidebarBrand, CSidebarNav, CCreateElement, CSidebarNavDivider, CSidebarNavDropdown, CSidebarNavItem, CSidebarNavTitle, CSidebarFooter, CHeader, CToggler, CHeaderBrand, CHeaderNav, CContainer } from '@coreui/react';
+import { CSidebar, CSidebarBrand, CSidebarNav, CCreateElement, CSidebarNavDivider, CSidebarNavDropdown, CSidebarNavItem, CSidebarNavTitle, CSidebarFooter, CContainer, CHeader, CToggler, CHeaderBrand, CHeaderNav } from '@coreui/react';
 import { CgMenuRight } from 'react-icons/cg';
 import { RiLogoutBoxRLine } from 'react-icons/ri';
 import Pusher from 'pusher-js/with-encryption';
@@ -41,8 +41,8 @@ import 'symbol-observable';
 var dashboard = "Dashboard";
 var user = "User";
 var question_bank = "Question bank";
-var email_template = "Email template";
-var custom_alert = "Custom alert";
+var email_template = "Email Template";
+var custom_alert = "Custom Alert";
 var set_up = "Set up";
 var media_gallery = "Media Gallery";
 var district_school_list = "District school list";
@@ -3978,8 +3978,8 @@ var lang_us = {
 var dashboard$1 = "Dashboard";
 var user$1 = "User";
 var question_bank$1 = "Question bank";
-var email_template$1 = "Email template";
-var custom_alert$1 = "Custom alert";
+var email_template$1 = "Email Template";
+var custom_alert$1 = "Custom Alert";
 var set_up$1 = "Set up";
 var media_gallery$1 = "Media Gallery";
 var district_school_list$1 = "District school list";
@@ -37408,6 +37408,19 @@ var msalConfig = {
   }
 };
 
+var getStaticFileUrl = function getStaticFileUrl(url) {
+  var STAGE_DOMAIN = "https://stage2.marioforme.com";
+  var isStage = STAGE_DOMAIN === location.origin;
+  if (!url) return "";
+  if (isLocalhost && !isStage || url.startsWith("http")) return url;
+  if (url.startsWith("/")) return "" + (isStage ? STAGE_DOMAIN : MARIO_SUCCESS_BASE_URL) + url;else return (isStage ? STAGE_DOMAIN : MARIO_SUCCESS_BASE_URL) + "/" + url;
+};
+
+var getFileUrl = function getFileUrl(fileName) {
+  if (!fileName || !fileName.trim()) return "";
+  return BASE_URL + "/api/file/viewer?key=" + fileName;
+};
+
 var _sessionStorage$getIt;
 var defaultInfo = {
   email: "",
@@ -37542,8 +37555,15 @@ var useLogin = function useLogin() {
 
       var _temp8 = _catch(function () {
         return Promise.resolve(getInfo$1()).then(function (res) {
+          var _res$data$schoolLogo;
+
+          var schoolLogo = (_res$data$schoolLogo = res.data.schoolLogo) != null ? _res$data$schoolLogo : "";
+
           if (!!res.data) {
-            setSchool(res.data);
+            setSchool({
+              schoolName: res.data.schoolName,
+              schoolLogo: !schoolLogo ? getStaticFileUrl("/images/logo_header_blue.png") : getFileUrl(schoolLogo)
+            });
           }
         });
       }, function (err) {
@@ -38069,19 +38089,6 @@ var BlockSelectTeacher = function BlockSelectTeacher(_ref) {
 
 var BlockSelectTeacher$1 = forwardRef(BlockSelectTeacher);
 
-var getStaticFileUrl = function getStaticFileUrl(url) {
-  var STAGE_DOMAIN = "https://stage2.marioforme.com";
-  var isStage = STAGE_DOMAIN === location.origin;
-  if (!url) return "";
-  if (isLocalhost && !isStage || url.startsWith("http")) return url;
-  if (url.startsWith("/")) return "" + (isStage ? STAGE_DOMAIN : MARIO_SUCCESS_BASE_URL) + url;else return (isStage ? STAGE_DOMAIN : MARIO_SUCCESS_BASE_URL) + "/" + url;
-};
-
-var getFileUrl = function getFileUrl(fileName) {
-  if (!fileName || !fileName.trim()) return "";
-  return BASE_URL + "/api/file/viewer?key=" + fileName;
-};
-
 var schema = object({
   email: string().email("Email is invalid").required("Email is required"),
   password: string().required("Password is required"),
@@ -38194,7 +38201,8 @@ var BlockLogin = function BlockLogin(_ref) {
     }, React.createElement("div", {
       className: "d-flex align-items-center mb-4"
     }, React.createElement("img", {
-      src: "" + (school !== null && school !== void 0 && school.schoolLogo ? getFileUrl("" + (school === null || school === void 0 ? void 0 : school.schoolLogo)) : getStaticFileUrl("/images/logoR.png")),
+      hidden: !(school !== null && school !== void 0 && school.schoolLogo),
+      src: school === null || school === void 0 ? void 0 : school.schoolLogo,
       className: styles["school-icon"] + " mr-3"
     }), React.createElement("p", {
       className: styles["school-name"] + " mb-0"
@@ -38253,7 +38261,7 @@ var BlockLogin = function BlockLogin(_ref) {
       lg: 12,
       md: 12,
       xs: 12,
-      className: "pr-md-2"
+      className: "pr-md-3"
     }, !!googleClientId && React.createElement(GoogleLogin, {
       clientId: googleClientId,
       buttonText: "GOOGLE",
@@ -38261,14 +38269,15 @@ var BlockLogin = function BlockLogin(_ref) {
       cookiePolicy: "single_host_origin",
       className: styles["btn-login-google"] + " p-0 mb-4 mb-md-0"
     }))), React.createElement("div", {
-      className: "w-100 d-flex align-items-center justify-content-center mt-3"
-    }, React.createElement("a", {
-      href: "https://launchpad.classlink.com/login"
+      className: "" + styles["btn-login-sso"]
+    }, React.createElement("div", {
+      className: styles["btn-login-with-sso"],
+      onClick: function onClick() {
+        return window.open("https://launchpad.classlink.com/login");
+      }
     }, React.createElement("img", {
-      className: styles["class-link-sso-image"],
-      src: getStaticFileUrl("images/classlink-sso.png"),
-      alt: ""
-    }))))));
+      src: "images/class-link-icon.png"
+    }), React.createElement("p", null, "Sign-in with ClassLink"))))));
   }), isLoginGoogle && React.createElement(BlockSelectTeacher$1, {
     onSubmit: function onSubmit(e) {
       return submitLogin(e, clickHandler);
@@ -39415,218 +39424,6 @@ var TheHeaderDropdown = function TheHeaderDropdown(_ref) {
   })), t("log_out")))));
 };
 
-var getCookieValue = function getCookieValue(name) {
-  var _document$cookie$matc;
-
-  return ((_document$cookie$matc = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')) === null || _document$cookie$matc === void 0 ? void 0 : _document$cookie$matc.pop()) || '';
-};
-
-var apiGetLanguage = function apiGetLanguage() {
-  return api.get(BASE_URL + "/api/language");
-};
-
-var apiUpdateLanguage = function apiUpdateLanguage(lang) {
-  return api.put(BASE_URL + "/api/language?lang=" + lang);
-};
-
-var LANGUAGE_SYSTEM = "LANGUAGE_SYSTEM";
-
-var useLanguages = function useLanguages() {
-  var dispatch = useDispatch();
-
-  var _useTranslation = useTranslation(),
-      i18n = _useTranslation.i18n;
-
-  var language = useSelector(function (state) {
-    return state.common.language;
-  });
-  var defaultLanguage = getCookieValue(LANGUAGE_SYSTEM) != null ? getCookieValue(LANGUAGE_SYSTEM) : DEFAULT_LANGUAGE_CODE;
-
-  var _useState = useState([]),
-      languageList = _useState[0],
-      setLanguageList = _useState[1];
-
-  var _useState2 = useState(false),
-      dropdownOpen = _useState2[0],
-      setDropdownOpen = _useState2[1];
-
-  var _useState3 = useState(defaultLanguage),
-      currentLang = _useState3[0],
-      setCurrentLang = _useState3[1];
-
-  var toggle = function toggle() {
-    return setDropdownOpen(function (prevState) {
-      return !prevState;
-    });
-  };
-
-  var changeLanguageApp = function changeLanguageApp(lang) {
-    try {
-      var _temp3 = function _temp3() {
-        dispatch(setLoading(false));
-      };
-
-      dispatch(setLoading(true));
-
-      var _temp4 = _catch(function () {
-        return Promise.resolve(apiUpdateLanguage(lang)).then(function () {
-          i18n.changeLanguage(lang);
-          setCurrentLang(lang);
-          dispatch(setLanguage(lang));
-        });
-      }, function (err) {
-        var _err$response, _err$response$data;
-
-        dispatch(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);
-    }
-  };
-
-  var getListLanguage = function getListLanguage() {
-    try {
-      var _temp6 = _catch(function () {
-        return Promise.resolve(apiGetLanguage()).then(function (res) {
-          setLanguageList(res.data);
-        });
-      }, function (err) {
-        var _err$response2, _err$response2$data;
-
-        dispatch(setAlert({
-          type: "danger",
-          message: ((_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : (_err$response2$data = _err$response2.data) === null || _err$response2$data === void 0 ? void 0 : _err$response2$data.title) || err.message
-        }));
-      });
-
-      return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  useEffect(function () {
-    defaultLanguage != language && changeLanguageApp(defaultLanguage);
-    getListLanguage();
-  }, []);
-  return {
-    languageList: languageList,
-    toggle: toggle,
-    dropdownOpen: dropdownOpen,
-    currentLang: currentLang,
-    changeLanguageApp: changeLanguageApp,
-    setCurrentLang: setCurrentLang
-  };
-};
-
-var TheLanguageDropdown = function TheLanguageDropdown() {
-  var _useLanguages = useLanguages(),
-      languageList = _useLanguages.languageList,
-      toggle = _useLanguages.toggle,
-      dropdownOpen = _useLanguages.dropdownOpen,
-      currentLang = _useLanguages.currentLang,
-      changeLanguageApp = _useLanguages.changeLanguageApp;
-
-  var currentLanguage = useMemo(function () {
-    var current = languageList.find(function (i) {
-      return i.code === currentLang;
-    });
-    if (!current) return null;
-    return React.createElement(React.Fragment, null, React.createElement("img", {
-      className: "mr-2 " + styles['dropdown-menu-flag'],
-      src: "" + getStaticFileUrl(current.image)
-    }), " ", current.name);
-  }, [currentLang, languageList]);
-  return React.createElement(Dropdown, {
-    isOpen: dropdownOpen,
-    toggle: toggle,
-    className: "" + styles["dropdown-menu"]
-  }, React.createElement(DropdownToggle, {
-    className: styles["header-avatar"] + " d-flex align-items-center"
-  }, React.createElement("span", {
-    style: {
-      color: "#000",
-      textTransform: "capitalize",
-      display: 'flex',
-      alignItems: 'center'
-    }
-  }, currentLanguage, React.createElement(BsChevronDown, {
-    className: "ml-2",
-    style: {
-      fontSize: '10px'
-    }
-  }))), React.createElement(DropdownMenu, {
-    className: styles["dropdown-content-language"]
-  }, !!languageList && languageList.length > 0 && languageList.map(function (lang, index) {
-    return React.createElement(DropdownItem, {
-      key: lang.code,
-      className: styles["dropdown-change"] + " px-0 py-0 " + (index === languageList.length - 1 ? "pb-2" : "pt-2"),
-      onClick: function onClick() {
-        return changeLanguageApp(lang.code);
-      }
-    }, React.createElement("div", {
-      className: styles["dropdown-item-language"] + " " + styles["item-logout"] + " " + (currentLang == lang.code ? styles['dropdown-item-language-active'] : "") + " d-flex align-items-center w-100"
-    }, React.createElement("span", {
-      className: "mr-2 d-flex hover-opacity"
-    }, React.createElement("img", {
-      style: {
-        width: "30px",
-        height: "25px",
-        borderRadius: "5px"
-      },
-      src: getStaticFileUrl(lang.image)
-    })), lang.name));
-  })));
-};
-
-var TheHeader = function TheHeader(_ref) {
-  var onToggleModel = _ref.onToggleModel;
-  var dispatch = useDispatch();
-  var sidebarShow = useSelector(function (state) {
-    return state.common.sidebarShow;
-  });
-
-  var _useTranslation = useTranslation(),
-      t = _useTranslation.t;
-
-  var toggleSidebarMobile = function toggleSidebarMobile() {
-    var val = [false, "responsive"].includes(sidebarShow) ? true : "responsive";
-    dispatch(setSidebar(val));
-  };
-
-  var isDistrict = window.location.host.includes("-district");
-  return React.createElement(CHeader, {
-    withSubheader: true,
-    className: "d-flex align-items-center justify-content-end"
-  }, React.createElement(CToggler, {
-    inHeader: true,
-    className: "ml-md-3 d-lg-none",
-    onClick: toggleSidebarMobile
-  }), React.createElement(CHeaderBrand, {
-    className: "mx-auto flex-grow-1 d-lg-none",
-    to: "/"
-  }, React.createElement("img", {
-    src: getStaticFileUrl(Images.LOGO_HEADER),
-    className: styles["header-logo"]
-  })), React.createElement(CHeaderNav, {
-    className: "pr-3"
-  }, React.createElement(TheLanguageDropdown, null), React.createElement("a", {
-    className: "mr-3",
-    style: {
-      color: '#000'
-    },
-    href: '/privacy-policy',
-    target: "blank"
-  }, t("privacy_policy")), !isDistrict && React.createElement(NotificationButton, null), React.createElement(TheHeaderDropdown, {
-    onToggleModel: onToggleModel
-  })));
-};
-
 var TITLE$3 = "Not found";
 
 var NotFound = function NotFound() {
@@ -39684,258 +39481,6 @@ var TheContent = function TheContent(_ref) {
 
 var TheContent$1 = React.memo(TheContent);
 
-var loadingStyle = {
-  minWidth: "100vw",
-  minHeight: "100vh",
-  position: "fixed",
-  top: 0,
-  left: 0,
-  zIndex: 999999999,
-  backgroundColor: "rgba(0, 0, 0, 0.4)",
-  display: "flex",
-  justifyContent: "center",
-  alignItems: "center"
-};
-
-var Loading = function Loading() {
-  var isLoading = useSelector(function (state) {
-    return state.common.isLoading;
-  });
-  localStorage.setItem("LAST_TIME_REQUETST", moment().utc().format("YYYY-MM-DD HH:mm:ss"));
-  return isLoading ? React.createElement("div", {
-    style: loadingStyle
-  }, React.createElement("div", {
-    className: "spinner-border text-secondary",
-    role: "status"
-  }, React.createElement("span", {
-    className: "sr-only"
-  }, "Loading..."))) : null;
-};
-
-var firstCheckToken = function firstCheckToken() {
-  return Promise.resolve(_catch(function () {
-    var token = getAccessToken();
-    return token ? Promise.resolve(checkToken(token)).then(function (tokenStatus) {
-      return tokenStatus.data ? true : false;
-    }) : false;
-  }, function () {
-    return false;
-  }));
-};
-
-var canAccess = function canAccess(userRoles, componentRoles) {
-  if (!Array.isArray(userRoles)) {
-    return false;
-  }
-
-  if (Array.isArray(componentRoles)) {
-    var intersects = userRoles.filter(function (i) {
-      return componentRoles.includes(i);
-    });
-    return intersects.length > 0;
-  }
-
-  return true;
-};
-
-var ModelSelectRole = function ModelSelectRole(_ref) {
-  var _handleUserRole;
-
-  var open = _ref.open,
-      onToggleModel = _ref.onToggleModel;
-  var dispatch = useDispatch();
-
-  var _useTranslation = useTranslation(),
-      t = _useTranslation.t;
-
-  var history = useHistory();
-  var pathname = window.location.pathname;
-  var user = useSelector(function (state) {
-    return state.common.user;
-  });
-  var roles = user === null || user === void 0 ? void 0 : user.roles;
-
-  var handleSelectUserRoles = function handleSelectUserRoles(roles) {
-    dispatch(setLoading(true));
-    var roleSelect = roles.includes("Teacher/Assistant") ? ["Teacher", "Assistant"] : roles;
-    dispatch(setUser(_extends({}, user, {
-      roles: roleSelect
-    })));
-    localStorage.setItem("ROLES", roleSelect.toString());
-    onToggleModel();
-
-    if (roles.includes("Parent")) {
-      history.push("/parent");
-    } else if (roles.includes("Admin")) {
-      history.push("/admin/home");
-    } else {
-      pathname !== "/home" ? history.push("/home") : window.location.reload();
-    }
-  };
-
-  return React.createElement(Modal, {
-    isOpen: open,
-    toggle: function toggle() {
-      return onToggleModel();
-    },
-    className: "" + styles["model-switch-roles"],
-    centered: true
-  }, React.createElement("p", {
-    className: "" + styles["title"]
-  }, t("continue_as")), React.createElement("div", null, (_handleUserRole = handleUserRole(user === null || user === void 0 ? void 0 : user.roles)) === null || _handleUserRole === void 0 ? void 0 : _handleUserRole.map(function (r) {
-    return React.createElement("p", {
-      key: r,
-      className: styles["item-select-role"] + " " + styles[roles.includes("Teacher") && roles.includes("Assistant") && r === "Teacher/Assistant" && !roles.includes("Admin") || roles.includes("Admin") && r === "Admin" || roles.includes(r) && !roles.includes("Admin") ? "item-role-active" : ""],
-      onClick: function onClick() {
-        return handleSelectUserRoles([r]);
-      }
-    }, r == "SecondaryTeacher" ? "Support Teacher" : r);
-  })));
-};
-
-var TheLayout = function TheLayout(_ref) {
-  var routes = _ref.routes,
-      navigation = _ref.navigation;
-  var history = useHistory();
-  var dispatch = useDispatch();
-  var user = useSelector(function (state) {
-    return state.common.user;
-  });
-  var language = useSelector(function (state) {
-    return state.common.language;
-  });
-
-  var _useState = useState(false),
-      openModelSelectRole = _useState[0],
-      setOpenModelSelectRole = _useState[1];
-
-  var _useTranslation = useTranslation(),
-      t = _useTranslation.t;
-
-  var location = useLocation();
-  var isNotification = location.pathname.includes("notifications");
-  var isDistrict = window.location.host.includes("-district");
-
-  var handleToggleModel = function handleToggleModel() {
-    setOpenModelSelectRole(!openModelSelectRole);
-  };
-
-  var authRoutes = useMemo(function () {
-    return routes.filter(function (route) {
-      return canAccess(user === null || user === void 0 ? void 0 : user.roles, route.roles);
-    }).filter(function (route) {
-      return !!route.isDistrict === isDistrict;
-    });
-  }, [user, language]);
-  var authNavigations = useMemo(function () {
-    return navigation.map(function (item) {
-      var _item$_children, _item$_children2;
-
-      return _extends({}, item, {
-        name: t(item.name),
-        _children: item !== null && item !== void 0 && (_item$_children = item._children) !== null && _item$_children !== void 0 && _item$_children.length ? item === null || item === void 0 ? void 0 : (_item$_children2 = item._children) === null || _item$_children2 === void 0 ? void 0 : _item$_children2.map(function (x) {
-          return _extends({}, x, {
-            name: t(x.name)
-          });
-        }) : undefined
-      });
-    }).filter(function (nav) {
-      return canAccess(user === null || user === void 0 ? void 0 : user.roles, nav.roles);
-    }).filter(function (nav) {
-      return !!nav.isDistrict === isDistrict;
-    });
-  }, [user, language]);
-
-  var getInformationSetting = function getInformationSetting() {
-    try {
-      var _temp2 = _catch(function () {
-        return Promise.resolve(getSchoolSettings()).then(function (res) {
-          dispatch(setSandboxMode(res.data.isSandboxMode));
-        });
-      }, function (err) {
-        console.error(err);
-      });
-
-      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  useEffect(function () {
-    checkAuthentication();
-  }, []);
-  useEffect(function () {
-    getInformationSetting();
-  }, [location.pathname]);
-
-  var checkAuthentication = function checkAuthentication() {
-    try {
-      var _temp4 = _catch(function () {
-        return Promise.resolve(firstCheckToken()).then(function (tokenStatus) {
-          tokenStatus ? loadInfo() : resetAuth();
-        });
-      }, function () {
-        resetAuth();
-      });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  var loadInfo = function loadInfo() {
-    try {
-      var _temp6 = _catch(function () {
-        return Promise.resolve(getInfo()).then(function (info) {
-          var _info$data, _info$data$roles;
-
-          if (!info || !(info !== null && info !== void 0 && (_info$data = info.data) !== null && _info$data !== void 0 && (_info$data$roles = _info$data.roles) !== null && _info$data$roles !== void 0 && _info$data$roles.includes("Admin"))) {
-            resetAuth();
-          }
-
-          dispatch(setUser(info.data));
-        });
-      }, function () {
-        resetAuth();
-      });
-
-      return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  var resetAuth = function resetAuth() {
-    localStorage.removeItem(ACCESS_TOKEN);
-    sessionStorage.removeItem(ACCESS_TOKEN);
-    localStorage.removeItem("ROLES");
-    history.push("/");
-  };
-
-  if (!user) {
-    return React.createElement(Loading, null);
-  }
-
-  return React.createElement("div", {
-    className: "c-app c-default-layout"
-  }, !isNotification && React.createElement(TheSidebar, {
-    navigation: authNavigations
-  }), React.createElement("div", {
-    className: "c-wrapper"
-  }, !isNotification && React.createElement(TheHeader, {
-    onToggleModel: handleToggleModel
-  }), React.createElement("div", {
-    className: "c-body bg-white"
-  }, React.createElement(TheContent$1, {
-    routes: authRoutes
-  }))), React.createElement(ModelSelectRole, {
-    open: openModelSelectRole,
-    onToggleModel: handleToggleModel
-  }));
-};
-
 var buttonTextStyle = {
   fontWeight: 500
 };
@@ -44059,17 +43604,11 @@ var useTeacherList = function useTeacherList() {
     }
   };
 
-  var handleSelectTeacher = useCallback(function (teacherIds, studentUserId) {
+  var handleSelectTeacher = useCallback(function (teacherId, studentUserId) {
     var _extends2;
 
-    var selectedTeacher = teacherOptions.filter(function (t) {
-      return teacherIds.includes(t.value);
-    });
-    console.log({
-      teacherIds: teacherIds
-    });
-    console.log({
-      selectedTeacher: selectedTeacher
+    var selectedTeacher = teacherOptions.find(function (t) {
+      return t.value === teacherId;
     });
     setSelectedTeachers(_extends({}, selectedTeachers, (_extends2 = {}, _extends2[studentUserId] = selectedTeacher, _extends2)));
   }, [JSON.stringify(selectedTeachers), JSON.stringify(teacherOptions)]);
@@ -44188,29 +43727,18 @@ var useAssignStudent = function useAssignStudent(teacherSelected, assistantSelec
       return;
     }
 
-    console.log("list userId");
-    console.log({
-      listUserIds: listUserIds
-    });
     var users = listUserIds.map(function (i) {
       var teacher = teacherSelected === null || teacherSelected === void 0 ? void 0 : teacherSelected[i];
       var assistant = assistantSelected === null || assistantSelected === void 0 ? void 0 : assistantSelected[i];
       var counselor = counselorSelected === null || counselorSelected === void 0 ? void 0 : counselorSelected[i];
       var secondaryTeacher = secondaryTeacherSelected === null || secondaryTeacherSelected === void 0 ? void 0 : secondaryTeacherSelected[i];
-      console.log({
-        teacher: teacher
-      });
       var value = {
         id: i
       };
 
       if (!!teacher) {
-        value.mainTeacherUserId = !!teacher ? teacher.map(function (i) {
-          return i.value;
-        }) : undefined;
-        value.mainTeacherEmail = !!teacher ? teacher.map(function (i) {
-          return i.label;
-        }) : undefined;
+        value.mainTeacherUserId = !!(teacher !== null && teacher !== void 0 && teacher.value) && typeof (teacher === null || teacher === void 0 ? void 0 : teacher.value) === 'string' ? teacher === null || teacher === void 0 ? void 0 : teacher.value : undefined;
+        value.mainTeacherEmail = !!(teacher !== null && teacher !== void 0 && teacher.value) && typeof (teacher === null || teacher === void 0 ? void 0 : teacher.value) === 'number' ? teacher === null || teacher === void 0 ? void 0 : teacher.label : undefined;
       }
 
       if (!!assistant) {
@@ -44237,10 +43765,6 @@ var useAssignStudent = function useAssignStudent(teacherSelected, assistantSelec
     var assistant = assistantSelected === null || assistantSelected === void 0 ? void 0 : assistantSelected[id];
     var counselor = counselorSelected === null || counselorSelected === void 0 ? void 0 : counselorSelected[id];
     var secondaryTeacher = secondaryTeacherSelected === null || secondaryTeacherSelected === void 0 ? void 0 : secondaryTeacherSelected[id];
-    console.log("assign student");
-    console.log({
-      teacherSelected: teacherSelected
-    });
 
     if (!teacher && !assistant && !counselor && !secondaryTeacher) {
       dispatch(setAlert({
@@ -44255,12 +43779,8 @@ var useAssignStudent = function useAssignStudent(teacherSelected, assistantSelec
     };
 
     if (!!teacher) {
-      studentRequest.mainTeacherUserId = !!teacher ? teacher.map(function (i) {
-        return i.value;
-      }) : undefined;
-      studentRequest.mainTeacherEmail = !!teacher ? teacher.map(function (i) {
-        return i.label;
-      }) : undefined;
+      studentRequest.mainTeacherUserId = !!(teacher !== null && teacher !== void 0 && teacher.value) && typeof (teacher === null || teacher === void 0 ? void 0 : teacher.value) === 'string' ? teacher === null || teacher === void 0 ? void 0 : teacher.value : undefined;
+      studentRequest.mainTeacherEmail = !!(teacher !== null && teacher !== void 0 && teacher.value) && typeof (teacher === null || teacher === void 0 ? void 0 : teacher.value) === 'number' ? teacher === null || teacher === void 0 ? void 0 : teacher.label : undefined;
     }
 
     if (!!assistant) {
@@ -44281,11 +43801,6 @@ var useAssignStudent = function useAssignStudent(teacherSelected, assistantSelec
     assignStudents([studentRequest]);
   }, [JSON.stringify(teacherSelected), JSON.stringify(assistantSelected), JSON.stringify(counselorSelected), JSON.stringify(secondaryTeacherSelected)]);
   var handleAssignStaffToStudents = useCallback(function (listUserIds) {
-    console.log("staffBulkAssign");
-    console.log({
-      staffBulkAssign: staffBulkAssign
-    });
-
     if (listUserIds.length === 0) {
       dispatch(setAlert({
         type: "danger",
@@ -44297,6 +43812,8 @@ var useAssignStudent = function useAssignStudent(teacherSelected, assistantSelec
     var users = listUserIds.map(function (i) {
       var value = {
         id: i,
+        mainTeacherUserId: !!(staffBulkAssign !== null && staffBulkAssign !== void 0 && staffBulkAssign.teacherId) ? staffBulkAssign === null || staffBulkAssign === void 0 ? void 0 : staffBulkAssign.teacherId : undefined,
+        mainTeacherEmail: !!(staffBulkAssign !== null && staffBulkAssign !== void 0 && staffBulkAssign.teacherEmail) ? staffBulkAssign === null || staffBulkAssign === void 0 ? void 0 : staffBulkAssign.teacherEmail : undefined,
         assistantUserId: !!(staffBulkAssign !== null && staffBulkAssign !== void 0 && staffBulkAssign.assistantId) ? staffBulkAssign === null || staffBulkAssign === void 0 ? void 0 : staffBulkAssign.assistantId : undefined,
         assistantEmail: !!(staffBulkAssign !== null && staffBulkAssign !== void 0 && staffBulkAssign.assistantEmail) ? staffBulkAssign === null || staffBulkAssign === void 0 ? void 0 : staffBulkAssign.assistantEmail : undefined,
         counselorUserId: !!(staffBulkAssign !== null && staffBulkAssign !== void 0 && staffBulkAssign.counselorId) ? staffBulkAssign === null || staffBulkAssign === void 0 ? void 0 : staffBulkAssign.counselorId : undefined,
@@ -44645,18 +44162,15 @@ var AssignStudentList = function AssignStudentList() {
       className: "align-middle"
     }, item.email), React.createElement("td", {
       className: "align-middle"
-    }, !!item.teachers && item.teachers.length > 0 ? React.createElement(React.Fragment, null, item.teachers.map(function (record) {
-      return React.createElement("p", {
-        className: "mb-0"
-      }, record.mainTeacherName, " - ", record.mainTeacherEmail);
-    })) : React.createElement(TeacherSelector, {
-      isMulti: true,
+    }, !!item.mainTeacherEmail ? React.createElement(React.Fragment, null, React.createElement("p", {
+      className: "mb-0"
+    }, item.mainTeacherEmail), React.createElement("p", {
+      className: "mb-0"
+    }, item.mainTeacherName)) : React.createElement(TeacherSelector, {
       value: selectedTeachers === null || selectedTeachers === void 0 ? void 0 : selectedTeachers[item.id],
       options: teacherOptions,
       onChange: function onChange(e) {
-        return handleSelectTeacher(e.map(function (i) {
-          return i.value;
-        }), item.id);
+        return handleSelectTeacher(e.value, item.id);
       },
       onCreateOption: function onCreateOption(value) {
         return handleCreateTeacherOption(value, item.id, true);
@@ -45731,6 +45245,34 @@ var UserDetail = function UserDetail() {
   });
 };
 
+var loadingStyle = {
+  minWidth: "100vw",
+  minHeight: "100vh",
+  position: "fixed",
+  top: 0,
+  left: 0,
+  zIndex: 999999999,
+  backgroundColor: "rgba(0, 0, 0, 0.4)",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center"
+};
+
+var Loading = function Loading() {
+  var isLoading = useSelector(function (state) {
+    return state.common.isLoading;
+  });
+  localStorage.setItem("LAST_TIME_REQUETST", moment().utc().format("YYYY-MM-DD HH:mm:ss"));
+  return isLoading ? React.createElement("div", {
+    style: loadingStyle
+  }, React.createElement("div", {
+    className: "spinner-border text-secondary",
+    role: "status"
+  }, React.createElement("span", {
+    className: "sr-only"
+  }, "Loading..."))) : null;
+};
+
 var ScrollToTop = function ScrollToTop() {
   var _useLocation = useLocation(),
       pathname = _useLocation.pathname;
@@ -48750,6 +48292,32 @@ var store = configureStore({
   }
 });
 
+var firstCheckToken = function firstCheckToken() {
+  return Promise.resolve(_catch(function () {
+    var token = getAccessToken();
+    return token ? Promise.resolve(checkToken(token)).then(function (tokenStatus) {
+      return tokenStatus.data ? true : false;
+    }) : false;
+  }, function () {
+    return false;
+  }));
+};
+
+var canAccess = function canAccess(userRoles, componentRoles) {
+  if (!Array.isArray(userRoles)) {
+    return false;
+  }
+
+  if (Array.isArray(componentRoles)) {
+    var intersects = userRoles.filter(function (i) {
+      return componentRoles.includes(i);
+    });
+    return intersects.length > 0;
+  }
+
+  return true;
+};
+
 var isInViewport = function isInViewport(el) {
   var rect = el === null || el === void 0 ? void 0 : el.getBoundingClientRect();
   return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
@@ -48779,11 +48347,423 @@ var getTextFromHTML = function getTextFromHTML(htmlString) {
   return text;
 };
 
+var getCookieValue = function getCookieValue(name) {
+  var _document$cookie$matc;
+
+  return ((_document$cookie$matc = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')) === null || _document$cookie$matc === void 0 ? void 0 : _document$cookie$matc.pop()) || '';
+};
+
 var generateRandomString = (function () {
   return (Math.random() + 1).toString(36).substring(7);
 });
 
 var amplitudeClient = amplitude.getInstance();
 
-export { ACCESS_TOKEN, ANSWER_EDITOR_HEIGHT, AcademicClassSelector, AddButton, BASE_URL, CHAT_CHANNEL, CategorySelector, CommonAlert, CommonHeader, CommonModal$1 as CommonModal, CreatableSelector, CustomPagination, CustomSelector, CustomTabs as CustomTab, DATE_FORMAT, DATE_RESULT, DEFAULT_FILTER, DEFAULT_LANGUAGE_CODE, Dashboard, DeleteButtonIcon, DetailActionButtons, EMOTIONS, EditButtonIcon, EmailTemplateDetail, EmailTemplateList, EmptyDataAlert, ErrorHandler, FULL_DATE_RESULT, FaqList, InputFile as FileInput, GOOGLE_RECAPTCHA_KEY, GalleryList, INIT_AMPLITUDE_KEY_PROD, INIT_AMPLITUDE_KEY_STAGE, IS_USER_SESSION_BROWSER, Images, LANGUAGES, LICENSE_AGGRID, LinkEditButton, Loading, Login, MediaList, NOTIFICATION_ALERT_KEY, NOTIFICATION_CHANNEL, NotFound, NotificationList, NotificationLogoutModal, NotificationModal, QUESTION_TYPES, QUESTION_TYPES_OPTIONS, QuestionCategorySelector, QuestionTypeSelector, QuitPrompt, ReactNotification, RequiredLabel$1 as RequiredLabel, SANDBOX_NOTIFICATION, SUPPORTED_LANGUAGES_CODE, SandboxAlert, SchoolList, ScrollToTop, SearchBox$1 as SearchBox, SearchBoxContainer, SkillList, StarRatingSelector, SuggestionCategorySelector, TAB_COLORS, TINY_MCE_API_KEY, TheContent$1 as TheContent, TheLayout, ToggleButton, UploadFileButton, UserContainer, UserDetail, UserList, addTab, amplitudeClient, answerQuestion, answerQuestionDataPlayer, api, apiUpload, canAccess as canAccessRoute, changeNote, changeTags, clearTab, closeTab, debounce, editTab, editorConfig, firstCheckToken, generateRandomString, getCookieValue, getFileUrl, getInfo, getStaticFileUrl, getTextFromHTML, i18n, initAmplitude, isInViewport, isLocalhost, reset, setAlert, setAssessmentList, setAssignmentList, setAssistantList, setBadgeList, setBandScoreList, setCertificateList, setClassList, setConferenceRubricList, setConversationOneToOne, setCurrentStudentId, setCurrentStudentName, setCurrentStudentUserId, setCustomAlertList, setDataPlayer, setEditItemQuesion, setEnableIEP, setEnableSurvey, setFeedbackList, setFilterWidget, setGoalExampleList, setImproveMyClass, setLanguage, setLearningSupportCategoryList, setLoading, setMailCategory, setModal, setMoveItemQuestion, setMyStudent, setOpenModelCongratulation, setQuestionByCategory, setQuestionCateList, setQuestionList, setReflectionList, setReflectionResultList, setResetQuestionList, setSandboxMode, setSchoolBlankDayList, setSelectQuestion, setSemesterList, setSessionPlayer, setSessionTemplateGeneralClassList, setSessionTemplateList, setStartTime, setStrategyList, setStudentIdSelectedByTeacher, setStudentList, setSubjectList, setSuggestionList, setTurnOffPassWhenChangeMode, setTutorialScreenList, setUser, setUserList, setWeeklyQuestList, showFontSize, showMenuBar, store, systemCertificateUpload, systemStudentBadge, uploadFile, useFilters, useGalleryList, utcToLocalTime };
+var apiGetLanguage = function apiGetLanguage() {
+  return api.get(BASE_URL + "/api/language");
+};
+
+var apiUpdateLanguage = function apiUpdateLanguage(lang) {
+  return api.put(BASE_URL + "/api/language?lang=" + lang);
+};
+
+var LANGUAGE_SYSTEM = "LANGUAGE_SYSTEM";
+
+var useLanguages = function useLanguages() {
+  var dispatch = useDispatch();
+
+  var _useTranslation = useTranslation(),
+      i18n = _useTranslation.i18n;
+
+  var language = useSelector(function (state) {
+    return state.common.language;
+  });
+  var defaultLanguage = getCookieValue(LANGUAGE_SYSTEM) != null ? getCookieValue(LANGUAGE_SYSTEM) : DEFAULT_LANGUAGE_CODE;
+
+  var _useState = useState([]),
+      languageList = _useState[0],
+      setLanguageList = _useState[1];
+
+  var _useState2 = useState(false),
+      dropdownOpen = _useState2[0],
+      setDropdownOpen = _useState2[1];
+
+  var _useState3 = useState(defaultLanguage),
+      currentLang = _useState3[0],
+      setCurrentLang = _useState3[1];
+
+  var toggle = function toggle() {
+    return setDropdownOpen(function (prevState) {
+      return !prevState;
+    });
+  };
+
+  var changeLanguageApp = function changeLanguageApp(lang) {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(setLoading(false));
+      };
+
+      dispatch(setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(apiUpdateLanguage(lang)).then(function () {
+          i18n.changeLanguage(lang);
+          setCurrentLang(lang);
+          dispatch(setLanguage(lang));
+        });
+      }, function (err) {
+        var _err$response, _err$response$data;
+
+        dispatch(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);
+    }
+  };
+
+  var getListLanguage = function getListLanguage() {
+    try {
+      var _temp6 = _catch(function () {
+        return Promise.resolve(apiGetLanguage()).then(function (res) {
+          setLanguageList(res.data);
+        });
+      }, function (err) {
+        var _err$response2, _err$response2$data;
+
+        dispatch(setAlert({
+          type: "danger",
+          message: ((_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : (_err$response2$data = _err$response2.data) === null || _err$response2$data === void 0 ? void 0 : _err$response2$data.title) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  useEffect(function () {
+    defaultLanguage != language && changeLanguageApp(defaultLanguage);
+    getListLanguage();
+  }, []);
+  return {
+    languageList: languageList,
+    toggle: toggle,
+    dropdownOpen: dropdownOpen,
+    currentLang: currentLang,
+    changeLanguageApp: changeLanguageApp,
+    setCurrentLang: setCurrentLang
+  };
+};
+
+var TheLanguageDropdown = function TheLanguageDropdown() {
+  var _useLanguages = useLanguages(),
+      languageList = _useLanguages.languageList,
+      toggle = _useLanguages.toggle,
+      dropdownOpen = _useLanguages.dropdownOpen,
+      currentLang = _useLanguages.currentLang,
+      changeLanguageApp = _useLanguages.changeLanguageApp;
+
+  var currentLanguage = useMemo(function () {
+    var current = languageList.find(function (i) {
+      return i.code === currentLang;
+    });
+    if (!current) return null;
+    return React.createElement(React.Fragment, null, React.createElement("img", {
+      className: "mr-2 " + styles['dropdown-menu-flag'],
+      src: "" + getStaticFileUrl(current.image)
+    }), " ", current.name);
+  }, [currentLang, languageList]);
+  return React.createElement(Dropdown, {
+    isOpen: dropdownOpen,
+    toggle: toggle,
+    className: "" + styles["dropdown-menu"]
+  }, React.createElement(DropdownToggle, {
+    className: styles["header-avatar"] + " d-flex align-items-center"
+  }, React.createElement("span", {
+    style: {
+      color: "#000",
+      textTransform: "capitalize",
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, currentLanguage, React.createElement(BsChevronDown, {
+    className: "ml-2",
+    style: {
+      fontSize: '10px'
+    }
+  }))), React.createElement(DropdownMenu, {
+    className: styles["dropdown-content-language"]
+  }, !!languageList && languageList.length > 0 && languageList.map(function (lang, index) {
+    return React.createElement(DropdownItem, {
+      key: lang.code,
+      className: styles["dropdown-change"] + " px-0 py-0 " + (index === languageList.length - 1 ? "pb-2" : "pt-2"),
+      onClick: function onClick() {
+        return changeLanguageApp(lang.code);
+      }
+    }, React.createElement("div", {
+      className: styles["dropdown-item-language"] + " " + styles["item-logout"] + " " + (currentLang == lang.code ? styles['dropdown-item-language-active'] : "") + " d-flex align-items-center w-100"
+    }, React.createElement("span", {
+      className: "mr-2 d-flex hover-opacity"
+    }, React.createElement("img", {
+      style: {
+        width: "30px",
+        height: "25px",
+        borderRadius: "5px"
+      },
+      src: getStaticFileUrl(lang.image)
+    })), lang.name));
+  })));
+};
+
+var TheHeader = function TheHeader(_ref) {
+  var onToggleModel = _ref.onToggleModel;
+  var dispatch = useDispatch();
+  var sidebarShow = useSelector(function (state) {
+    return state.common.sidebarShow;
+  });
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var toggleSidebarMobile = function toggleSidebarMobile() {
+    var val = [false, "responsive"].includes(sidebarShow) ? true : "responsive";
+    dispatch(setSidebar(val));
+  };
+
+  var isDistrict = window.location.host.includes("-district");
+  return React.createElement(CHeader, {
+    withSubheader: true,
+    className: "d-flex align-items-center justify-content-end"
+  }, React.createElement(CToggler, {
+    inHeader: true,
+    className: "ml-md-3 d-lg-none",
+    onClick: toggleSidebarMobile
+  }), React.createElement(CHeaderBrand, {
+    className: "mx-auto flex-grow-1 d-lg-none",
+    to: "/"
+  }, React.createElement("img", {
+    src: getStaticFileUrl(Images.LOGO_HEADER),
+    className: styles["header-logo"]
+  })), React.createElement(CHeaderNav, {
+    className: "pr-3"
+  }, React.createElement(TheLanguageDropdown, null), React.createElement("a", {
+    className: "mr-3",
+    style: {
+      color: '#000'
+    },
+    href: '/privacy-policy',
+    target: "blank"
+  }, t("privacy_policy")), !isDistrict && React.createElement(NotificationButton, null), React.createElement(TheHeaderDropdown, {
+    onToggleModel: onToggleModel
+  })));
+};
+
+var ModelSelectRole = function ModelSelectRole(_ref) {
+  var _handleUserRole;
+
+  var open = _ref.open,
+      onToggleModel = _ref.onToggleModel;
+  var dispatch = useDispatch();
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var history = useHistory();
+  var pathname = window.location.pathname;
+  var user = useSelector(function (state) {
+    return state.common.user;
+  });
+  var roles = user === null || user === void 0 ? void 0 : user.roles;
+
+  var handleSelectUserRoles = function handleSelectUserRoles(roles) {
+    dispatch(setLoading(true));
+    var roleSelect = roles.includes("Teacher/Assistant") ? ["Teacher", "Assistant"] : roles;
+    dispatch(setUser(_extends({}, user, {
+      roles: roleSelect
+    })));
+    localStorage.setItem("ROLES", roleSelect.toString());
+    onToggleModel();
+
+    if (roles.includes("Parent")) {
+      history.push("/parent");
+    } else if (roles.includes("Admin")) {
+      history.push("/admin/home");
+    } else {
+      pathname !== "/home" ? history.push("/home") : window.location.reload();
+    }
+  };
+
+  return React.createElement(Modal, {
+    isOpen: open,
+    toggle: function toggle() {
+      return onToggleModel();
+    },
+    className: "" + styles["model-switch-roles"],
+    centered: true
+  }, React.createElement("p", {
+    className: "" + styles["title"]
+  }, t("continue_as")), React.createElement("div", null, (_handleUserRole = handleUserRole(user === null || user === void 0 ? void 0 : user.roles)) === null || _handleUserRole === void 0 ? void 0 : _handleUserRole.map(function (r) {
+    return React.createElement("p", {
+      key: r,
+      className: styles["item-select-role"] + " " + styles[roles.includes("Teacher") && roles.includes("Assistant") && r === "Teacher/Assistant" && !roles.includes("Admin") || roles.includes("Admin") && r === "Admin" || roles.includes(r) && !roles.includes("Admin") ? "item-role-active" : ""],
+      onClick: function onClick() {
+        return handleSelectUserRoles([r]);
+      }
+    }, r == "SecondaryTeacher" ? "Support Teacher" : r);
+  })));
+};
+
+var TheLayout = function TheLayout(_ref) {
+  var routes = _ref.routes,
+      navigation = _ref.navigation;
+  var history = useHistory();
+  var dispatch = useDispatch();
+  var user = useSelector(function (state) {
+    return state.common.user;
+  });
+  var language = useSelector(function (state) {
+    return state.common.language;
+  });
+
+  var _useState = useState(false),
+      openModelSelectRole = _useState[0],
+      setOpenModelSelectRole = _useState[1];
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var location = useLocation();
+  var isNotification = location.pathname.includes("notifications");
+  var isDistrict = window.location.host.includes("-district");
+
+  var handleToggleModel = function handleToggleModel() {
+    setOpenModelSelectRole(!openModelSelectRole);
+  };
+
+  var authRoutes = useMemo(function () {
+    return routes.filter(function (route) {
+      return canAccess(user === null || user === void 0 ? void 0 : user.roles, route.roles);
+    }).filter(function (route) {
+      return !!route.isDistrict === isDistrict;
+    });
+  }, [user, language]);
+  var authNavigations = useMemo(function () {
+    return navigation.map(function (item) {
+      var _item$_children, _item$_children2;
+
+      return _extends({}, item, {
+        name: t(item.name),
+        _children: item !== null && item !== void 0 && (_item$_children = item._children) !== null && _item$_children !== void 0 && _item$_children.length ? item === null || item === void 0 ? void 0 : (_item$_children2 = item._children) === null || _item$_children2 === void 0 ? void 0 : _item$_children2.map(function (x) {
+          return _extends({}, x, {
+            name: t(x.name)
+          });
+        }) : undefined
+      });
+    }).filter(function (nav) {
+      return canAccess(user === null || user === void 0 ? void 0 : user.roles, nav.roles);
+    }).filter(function (nav) {
+      return !!nav.isDistrict === isDistrict;
+    });
+  }, [user, language]);
+
+  var getInformationSetting = function getInformationSetting() {
+    try {
+      var _temp2 = _catch(function () {
+        return Promise.resolve(getSchoolSettings()).then(function (res) {
+          dispatch(setSandboxMode(res.data.isSandboxMode));
+        });
+      }, function (err) {
+        console.error(err);
+      });
+
+      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  useEffect(function () {
+    checkAuthentication();
+  }, []);
+  useEffect(function () {
+    getInformationSetting();
+  }, [location.pathname]);
+
+  var checkAuthentication = function checkAuthentication() {
+    try {
+      var _temp4 = _catch(function () {
+        return Promise.resolve(firstCheckToken()).then(function (tokenStatus) {
+          tokenStatus ? loadInfo() : resetAuth();
+        });
+      }, function () {
+        resetAuth();
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  var loadInfo = function loadInfo() {
+    try {
+      var _temp6 = _catch(function () {
+        return Promise.resolve(getInfo()).then(function (info) {
+          var _info$data, _info$data$roles;
+
+          if (!info || !(info !== null && info !== void 0 && (_info$data = info.data) !== null && _info$data !== void 0 && (_info$data$roles = _info$data.roles) !== null && _info$data$roles !== void 0 && _info$data$roles.includes("Admin"))) {
+            resetAuth();
+          }
+
+          dispatch(setUser(info.data));
+        });
+      }, function () {
+        resetAuth();
+      });
+
+      return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  var resetAuth = function resetAuth() {
+    localStorage.removeItem(ACCESS_TOKEN);
+    sessionStorage.removeItem(ACCESS_TOKEN);
+    localStorage.removeItem("ROLES");
+    history.push("/");
+  };
+
+  if (!user) {
+    return React.createElement(Loading, null);
+  }
+
+  return React.createElement("div", {
+    className: "c-app c-default-layout"
+  }, !isNotification && React.createElement(TheSidebar, {
+    navigation: authNavigations
+  }), React.createElement("div", {
+    className: "c-wrapper"
+  }, !isNotification && React.createElement(TheHeader, {
+    onToggleModel: handleToggleModel
+  }), React.createElement("div", {
+    className: "c-body bg-white"
+  }, React.createElement(TheContent$1, {
+    routes: authRoutes
+  }))), React.createElement(ModelSelectRole, {
+    open: openModelSelectRole,
+    onToggleModel: handleToggleModel
+  }));
+};
+
+var amplitudeClient$1 = amplitude.getInstance();
+
+export { ACCESS_TOKEN, ANSWER_EDITOR_HEIGHT, AcademicClassSelector, AddButton, BASE_URL, CHAT_CHANNEL, CategorySelector, CommonAlert, CommonHeader, CommonModal$1 as CommonModal, CreatableSelector, CustomPagination, CustomSelector, CustomTabs as CustomTab, DATE_FORMAT, DATE_RESULT, DEFAULT_FILTER, DEFAULT_LANGUAGE_CODE, Dashboard, DeleteButtonIcon, DetailActionButtons, EMOTIONS, EditButtonIcon, EmailTemplateDetail, EmailTemplateList, EmptyDataAlert, ErrorHandler, FULL_DATE_RESULT, FaqList, InputFile as FileInput, GOOGLE_RECAPTCHA_KEY, GalleryList, INIT_AMPLITUDE_KEY_PROD, INIT_AMPLITUDE_KEY_STAGE, IS_USER_SESSION_BROWSER, Images, LANGUAGES, LICENSE_AGGRID, LinkEditButton, Loading, Login, MediaList, NOTIFICATION_ALERT_KEY, NOTIFICATION_CHANNEL, NotFound, NotificationList, NotificationLogoutModal, NotificationModal, QUESTION_TYPES, QUESTION_TYPES_OPTIONS, QuestionCategorySelector, QuestionTypeSelector, QuitPrompt, ReactNotification, RequiredLabel$1 as RequiredLabel, SANDBOX_NOTIFICATION, SUPPORTED_LANGUAGES_CODE, SandboxAlert, SchoolList, ScrollToTop, SearchBox$1 as SearchBox, SearchBoxContainer, SkillList, StarRatingSelector, SuggestionCategorySelector, TAB_COLORS, TINY_MCE_API_KEY, TheContent$1 as TheContent, TheLayout, ToggleButton, UploadFileButton, UserContainer, UserDetail, UserList, addTab, amplitudeClient$1 as amplitudeClient, answerQuestion, answerQuestionDataPlayer, api, apiUpload, canAccess as canAccessRoute, changeNote, changeTags, clearTab, closeTab, debounce, editTab, editorConfig, firstCheckToken, generateRandomString, getCookieValue, getFileUrl, getInfo, getStaticFileUrl, getTextFromHTML, i18n, initAmplitude, isInViewport, isLocalhost, reset, setAlert, setAssessmentList, setAssignmentList, setAssistantList, setBadgeList, setBandScoreList, setCertificateList, setClassList, setConferenceRubricList, setConversationOneToOne, setCurrentStudentId, setCurrentStudentName, setCurrentStudentUserId, setCustomAlertList, setDataPlayer, setEditItemQuesion, setEnableIEP, setEnableSurvey, setFeedbackList, setFilterWidget, setGoalExampleList, setImproveMyClass, setLanguage, setLearningSupportCategoryList, setLoading, setMailCategory, setModal, setMoveItemQuestion, setMyStudent, setOpenModelCongratulation, setQuestionByCategory, setQuestionCateList, setQuestionList, setReflectionList, setReflectionResultList, setResetQuestionList, setSandboxMode, setSchoolBlankDayList, setSelectQuestion, setSemesterList, setSessionPlayer, setSessionTemplateGeneralClassList, setSessionTemplateList, setStartTime, setStrategyList, setStudentIdSelectedByTeacher, setStudentList, setSubjectList, setSuggestionList, setTurnOffPassWhenChangeMode, setTutorialScreenList, setUser, setUserList, setWeeklyQuestList, showFontSize, showMenuBar, store, systemCertificateUpload, systemStudentBadge, uploadFile, useFilters, useGalleryList, utcToLocalTime };
 //# sourceMappingURL=index.modern.js.map