mario-core 1.2.23-es-prod → 1.2.23-es-release

package/dist/index.js

@@ -22160,7 +22160,7 @@ function _catch(body, recover) {
 	return result;
 }
 
-var styles = {"btn-login-with-sso":"_DrSlA","icon":"_20YJX","btn-login-google":"_2HqmH","notification-count":"_2sew7","text-introduction":"_3OgWF","btn-trans-border":"_r9cAh","contact":"_NszFe","learn-more":"_MDjzH","title-quote":"_1Swkw","descriptions-quote":"_gi8vj","box-login":"_38Lo1","block-verification":"_1OzGy","block-login":"_wWIyO","title-login":"_3nuns","title-forgot-password":"_21qb6","btn-close":"_NhW9l","btn-login":"_3IL10","school-icon":"_2OUwW","school-name":"_2Owso","login-description":"_fx-kA","return-to-login":"_Ce3Kg","recover-account":"_2t6d9","link-to-login":"_3bDsd","privacy-policy":"_I4SVu","remember":"_11FZt","term-and-conditions":"_3LXoI","descriptions-forgot-pass":"_PMcjT","content-icon":"_2rZY6","descriptions-icon":"_3SOdX","title-icon":"_y9lM2","digital-privacy-icon":"_141p1","nav-home":"_1TT1q","box-introduction":"_32V6L","checkbox-keep-login":"_1AiX0","label-keep-login":"_2uNvW","option-text":"_pqn4y","form-user-name":"_39BJD","input":"_ozRAq","checkbox-remember":"_2K9b2","btn-rounder":"_2VvIr","btn-active":"_2A0HF","block-reset-password":"_23Sua","block-forgot-pass":"_3CWP6","page-not-login":"_3Wmco","content-quote":"_13Rk0","home-page":"_o6HKW","red-background":"_jOY7o","login":"_F-hjL","version-prod":"_OqRPX","login-content":"_149oA","logo-home":"_24U3W","img-box":"_2v-L_","img-login":"_3ncTL","img-login-rectangle":"_2kOvJ","c-main":"_39l0X","container-fluid":"_1BMwK","input-file-label":"_1XNpH","delete-avatar-button":"_1z5h9","header-logo":"_Gewcf","box-sidebar":"_2vcmv","sidebar-logo":"_1hXpy","sidebar-nav-links":"_3vb3s","c-active":"_36jSM","sidebar-nav-links-hover":"_DNrus","box-sidebar-header":"_3NEZj","box-logout":"_1wUDG","sidebar-btn-minimized":"_1S7Px","sidebar-logout":"_2P85D","nav-mobile":"_1qjbW","filter-media-file":"_1I62C","div":"_3cLcM","dropdown-menu":"_1krbH","header-avatar":"_RQaHE","dropdown-menu-flag":"_XK8oS","dropdown-content":"_3ys4W","dropdown-change":"_ToOW_","item-address":"_3sQlR","item-logout":"_3bqSM","title-address":"_1jgSI","img-avatar":"_35Ttz","item-contact":"_1wc7o","logout":"_1_9tV","content-text":"_3S4f2","dropdown-content-language":"_3ajui","dropdown-item-language":"_3Y_y4","dropdown-item-language-active":"_CzNMi","hide-in-mobile":"_1INnO","popover__sort__item":"_1ocBa","popover__sort__item--active":"_18NhM","popover__search__icon":"_2bquW","popover__search__input":"_3A4G4","popover__options":"_1MsEW","item-select-role":"_1KcY7","item-role-active":"_dOVso","model-switch-roles":"_3ZqxI","title":"_g-p72","bg-animate":"_30npl","active":"_3oAH-","show":"_16rY4","fade-in":"_26nbh","behind":"_3A7Vv","hamburger-menu":"_2yRc8","box-content-home-page":"_ABUIP","collapse-box":"_WX97m","hide-in-desktop":"_2LIqK","control-input":"_2Zz97","custom-control":"_3-yp5","font-large":"_3Sup6","custom-title-font-size":"_2aaqy","modal-title":"_13Gcm","custom-font-size":"_VzIb0","font-small":"_2JnMg"};
+var customStyles = {"btn-login-with-sso":"_DrSlA","icon":"_20YJX","btn-login-google":"_2HqmH","notification-count":"_2sew7","text-introduction":"_3OgWF","btn-trans-border":"_r9cAh","contact":"_NszFe","learn-more":"_MDjzH","title-quote":"_1Swkw","descriptions-quote":"_gi8vj","box-login":"_38Lo1","block-verification":"_1OzGy","block-login":"_wWIyO","title-login":"_3nuns","title-forgot-password":"_21qb6","btn-close":"_NhW9l","btn-login":"_3IL10","school-icon":"_2OUwW","school-name":"_2Owso","login-description":"_fx-kA","return-to-login":"_Ce3Kg","recover-account":"_2t6d9","link-to-login":"_3bDsd","privacy-policy":"_I4SVu","remember":"_11FZt","term-and-conditions":"_3LXoI","descriptions-forgot-pass":"_PMcjT","content-icon":"_2rZY6","descriptions-icon":"_3SOdX","title-icon":"_y9lM2","digital-privacy-icon":"_141p1","nav-home":"_1TT1q","box-introduction":"_32V6L","checkbox-keep-login":"_1AiX0","label-keep-login":"_2uNvW","option-text":"_pqn4y","form-user-name":"_39BJD","input":"_ozRAq","checkbox-remember":"_2K9b2","btn-rounder":"_2VvIr","btn-active":"_2A0HF","block-reset-password":"_23Sua","block-forgot-pass":"_3CWP6","page-not-login":"_3Wmco","content-quote":"_13Rk0","home-page":"_o6HKW","red-background":"_jOY7o","login":"_F-hjL","version-prod":"_OqRPX","login-content":"_149oA","logo-home":"_24U3W","img-box":"_2v-L_","img-login":"_3ncTL","img-login-rectangle":"_2kOvJ","c-main":"_39l0X","container-fluid":"_1BMwK","input-file-label":"_1XNpH","delete-avatar-button":"_1z5h9","header-logo":"_Gewcf","box-sidebar":"_2vcmv","sidebar-logo":"_1hXpy","sidebar-nav-links":"_3vb3s","c-active":"_36jSM","sidebar-nav-links-hover":"_DNrus","box-sidebar-header":"_3NEZj","box-logout":"_1wUDG","sidebar-btn-minimized":"_1S7Px","sidebar-logout":"_2P85D","nav-mobile":"_1qjbW","filter-media-file":"_1I62C","div":"_3cLcM","dropdown-menu":"_1krbH","header-avatar":"_RQaHE","dropdown-menu-flag":"_XK8oS","dropdown-content":"_3ys4W","dropdown-change":"_ToOW_","item-address":"_3sQlR","item-logout":"_3bqSM","title-address":"_1jgSI","img-avatar":"_35Ttz","item-contact":"_1wc7o","logout":"_1_9tV","content-text":"_3S4f2","dropdown-content-language":"_3ajui","dropdown-item-language":"_3Y_y4","dropdown-item-language-active":"_CzNMi","hide-in-mobile":"_1INnO","popover__sort__item":"_1ocBa","popover__sort__item--active":"_18NhM","popover__search__icon":"_2bquW","popover__search__input":"_3A4G4","popover__options":"_1MsEW","item-select-role":"_1KcY7","item-role-active":"_dOVso","model-switch-roles":"_3ZqxI","title":"_g-p72","bg-animate":"_30npl","active":"_3oAH-","show":"_16rY4","fade-in":"_26nbh","behind":"_3A7Vv","hamburger-menu":"_2yRc8","box-content-home-page":"_ABUIP","collapse-box":"_WX97m","hide-in-desktop":"_2LIqK","control-input":"_2Zz97","custom-control":"_3-yp5","font-large":"_3Sup6","custom-title-font-size":"_2aaqy","modal-title":"_13Gcm","custom-font-size":"_VzIb0","font-small":"_2JnMg"};
 
 var style = {
   fontSize: "0.85rem"
@@ -23146,7 +23146,7 @@ var BlockLogin = function BlockLogin(_ref) {
       var subDomain = hostName === null || hostName === void 0 ? void 0 : (_hostName$split = hostName.split(".marioforme.com")) === null || _hostName$split === void 0 ? void 0 : (_hostName$split$ = _hostName$split[0]) === null || _hostName$split$ === void 0 ? void 0 : _hostName$split$.replace(/-es$|^es-/, "");
       var emailDomain = (_email$split = email.split("@")) === null || _email$split === void 0 ? void 0 : _email$split[1];
 
-      if (!emailDomain.includes(subDomain) && !emailDomain.includes(extensionEmail)) {
+      if (!emailDomain.includes(subDomain) && !emailDomain.includes(!(extensionEmail !== null && extensionEmail !== void 0 && extensionEmail.trim()) ? subDomain : extensionEmail)) {
         alert("The email address you used does not match the login information in the database.  Please check that you are using your school assigned email address to log into MARIO for Me.  If you have further trouble please notify your school site administrator");
         return;
       }
@@ -23195,25 +23195,25 @@ var BlockLogin = function BlockLogin(_ref) {
     var emailError = touched.email && errors.email;
     var passwordError = touched.password && errors.password;
     return React__default.createElement("div", {
-      className: styles["box-login"] + " w-100"
+      className: customStyles["box-login"] + " w-100"
     }, React__default.createElement(reactstrap.Form, {
-      className: "" + styles["block-login"],
+      className: "" + customStyles["block-login"],
       onSubmit: handleSubmit
     }, React__default.createElement("div", {
-      className: "" + styles["block-form"]
+      className: "" + customStyles["block-form"]
     }, React__default.createElement("div", {
       className: "d-flex align-items-center mb-4"
     }, React__default.createElement("img", {
       src: school.schoolLogo ? getFileUrl("" + school.schoolLogo) : "" + getStaticFileUrl("/images/mario-logo.png"),
-      className: styles["school-icon"] + " mr-3"
+      className: customStyles["school-icon"] + " mr-3"
     }), React__default.createElement("p", {
-      className: styles["school-name"] + " mb-0"
+      className: customStyles["school-name"] + " mb-0"
     }, school.schoolName)), React__default.createElement("p", {
-      className: "" + styles["title-login"]
+      className: "" + customStyles["title-login"]
     }, "Welcome Back!"), React__default.createElement("p", {
-      className: styles["login-description"] + " mb-5"
+      className: customStyles["login-description"] + " mb-5"
     }, "Please enter your MARIO Education account details"), React__default.createElement(reactstrap.FormGroup, {
-      className: "" + styles["form-user-name"]
+      className: "" + customStyles["form-user-name"]
     }, React__default.createElement(reactstrap.Input, {
       type: "text",
       name: "email",
@@ -23243,20 +23243,20 @@ var BlockLogin = function BlockLogin(_ref) {
     }, React__default.createElement("input", {
       type: "checkbox",
       checked: !values.isSessionUserBrowser,
-      className: "" + styles["checkbox-keep-login"],
+      className: "" + customStyles["checkbox-keep-login"],
       onChange: function onChange() {
         return setFieldValue("isSessionUserBrowser", !values.isSessionUserBrowser);
       }
     }), React__default.createElement("p", {
-      className: styles["label-keep-login"] + " mb-0 ml-2"
+      className: customStyles["label-keep-login"] + " mb-0 ml-2"
     }, "Keep me logged in")), React__default.createElement(reactRouterDom.Link, {
       to: "/forgot-password",
-      className: "" + styles["link-to-login"]
+      className: "" + customStyles["link-to-login"]
     }, "Forgot password?")), React__default.createElement("button", {
-      className: styles["btn-login"] + " mt-5",
+      className: customStyles["btn-login"] + " mt-5",
       type: "submit"
     }, "LOG IN"), React__default.createElement("p", {
-      className: styles["option-text"] + " my-3 text-center"
+      className: customStyles["option-text"] + " my-3 text-center"
     }, "OR"), React__default.createElement(reactstrap.Row, {
       className: "mb-4"
     }, React__default.createElement(reactstrap.Col, {
@@ -23269,15 +23269,15 @@ var BlockLogin = function BlockLogin(_ref) {
       buttonText: "GOOGLE",
       onSuccess: onSuccessGoogle,
       cookiePolicy: "single_host_origin",
-      className: styles["btn-login-google"] + " p-0 mb-4 mb-md-0"
+      className: customStyles["btn-login-google"] + " p-0 mb-4 mb-md-0"
     })), React__default.createElement(reactstrap.Col, {
       lg: 6,
       md: 6,
       xs: 12,
-      className: styles["btn-login-sso"] + " pl-md-2",
+      className: customStyles["btn-login-sso"] + " pl-md-2",
       hidden: !(school !== null && school !== void 0 && school.schoolId)
     }, React__default.createElement("div", {
-      className: styles["btn-login-with-sso"],
+      className: customStyles["btn-login-with-sso"],
       onClick: function onClick() {
         return fnLoginSSO(clickHandler);
       }
@@ -23486,22 +23486,22 @@ var BlockForgetPassword = function BlockForgetPassword(_ref) {
         touched = formikProps.touched,
         errors = formikProps.errors;
     return React__default.createElement("div", {
-      className: "" + styles["box-login"]
+      className: "" + customStyles["box-login"]
     }, React__default.createElement("div", {
-      className: "" + styles["block-login"]
+      className: "" + customStyles["block-login"]
     }, React__default.createElement("div", {
-      className: "" + styles["block-form"]
+      className: "" + customStyles["block-form"]
     }, React__default.createElement("div", {
       className: "d-flex align-items-center mb-4"
     }, React__default.createElement("img", {
       src: "" + getStaticFileUrl("/images/mario-logo.png"),
-      className: styles["school-icon"] + " mr-3"
+      className: customStyles["school-icon"] + " mr-3"
     }), React__default.createElement("p", {
-      className: styles["school-name"] + " mb-0"
+      className: customStyles["school-name"] + " mb-0"
     }, school.schoolName)), React__default.createElement("p", {
-      className: styles["title-login"] + " "
+      className: customStyles["title-login"] + " "
     }, "Forgot password"), React__default.createElement("p", {
-      className: styles["recover-account"] + " mb-5"
+      className: customStyles["recover-account"] + " mb-5"
     }, "Enter email to recover your account"), React__default.createElement("div", {
       className: "w-100"
     }, React__default.createElement(reactstrap.Input, {
@@ -23515,14 +23515,14 @@ var BlockForgetPassword = function BlockForgetPassword(_ref) {
       text: errors.email
     })), React__default.createElement(reactRouterDom.Link, {
       to: "/login",
-      className: styles["link-to-login"] + " mt-2"
+      className: customStyles["link-to-login"] + " mt-2"
     }, "Return to login"), React__default.createElement(reactGoogleRecaptchaV3.GoogleReCaptcha, {
       action: "forgetPass",
       onVerify: handleVerify
     }), React__default.createElement(reactstrap.Col, {
       className: "p-0"
     }, React__default.createElement("button", {
-      className: styles["btn-login"] + " mt-5",
+      className: customStyles["btn-login"] + " mt-5",
       onClick: function onClick() {
         return handleSubmit();
       }
@@ -23574,15 +23574,15 @@ var BlockResetPassword = function BlockResetPassword() {
       setFieldValue("token", token);
     }, []);
     return React__default.createElement(reactstrap.Row, {
-      className: "" + styles["box-login"]
+      className: "" + customStyles["box-login"]
     }, React__default.createElement(reactstrap.Col, {
       className: "p-0"
     }, React__default.createElement("div", {
-      className: "" + styles["block-login"]
+      className: "" + customStyles["block-login"]
     }, React__default.createElement("div", {
-      className: "" + styles["block-form"]
+      className: "" + customStyles["block-form"]
     }, React__default.createElement("p", {
-      className: "" + styles["title-login"]
+      className: "" + customStyles["title-login"]
     }, "Reset Password"), React__default.createElement("div", {
       className: "w-100"
     }, validLink ? React__default.createElement(React__default.Fragment, null, React__default.createElement(reactstrap.Label, {
@@ -23612,13 +23612,13 @@ var BlockResetPassword = function BlockResetPassword() {
     }), touched.reEnterPassword && errors.reEnterPassword && React__default.createElement(ErrorHandler, {
       text: errors.reEnterPassword
     })) : React__default.createElement(React__default.Fragment, null, React__default.createElement("p", {
-      className: styles["recover-account"] + " mb-5"
+      className: customStyles["recover-account"] + " mb-5"
     }, "Invalid reset password link"), React__default.createElement("p", {
       className: "w-100"
     }, "It may have been accessed before or expired or you have just tried to reset another account's password"))), validLink && React__default.createElement(reactstrap.Col, {
       className: "p-0"
     }, React__default.createElement("button", {
-      className: styles["btn-login"] + " mt-4",
+      className: customStyles["btn-login"] + " mt-4",
       onClick: function onClick() {
         return handleSubmit();
       }
@@ -23626,11 +23626,11 @@ var BlockResetPassword = function BlockResetPassword() {
       className: "d-flex justify-content-between"
     }, React__default.createElement(reactRouterDom.Link, {
       to: "/login",
-      className: "" + styles["link-to-login"]
+      className: "" + customStyles["link-to-login"]
     }, "Return to login"), React__default.createElement("a", {
       href: "/privacy-policy/",
       target: "blank",
-      className: "" + styles["link-to-login"]
+      className: "" + customStyles["link-to-login"]
     }, "Privacy Policy"))))));
   });
 };
@@ -23656,7 +23656,7 @@ var Login = function Login(props) {
     isResetPassword && (document.title = RESET_PASSWORD_TITLE);
   }, [isLogin, isForgotPassword, isResetPassword]);
   return React__default.createElement("div", {
-    className: styles["login"] + " container-fluid font-family-lato"
+    className: customStyles["login"] + " container-fluid font-family-lato"
   }, React__default.createElement(reactstrap.Row, {
     className: "h-100"
   }, React__default.createElement(reactstrap.Col, {
@@ -23681,7 +23681,7 @@ var Login = function Login(props) {
   })), isResetPassword && React__default.createElement(BlockResetPassword, null), React__default.createElement("a", {
     href: "/privacy-policy/",
     target: "blank",
-    className: "" + styles["privacy-policy"]
+    className: "" + customStyles["privacy-policy"]
   }, "Privacy Policy")), !isResetPassword && React__default.createElement(reactstrap.Col, {
     className: "p-3 mh-100 d-flex justify-content-end",
     lg: 4,
@@ -23689,17 +23689,17 @@ var Login = function Login(props) {
     xs: 12
   }, React__default.createElement("img", {
     src: "" + getStaticFileUrl(window.innerWidth > 992 ? "/images/img-login.png" : "/images/img-login-tablet.png"),
-    className: "" + styles["img-login"]
+    className: "" + customStyles["img-login"]
   }))));
 };
 
 var QuoteContent = function QuoteContent() {
   return React__default.createElement("div", {
-    className: "" + styles["content-quote"]
+    className: "" + customStyles["content-quote"]
   }, React__default.createElement("div", {
-    className: styles["title-quote"] + " d-block"
+    className: customStyles["title-quote"] + " d-block"
   }, React__default.createElement("p", null, "Powerful"), React__default.createElement("p", null, "Personalized"), React__default.createElement("p", null, "Learning")), React__default.createElement("div", {
-    className: styles["descriptions-quote"] + " d-block"
+    className: customStyles["descriptions-quote"] + " d-block"
   }, React__default.createElement("p", null, "Focus on what matters most to you and"), React__default.createElement("p", null, "make learning meaningful.")));
 };
 
@@ -23708,14 +23708,14 @@ var IconContent = function IconContent(_ref) {
       content = _ref.content;
   return React__default.createElement("div", {
     key: content,
-    className: "" + styles["content-icon"]
+    className: "" + customStyles["content-icon"]
   }, React__default.createElement("div", {
-    className: "" + styles["title-icon"]
+    className: "" + customStyles["title-icon"]
   }, React__default.createElement("img", {
     src: getStaticFileUrl(srcIcon),
     alt: "icon"
   })), React__default.createElement("div", {
-    className: "" + styles["descriptions-icon"],
+    className: "" + customStyles["descriptions-icon"],
     dangerouslySetInnerHTML: {
       __html: content
     }
@@ -23737,12 +23737,12 @@ var ContentHomePage = function ContentHomePage(_ref) {
   _objectDestructuringEmpty(_ref);
 
   return React__default.createElement(reactstrap.Row, {
-    className: "" + styles["page-not-login"]
+    className: "" + customStyles["page-not-login"]
   }, React__default.createElement(reactstrap.Col, {
     md: 12
   }, React__default.createElement(QuoteContent, null)), React__default.createElement(reactstrap.Col, {
     md: 12,
-    className: styles["box-content-home-page"] + " d-flex align-items-center"
+    className: customStyles["box-content-home-page"] + " d-flex align-items-center"
   }, contents.map(function (content) {
     return React__default.createElement(IconContent, {
       key: content.content,
@@ -23765,10 +23765,10 @@ var BlockBackground = function BlockBackground(_ref) {
 
   var ref = React.useRef();
   var getActiveClass = React.useCallback(function (index) {
-    return index === activeImage ? styles["active"] + " " + styles["show"] : '';
+    return index === activeImage ? customStyles["active"] + " " + customStyles["show"] : '';
   }, [activeImage]);
   var getBehindClass = React.useCallback(function (index) {
-    return activeImage === 0 && index === data.length - 1 || index === activeImage - 1 ? styles["behind"] : '';
+    return activeImage === 0 && index === data.length - 1 || index === activeImage - 1 ? customStyles["behind"] : '';
   }, [activeImage, data.length]);
   var animate = React.useCallback(function () {
     ref && ref.current && clearInterval(ref.current);
@@ -23785,7 +23785,7 @@ var BlockBackground = function BlockBackground(_ref) {
     };
   }, [data.length, duration]);
   return React__default.createElement("div", {
-    className: styles["bg-animate"] + " position-absolute"
+    className: customStyles["bg-animate"] + " position-absolute"
   }, data.map(function (img, index) {
     return React__default.createElement("img", {
       key: index,
@@ -23821,55 +23821,55 @@ var Dashboard = function Dashboard(_ref) {
     !!user ? document.title = DASHBOARD_TITLE : document.title = ROOT_TITLE;
   }, [user]);
   return React__default.createElement("div", {
-    className: styles["login"] + " " + styles["red-background"] + " position-relative"
+    className: customStyles["login"] + " " + customStyles["red-background"] + " position-relative"
   }, React__default.createElement("span", {
-    className: "" + styles["version-prod"]
+    className: "" + customStyles["version-prod"]
   }, "v " + version), React__default.createElement(BlockBackground, {
     data: BG_IMAGES
   }), React__default.createElement("div", {
-    className: "" + styles["login-content"]
+    className: "" + customStyles["login-content"]
   }, React__default.createElement(reactstrap.Navbar, {
     light: true,
     expand: "md"
   }, React__default.createElement(reactstrap.NavbarBrand, {
     href: "/",
-    className: "" + styles["logo-home"]
+    className: "" + customStyles["logo-home"]
   }, React__default.createElement("img", {
     src: getStaticFileUrl("/images/logo-white.svg"),
     alt: "mario"
   })), React__default.createElement(gi.GiHamburgerMenu, {
     onClick: toggle,
-    className: styles["hide-in-desktop"] + " " + styles["hamburger-menu"]
+    className: customStyles["hide-in-desktop"] + " " + customStyles["hamburger-menu"]
   }), React__default.createElement(reactstrap.Collapse, {
     isOpen: isOpen,
     navbar: true,
-    className: "" + styles["collapse-box"]
+    className: "" + customStyles["collapse-box"]
   }, React__default.createElement(reactstrap.Nav, {
-    className: styles["nav-home"] + " d-md-flex w-100 justify-content-center mr-auto",
+    className: customStyles["nav-home"] + " d-md-flex w-100 justify-content-center mr-auto",
     navbar: true
   }, React__default.createElement(reactstrap.NavItem, null, React__default.createElement(reactstrap.NavLink, {
-    className: styles["learn-more"] + " align-self-md-center",
+    className: customStyles["learn-more"] + " align-self-md-center",
     href: "https://marioframework.com/software",
     target: "blank"
   }, "Learn More")), React__default.createElement(reactstrap.NavItem, null, React__default.createElement(reactRouterDom.Link, {
-    className: styles["contact"] + " align-self-md-center",
+    className: customStyles["contact"] + " align-self-md-center",
     to: "/contact"
   }, "Contact")), React__default.createElement(reactstrap.NavItem, null, React__default.createElement(reactstrap.NavLink, {
-    className: styles["learn-more"] + " align-self-md-center",
+    className: customStyles["learn-more"] + " align-self-md-center",
     href: "/privacy-policy",
     target: "blank"
   }, "Privacy Policy"))), React__default.createElement("div", {
-    className: styles["hide-in-mobile"] + " d-flex justify-content-end"
+    className: customStyles["hide-in-mobile"] + " d-flex justify-content-end"
   }, user ? React__default.createElement(reactRouterDom.Link, {
     to: user.roles.includes("Admin") ? HOME_ADMIN : user.roles.includes("Teacher") ? HOME_TEACHER : HOME_STUDENT,
-    className: "" + styles["btn-trans-border"]
+    className: "" + customStyles["btn-trans-border"]
   }, "Dashboard") : React__default.createElement(reactRouterDom.Link, {
     to: "/login",
-    className: "" + styles["btn-trans-border"]
+    className: "" + customStyles["btn-trans-border"]
   }, "Login")))), React__default.createElement("div", {
     className: ""
   }, React__default.createElement(ContentHomePage, null)), React__default.createElement("div", {
-    className: "" + styles["digital-privacy-icon"]
+    className: "" + customStyles["digital-privacy-icon"]
   }, React__default.createElement("a", {
     href: "https://cert.privo.com/#/companies/marioFrameworkLlc",
     target: "blank"
@@ -23917,25 +23917,25 @@ var TheSidebar = function TheSidebar(_ref) {
       return dispatch(setSidebar(val));
     },
     minimize: toggleMinimize,
-    className: "" + styles["box-sidebar"]
+    className: "" + customStyles["box-sidebar"]
   }, React__default.createElement(react.CSidebarBrand, {
-    className: styles["box-sidebar-header"] + " d-md-down-none justify-content-around"
+    className: customStyles["box-sidebar-header"] + " d-md-down-none justify-content-around"
   }, React__default.createElement("div", null, React__default.createElement("img", {
     src: Images.LOGO,
-    className: styles["sidebar-logo"] + " c-sidebar-brand-full"
+    className: customStyles["sidebar-logo"] + " c-sidebar-brand-full"
   }), React__default.createElement("img", {
     src: Images.LOGO_MINIMIZED,
-    className: styles["sidebar-logo"] + " " + styles["sidebar-btn-minimized"] + " c-sidebar-brand-minimized",
+    className: customStyles["sidebar-logo"] + " " + customStyles["sidebar-btn-minimized"] + " c-sidebar-brand-minimized",
     onClick: function onClick() {
       return setToggleMinimize(false);
     }
   })), React__default.createElement(cg.CgMenuRight, {
-    className: styles["sidebar-btn-minimized"] + " c-sidebar-brand-full",
+    className: customStyles["sidebar-btn-minimized"] + " c-sidebar-brand-full",
     onClick: function onClick() {
       return setToggleMinimize(true);
     }
   })), React__default.createElement(react.CSidebarNav, {
-    className: styles["sidebar-nav-links"] + " " + (toggleMinimize && styles["sidebar-nav-links-hover"])
+    className: customStyles["sidebar-nav-links"] + " " + (toggleMinimize && customStyles["sidebar-nav-links-hover"])
   }, React__default.createElement(react.CCreateElement, {
     items: navigation,
     components: {
@@ -23946,10 +23946,10 @@ var TheSidebar = function TheSidebar(_ref) {
     }
   })), React__default.createElement(react.CSidebarFooter, {
     onClick: signOut,
-    className: styles["box-logout"] + " p-3 d-flex align-items-center cursor-point"
+    className: customStyles["box-logout"] + " p-3 d-flex align-items-center cursor-point"
   }, React__default.createElement(ri.RiLogoutBoxRLine, {
     onClick: signOut,
-    className: "" + styles["sidebar-logout"]
+    className: "" + customStyles["sidebar-logout"]
   }), React__default.createElement("p", {
     onClick: signOut
   }, "Log out")));
@@ -24066,7 +24066,7 @@ var NotificationButton = function NotificationButton(_ref) {
       fontSize: "20px"
     }
   }), !!unReadNotification && React__default.createElement("div", {
-    className: styles["notification-count"] + " position-absolute text-small"
+    className: customStyles["notification-count"] + " position-absolute text-small"
   }, unReadNotification)));
 };
 
@@ -24115,23 +24115,23 @@ var TheHeaderDropdown = function TheHeaderDropdown(_ref) {
   return React__default.createElement(reactstrap.Dropdown, {
     isOpen: dropdownOpen,
     toggle: toggle,
-    className: "" + styles["dropdown-menu"]
+    className: "" + customStyles["dropdown-menu"]
   }, React__default.createElement(reactstrap.DropdownToggle, {
-    className: styles["header-avatar"] + " "
+    className: customStyles["header-avatar"] + " "
   }, React__default.createElement("img", {
     src: avatarUrl,
     alt: "avatar"
   })), React__default.createElement(reactstrap.DropdownMenu, {
-    className: styles["dropdown-content"]
+    className: customStyles["dropdown-content"]
   }, React__default.createElement("div", {
-    className: styles["item-contact"] + " d-flex"
+    className: customStyles["item-contact"] + " d-flex"
   }, React__default.createElement("div", {
-    className: styles["img-avatar"] + " d-flex align-items-center"
+    className: customStyles["img-avatar"] + " d-flex align-items-center"
   }, React__default.createElement("img", {
     src: avatarUrl,
     alt: "admin@bootstrapmaster.com"
   })), React__default.createElement("div", {
-    className: styles["content-text"]
+    className: customStyles["content-text"]
   }, React__default.createElement("h5", null, user.firstName + " " + user.lastName), React__default.createElement("span", {
     className: "block"
   }, email), !isDistrict && React__default.createElement(reactstrap.NavLink, null, (isAdmin || isTeacher) && React__default.createElement(reactRouterDom.Link, {
@@ -24140,18 +24140,18 @@ var TheHeaderDropdown = function TheHeaderDropdown(_ref) {
     onClick: function onClick() {
       onToggleModel === null || onToggleModel === void 0 ? void 0 : onToggleModel();
     },
-    className: styles["dropdown-change"] + " px-0"
+    className: customStyles["dropdown-change"] + " px-0"
   }, React__default.createElement("div", {
-    className: styles["item-address"] + " d-flex align-items-center w-100 text-uppercase mb-2"
+    className: customStyles["item-address"] + " d-flex align-items-center w-100 text-uppercase mb-2"
   }, React__default.createElement("span", {
     className: "mr-2"
   }, React__default.createElement("i", {
     className: "fas fa-cogs h6 mb-0"
   })), "Role change")), React__default.createElement(reactstrap.DropdownItem, {
     onClick: signOut,
-    className: styles["dropdown-change"] + " px-0"
+    className: customStyles["dropdown-change"] + " px-0"
   }, React__default.createElement("div", {
-    className: styles["item-address"] + " " + styles["item-logout"] + " d-flex align-items-center w-100"
+    className: customStyles["item-address"] + " " + customStyles["item-logout"] + " d-flex align-items-center w-100"
   }, React__default.createElement("span", {
     className: "mr-2 d-flex hover-opacity"
   }, React__default.createElement("i", {
@@ -24159,6 +24159,195 @@ var TheHeaderDropdown = function TheHeaderDropdown(_ref) {
   })), "LOG OUT"))));
 };
 
+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 = reactRedux.useDispatch();
+
+  var _useTranslation = reactI18next.useTranslation(),
+      i18n = _useTranslation.i18n;
+
+  var language = reactRedux.useSelector(function (state) {
+    return state.common.language;
+  });
+  var defaultLanguage = getCookieValue(LANGUAGE_SYSTEM) != null ? getCookieValue(LANGUAGE_SYSTEM) : DEFAULT_LANGUAGE_CODE;
+
+  var _useState = React.useState([]),
+      languageList = _useState[0],
+      setLanguageList = _useState[1];
+
+  var _useState2 = React.useState(false),
+      dropdownOpen = _useState2[0],
+      setDropdownOpen = _useState2[1];
+
+  var _useState3 = React.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);
+    }
+  };
+
+  React.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 = React.useMemo(function () {
+    var current = languageList.find(function (i) {
+      return i.code === currentLang;
+    });
+    if (!current) return null;
+    return React__default.createElement(React__default.Fragment, null, React__default.createElement("img", {
+      className: "mr-2 " + customStyles['dropdown-menu-flag'],
+      src: "" + getStaticFileUrl(current.image)
+    }), " ", current.name);
+  }, [currentLang, languageList]);
+  return React__default.createElement(reactstrap.Dropdown, {
+    isOpen: dropdownOpen,
+    toggle: toggle,
+    className: "" + customStyles["dropdown-menu"]
+  }, React__default.createElement(reactstrap.DropdownToggle, {
+    className: customStyles["header-avatar"] + " d-flex align-items-center"
+  }, React__default.createElement("span", {
+    style: {
+      color: "#000",
+      textTransform: "capitalize",
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, currentLanguage, React__default.createElement(bs.BsChevronDown, {
+    className: "ml-2",
+    style: {
+      fontSize: '10px'
+    }
+  }))), React__default.createElement(reactstrap.DropdownMenu, {
+    className: customStyles["dropdown-content-language"]
+  }, !!languageList && languageList.length > 0 && languageList.map(function (lang, index) {
+    return React__default.createElement(reactstrap.DropdownItem, {
+      key: lang.code,
+      className: customStyles["dropdown-change"] + " px-0 py-0 " + (index === languageList.length - 1 ? "pb-2" : "pt-2"),
+      onClick: function onClick() {
+        return changeLanguageApp(lang.code);
+      }
+    }, React__default.createElement("div", {
+      className: customStyles["dropdown-item-language"] + " " + customStyles["item-logout"] + " " + (currentLang == lang.code ? customStyles['dropdown-item-language-active'] : "") + " d-flex align-items-center w-100"
+    }, React__default.createElement("span", {
+      className: "mr-2 d-flex hover-opacity"
+    }, React__default.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 isDistrict = window.location.host.includes("-district");
+  return React__default.createElement(react.CHeader, {
+    withSubheader: true,
+    className: "d-flex align-items-center justify-content-end"
+  }, React__default.createElement(react.CHeaderBrand, {
+    className: "mx-auto flex-grow-1 d-lg-none",
+    to: "/"
+  }, React__default.createElement("img", {
+    src: Images.LOGO_HEADER,
+    className: customStyles["header-logo"]
+  })), React__default.createElement(react.CHeaderNav, {
+    className: "pr-3"
+  }, React__default.createElement(TheLanguageDropdown, null), React__default.createElement("a", {
+    className: "mr-3",
+    style: {
+      color: '#000'
+    },
+    href: '/privacy-policy',
+    target: "blank"
+  }, "Privacy Policy"), !isDistrict && React__default.createElement(NotificationButton, null), React__default.createElement(TheHeaderDropdown, {
+    onToggleModel: onToggleModel
+  })));
+};
+
 var TITLE$2 = "Not found";
 
 var NotFound = function NotFound() {
@@ -24219,51 +24408,270 @@ var TheContent = function TheContent(_ref) {
 
 var TheContent$1 = React__default.memo(TheContent);
 
-var buttonTextStyle = {
-  fontWeight: 500
-};
-var buttonStyle = {
-  height: 38
+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 AddButton = function AddButton(_ref) {
-  var text = _ref.text,
-      onClick = _ref.onClick,
-      className = _ref.className;
-  return React__default.createElement(reactstrap.Button, {
-    onClick: onClick,
-    color: 'success',
-    style: buttonStyle,
-    className: 'd-flex align-items-center'
-  }, React__default.createElement(fa.FaPlus, null), React__default.createElement("span", {
-    className: "ml-2 " + className,
-    style: buttonTextStyle
-  }, text));
+var Loading = function Loading() {
+  var isLoading = reactRedux.useSelector(function (state) {
+    return state.common.isLoading;
+  });
+  return isLoading ? React__default.createElement("div", {
+    style: loadingStyle
+  }, React__default.createElement("div", {
+    className: "spinner-border text-secondary",
+    role: "status"
+  }, React__default.createElement("span", {
+    className: "sr-only"
+  }, "Loading..."))) : null;
 };
 
-var DeleteButtonIcon = function DeleteButtonIcon(_ref) {
-  var onClick = _ref.onClick;
-  return React__default.createElement("div", {
-    className: "d-inline text-center cursor-pointer hover-opacity",
-    title: "Delete",
-    onClick: onClick
-  }, React__default.createElement(fa.FaTrashAlt, 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 LinkEditButton = function LinkEditButton(_ref) {
-  var label = _ref.label,
-      onClick = _ref.onClick,
-      className = _ref.className;
-  return React__default.createElement(reactstrap.Button, {
-    className: "text-left py-0 " + className,
-    color: "link",
-    onClick: onClick
-  }, label);
-};
+var canAccess = function canAccess(userRoles, componentRoles) {
+  if (!Array.isArray(userRoles)) {
+    return false;
+  }
 
-var EmptyDataAlert = function EmptyDataAlert(_ref) {
-  var label = _ref.label,
-      className = _ref.className,
+  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 = reactRedux.useDispatch();
+  var history = reactRouterDom.useHistory();
+  var pathname = window.location.pathname;
+  var user = reactRedux.useSelector(function (state) {
+    return state.common.user;
+  });
+  var roles = user === null || user === void 0 ? void 0 : user.roles;
+
+  var handleSelectUserRoles = function handleSelectUserRoles(roles) {
+    if (roles.includes("Admin")) {
+      dispatch(setLoading(true));
+      return history.push("/admin/home");
+    }
+
+    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 {
+      pathname !== "/home" ? history.push("/home") : window.location.reload();
+    }
+  };
+
+  return React__default.createElement(reactstrap.Modal, {
+    isOpen: open,
+    toggle: function toggle() {
+      return onToggleModel();
+    },
+    className: "" + customStyles["model-switch-roles"],
+    centered: true
+  }, React__default.createElement("p", {
+    className: "" + customStyles["title"]
+  }, "Continue as:"), React__default.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__default.createElement("p", {
+      key: r,
+      className: customStyles["item-select-role"] + " " + customStyles[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 = reactRouterDom.useHistory();
+  var dispatch = reactRedux.useDispatch();
+  var user = reactRedux.useSelector(function (state) {
+    return state.common.user;
+  });
+  var language = reactRedux.useSelector(function (state) {
+    return state.common.language;
+  });
+
+  var _useState = React.useState(false),
+      openModelSelectRole = _useState[0],
+      setOpenModelSelectRole = _useState[1];
+
+  var _useTranslation = reactI18next.useTranslation(),
+      t = _useTranslation.t;
+
+  var location = reactRouterDom.useLocation();
+  var isNotification = location.pathname.includes("notifications");
+  var isDistrict = window.location.host.includes("-district");
+
+  var handleToggleModel = function handleToggleModel() {
+    setOpenModelSelectRole(!openModelSelectRole);
+  };
+
+  var authRoutes = React.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 = React.useMemo(function () {
+    return navigation.map(function (item) {
+      return _extends({}, item, {
+        name: t(item.name)
+      });
+    }).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]);
+  React.useEffect(function () {
+    checkAuthentication();
+  }, []);
+
+  var checkAuthentication = function checkAuthentication() {
+    try {
+      var _temp2 = _catch(function () {
+        return Promise.resolve(firstCheckToken()).then(function (tokenStatus) {
+          tokenStatus ? loadInfo() : resetAuth();
+        });
+      }, function () {
+        resetAuth();
+      });
+
+      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  var loadInfo = function loadInfo() {
+    try {
+      var _temp4 = _catch(function () {
+        return Promise.resolve(getInfo()).then(function (info) {
+          if (!info) {
+            resetAuth();
+          }
+
+          dispatch(setUser(info.data));
+        });
+      }, function () {
+        resetAuth();
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  var resetAuth = function resetAuth() {
+    localStorage.removeItem(ACCESS_TOKEN);
+    sessionStorage.removeItem(ACCESS_TOKEN);
+    history.push("/");
+  };
+
+  if (!user) {
+    return React__default.createElement(Loading, null);
+  }
+
+  return React__default.createElement("div", {
+    className: "c-app c-default-layout"
+  }, !isNotification && React__default.createElement(TheSidebar, {
+    navigation: authNavigations
+  }), React__default.createElement("div", {
+    className: "c-wrapper"
+  }, !isNotification && React__default.createElement(TheHeader, {
+    onToggleModel: handleToggleModel
+  }), React__default.createElement("div", {
+    className: "c-body bg-white"
+  }, React__default.createElement(TheContent$1, {
+    routes: authRoutes
+  }))), React__default.createElement(ModelSelectRole, {
+    open: openModelSelectRole,
+    onToggleModel: handleToggleModel
+  }));
+};
+
+var buttonTextStyle = {
+  fontWeight: 500
+};
+var buttonStyle = {
+  height: 38
+};
+
+var AddButton = function AddButton(_ref) {
+  var text = _ref.text,
+      onClick = _ref.onClick,
+      className = _ref.className;
+  return React__default.createElement(reactstrap.Button, {
+    onClick: onClick,
+    color: 'success',
+    style: buttonStyle,
+    className: 'd-flex align-items-center'
+  }, React__default.createElement(fa.FaPlus, null), React__default.createElement("span", {
+    className: "ml-2 " + className,
+    style: buttonTextStyle
+  }, text));
+};
+
+var DeleteButtonIcon = function DeleteButtonIcon(_ref) {
+  var onClick = _ref.onClick;
+  return React__default.createElement("div", {
+    className: "d-inline text-center cursor-pointer hover-opacity",
+    title: "Delete",
+    onClick: onClick
+  }, React__default.createElement(fa.FaTrashAlt, null));
+};
+
+var LinkEditButton = function LinkEditButton(_ref) {
+  var label = _ref.label,
+      onClick = _ref.onClick,
+      className = _ref.className;
+  return React__default.createElement(reactstrap.Button, {
+    className: "text-left py-0 " + className,
+    color: "link",
+    onClick: onClick
+  }, label);
+};
+
+var EmptyDataAlert = function EmptyDataAlert(_ref) {
+  var label = _ref.label,
+      className = _ref.className,
       style = _ref.style;
 
   var _useTranslation = reactI18next.useTranslation(),
@@ -24575,9 +24983,9 @@ var EmailTemplateList = function EmailTemplateList() {
   };
 
   return React__default.createElement("div", {
-    className: "fadeIn animated " + styles[classFontSize]
+    className: "fadeIn animated " + customStyles[classFontSize]
   }, React__default.createElement("h5", {
-    className: "mb-2 " + styles['custom-title-font-size']
+    className: "mb-2 " + customStyles['custom-title-font-size']
   }, t(header)), React__default.createElement(reactstrap.Row, {
     className: "my-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -24587,10 +24995,10 @@ var EmailTemplateList = function EmailTemplateList() {
     onClick: function onClick() {
       return goToDetail();
     },
-    className: " " + styles['custom-font-size']
+    className: " " + customStyles['custom-font-size']
   })), React__default.createElement(reactstrap.Col, {
     md: 4,
-    className: "d-flex justify-content-end align-items-center " + styles['custom-font-size']
+    className: "d-flex justify-content-end align-items-center " + customStyles['custom-font-size']
   }, t('total_of_templates'), ": ", totalItems)), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -24602,13 +25010,13 @@ var EmailTemplateList = function EmailTemplateList() {
     responsive: true,
     size: "sm"
   }, React__default.createElement("thead", null, React__default.createElement("tr", null, React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('template_name')), React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('category_name')), React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('created_date')), React__default.createElement("th", {
-    className: "text-center " + styles['custom-font-size']
+    className: "text-center " + customStyles['custom-font-size']
   }, t('action')))), React__default.createElement("tbody", null, emailTemplateList.map(function (record) {
     return React__default.createElement("tr", {
       key: record.id
@@ -24619,11 +25027,11 @@ var EmailTemplateList = function EmailTemplateList() {
       onClick: function onClick() {
         return goToDetail(record.id);
       },
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, record.category.name), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, dateFns.format(new Date(record.createdAt), DATE_RESULT)), React__default.createElement("td", {
       className: "text-center align-middle"
     }, React__default.createElement(DeleteButtonIcon, {
@@ -24659,12 +25067,12 @@ var EmailTemplateList = function EmailTemplateList() {
     responsive: true,
     size: "sm"
   }, React__default.createElement("thead", null, React__default.createElement("tr", null, React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('category_name')))), React__default.createElement("tbody", null, mailCategoryList.map(function (record) {
     return React__default.createElement("tr", {
       key: record.id
     }, React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, record.name));
   }))))));
 };
@@ -25370,18 +25778,18 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
         handleBlur = formikProps.handleBlur,
         handleSubmit = formikProps.handleSubmit;
     return React__default.createElement("div", {
-      className: "animated fadeIn detail-buttons-padding " + styles[classFontSize],
+      className: "animated fadeIn detail-buttons-padding " + customStyles[classFontSize],
       id: "email-detail"
     }, React__default.createElement(QuitPrompt, {
       when: edited
     }), React__default.createElement("h5", {
-      className: "mb-2 " + styles['custom-title-font-size']
+      className: "mb-2 " + customStyles['custom-title-font-size']
     }, t(header)), React__default.createElement(reactstrap.Row, {
       className: "my-2"
     }, React__default.createElement(reactstrap.Col, {
       md: 8
     }, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('mail_subject')
     }), React__default.createElement(reactstrap.Input, {
       placeholder: t('mail_subject_nm'),
@@ -25392,13 +25800,13 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
         setEditedTrue();
       },
       onBlur: handleBlur("subject"),
-      className: "selector-input " + styles['custom-font-size']
+      className: "selector-input " + customStyles['custom-font-size']
     }), touched.subject && errors.subject && React__default.createElement(ErrorHandler, {
       text: errors.subject
     })), React__default.createElement(reactstrap.Col, {
       md: 4
     }, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t("category")
     }), React__default.createElement(MailCategorySelector, {
       onChange: function onChange(e) {
@@ -25406,7 +25814,7 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
         setEditedTrue();
       },
       id: values.categoryId,
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), touched.categoryId && errors.categoryId && React__default.createElement(ErrorHandler, {
       text: errors.categoryId
     }))), React__default.createElement(reactstrap.Row, {
@@ -25417,7 +25825,7 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
       md: 12,
       className: "mb-2"
     }, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('mail_body')
     }), (emailTemplateDetail.body || !id) && React__default.createElement(tinymceReact.Editor, {
       ref: function ref(node) {
@@ -25440,7 +25848,7 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
       color: "link",
       size: "sm",
       onClick: onAttachFile,
-      className: "pl-0 " + styles['custom-font-size']
+      className: "pl-0 " + customStyles['custom-font-size']
     }, t('add_attachment'))), React__default.createElement(reactstrap.Col, {
       md: 12
     }, React__default.createElement(reactstrap.Row, null, values.attachments.map(function (attachment) {
@@ -25454,7 +25862,7 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
             return a.name !== attachment.name;
           }));
         },
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }));
     }), fileUpload.map(function (file, index) {
       return React__default.createElement(reactstrap.Col, {
@@ -25466,12 +25874,12 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
         onRemove: function onRemove() {
           return removeAttachment(file.inputId, file.name);
         },
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }));
     }))))))), React__default.createElement(reactstrap.Col, {
       md: 4
     }, React__default.createElement(reactstrap.Label, {
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }, t('mail_params')), React__default.createElement(MailSubject, {
       onClick: function onClick(param) {
         return addParams(param);
@@ -25479,12 +25887,12 @@ var EmailTemplateDetail = function EmailTemplateDetail() {
       isResetPasswordTemplate: values.categoryId == (mailCategoryList && mailCategoryList.length > 0 && mailCategoryList.filter(function (c) {
         return c.name == "Reset password";
       })[0].id),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }))), React__default.createElement(DetailActionButtons, {
       confirmText: confirmText,
       onConfirm: handleSubmit,
       onCancel: backToList,
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }));
   });
 };
@@ -25570,9 +25978,9 @@ var CommonModal = function CommonModal(props, ref) {
       return _toggle(!!edited);
     },
     size: size,
-    className: styles[className]
+    className: customStyles[className]
   }, React__default.createElement(reactstrap.ModalHeader, {
-    className: "" + styles['custom-title-font-size'],
+    className: "" + customStyles['custom-title-font-size'],
     toggle: function toggle() {
       return _toggle(!!edited);
     }
@@ -25581,10 +25989,10 @@ var CommonModal = function CommonModal(props, ref) {
   }, onConfirm && React__default.createElement(reactstrap.Button, {
     color: "primary",
     onClick: onConfirm,
-    className: " " + styles['custom-font-size']
+    className: " " + customStyles['custom-font-size']
   }, confirmText || t('confirm')), React__default.createElement(reactstrap.Button, {
     onClick: cancel,
-    className: " " + styles['custom-font-size']
+    className: " " + customStyles['custom-font-size']
   }, cancelText || t("cancel"))));
 };
 
@@ -26158,7 +26566,7 @@ var SkillDetailModal = function SkillDetailModal(props, ref) {
       md: 12,
       className: "mb-2"
     }, React__default.createElement(RequiredLabel$1, {
-      className: "" + styles['custom-font-size'],
+      className: "" + customStyles['custom-font-size'],
       text: t('name')
     }), React__default.createElement(reactstrap.Input, {
       name: "name",
@@ -26169,14 +26577,14 @@ var SkillDetailModal = function SkillDetailModal(props, ref) {
         setEditedTrue();
       },
       onBlur: handleBlur("name"),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), touched.name && errors.name && React__default.createElement(ErrorHandler, {
       text: errors.name
     })), React__default.createElement(reactstrap.Col, {
       md: 12,
       className: "mb-2"
     }, React__default.createElement(reactstrap.Label, {
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }, t('description')), React__default.createElement(reactstrap.Input, {
       type: "textarea",
       rows: 5,
@@ -26188,12 +26596,12 @@ var SkillDetailModal = function SkillDetailModal(props, ref) {
         setEditedTrue();
       },
       onBlur: handleBlur("description"),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     })), React__default.createElement(reactstrap.Col, {
       md: 12,
       className: "mb-2"
     }, React__default.createElement(reactstrap.Label, {
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }, t('parent_category')), React__default.createElement(SkillSelector, {
       isDisabled: isDisabled,
       onChange: function onChange(e) {
@@ -26201,7 +26609,7 @@ var SkillDetailModal = function SkillDetailModal(props, ref) {
         setEditedTrue();
       },
       id: values.parentSkillId,
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }))));
   });
 };
@@ -26512,7 +26920,7 @@ var SkillList = function SkillList() {
   };
 
   return React__default.createElement("div", {
-    className: "fadeIn animated " + styles[classFontSize]
+    className: "fadeIn animated " + customStyles[classFontSize]
   }, React__default.createElement(SkillDetailModal$1, {
     ref: modal,
     header: t(!!id ? "edit_skill" : "create_skill"),
@@ -26537,10 +26945,10 @@ var SkillList = function SkillList() {
     onClick: function onClick() {
       return openModal();
     },
-    className: " " + styles['custom-font-size']
+    className: " " + customStyles['custom-font-size']
   })), React__default.createElement(reactstrap.Col, {
     md: 4,
-    className: "d-flex justify-content-end align-items-center " + styles['custom-font-size']
+    className: "d-flex justify-content-end align-items-center " + customStyles['custom-font-size']
   }, t('total_of_skills'), ": ", totalItems)), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -26552,28 +26960,28 @@ var SkillList = function SkillList() {
     responsive: true,
     size: "sm"
   }, React__default.createElement("thead", null, React__default.createElement("tr", null, React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('name')), React__default.createElement("th", {
-    className: "align-top " + styles['custom-font-size']
+    className: "align-top " + customStyles['custom-font-size']
   }, t('description')), React__default.createElement("th", {
-    className: "text-center " + styles['custom-font-size']
+    className: "text-center " + customStyles['custom-font-size']
   }, t('action')))), React__default.createElement("tbody", null, skillList.map(function (record) {
     return React__default.createElement("tr", {
       key: record.id
     }, React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, React__default.createElement(LinkEditButton, {
       label: record.name,
       onClick: function onClick() {
         return openModal(record.id);
       },
-      className: "" + styles['custom-font-size']
+      className: "" + customStyles['custom-font-size']
     }), !!record.path && React__default.createElement("p", {
       className: "mb-0 pl-3"
     }, React__default.createElement("i", null, record.path))), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, record.description), React__default.createElement("td", {
-      className: "text-center align-middle " + styles['custom-font-size']
+      className: "text-center align-middle " + customStyles['custom-font-size']
     }, React__default.createElement(DeleteButtonIcon, {
       onClick: function onClick() {
         return onRemove(record.id);
@@ -26597,7 +27005,7 @@ var SkillList = function SkillList() {
         currentPage: currentPage
       });
     },
-    className: "" + styles['custom-font-size']
+    className: "" + customStyles['custom-font-size']
   }))));
 };
 
@@ -26646,7 +27054,7 @@ var CustomTabs = function CustomTabs(props) {
     }
 
     return React__default.createElement(reactstrap.Row, {
-      className: styles[classFontSize]
+      className: customStyles[classFontSize]
     }, React__default.createElement(reactstrap.Col, {
       md: 12
     }, React__default.createElement("h5", null, t(title))), React__default.createElement(reactstrap.Col, {
@@ -26657,7 +27065,7 @@ var CustomTabs = function CustomTabs(props) {
       return React__default.createElement(reactstrap.NavItem, {
         key: i.path
       }, React__default.createElement(reactstrap.NavLink, {
-        className: (i.path === pathname ? "active" : "") + " " + styles['custom-font-size'] + " cursor-pointer",
+        className: (i.path === pathname ? "active" : "") + " " + customStyles['custom-font-size'] + " cursor-pointer",
         onClick: function onClick() {
           toggle(i.path);
         }
@@ -27205,7 +27613,7 @@ var SearchBoxContainer = function SearchBoxContainer(_ref) {
   return React__default.createElement("div", {
     className: "d-flex align-items-center"
   }, React__default.createElement("div", null, React__default.createElement(AddButton, {
-    className: "" + styles['custom-font-size'],
+    className: "" + customStyles['custom-font-size'],
     text: text,
     onClick: onClick
   })), React__default.createElement("div", {
@@ -27215,7 +27623,7 @@ var SearchBoxContainer = function SearchBoxContainer(_ref) {
     onSearch: onSearch,
     placeholder: placeholder,
     style: searchInputStyle,
-    className: "" + styles['custom-font-size']
+    className: "" + customStyles['custom-font-size']
   })));
 };
 
@@ -27390,18 +27798,18 @@ var FilterPopover = function FilterPopover(props) {
     className: "pb-3"
   }, React__default.createElement("div", {
     ref: ref,
-    className: styles["popover"]
+    className: customStyles["popover"]
   }, React__default.createElement("div", {
-    className: "d-flex flex-column " + styles["popover__sort"]
+    className: "d-flex flex-column " + customStyles["popover__sort"]
   }, React__default.createElement(reactstrap.Label, {
     className: "font-weight-bold"
   }, "Sort"), React__default.createElement("div", {
-    className: "px-1 " + styles["popover__sort__item"] + " " + (isAscending && styles["popover__sort__item--active"]),
+    className: "px-1 " + customStyles["popover__sort__item"] + " " + (isAscending && customStyles["popover__sort__item--active"]),
     onClick: handleSortAsc
   }, React__default.createElement(ai.AiOutlineSortAscending, {
     className: "mr-1"
   }), "Ascending"), React__default.createElement("div", {
-    className: "px-1 mt-1 " + styles["popover__sort__item"] + " " + (isDescending && styles["popover__sort__item--active"]),
+    className: "px-1 mt-1 " + customStyles["popover__sort__item"] + " " + (isDescending && customStyles["popover__sort__item--active"]),
     onClick: handleSortDesc
   }, React__default.createElement(ai.AiOutlineSortDescending, {
     className: "mr-1"
@@ -27412,16 +27820,16 @@ var FilterPopover = function FilterPopover(props) {
   }, React__default.createElement(reactstrap.Label, {
     className: "font-weight-bold"
   }, "Filter"), React__default.createElement("div", {
-    className: "position-relative px-1 " + styles["popover__search"]
+    className: "position-relative px-1 " + customStyles["popover__search"]
   }, React__default.createElement(bi.BiSearchAlt2, {
-    className: "position-absolute " + styles["popover__search__icon"]
+    className: "position-absolute " + customStyles["popover__search__icon"]
   }), React__default.createElement(reactstrap.Input, {
     ref: inputRef,
-    className: styles["popover__search__input"],
+    className: customStyles["popover__search__input"],
     value: searchKey,
     onChange: handleChangeSearchKey
   })), React__default.createElement("div", {
-    className: "mx-1 mt-2 p-2 bg-light " + styles["popover__options"]
+    className: "mx-1 mt-2 p-2 bg-light " + customStyles["popover__options"]
   }, React__default.createElement(reactstrap.FormGroup, {
     className: "d-flex align-items-center",
     check: true
@@ -27511,7 +27919,7 @@ var HeaderCell = function HeaderCell(_ref) {
   return React__default.createElement("th", {
     className: data.className
   }, !!id && data.sortBy !== undefined ? React__default.createElement("div", {
-    className: "w-100 d-flex justify-content-between align-items-center " + styles["table-filter-icon"]
+    className: "w-100 d-flex justify-content-between align-items-center " + customStyles["table-filter-icon"]
   }, t(data.name), React__default.createElement("div", {
     className: "ml-2 p-1",
     id: id,
@@ -27684,11 +28092,11 @@ var UserList = function UserList() {
       t = _useTranslation.t;
 
   return React__default.createElement("div", {
-    className: "fadeIn animated h-100 pt-3 " + styles[classFontSize]
+    className: "fadeIn animated h-100 pt-3 " + customStyles[classFontSize]
   }, React__default.createElement("h5", {
-    className: "mb-2 " + styles['custom-title-font-size']
+    className: "mb-2 " + customStyles['custom-title-font-size']
   }, t('user')), React__default.createElement(reactstrap.Row, {
-    className: "my-2 " + styles['custom-font-size']
+    className: "my-2 " + customStyles['custom-font-size']
   }, React__default.createElement(reactstrap.Col, {
     md: 8
   }, React__default.createElement(SearchBoxContainer, {
@@ -27705,7 +28113,7 @@ var UserList = function UserList() {
     placeholder: t('type_something_to_search_by_user_name')
   })), React__default.createElement(reactstrap.Col, {
     md: 4,
-    className: "d-flex justify-content-end align-items-center " + styles['custom-font-size']
+    className: "d-flex justify-content-end align-items-center " + customStyles['custom-font-size']
   }, t('total_of_users'), ": ", totalItems)), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -27725,26 +28133,26 @@ var UserList = function UserList() {
     return React__default.createElement("tr", {
       key: record.id
     }, React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, React__default.createElement(LinkEditButton, {
       label: "" + record.fullName,
       onClick: function onClick() {
         return reDirectDetailPage(record.id);
       }
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, record.email), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, record.dateOfBirth !== DATE_MIN_VALUE && differenceInCalendarYears(new Date(), moment.utc(record.dateOfBirth).local().toDate())), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, !!record.roles && record.roles.map(function (role) {
       return role === "SecondaryTeacher" ? "SupportTeacher" : role;
     }).join(", ")), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, t(record.isActive ? "active" : "inactive")), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, utcToLocalTime(record === null || record === void 0 ? void 0 : record.createTime, "yyyy-MM-DD HH:mm")), React__default.createElement("td", {
-      className: "align-middle text-center " + styles['custom-font-size']
+      className: "align-middle text-center " + customStyles['custom-font-size']
     }, React__default.createElement(fa.FaUsersCog, {
       style: {
         fontSize: "18px",
@@ -27780,7 +28188,7 @@ var UserList = function UserList() {
         currentPage: currentPage
       });
     },
-    className: "" + styles['custom-font-size']
+    className: "" + customStyles['custom-font-size']
   }))));
 };
 
@@ -28359,9 +28767,9 @@ var AssignStudentList = function AssignStudentList() {
       handleAssignMultiStudent = _useAssignStudent.handleAssignMultiStudent;
 
   return React__default.createElement("div", {
-    className: "fadeIn animated " + styles[classFontSize]
+    className: "fadeIn animated " + customStyles[classFontSize]
   }, React__default.createElement("h5", {
-    className: "mt-4 mb-2 " + styles['custom-title-font-size']
+    className: "mt-4 mb-2 " + customStyles['custom-title-font-size']
   }, t("assign_student")), React__default.createElement(reactstrap.Row, {
     className: "my-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -28374,10 +28782,10 @@ var AssignStudentList = function AssignStudentList() {
       });
     },
     placeholder: t('type_something_to_search_students'),
-    className: styles['custom-font-size']
+    className: customStyles['custom-font-size']
   })), React__default.createElement(reactstrap.Col, {
     md: 4,
-    className: "d-flex justify-content-end align-items-center " + styles['custom-font-size']
+    className: "d-flex justify-content-end align-items-center " + customStyles['custom-font-size']
   }, t("total_of_users"), ": ", totalItem)), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, null, React__default.createElement(reactstrap.Button, {
@@ -28385,7 +28793,7 @@ var AssignStudentList = function AssignStudentList() {
       return handleAssignMultiStudent(isCheck);
     },
     color: "primary",
-    className: styles['custom-font-size']
+    className: customStyles['custom-font-size']
   }, t("assign_for_selected_students")))), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, {
@@ -28402,7 +28810,7 @@ var AssignStudentList = function AssignStudentList() {
     onChange: handleSelectAll,
     checked: isCheckAll
   })), React__default.createElement("th", {
-    className: "align-top " + styles["pointer"] + " text-capitalize",
+    className: "align-top " + customStyles["pointer"] + " text-capitalize",
     onClick: function onClick() {
       return handelSort(UserOrder.Name);
     }
@@ -28411,7 +28819,7 @@ var AssignStudentList = function AssignStudentList() {
   }) : React__default.createElement(ai.AiOutlineSortAscending, {
     className: "ml-1"
   }))), React__default.createElement("th", {
-    className: "align-top " + styles["pointer"],
+    className: "align-top " + customStyles["pointer"],
     onClick: function onClick() {
       return handelSort(UserOrder.Email);
     }
@@ -28437,22 +28845,22 @@ var AssignStudentList = function AssignStudentList() {
     return React__default.createElement("tr", {
       key: item.id
     }, React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size'] + " text-center"
+      className: "align-middle " + customStyles['custom-font-size'] + " text-center"
     }, React__default.createElement("input", {
       id: item.id,
       type: "checkbox",
       onChange: handleClickCheck,
       checked: isCheck.includes(item.id)
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, item.fullName), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, item.email), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, !!item.mainTeacherEmail ? React__default.createElement(React__default.Fragment, null, React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.mainTeacherEmail), React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.mainTeacherName)) : React__default.createElement(TeacherSelector, {
       value: selectedTeachers === null || selectedTeachers === void 0 ? void 0 : selectedTeachers[item.id],
       options: teacherOptions,
@@ -28463,13 +28871,13 @@ var AssignStudentList = function AssignStudentList() {
         return handleCreateTeacherOption(value, item.id);
       },
       placeholder: t("select_teacher"),
-      className: "flex-grow-1 mr-2 " + styles['custom-font-size']
+      className: "flex-grow-1 mr-2 " + customStyles['custom-font-size']
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, !!item.assistantEmail ? React__default.createElement(React__default.Fragment, null, React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.assistantEmail), React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.assistantName)) : React__default.createElement(TeacherSelector, {
       value: selectedAssistants === null || selectedAssistants === void 0 ? void 0 : selectedAssistants[item.id],
       options: assistantOptions,
@@ -28480,13 +28888,13 @@ var AssignStudentList = function AssignStudentList() {
         return handleCreateAssistantOption(value, item.id);
       },
       placeholder: t("select_assistant"),
-      className: "flex-grow-1 mr-2 " + styles['custom-font-size']
+      className: "flex-grow-1 mr-2 " + customStyles['custom-font-size']
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, !!item.counselorEmail ? React__default.createElement(React__default.Fragment, null, React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.counselorEmail), React__default.createElement("p", {
-      className: "mb-0 " + styles['custom-font-size']
+      className: "mb-0 " + customStyles['custom-font-size']
     }, item.counselorName)) : React__default.createElement(TeacherSelector, {
       value: selectedCounselors === null || selectedCounselors === void 0 ? void 0 : selectedCounselors[item.id],
       options: counselorOptions,
@@ -28497,9 +28905,9 @@ var AssignStudentList = function AssignStudentList() {
         return handleCreateCounselorOption(value, item.id);
       },
       placeholder: t("select_counselor"),
-      className: "flex-grow-1 mr-2 " + styles['custom-font-size']
+      className: "flex-grow-1 mr-2 " + customStyles['custom-font-size']
     })), React__default.createElement("td", {
-      className: "align-middle " + styles['custom-font-size']
+      className: "align-middle " + customStyles['custom-font-size']
     }, React__default.createElement("div", {
       className: "d-flex"
     }, React__default.createElement(LinkEditButton, {
@@ -28507,7 +28915,7 @@ var AssignStudentList = function AssignStudentList() {
       onClick: function onClick() {
         return handleAssignSingleStudent(item.id);
       },
-      className: styles['custom-font-size']
+      className: customStyles['custom-font-size']
     }))));
   })))) : React__default.createElement(EmptyDataAlert, {
     label: "student"
@@ -28526,7 +28934,7 @@ var AssignStudentList = function AssignStudentList() {
         currentPage: currentPage
       });
     },
-    className: styles['custom-font-size']
+    className: customStyles['custom-font-size']
   }))));
 };
 
@@ -28615,14 +29023,14 @@ var UploadFileButton = function UploadFileButton(_ref) {
     htmlFor: "uploadFile",
     role: "button",
     tabIndex: 0,
-    className: styles["input-file-label"]
+    className: customStyles["input-file-label"]
   }, isCheckFeedBack == true ? React__default.createElement(md.MdAttachFile, null) : React__default.createElement(React__default.Fragment, null, React__default.createElement("i", {
     className: "fa fa-paperclip mr-1",
     "aria-hidden": "true"
   }), imagePreviewUrl || fileName ? "Change file" : "Choose file")), canDelete && imagePreviewContainer && React__default.createElement(reactstrap.Button, {
     size: "sm",
     color: "danger",
-    className: styles["delete-avatar-button"] + " ml-2 d-flex align-items-center justify-content-center",
+    className: customStyles["delete-avatar-button"] + " ml-2 d-flex align-items-center justify-content-center",
     onClick: function onClick() {
       setImagePreviewUrl(null);
       onDelete && onDelete();
@@ -29036,19 +29444,19 @@ var UserDetail = function UserDetail() {
       setFieldValue("roles", [].concat(values.roles, [role]));
     }, [values.roles]);
     return React__default.createElement("div", {
-      className: "animated fadeIn detail-buttons-padding " + styles[classFontSize]
+      className: "animated fadeIn detail-buttons-padding " + customStyles[classFontSize]
     }, React__default.createElement(QuitPrompt, {
       when: edited
     }), React__default.createElement("h5", {
-      className: "mb-2 " + styles['custom-title-font-size']
+      className: "mb-2 " + customStyles['custom-title-font-size']
     }, t(header)), React__default.createElement(reactstrap.Row, {
-      className: "pt-2 " + styles['custom-font-size']
+      className: "pt-2 " + customStyles['custom-font-size']
     }, React__default.createElement(reactstrap.Col, {
       md: 8
     }, React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('first_name')
     }), React__default.createElement(reactstrap.Input, {
       name: "firstName",
@@ -29059,13 +29467,13 @@ var UserDetail = function UserDetail() {
       },
       onBlur: handleBlur("subject"),
       placeholder: t('first_name'),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), touched.firstName && errors.firstName && React__default.createElement(ErrorHandler, {
       text: errors.firstName
     }))), React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('date_of_birth')
     }), React__default.createElement("div", null, React__default.createElement(DatePicker, {
       value: values.dateOfBirth,
@@ -29086,14 +29494,14 @@ var UserDetail = function UserDetail() {
           width: "maxContent"
         },
         placeholder: t('date_of_birth'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       })
     })), touched.dateOfBirth && errors.dateOfBirth && React__default.createElement(ErrorHandler, {
       text: errors.dateOfBirth
     })))), React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('last_name')
     }), React__default.createElement(reactstrap.Input, {
       name: "lastName",
@@ -29104,13 +29512,13 @@ var UserDetail = function UserDetail() {
       },
       onBlur: handleBlur("lastName"),
       placeholder: t('last_name'),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), touched.lastName && errors.lastName && React__default.createElement(ErrorHandler, {
       text: errors.lastName
     }))), React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('roles')
     }), React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 12,
@@ -29129,14 +29537,14 @@ var UserDetail = function UserDetail() {
           setEditedTrue();
         },
         disabled: !!id ? currentRoles.concat(["Student", "Parent", "General ED teacher"]).includes(role) || currentRoles.every(handleDisableRoles) : ["Parent"].includes(role),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }));
     }))), touched.roles && errors.roles && React__default.createElement(ErrorHandler, {
       text: errors.roles
     })))), React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-      className: " " + styles['custom-font-size'],
+      className: " " + customStyles['custom-font-size'],
       text: t('email')
     }), React__default.createElement(reactstrap.Input, {
       name: "email",
@@ -29147,14 +29555,14 @@ var UserDetail = function UserDetail() {
       },
       onBlur: handleBlur("email"),
       placeholder: t('email'),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), touched.email && errors.email && React__default.createElement(ErrorHandler, {
       text: errors.email
     }))), React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
       text: t('status'),
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 3
     }, React__default.createElement(reactstrap.CustomInput, {
@@ -29167,7 +29575,7 @@ var UserDetail = function UserDetail() {
         setFieldValue("isActive", true);
         setEditedTrue();
       },
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     })), React__default.createElement(reactstrap.Col, {
       md: 3
     }, React__default.createElement(reactstrap.CustomInput, {
@@ -29179,19 +29587,19 @@ var UserDetail = function UserDetail() {
       onChange: function onChange() {
         return setFieldValue("isActive", false);
       },
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     })))))), !!id && React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
       md: 6
     }), React__default.createElement(reactstrap.Col, {
       md: 6
     }, React__default.createElement(reactstrap.Button, {
       color: "primary",
-      className: "w-100 " + styles['custom-font-size'],
+      className: "w-100 " + customStyles['custom-font-size'],
       onClick: function onClick() {
         onResetPw(values.email || "");
       }
     }, t('send_forgot_password_link')), React__default.createElement(reactstrap.Button, {
-      className: "w-100 mt-3 " + styles['custom-font-size'],
+      className: "w-100 mt-3 " + customStyles['custom-font-size'],
       color: "success",
       onClick: function onClick() {
         getFile();
@@ -29235,7 +29643,7 @@ var UserDetail = function UserDetail() {
       }, React__default.createElement(reactstrap.Col, {
         md: 7
       }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
-        className: " " + styles['custom-font-size'],
+        className: " " + customStyles['custom-font-size'],
         text: t('current_password')
       }), React__default.createElement(reactstrap.Input, {
         name: "oldPassword",
@@ -29247,14 +29655,14 @@ var UserDetail = function UserDetail() {
         },
         onBlur: handleBlur("subject"),
         placeholder: t('current_password'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }), touched.oldPassword && errors.oldPassword && React__default.createElement(ErrorHandler, {
         text: errors.oldPassword
       }))), React__default.createElement(reactstrap.Col, {
         md: 7
       }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
         text: t('new_password'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }), React__default.createElement(reactstrap.Input, {
         name: "newPassword",
         type: "password",
@@ -29265,14 +29673,14 @@ var UserDetail = function UserDetail() {
         },
         onBlur: handleBlur("subject"),
         placeholder: t('new_password'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }), touched.newPassword && errors.newPassword && React__default.createElement(ErrorHandler, {
         text: errors.newPassword
       }))), React__default.createElement(reactstrap.Col, {
         md: 7
       }, React__default.createElement(reactstrap.FormGroup, null, React__default.createElement(RequiredLabel$1, {
         text: t('confirm_password'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }), React__default.createElement(reactstrap.Input, {
         name: "confirmedNewPassword",
         type: "password",
@@ -29283,7 +29691,7 @@ var UserDetail = function UserDetail() {
         },
         onBlur: handleBlur("subject"),
         placeholder: t('confirm_password'),
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       }), touched.confirmedNewPassword && errors.confirmedNewPassword && React__default.createElement(ErrorHandler, {
         text: errors.confirmedNewPassword
       }))), React__default.createElement(reactstrap.Col, {
@@ -29291,7 +29699,7 @@ var UserDetail = function UserDetail() {
       }, React__default.createElement(reactstrap.Button, {
         color: "primary",
         size: "sm",
-        className: "px-4 pl-1 mr-2 ml-3 " + styles['custom-font-size'],
+        className: "px-4 pl-1 mr-2 ml-3 " + customStyles['custom-font-size'],
         onClick: function onClick() {
           return handleSubmit();
         }
@@ -29300,7 +29708,7 @@ var UserDetail = function UserDetail() {
       confirmText: confirmText,
       onConfirm: values.roles.includes(ROLES.STUDENT) && !id ? handleToggleModel : handleSubmit,
       onCancel: backToList,
-      className: " " + styles['custom-font-size']
+      className: " " + customStyles['custom-font-size']
     }), React__default.createElement(reactstrap.Modal, {
       centered: true,
       isOpen: openModel,
@@ -29335,33 +29743,6 @@ 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 = reactRedux.useSelector(function (state) {
-    return state.common.isLoading;
-  });
-  return isLoading ? React__default.createElement("div", {
-    style: loadingStyle
-  }, React__default.createElement("div", {
-    className: "spinner-border text-secondary",
-    role: "status"
-  }, React__default.createElement("span", {
-    className: "sr-only"
-  }, "Loading..."))) : null;
-};
-
 var ScrollToTop = function ScrollToTop() {
   var _useLocation = reactRouterDom.useLocation(),
       pathname = _useLocation.pathname;
@@ -29990,7 +30371,7 @@ var NotificationList = function NotificationList() {
     }, record.text), React__default.createElement("td", {
       className: "align-middle"
     }, utcToLocalTime(record.time, "yyyy-MM-DD HH:mm")), React__default.createElement("td", {
-      className: styles["control-input"] + " text-center align-middle"
+      className: customStyles["control-input"] + " text-center align-middle"
     }, React__default.createElement(reactstrap.CustomInput, {
       type: "checkbox",
       id: "status-checkbox-" + record.id,
@@ -30028,7 +30409,7 @@ var NotificationList = function NotificationList() {
   }))));
 };
 
-var styles$1 = {"app-alert":"_3XSJu","app-alert--success":"_2W87y"};
+var styles = {"app-alert":"_3XSJu","app-alert--success":"_2W87y"};
 
 var IconSuccess = function IconSuccess(_ref) {
   var _ref$className = _ref.className,
@@ -30088,7 +30469,7 @@ var CommonAlert = function CommonAlert() {
   }, [alert]);
   var isBold = !window.location.pathname.startsWith("/admin");
   return ((_alert$message2 = alert.message) === null || _alert$message2 === void 0 ? void 0 : _alert$message2.length) > 0 ? React__default.createElement("div", {
-    className: "app-alert " + (isBold ? styles$1["app-alert"] + " " + styles$1["app-alert--" + alert.type] : '')
+    className: "app-alert " + (isBold ? styles["app-alert"] + " " + styles["app-alert--" + alert.type] : '')
   }, React__default.createElement(reactstrap.Alert, {
     color: alert.type,
     isOpen: alert.message.length > 0,
@@ -30276,7 +30657,7 @@ var MediaNav = function MediaNav(_ref) {
 
 var MediaNav$1 = React__default.memo(MediaNav);
 
-var styles$2 = {"gallery-image":"_297lu","media-wrapper":"_fAgyT","media-image":"_174lZ","media-image-selected":"_27ch0","media-title":"_2KvRR","filter-media-file":"_1thMc","date-time-input":"_1Yddg"};
+var styles$1 = {"gallery-image":"_297lu","media-wrapper":"_fAgyT","media-image":"_174lZ","media-image-selected":"_27ch0","media-title":"_2KvRR","filter-media-file":"_1thMc","date-time-input":"_1Yddg"};
 
 var MediaType;
 
@@ -30331,9 +30712,9 @@ var Media = function Media(_ref) {
       className = _ref.className;
   var thumbnail = getMediaThumbnail(media);
   return React__default.createElement(reactstrap.Card, {
-    className: (isTarget ? styles$2["media-image-selected"] : '') + " border-0 "
+    className: (isTarget ? styles$1["media-image-selected"] : '') + " border-0 "
   }, React__default.createElement(reactstrap.CardImg, {
-    className: styles$2["media-image"] + " p-1",
+    className: styles$1["media-image"] + " p-1",
     top: true,
     width: "90%",
     src: thumbnail,
@@ -30345,7 +30726,7 @@ var Media = function Media(_ref) {
     }
   }, React__default.createElement(reactstrap.CardTitle, {
     tag: "h6",
-    className: styles$2["media-title"] + " " + className
+    className: styles$1["media-title"] + " " + className
   }, media.name)));
 };
 
@@ -30376,7 +30757,7 @@ var Filter = function Filter(_ref) {
     label: t('videos')
   }];
   return React__default.createElement(reactstrap.Row, {
-    className: "" + styles$2["filter-media-file"]
+    className: "" + styles$1["filter-media-file"]
   }, React__default.createElement(reactstrap.Col, {
     sm: 8
   }, React__default.createElement(SearchBox$1, {
@@ -30780,19 +31161,19 @@ var MediaList = function MediaList(_ref) {
         onClick: function onClick() {
           return handleSelectMedia(media);
         },
-        className: styles$2["media-wrapper"]
+        className: styles$1["media-wrapper"]
       }, React__default.createElement(Media$1, {
         media: media,
         isTarget: isTarget,
-        className: " " + styles['custom-font-size']
+        className: " " + customStyles['custom-font-size']
       })));
     });
   };
 
   return React__default.createElement(reactstrap.Card, {
-    className: styles[classFontSize]
+    className: customStyles[classFontSize]
   }, React__default.createElement(reactstrap.CardHeader, null, React__default.createElement(Filter, {
-    className: "" + styles['custom-font-size'],
+    className: "" + customStyles['custom-font-size'],
     changeFilters: changeFilters,
     filters: filters
   }), React__default.createElement(MediaNav$1, {
@@ -30808,7 +31189,7 @@ var MediaList = function MediaList(_ref) {
     handleDeleteMediaOrFolder: handleDeleteMediaOrFolder,
     handleGoBack: handleGoBack,
     showErrorAlert: showErrorAlert,
-    className: " " + styles['custom-font-size']
+    className: " " + customStyles['custom-font-size']
   })), React__default.createElement(reactstrap.CardBody, {
     style: {
       minHeight: height
@@ -32143,34 +32524,8 @@ var store = toolkit.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 getLanguage = function getLanguage() {
-  return api.get(BASE_URL + "/api/language");
+var getLanguage = function getLanguage() {
+  return api.get(BASE_URL + "/api/language");
 };
 
 var isInViewport = function isInViewport(el) {
@@ -32301,361 +32656,6 @@ var NotificationLogoutModal = function NotificationLogoutModal() {
   }, "Confirm")));
 };
 
-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 = reactRedux.useDispatch();
-
-  var _useTranslation = reactI18next.useTranslation(),
-      i18n = _useTranslation.i18n;
-
-  var language = reactRedux.useSelector(function (state) {
-    return state.common.language;
-  });
-  var defaultLanguage = getCookieValue(LANGUAGE_SYSTEM) != null ? getCookieValue(LANGUAGE_SYSTEM) : DEFAULT_LANGUAGE_CODE;
-
-  var _useState = React.useState([]),
-      languageList = _useState[0],
-      setLanguageList = _useState[1];
-
-  var _useState2 = React.useState(false),
-      dropdownOpen = _useState2[0],
-      setDropdownOpen = _useState2[1];
-
-  var _useState3 = React.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);
-    }
-  };
-
-  React.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 = React.useMemo(function () {
-    var current = languageList.find(function (i) {
-      return i.code === currentLang;
-    });
-    if (!current) return null;
-    return React__default.createElement(React__default.Fragment, null, React__default.createElement("img", {
-      className: "mr-2 " + styles['dropdown-menu-flag'],
-      src: "" + getStaticFileUrl(current.image)
-    }), " ", current.name);
-  }, [currentLang, languageList]);
-  return React__default.createElement(reactstrap.Dropdown, {
-    isOpen: dropdownOpen,
-    toggle: toggle,
-    className: "" + styles["dropdown-menu"]
-  }, React__default.createElement(reactstrap.DropdownToggle, {
-    className: styles["header-avatar"] + " d-flex align-items-center"
-  }, React__default.createElement("span", {
-    style: {
-      color: "#000",
-      textTransform: "capitalize",
-      display: 'flex',
-      alignItems: 'center'
-    }
-  }, currentLanguage, React__default.createElement(bs.BsChevronDown, {
-    className: "ml-2",
-    style: {
-      fontSize: '10px'
-    }
-  }))), React__default.createElement(reactstrap.DropdownMenu, {
-    className: styles["dropdown-content-language"]
-  }, !!languageList && languageList.length > 0 && languageList.map(function (lang, index) {
-    return React__default.createElement(reactstrap.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__default.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__default.createElement("span", {
-      className: "mr-2 d-flex hover-opacity"
-    }, React__default.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 isDistrict = window.location.host.includes("-district");
-  return React__default.createElement(react.CHeader, {
-    withSubheader: true,
-    className: "d-flex align-items-center justify-content-end"
-  }, React__default.createElement(react.CHeaderBrand, {
-    className: "mx-auto flex-grow-1 d-lg-none",
-    to: "/"
-  }, React__default.createElement("img", {
-    src: Images.LOGO_HEADER,
-    className: styles["header-logo"]
-  })), React__default.createElement(react.CHeaderNav, {
-    className: "pr-3"
-  }, React__default.createElement(TheLanguageDropdown, null), React__default.createElement("a", {
-    className: "mr-3",
-    style: {
-      color: '#000'
-    },
-    href: '/privacy-policy',
-    target: "blank"
-  }, "Privacy Policy"), !isDistrict && React__default.createElement(NotificationButton, null), React__default.createElement(TheHeaderDropdown, {
-    onToggleModel: onToggleModel
-  })));
-};
-
-var ModelSelectRole = function ModelSelectRole(_ref) {
-  var _handleUserRole;
-
-  var open = _ref.open,
-      onToggleModel = _ref.onToggleModel;
-  var dispatch = reactRedux.useDispatch();
-  var history = reactRouterDom.useHistory();
-  var pathname = window.location.pathname;
-  var user = reactRedux.useSelector(function (state) {
-    return state.common.user;
-  });
-  var roles = user === null || user === void 0 ? void 0 : user.roles;
-
-  var handleSelectUserRoles = function handleSelectUserRoles(roles) {
-    if (roles.includes("Admin")) {
-      dispatch(setLoading(true));
-      return history.push("/admin/home");
-    }
-
-    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 {
-      pathname !== "/home" ? history.push("/home") : window.location.reload();
-    }
-  };
-
-  return React__default.createElement(reactstrap.Modal, {
-    isOpen: open,
-    toggle: function toggle() {
-      return onToggleModel();
-    },
-    className: "" + styles["model-switch-roles"],
-    centered: true
-  }, React__default.createElement("p", {
-    className: "" + styles["title"]
-  }, "Continue as:"), React__default.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__default.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 = reactRouterDom.useHistory();
-  var dispatch = reactRedux.useDispatch();
-  var user = reactRedux.useSelector(function (state) {
-    return state.common.user;
-  });
-  var language = reactRedux.useSelector(function (state) {
-    return state.common.language;
-  });
-
-  var _useState = React.useState(false),
-      openModelSelectRole = _useState[0],
-      setOpenModelSelectRole = _useState[1];
-
-  var _useTranslation = reactI18next.useTranslation(),
-      t = _useTranslation.t;
-
-  var location = reactRouterDom.useLocation();
-  var isNotification = location.pathname.includes("notifications");
-  var isDistrict = window.location.host.includes("-district");
-
-  var handleToggleModel = function handleToggleModel() {
-    setOpenModelSelectRole(!openModelSelectRole);
-  };
-
-  var authRoutes = React.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 = React.useMemo(function () {
-    return navigation.map(function (item) {
-      return _extends({}, item, {
-        name: t(item.name)
-      });
-    }).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]);
-  React.useEffect(function () {
-    checkAuthentication();
-  }, []);
-
-  var checkAuthentication = function checkAuthentication() {
-    try {
-      var _temp2 = _catch(function () {
-        return Promise.resolve(firstCheckToken()).then(function (tokenStatus) {
-          tokenStatus ? loadInfo() : resetAuth();
-        });
-      }, function () {
-        resetAuth();
-      });
-
-      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  var loadInfo = function loadInfo() {
-    try {
-      var _temp4 = _catch(function () {
-        return Promise.resolve(getInfo()).then(function (info) {
-          if (!info) {
-            resetAuth();
-          }
-
-          dispatch(setUser(info.data));
-        });
-      }, function () {
-        resetAuth();
-      });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  var resetAuth = function resetAuth() {
-    localStorage.removeItem(ACCESS_TOKEN);
-    sessionStorage.removeItem(ACCESS_TOKEN);
-    history.push("/");
-  };
-
-  if (!user) {
-    return React__default.createElement(Loading, null);
-  }
-
-  return React__default.createElement("div", {
-    className: "c-app c-default-layout"
-  }, !isNotification && React__default.createElement(TheSidebar, {
-    navigation: authNavigations
-  }), React__default.createElement("div", {
-    className: "c-wrapper"
-  }, !isNotification && React__default.createElement(TheHeader, {
-    onToggleModel: handleToggleModel
-  }), React__default.createElement("div", {
-    className: "c-body bg-white"
-  }, React__default.createElement(TheContent$1, {
-    routes: authRoutes
-  }))), React__default.createElement(ModelSelectRole, {
-    open: openModelSelectRole,
-    onToggleModel: handleToggleModel
-  }));
-};
-
 Object.defineProperty(exports, 'I18nextProvider', {
     enumerable: true,
     get: function () {