acsi-core 0.1.66 → 0.1.68

package/dist/index.modern.js

@@ -1,7 +1,7 @@
 import { createBrowserHistory } from 'history';
 import { createAction, createReducer, configureStore } from '@reduxjs/toolkit';
-import React, { useState, useCallback, useEffect, Fragment, useRef } from 'react';
-import { Row, Col, Modal, ModalHeader, ModalBody, ModalFooter, Button, Pagination, PaginationItem, PaginationLink, FormGroup, Input, Label, Tooltip } from 'reactstrap';
+import React, { useState, useRef, useEffect, useCallback, Fragment } from 'react';
+import { FormGroup, Input, Label, Modal, ModalHeader, ModalBody, ModalFooter, Tooltip, Row, Col, Button, Pagination, PaginationItem, PaginationLink } from 'reactstrap';
 import axios from 'axios';
 import moment from 'moment';
 import Cookies from 'js-cookie';
@@ -10,11 +10,12 @@ import { Link } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 import { useGoogleLogin } from '@react-oauth/google';
 export { GoogleOAuthProvider } from '@react-oauth/google';
+import ReactSelect, { components } from 'react-select';
+import { toast } from 'react-toastify';
+export { ToastContainer, toast } from 'react-toastify';
 import { useGoogleLogout } from '@leecheuk/react-google-login';
 import { Box, Typography } from '@mui/material';
-export { ToastContainer, toast } from 'react-toastify';
 import { Identify, identify, track, setUserId, reset as reset$1, init } from '@amplitude/analytics-browser';
-import ReactSelect, { components } from 'react-select';
 import { FaCaretDown } from 'react-icons/fa';
 import CreatableSelect from 'react-select/creatable';
 
@@ -91,7 +92,7 @@ var COLORS = {
 var ORGANIZATION_TENANT = "ORGANIZATION_TENANT";
 var ORGANIZATION_TEAM = "ORGANIZATION_TEAM";
 
-var styleGlobal = {"signup_wrap":"_1KLz9","box-signin":"_2Jo1o","signin_title":"_3egBO","signup_link":"_1DoIT","google_button":"_34hK_","box-field":"_2e9xO","box-input":"_3zXRp","box-text":"_8NJga","box-button-email":"_21FPk","box-signin-container":"_1QERu","box-signin-text":"_2-znH","box-signin-logo":"_1aB2m","box-right":"_3qndF","box-right-body":"_JzdCr","box-right-footer":"_19aCA","pr-30":"_2HB5r"};
+var styleGlobal = {"signup_wrap":"_1KLz9","box-signin":"_2Jo1o","signin_title":"_3egBO","signup_link":"_1DoIT","google_button":"_34hK_","box-field":"_2e9xO","box-input":"_3zXRp","box-text":"_8NJga","box-button-email":"_21FPk","box-signin-container":"_1QERu","box-signin-text":"_2-znH","box-signin-logo":"_1aB2m","box-right":"_3qndF","box-right-body":"_JzdCr","box-right-footer":"_19aCA","pr-30":"_2HB5r","width-400":"_4ehXP"};
 
 var api = axios.create({
   baseURL: BASE_URL,
@@ -211,1333 +212,916 @@ var AmplitudeEvent;
   AmplitudeEvent["USER_USAGE"] = "user_usage";
 })(AmplitudeEvent || (AmplitudeEvent = {}));
 
-var BlockLogin = function BlockLogin(_ref) {
-  var onNavigate = _ref.onNavigate,
-    role = _ref.role,
-    hiddenSignup = _ref.hiddenSignup,
-    email = _ref.email,
-    setEmail = _ref.setEmail,
-    loginWithEmail = _ref.loginWithEmail,
-    code = _ref.code,
-    setCode = _ref.setCode,
-    isScreenCode = _ref.isScreenCode,
-    formatTime = _ref.formatTime,
-    loginWithEmailCode = _ref.loginWithEmailCode,
-    trackEvent = _ref.trackEvent;
-  var dispatch = useDispatch();
-  var googleLogin = useGoogleLogin({
-    onSuccess: function (tokenResponse) {
-      try {
-        return Promise.resolve(axios.get("https://www.googleapis.com/oauth2/v3/userinfo", {
-          headers: {
-            Authorization: "Bearer " + tokenResponse.access_token
-          }
-        })).then(function (userInfo) {
-          return function () {
-            if (userInfo && userInfo.data) {
-              var _userInfo$data = userInfo.data,
-                _email = _userInfo$data.email,
-                picture = _userInfo$data.picture,
-                family_name = _userInfo$data.family_name,
-                given_name = _userInfo$data.given_name,
-                name = _userInfo$data.name,
-                sub = _userInfo$data.sub;
-              var accessToken = tokenResponse.access_token;
-              var infoLogin = {
-                imageUrl: picture,
-                fullName: name,
-                firstName: family_name,
-                lastName: given_name,
-                email: _email,
-                token: accessToken,
-                googleId: sub,
-                role: role,
-                type: TypeLogin.Google
-              };
-              dispatch(setLoading(true));
-              return Promise.resolve(apiLoginGoogle(infoLogin)).then(function (authResult) {
-                var _authResult$data;
-                if (((_authResult$data = authResult.data) === null || _authResult$data === void 0 ? void 0 : _authResult$data.id) == null) {
-                  dispatch(setLoading(false));
-                  alert("Please contact admin.");
-                  return;
-                }
-                localStorage.clear();
-                var tokenJWT = authResult.data.token;
-                trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
-                  eventName: AmplitudeEvent.LOGIN,
-                  eventProperties: {
-                    email: _email,
-                    login_method: 'google',
-                    user_role: authResult.data.role,
-                    success: true,
-                    timestamp: new Date().toISOString()
-                  }
-                });
-                if (role === "LandingPage") {
-                  CookieService.setAuthCookie({
-                    token: tokenJWT,
-                    expiresAt: Date.now() + 24 * 60 * 60 * 1000
-                  });
-                  var getRedirectUrl = function getRedirectUrl(role) {
-                    switch (role) {
-                      case "Admin":
-                        return ADMIN_ORIGIN;
-                      case "Teacher":
-                        return TEACHER_ORIGIN;
-                      default:
-                        return role + "." + REQUEST_ORIGIN;
-                    }
-                  };
-                  var redirectUrl = getRedirectUrl(authResult.data.role);
-                  window.location.href = redirectUrl + "/dashboard";
-                  dispatch(setLoading(false));
-                }
-                localStorage.setItem(ACCESS_TOKEN, tokenJWT);
-                onNavigate("/dashboard");
-                dispatch(setLoading(false));
-              });
-            }
-          }();
-        });
-      } catch (e) {
-        return Promise.reject(e);
-      }
-    },
-    onError: function onError(errorResponse) {
-      return console.log(errorResponse);
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
-  });
-  return React.createElement(Row, {
+    return n;
+  }, _extends.apply(null, arguments);
+}
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (-1 !== e.indexOf(n)) continue;
+    t[n] = r[n];
+  }
+  return t;
+}
+
+var styles = {"core-button":"_xvNBN","primary":"_U9Qyp","secondary":"_1VzMy","text":"_pZNuj","danger":"_2uYm1","light":"_wxH5S"};
+
+var _excluded = ["type", "children", "onClick", "icon", "disabled", "htmlType"];
+var CoreButton = function CoreButton(props) {
+  var _props$type = props.type,
+    type = _props$type === void 0 ? "primary" : _props$type,
+    children = props.children,
+    onClick = props.onClick,
+    icon = props.icon,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$htmlType = props.htmlType,
+    htmlType = _props$htmlType === void 0 ? "button" : _props$htmlType,
+    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  return React.createElement("button", Object.assign({
+    className: styles["core-button"] + " " + styles[type],
+    onClick: onClick,
+    disabled: disabled,
+    type: htmlType
+  }, rest), icon && icon, children);
+};
+
+var styles$1 = {"core-input":"_1WdX2","outline":"_3X2RJ","no-outline":"_bVYtv","error":"_n7n3Q"};
+
+var styles$2 = {"core-error":"_1Mmxr"};
+
+var CoreError = function CoreError(props) {
+  var message = props.message;
+  return React.createElement("div", {
+    className: "" + styles$2["core-error"]
+  }, React.createElement("p", null, message));
+};
+
+var CoreInput = function CoreInput(props) {
+  var name = props.name,
+    value = props.value,
+    _onChange = props.onChange,
+    _props$type = props.type,
+    type = _props$type === void 0 ? "outline" : _props$type,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    label = props.label,
+    width = props.width,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Type here" : _props$placeholder,
+    error = props.error,
+    _props$errorMessage = props.errorMessage,
+    errorMessage = _props$errorMessage === void 0 ? "" : _props$errorMessage,
+    fontSize = props.fontSize,
+    fontWeight = props.fontWeight,
+    _onKeyDown = props.onKeyDown,
+    ref = props.ref,
+    maxLength = props.maxLength,
+    className = props.className,
+    onKeyFocus = props.onKeyFocus;
+  return React.createElement("div", {
+    className: styles$1["core-input"] + "  " + styles$1[type] + " " + (error ? styles$1["error"] : ""),
     style: {
-      height: "100%"
+      width: width != null ? width : "100%"
     }
-  }, React.createElement(Col, {
-    sm: 12,
-    lg: role != "Admin" ? 7 : 12
-  }, React.createElement("div", {
-    className: "" + styleGlobal["box-signin-container"]
-  }, React.createElement("div", {
-    className: styleGlobal["box-signin-logo"] + " "
-  }, React.createElement(Link, {
-    to: "/",
-    className: "d-flex"
-  }, React.createElement("img", {
-    src: "/images/Logo.png",
-    alt: "",
-    height: 37,
-    width: 155,
-    className: "my-auto"
-  }))), React.createElement("div", {
-    className: styleGlobal["box-signin"] + " "
-  }, React.createElement("div", {
-    className: "" + styleGlobal["signin_title"]
-  }, React.createElement("span", null, "Welcome to Edusfere")), !hiddenSignup && React.createElement("div", {
-    className: "" + styleGlobal["signup_link"]
-  }, React.createElement("span", null, "Don't have an account?", " ", React.createElement(Link, {
-    to: "/",
+  }, label && React.createElement("label", null, label), React.createElement("input", Object.assign({
     style: {
-      color: "#00A0DA"
+      fontSize: fontSize,
+      fontWeight: fontWeight
     },
-    className: "text-decoration-none"
-  }, "Sign up"))), React.createElement("div", {
-    className: "" + styleGlobal["google_button"]
-  }, React.createElement("button", {
-    onClick: function onClick() {
-      return googleLogin();
-    }
-  }, React.createElement("img", {
-    width: 24,
-    height: 24,
-    alt: "Google sign-in",
-    src: "/images/icons/Google__G__logo.png"
-  }), "Sign in with Google")), React.createElement("span", {
-    className: "" + styleGlobal["box-field"]
-  }, "OR"), isScreenCode ? React.createElement(React.Fragment, null, React.createElement("div", {
-    className: "" + styleGlobal["box-input"]
-  }, React.createElement("input", {
-    type: "text",
-    placeholder: "Code OTP",
-    value: code,
-    onChange: function onChange(event) {
-      setCode(event.target.value);
-    }
-  }), React.createElement("p", {
-    className: styleGlobal["box-text"]
-  }, "Your code will expire: ", React.createElement("span", null, formatTime()))), React.createElement("button", {
-    onClick: function onClick() {
-      return loginWithEmailCode(role);
+    name: name,
+    value: value,
+    onChange: function onChange(e) {
+      return _onChange(name, e.target.value);
     },
-    className: "" + styleGlobal["box-button-email"]
-  }, React.createElement("img", {
-    width: 20,
-    height: 20,
-    alt: "Email sign-in",
-    src: "/images/icons/Login_icon.png"
-  }), "Login")) : React.createElement(React.Fragment, null, React.createElement("div", {
-    className: "" + styleGlobal["box-input"]
-  }, React.createElement("input", {
-    type: "email",
-    placeholder: "Email",
-    value: email,
-    onChange: function onChange(event) {
-      setEmail(event.target.value.trim());
-    }
-  })), React.createElement("button", {
-    onClick: function onClick() {
-      !!email && loginWithEmail(role);
+    disabled: disabled,
+    placeholder: placeholder,
+    onKeyDown: function onKeyDown(e) {
+      return _onKeyDown === null || _onKeyDown === void 0 ? void 0 : _onKeyDown(e);
     },
-    className: "" + styleGlobal["box-button-email"]
-  }, React.createElement("img", {
-    width: 20,
-    height: 20,
-    alt: "Email sign-in",
-    src: "/images/icons/Login_icon.png"
-  }), "Sign in with Email"))), React.createElement("div", {
-    className: styleGlobal["box-signin-text"] + " "
-  }, React.createElement("span", {
-    style: {
-      fontSize: "13px",
-      color: "#A6A6AD"
-    }
-  }, "By signing in, you agree to our Terms & Privacy Policy")))), role != "Admin" && role != 'LandingPage' && React.createElement(Col, {
-    sm: 12,
-    lg: 5,
-    className: "d-none d-lg-block " + styleGlobal["pr-30"]
-  }, React.createElement("div", {
-    className: "" + styleGlobal["box-right"],
-    style: {
-      backgroundImage: "url('/images/bg_login.png')"
-    }
-  }, React.createElement("div", {
-    className: "" + styleGlobal["box-right-body"]
-  }, React.createElement("span", {
-    style: {
-      fontSize: "24px",
-      fontWeight: "700"
-    }
-  }, "As a teacher, your time and energy are too valuable to waste"), React.createElement("p", {
-    className: " fw-normal ",
-    style: {
-      marginTop: "12px",
-      marginBottom: "24px",
-      color: "#03191F"
-    }
-  }, "So we\u2019re building a curriculum hub and and workspace that puts everything you need to plan and prep within reach."), React.createElement("ul", null, itemLogin.map(function (item, it) {
-    return React.createElement("li", {
-      key: it,
-      className: "mb-2 ",
-      style: {
-        color: "#212126"
-      }
-    }, item);
-  })), React.createElement("div", {
-    className: "" + styleGlobal["box-right-footer"]
-  }, React.createElement("img", {
-    className: "img-fluid",
-    alt: "",
-    src: "/images/image_login.png",
-    style: {
-      width: "15vw"
-    }
-  }), React.createElement("div", null, React.createElement("p", null, "As one of our earliest users,", React.createElement("br", null), "you are a vital part of this process"), React.createElement("div", null, React.createElement("span", {
-    className: "d-block"
-  }, "Thank you!"), React.createElement("img", {
-    style: {
-      marginTop: "-15px"
-    },
-    alt: "",
-    src: "/images/icons/Vector 22.png"
-  }))))))), role === "LandingPage" && React.createElement(Col, {
-    sm: 12,
-    lg: 5,
-    className: "d-none d-lg-block " + styleGlobal["pr-30"]
-  }, React.createElement("div", {
-    className: "" + styleGlobal["box-right"],
-    style: {
-      backgroundImage: "url('/images/bg_login.png')"
-    }
-  }, React.createElement("div", {
-    className: "" + styleGlobal["box-right-body"]
-  }, React.createElement("span", {
-    style: {
-      fontSize: "24px",
-      fontWeight: "700"
-    }
-  }, "Get ready to manage your realm!"), React.createElement("p", {
-    className: " fw-normal ",
-    style: {
-      marginTop: "12px",
-      marginBottom: "24px",
-      color: "#03191F"
-    }
-  }, "So we\u2019re building a curriculum hub and and workspace that puts everything you need to plan and prep within reach."), React.createElement("ul", null, itemLogin.map(function (item, it) {
-    return React.createElement("li", {
-      key: it,
-      className: "mb-2 ",
-      style: {
-        color: "#212126"
-      }
-    }, item);
-  })), React.createElement("div", {
-    className: "" + styleGlobal["box-right-footer"]
-  }, React.createElement("img", {
-    className: "img-fluid",
-    alt: "",
-    src: "/images/image_login.png",
-    style: {
-      width: "15vw"
+    onFocus: function onFocus(e) {
+      return onKeyFocus === null || onKeyFocus === void 0 ? void 0 : onKeyFocus(name, e.target.value);
     }
-  }), React.createElement("div", null, React.createElement("p", null, "As one of our earliest users,", React.createElement("br", null), "you are a vital part of this process"), React.createElement("div", null, React.createElement("span", {
-    className: "d-block"
-  }, "Thank you!"), React.createElement("img", {
-    style: {
-      marginTop: "-15px"
-    },
-    alt: "",
-    src: "/images/icons/Vector 22.png"
-  }))))))));
+  }, ref, {
+    maxLength: maxLength,
+    className: className
+  })), error && React.createElement(CoreError, {
+    message: errorMessage
+  }));
 };
 
-// A type of promise-like that resolves synchronously and supports only one observer
-
-const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator"))) : "@@iterator";
-
-const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator"))) : "@@asyncIterator";
-
-// Asynchronously call a function and send errors to recovery continuation
-function _catch(body, recover) {
-	try {
-		var result = body();
-	} catch(e) {
-		return recover(e);
-	}
-	if (result && result.then) {
-		return result.then(void 0, recover);
-	}
-	return result;
-}
+var styles$3 = {"core-select":"_2sg12","label":"_1-XBo"};
 
-var defaultInfo = {
-  email: "",
-  password: "",
-  captcha: "",
-  rememberMe: false
+var Option = function Option(props) {
+  return React.createElement("div", null, React.createElement(components.Option, Object.assign({}, props), React.createElement(CoreInput$1, {
+    checked: props.isSelected,
+    onChange: function onChange() {
+      return null;
+    },
+    name: "",
+    label: props.label
+  })));
 };
-var minutes = 15;
-var useLogin = function useLogin(onNavigate, trackEvent) {
-  var _useState = useState(false),
-    openLogin = _useState[0],
-    setOpenLogin = _useState[1];
-  var _useState2 = useState(),
-    infoUser = _useState2[0],
-    setInfoUser = _useState2[1];
-  var dispatch = useDispatch();
-  var toggle = useCallback(function () {
-    setOpenLogin(!openLogin);
-  }, [openLogin]);
-  var _useState3 = useState(""),
-    email = _useState3[0],
-    setEmail = _useState3[1];
-  var _useState4 = useState(""),
-    code = _useState4[0],
-    setCode = _useState4[1];
-  var _useState5 = useState(false),
-    isScreenCode = _useState5[0],
-    setIsScreenCode = _useState5[1];
-  var _useState6 = useState(minutes * 60),
-    timeLeft = _useState6[0],
-    setTimeLeft = _useState6[1];
-  var loginWithEmail = function loginWithEmail(role) {
-    try {
-      var _temp2 = function _temp2() {
-        dispatch(setLoading(false));
-      };
-      dispatch(setLoading(true));
-      var _temp = _catch(function () {
-        var body = {
-          email: email,
-          role: role
+var CoreSelect = function CoreSelect(props) {
+  var name = props.name,
+    options = props.options,
+    value = props.value,
+    onChange = props.onChange,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    label = props.label,
+    width = props.width,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Select" : _props$placeholder,
+    error = props.error,
+    _props$errorMessage = props.errorMessage,
+    errorMessage = _props$errorMessage === void 0 ? "" : _props$errorMessage,
+    _props$type = props.type,
+    type = _props$type === void 0 ? "outline" : _props$type,
+    _props$isMulti = props.isMulti,
+    isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
+    _props$closeMenuOnSel = props.closeMenuOnSelect,
+    closeMenuOnSelect = _props$closeMenuOnSel === void 0 ? true : _props$closeMenuOnSel,
+    _props$hideSelectedOp = props.hideSelectedOptions,
+    hideSelectedOptions = _props$hideSelectedOp === void 0 ? true : _props$hideSelectedOp;
+  var handleChange = function handleChange(e) {
+    var newValue = isMulti ? e.map(function (item) {
+      return item.value;
+    }) : e === null || e === void 0 ? void 0 : e.value;
+    onChange(name, newValue);
+  };
+  var controlStyle = function controlStyle(base, state) {
+    var styles = _extends({}, base, {
+      fontSize: "14px",
+      fontWeight: "400",
+      padding: "0 4px",
+      borderRadius: "8px",
+      backgroundColor: state.isDisabled ? COLORS.lightGrayBg : COLORS.white,
+      border: state.isFocused ? "2px solid " + (!error ? COLORS.brandBlue : COLORS.red) : "1px solid " + (!error ? COLORS.grayLines : COLORS.red),
+      height: isMulti ? undefined : "32px",
+      minHeight: 0,
+      boxShadow: "none"
+    });
+    switch (type) {
+      case "outline":
+        styles.overflow = "hidden";
+        styles[":hover"] = {
+          backgroundColor: COLORS.lightBlueHover
         };
-        return Promise.resolve(apiSendEmailCode(body)).then(function (res) {
-          var data = res.data;
-          if (data.status == 1) {
-            if (data.data.token != null) {
-              var tokenJWT = data.data.token;
-              localStorage.setItem(ACCESS_TOKEN, tokenJWT);
-              trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
-                eventName: AmplitudeEvent.LOGIN,
-                eventProperties: {
-                  email: email,
-                  login_method: 'email',
-                  timestamp: new Date().toISOString()
-                }
-              });
-              onNavigate("/dashboard");
-            } else {
-              setIsScreenCode(true);
-            }
-          } else {
-            dispatch(setLoading(false));
-            alert("Please contact admin.");
-          }
-        });
-      }, function (e) {
-        console.log(e);
-      });
-      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
-    } catch (e) {
-      return Promise.reject(e);
+        break;
+      case "no-outline":
+        styles.border = "none";
+        styles.padding = 0;
+        styles["&>div"] = {
+          padding: 0
+        };
+        break;
     }
+    return styles;
   };
-  var loginWithEmailCode = function loginWithEmailCode(role) {
-    try {
-      var _temp4 = function _temp4() {
-        dispatch(setLoading(false));
-      };
-      dispatch(setLoading(true));
-      var _temp3 = _catch(function () {
-        return Promise.resolve(apiCheckEmailCode({
-          email: email,
-          code: code,
-          role: role
-        })).then(function (res) {
-          var data = res.data;
-          if (data.status == 1) {
-            localStorage.clear();
-            var tokenJWT = data.data.token;
-            localStorage.setItem(ACCESS_TOKEN, tokenJWT);
-            trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
-              eventName: AmplitudeEvent.LOGIN,
-              eventProperties: {
-                email: email,
-                login_method: 'email',
-                timestamp: new Date().toISOString()
-              }
-            });
-            onNavigate("/dashboard");
-          } else {
-            dispatch(setLoading(false));
-            alert("The code is not correct. Please check again.");
-          }
-        });
-      }, function (e) {
-        console.log(e);
-      });
-      return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
-    } catch (e) {
-      return Promise.reject(e);
-    }
+  var inputStyles = function inputStyles(base) {
+    var styles = _extends({}, base, {
+      margin: "0",
+      padding: "0",
+      color: "inherit"
+    });
+    return styles;
   };
-  var formatTime = function formatTime() {
-    var m = Math.floor(timeLeft / 60);
-    var s = timeLeft % 60;
-    return m.toString().padStart(2, '0') + ":" + s.toString().padStart(2, '0');
+  var placeholderStyles = function placeholderStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.lightGray
+    });
+    return styles;
   };
-  useEffect(function () {
-    if (isScreenCode) {
-      var timer = setInterval(function () {
-        setTimeLeft(function (prev) {
-          if (prev <= 1) {
-            clearInterval(timer);
-            return 0;
-          }
-          return prev - 1;
-        });
-      }, 1000);
-      return function () {
-        return clearInterval(timer);
-      };
-    }
-    return;
-  }, [isScreenCode]);
-  return {
-    defaultInfo: defaultInfo,
-    openLogin: openLogin,
-    toggle: toggle,
-    email: email,
-    setEmail: setEmail,
-    loginWithEmail: loginWithEmail,
-    infoUser: infoUser,
-    setInfoUser: setInfoUser,
-    code: code,
-    setCode: setCode,
-    isScreenCode: isScreenCode,
-    formatTime: formatTime,
-    loginWithEmailCode: loginWithEmailCode
+  var dropdownIndicatorStyles = function dropdownIndicatorStyles(base) {
+    var styles = _extends({}, base, {
+      position: "relative",
+      top: "-4px",
+      padding: "8px 0"
+    });
+    return styles;
+  };
+  var valueContainerStyles = function valueContainerStyles(base) {
+    var styles = _extends({}, base, {
+      height: isMulti ? undefined : "32px",
+      position: "relative",
+      top: "-3px"
+    });
+    return styles;
+  };
+  var singleValueStyles = function singleValueStyles(base) {
+    var styles = _extends({}, base);
+    return styles;
+  };
+  var optionStyles = function optionStyles(base, state) {
+    var styles = _extends({}, base, {
+      padding: "8px",
+      borderRadius: "8px",
+      cursor: "pointer",
+      fontSize: "14px",
+      fontWeight: 400,
+      backgroundColor: state.isSelected ? COLORS.lightBlueHover : "transparent",
+      "&:hover": {
+        backgroundColor: COLORS.lightBlueHover
+      }
+    });
+    return styles;
+  };
+  var indicatorsContainerStyles = function indicatorsContainerStyles(base) {
+    var styles = _extends({}, base, {
+      display: type === "no-outline" ? "none" : "block"
+    });
+    return styles;
+  };
+  var multiValueStyles = function multiValueStyles(base) {
+    var styles = _extends({}, base, {
+      backgroundColor: COLORS.lightBlue,
+      borderRadius: "4px",
+      padding: "2px 8px",
+      display: "flex",
+      alignItems: "center",
+      fontSize: "13px",
+      color: COLORS.blackText
+    });
+    return styles;
+  };
+  var multiValueRemoveStyles = function multiValueRemoveStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.lightGray,
+      cursor: "pointer"
+    });
+    return styles;
+  };
+  var multiValueLabelStyles = function multiValueLabelStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.blackText,
+      fontWeight: "400",
+      fontSize: "13px",
+      padding: 0
+    });
+    return styles;
   };
-};
-
-var Login = function Login(props) {
-  var onNavigate = props.onNavigate,
-    role = props.role,
-    hiddenSignup = props.hiddenSignup,
-    trackEvent = props.trackEvent;
-  var _useLogin = useLogin(onNavigate, trackEvent),
-    defaultInfo = _useLogin.defaultInfo,
-    email = _useLogin.email,
-    setEmail = _useLogin.setEmail,
-    loginWithEmail = _useLogin.loginWithEmail,
-    code = _useLogin.code,
-    setCode = _useLogin.setCode,
-    isScreenCode = _useLogin.isScreenCode,
-    formatTime = _useLogin.formatTime,
-    loginWithEmailCode = _useLogin.loginWithEmailCode;
   return React.createElement("div", {
-    className: styleGlobal["signup_wrap"] + " container-fluid font-family-lato"
-  }, React.createElement(BlockLogin, {
-    defaultInfo: defaultInfo,
-    email: email,
-    hiddenSignup: hiddenSignup,
-    setEmail: setEmail,
-    loginWithEmail: loginWithEmail,
-    code: code,
-    setCode: setCode,
-    formatTime: formatTime,
-    isScreenCode: isScreenCode,
-    onNavigate: onNavigate,
-    loginWithEmailCode: loginWithEmailCode,
-    role: role,
-    trackEvent: trackEvent
+    className: "" + styles$3["core-select"],
+    style: {
+      width: width != null ? width : "100%"
+    }
+  }, label && React.createElement("span", {
+    className: styles$3["label"]
+  }, label), React.createElement(ReactSelect, {
+    name: name,
+    value: options.filter(function (i) {
+      return value && (isMulti ? value.includes(i.value) : i.value === value);
+    }),
+    onChange: handleChange,
+    placeholder: placeholder,
+    isDisabled: disabled,
+    isMulti: isMulti,
+    closeMenuOnSelect: closeMenuOnSelect,
+    hideSelectedOptions: hideSelectedOptions,
+    options: options,
+    components: isMulti ? {
+      Option: Option
+    } : undefined,
+    styles: {
+      control: controlStyle,
+      input: inputStyles,
+      placeholder: placeholderStyles,
+      dropdownIndicator: dropdownIndicatorStyles,
+      indicatorSeparator: function indicatorSeparator() {
+        return {
+          display: "none"
+        };
+      },
+      indicatorsContainer: indicatorsContainerStyles,
+      valueContainer: valueContainerStyles,
+      singleValue: singleValueStyles,
+      option: optionStyles,
+      multiValue: multiValueStyles,
+      multiValueRemove: multiValueRemoveStyles,
+      multiValueLabel: multiValueLabelStyles
+    }
+  }), error && React.createElement(CoreError, {
+    message: errorMessage
   }));
 };
 
-// src/utils/formatProdErrorMessage.ts
-function formatProdErrorMessage(code) {
-  return `Minified Redux error #${code}; visit https://redux.js.org/Errors?code=${code} for the full message or use the non-minified dev environment for full errors. `;
-}
-
-// src/utils/actionTypes.ts
-var randomString = () => Math.random().toString(36).substring(7).split("").join(".");
-var ActionTypes = {
-  INIT: `@@redux/INIT${/* @__PURE__ */ randomString()}`,
-  REPLACE: `@@redux/REPLACE${/* @__PURE__ */ randomString()}`,
-  PROBE_UNKNOWN_ACTION: () => `@@redux/PROBE_UNKNOWN_ACTION${randomString()}`
-};
-var actionTypes_default = ActionTypes;
-
-// src/utils/isPlainObject.ts
-function isPlainObject(obj) {
-  if (typeof obj !== "object" || obj === null)
-    return false;
-  let proto = obj;
-  while (Object.getPrototypeOf(proto) !== null) {
-    proto = Object.getPrototypeOf(proto);
-  }
-  return Object.getPrototypeOf(obj) === proto || Object.getPrototypeOf(obj) === null;
-}
+var styles$4 = {"core-checkbox":"_3HY4f"};
 
-// src/utils/kindOf.ts
-function miniKindOf(val) {
-  if (val === void 0)
-    return "undefined";
-  if (val === null)
-    return "null";
-  const type = typeof val;
-  switch (type) {
-    case "boolean":
-    case "string":
-    case "number":
-    case "symbol":
-    case "function": {
-      return type;
-    }
-  }
-  if (Array.isArray(val))
-    return "array";
-  if (isDate(val))
-    return "date";
-  if (isError(val))
-    return "error";
-  const constructorName = ctorName(val);
-  switch (constructorName) {
-    case "Symbol":
-    case "Promise":
-    case "WeakMap":
-    case "WeakSet":
-    case "Map":
-    case "Set":
-      return constructorName;
-  }
-  return Object.prototype.toString.call(val).slice(8, -1).toLowerCase().replace(/\s/g, "");
-}
-function ctorName(val) {
-  return typeof val.constructor === "function" ? val.constructor.name : null;
-}
-function isError(val) {
-  return val instanceof Error || typeof val.message === "string" && val.constructor && typeof val.constructor.stackTraceLimit === "number";
-}
-function isDate(val) {
-  if (val instanceof Date)
-    return true;
-  return typeof val.toDateString === "function" && typeof val.getDate === "function" && typeof val.setDate === "function";
-}
-function kindOf(val) {
-  let typeOfVal = typeof val;
-  if (process.env.NODE_ENV !== "production") {
-    typeOfVal = miniKindOf(val);
-  }
-  return typeOfVal;
-}
-
-// src/utils/warning.ts
-function warning(message) {
-  if (typeof console !== "undefined" && typeof console.error === "function") {
-    console.error(message);
-  }
-  try {
-    throw new Error(message);
-  } catch (e) {
-  }
-}
-
-// src/combineReducers.ts
-function getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) {
-  const reducerKeys = Object.keys(reducers);
-  const argumentName = action && action.type === actionTypes_default.INIT ? "preloadedState argument passed to createStore" : "previous state received by the reducer";
-  if (reducerKeys.length === 0) {
-    return "Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.";
-  }
-  if (!isPlainObject(inputState)) {
-    return `The ${argumentName} has unexpected type of "${kindOf(inputState)}". Expected argument to be an object with the following keys: "${reducerKeys.join('", "')}"`;
-  }
-  const unexpectedKeys = Object.keys(inputState).filter((key) => !reducers.hasOwnProperty(key) && !unexpectedKeyCache[key]);
-  unexpectedKeys.forEach((key) => {
-    unexpectedKeyCache[key] = true;
-  });
-  if (action && action.type === actionTypes_default.REPLACE)
-    return;
-  if (unexpectedKeys.length > 0) {
-    return `Unexpected ${unexpectedKeys.length > 1 ? "keys" : "key"} "${unexpectedKeys.join('", "')}" found in ${argumentName}. Expected to find one of the known reducer keys instead: "${reducerKeys.join('", "')}". Unexpected keys will be ignored.`;
-  }
-}
-function assertReducerShape(reducers) {
-  Object.keys(reducers).forEach((key) => {
-    const reducer = reducers[key];
-    const initialState = reducer(void 0, {
-      type: actionTypes_default.INIT
-    });
-    if (typeof initialState === "undefined") {
-      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(12) : `The slice reducer for key "${key}" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.`);
-    }
-    if (typeof reducer(void 0, {
-      type: actionTypes_default.PROBE_UNKNOWN_ACTION()
-    }) === "undefined") {
-      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(13) : `The slice reducer for key "${key}" returned undefined when probed with a random type. Don't try to handle '${actionTypes_default.INIT}' or other actions in "redux/*" namespace. They are considered private. Instead, you must return the current state for any unknown actions, unless it is undefined, in which case you must return the initial state, regardless of the action type. The initial state may not be undefined, but can be null.`);
-    }
-  });
-}
-function combineReducers(reducers) {
-  const reducerKeys = Object.keys(reducers);
-  const finalReducers = {};
-  for (let i = 0; i < reducerKeys.length; i++) {
-    const key = reducerKeys[i];
-    if (process.env.NODE_ENV !== "production") {
-      if (typeof reducers[key] === "undefined") {
-        warning(`No reducer provided for key "${key}"`);
-      }
-    }
-    if (typeof reducers[key] === "function") {
-      finalReducers[key] = reducers[key];
-    }
-  }
-  const finalReducerKeys = Object.keys(finalReducers);
-  let unexpectedKeyCache;
-  if (process.env.NODE_ENV !== "production") {
-    unexpectedKeyCache = {};
-  }
-  let shapeAssertionError;
-  try {
-    assertReducerShape(finalReducers);
-  } catch (e) {
-    shapeAssertionError = e;
-  }
-  return function combination(state = {}, action) {
-    if (shapeAssertionError) {
-      throw shapeAssertionError;
-    }
-    if (process.env.NODE_ENV !== "production") {
-      const warningMessage = getUnexpectedStateShapeWarningMessage(state, finalReducers, action, unexpectedKeyCache);
-      if (warningMessage) {
-        warning(warningMessage);
-      }
-    }
-    let hasChanged = false;
-    const nextState = {};
-    for (let i = 0; i < finalReducerKeys.length; i++) {
-      const key = finalReducerKeys[i];
-      const reducer = finalReducers[key];
-      const previousStateForKey = state[key];
-      const nextStateForKey = reducer(previousStateForKey, action);
-      if (typeof nextStateForKey === "undefined") {
-        const actionType = action && action.type;
-        throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(14) : `When called with an action of type ${actionType ? `"${String(actionType)}"` : "(unknown type)"}, the slice reducer for key "${key}" returned undefined. To ignore an action, you must explicitly return the previous state. If you want this reducer to hold no value, you can return null instead of undefined.`);
-      }
-      nextState[key] = nextStateForKey;
-      hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
-    }
-    hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;
-    return hasChanged ? nextState : state;
-  };
-}
-//# sourceMappingURL=redux.mjs.map
-
-var initialState = {
-  isLoading: false,
-  isLoadingPage: false,
-  alert: {
-    type: "",
-    message: ""
-  },
-  user: null,
-  academy: null,
-  menuCollapse: false,
-  isRefetchSidebar: false
-};
-var commonReducer = createReducer(initialState, function (builder) {
-  builder.addCase(setLoading, function (state, action) {
-    state.isLoading = action.payload;
-  }).addCase(setLoadingPage, function (state, action) {
-    state.isLoadingPage = action.payload;
-  }).addCase(setAlert, function (state, action) {
-    state.alert = action.payload;
-  }).addCase(setUser, function (state, action) {
-    state.user = action.payload;
-  }).addCase(setLanguage, function (state, action) {
-    state.language = action.payload;
-  }).addCase(reset, function (_state, _action) {
-    return initialState;
-  }).addCase(setMenuCollapse, function (state, action) {
-    state.menuCollapse = action.payload;
-  }).addCase(setIsRefetchSidebar, function (state) {
-    state.isRefetchSidebar = !state.isRefetchSidebar;
-  }).addCase(setTenant, function (state, action) {
-    state.user.currentTenantId = action.payload;
-  }).addCase(setAddTenant, function (state, action) {
-    state.user.tenantInfo = action.payload;
-  }).addCase(setTeam, function (state, action) {
-    state.user.currentTeamId = action.payload;
-  });
-});
-
-var rootReducer = combineReducers({
-  common: commonReducer
-});
-
-var store = configureStore({
-  reducer: rootReducer,
-  middleware: function middleware(getDefaultMiddleware) {
-    return getDefaultMiddleware({
-      serializableCheck: false
-    });
-  }
-});
-
-var getAccessToken$1 = (function () {
-  try {
-    return localStorage.getItem(ACCESS_TOKEN);
-  } catch (err) {
-    return null;
-  }
-});
-
-var encodeParams$1 = (function (params) {
-  return Object.keys(params).filter(function (key) {
-    return params[key] || params[key] === 0 || params[key] === false;
-  }).map(function (key) {
-    if (Array.isArray(params[key])) {
-      return params[key].map(function (i) {
-        return encodeURIComponent(key) + "=" + encodeURIComponent(i);
-      }).join('&');
-    }
-    return encodeURIComponent(key) + "=" + encodeURIComponent(params[key]);
-  }).join('&');
-});
-
-var api$1 = axios.create({
-  baseURL: BASE_URL,
-  timeout: 0,
-  headers: {
-    "Content-Type": "application/json"
-  },
-  paramsSerializer: function paramsSerializer(params) {
-    return encodeParams$1(params);
-  }
-});
-var apiUpload$1 = axios.create({
-  baseURL: BASE_URL,
-  timeout: 60000,
-  headers: {
-    "Content-Type": "multipart/form-data"
-  }
-});
-[api$1, apiUpload$1].forEach(function (i) {
-  return i.interceptors.request.use(function (config) {
-    var token = getAccessToken$1();
-    if (token) {
-      config.headers.Authorization = "Bearer " + token;
-    }
-    return config;
-  }, function (error) {
-    return Promise.reject(error);
-  });
-});
-[api$1, apiUpload$1].forEach(function (i) {
-  return i.interceptors.response.use(function (response) {
-    return response;
-  }, function (error) {
-    if (error.response.status === 401) {
-      window.location.href = "/login";
-    }
-    if (error.response.status == 403) {
-      var hostname = window.location.hostname;
-      var parts = hostname.split('.');
-      var domain = parts.slice(-2).join('.');
-      localStorage.removeItem(ACCESS_TOKEN);
-      localStorage.removeItem(ORGANIZATION_TENANT);
-      localStorage.removeItem(ORGANIZATION_TEAM);
-      Cookies.remove('auth', {
-        path: '/',
-        domain: "." + domain
-      });
-      localStorage.removeItem("USER_EMAIL");
-      window.location.href = "/login";
-    }
-    return Promise.reject(error);
-  });
-});
-
-var AUTH_URL = BASE_URL + "/api/auth";
-var checkToken = function checkToken(token) {
-  return api$1.post(AUTH_URL + "/checktoken", {
-    token: token
-  });
+var CoreInput$1 = function CoreInput(props) {
+  var name = props.name,
+    checked = props.checked,
+    _onChange = props.onChange,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    label = props.label;
+  return React.createElement("div", {
+    className: "" + styles$4["core-checkbox"]
+  }, React.createElement(FormGroup, {
+    check: true,
+    inline: true
+  }, React.createElement(Input, {
+    id: "core-checkbox-" + name,
+    type: "checkbox",
+    name: name,
+    checked: checked,
+    onChange: function onChange(e) {
+      return _onChange === null || _onChange === void 0 ? void 0 : _onChange(name, e.target.checked);
+    },
+    disabled: disabled
+  }), React.createElement(Label, {
+    htmlFor: "core-checkbox-" + name,
+    check: true
+  }, label)));
 };
 
-var firstCheckToken = function firstCheckToken() {
-  return Promise.resolve(_catch(function () {
-    var token = getAccessToken$1();
-    return token ? Promise.resolve(checkToken(token)).then(function (tokenStatus) {
-      return tokenStatus.data ? true : false;
-    }) : false;
-  }, function () {
-    return false;
-  }));
+var styles$5 = {"core-radio":"_kvUpe","form-check":"_3ToPe"};
+
+var CoreRadio = function CoreRadio(props) {
+  var name = props.name,
+    value = props.value,
+    options = props.options,
+    onChange = props.onChange,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled;
+  return React.createElement("div", {
+    className: "" + styles$5["core-radio"]
+  }, React.createElement(FormGroup, {
+    check: true
+  }, options.map(function (i) {
+    return React.createElement("div", {
+      key: i.value
+    }, React.createElement(Input, {
+      id: "core-radio-" + i.value,
+      type: "radio",
+      checked: value === i.value,
+      onClick: function onClick() {
+        onChange(name, i.value);
+      },
+      onChange: function onChange() {
+        return;
+      },
+      disabled: disabled || i.disabled
+    }), React.createElement(Label, {
+      htmlFor: "core-radio-" + i.value
+    }, i.label));
+  })));
 };
 
-var getImageUrl = function getImageUrl(imageUrl) {
-  try {
-    if (!!imageUrl) {
-      var imageTrimmed = imageUrl.trim();
-      if (imageTrimmed.startsWith('http://') || imageTrimmed.startsWith('https://')) {
-        return imageTrimmed;
-      }
-      return BASE_URL + "/images/" + imageTrimmed;
+var styles$6 = {"core-modal-header":"_2y5ln"};
+
+var CoreModal = function CoreModal(props) {
+  var open = props.open,
+    onClose = props.onClose,
+    children = props.children,
+    title = props.title,
+    footer = props.footer,
+    handleSubmit = props.handleSubmit,
+    onSubmit = props.onSubmit,
+    _props$bodyPadding = props.bodyPadding,
+    bodyPadding = _props$bodyPadding === void 0 ? "24px" : _props$bodyPadding,
+    className = props.className;
+  return React.createElement(Modal, {
+    isOpen: open,
+    toggle: onClose,
+    centered: true,
+    modalClassName: className
+  }, React.createElement("form", {
+    onSubmit: onSubmit ? handleSubmit(onSubmit) : undefined,
+    className: "" + styles$6["core-modal-container"]
+  }, React.createElement(ModalHeader, {
+    toggle: onClose,
+    className: styles$6["core-modal-header"]
+  }, title), React.createElement(ModalBody, {
+    style: {
+      padding: bodyPadding
     }
-    return "/images/avatar-default.png";
-  } catch (err) {
-    return "/images/avatar-default.png";
-  }
+  }, children), footer && React.createElement(ModalFooter, null, footer)));
 };
 
-var NotFound = function NotFound() {
+var styles$7 = {"core-range":"_1dzD7"};
+
+var CoreRange = function CoreRange(props) {
+  var name = props.name,
+    value = props.value,
+    _onChange = props.onChange,
+    label = props.label,
+    width = props.width,
+    min = props.min,
+    max = props.max,
+    step = props.step;
   return React.createElement("div", {
-    className: "not-found"
-  }, React.createElement("div", {
-    className: "clearfix"
-  }, React.createElement("h1", {
-    className: "float-left display-3 mr-4"
-  }, "404"), React.createElement("div", {
-    className: "float-left"
-  }, React.createElement("h4", {
-    className: "pt-3"
-  }, "Oops! You are lost."), React.createElement("p", {
-    className: "text-muted mb-2"
-  }, "The page you are looking for was not found."), React.createElement("div", null))));
+    className: "" + styles$7["core-range"],
+    style: {
+      width: width != null ? width : "100%"
+    }
+  }, label && React.createElement("label", null, label), React.createElement("input", {
+    type: "range",
+    name: name,
+    value: value,
+    onChange: function onChange(e) {
+      return _onChange(name, +e.target.value);
+    },
+    min: min,
+    max: max,
+    step: step
+  }));
 };
 
-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 styles$8 = {"editor":"_3TUh3","label":"_15n2K","optional":"_1fHZB","icon":"_38AfS","error":"_DaofN","no-border":"_2JOcF","small-height":"_1EXev"};
+
+var Search = function Search(props) {
+  var _props$size = props.size,
+    size = _props$size === void 0 ? 16 : _props$size,
+    _props$color = props.color,
+    color = _props$color === void 0 ? "#A6A6AD" : _props$color;
+  return React.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M9.40376 9.40352C9.63808 9.1692 10.018 9.1692 10.2523 9.40352L13.4243 12.5755C13.6586 12.8098 13.6586 13.1897 13.4243 13.424C13.19 13.6584 12.8101 13.6584 12.5758 13.424L9.40376 10.252C9.16945 10.0177 9.16945 9.63783 9.40376 9.40352Z",
+    fill: color
+  }), React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M6.9999 3.5999C5.12213 3.5999 3.5999 5.12213 3.5999 6.9999C3.5999 8.87767 5.12213 10.3999 6.9999 10.3999C8.87767 10.3999 10.3999 8.87767 10.3999 6.9999C10.3999 5.12213 8.87767 3.5999 6.9999 3.5999ZM2.3999 6.9999C2.3999 4.45939 4.45939 2.3999 6.9999 2.3999C9.54041 2.3999 11.5999 4.45939 11.5999 6.9999C11.5999 9.54041 9.54041 11.5999 6.9999 11.5999C4.45939 11.5999 2.3999 9.54041 2.3999 6.9999Z",
+    fill: color
+  }));
 };
-var Loading = function Loading() {
-  var isLoading = useSelector(function (state) {
-    return state.common.isLoading;
-  });
-  localStorage.setItem("LAST_TIME_REQUETST", moment().utc().format("YYYY-MM-DD HH:mm:ss"));
-  return isLoading ? React.createElement("div", {
-    style: loadingStyle
-  }, React.createElement("div", {
-    className: "spinner-border text-secondary",
-    role: "status"
-  }, React.createElement("span", {
-    className: "sr-only"
-  }))) : null;
+
+var Close = function Close(props) {
+  var _props$color = props.color,
+    color = _props$color === void 0 ? "#A6A6AD" : _props$color,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 16 : _props$size;
+  return React.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React.createElement("g", {
+    clipPath: "url(#clip0_1060_48455)"
+  }, React.createElement("rect", {
+    x: "2.48438",
+    y: "3.61597",
+    width: "1.6",
+    height: "14",
+    rx: "0.8",
+    transform: "rotate(-45 2.48438 3.61597)",
+    fill: color
+  }), React.createElement("rect", {
+    x: "12.2427",
+    y: "2.34326",
+    width: "1.6",
+    height: "14",
+    rx: "0.8",
+    transform: "rotate(45 12.2427 2.34326)",
+    fill: color
+  })), React.createElement("defs", null, React.createElement("clipPath", {
+    id: "clip0_1060_48455"
+  }, React.createElement("rect", {
+    width: "16",
+    height: "16",
+    fill: "white"
+  }))));
+};
+
+var Info = function Info() {
+  return React.createElement("svg", {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 12 12",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M6.0002 2.1002C3.84628 2.1002 2.1002 3.84628 2.1002 6.0002C2.1002 8.15411 3.84628 9.9002 6.0002 9.9002C8.15411 9.9002 9.9002 8.15411 9.9002 6.0002C9.9002 3.84628 8.15411 2.1002 6.0002 2.1002ZM1.2002 6.0002C1.2002 3.34923 3.34923 1.2002 6.0002 1.2002C8.65116 1.2002 10.8002 3.34923 10.8002 6.0002C10.8002 8.65116 8.65116 10.8002 6.0002 10.8002C3.34923 10.8002 1.2002 8.65116 1.2002 6.0002Z",
+    fill: "#A6A6AD"
+  }), React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M5.9998 5.1001C6.24833 5.1001 6.4498 5.30157 6.4498 5.5501V8.2915C6.4498 8.54003 6.24833 8.7415 5.9998 8.7415C5.75128 8.7415 5.5498 8.54003 5.5498 8.2915V5.5501C5.5498 5.30157 5.75128 5.1001 5.9998 5.1001Z",
+    fill: "#A6A6AD"
+  }), React.createElement("path", {
+    d: "M5.9999 4.6502C5.6687 4.6502 5.3999 4.3808 5.3999 4.0502C5.3999 3.7196 5.6687 3.4502 5.9999 3.4502C6.3311 3.4502 6.5999 3.7196 6.5999 4.0502C6.5999 4.3808 6.3311 4.6502 5.9999 4.6502Z",
+    fill: "#A6A6AD"
+  }));
 };
 
-var useGoogleSignOut = function useGoogleSignOut(props) {
-  var dispatch = useDispatch();
-  var onLogoutSuccess = props.onLogoutSuccess,
-    onFailure = props.onFailure;
-  var handleLogoutSuccess = function handleLogoutSuccess() {
-    onLogoutSuccess === null || onLogoutSuccess === void 0 ? void 0 : onLogoutSuccess();
-  };
-  var handleLogoutFailure = function handleLogoutFailure() {
-    onFailure === null || onFailure === void 0 ? void 0 : onFailure();
+var _excluded$1 = ["name", "value", "onChange", "placeholder", "error", "label", "isOptional", "tooltip", "noBorder", "smallHeight", "cols", "rows", "minHeight", "className", "onKeyDown", "onKeyFocus", "autoResize", "width", "onClick", "onBlur", "isDisabled"];
+var CoreTextArea = function CoreTextArea(props) {
+  var _props$name = props.name,
+    name = _props$name === void 0 ? "" : _props$name,
+    value = props.value,
+    _onChange = props.onChange,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Type here..." : _props$placeholder,
+    _props$error = props.error,
+    error = _props$error === void 0 ? false : _props$error,
+    label = props.label,
+    _props$isOptional = props.isOptional,
+    isOptional = _props$isOptional === void 0 ? false : _props$isOptional,
+    tooltip = props.tooltip,
+    _props$noBorder = props.noBorder,
+    noBorder = _props$noBorder === void 0 ? false : _props$noBorder,
+    _props$smallHeight = props.smallHeight,
+    smallHeight = _props$smallHeight === void 0 ? false : _props$smallHeight,
+    cols = props.cols,
+    rows = props.rows,
+    minHeight = props.minHeight,
+    className = props.className,
+    _onKeyDown = props.onKeyDown,
+    onKeyFocus = props.onKeyFocus,
+    autoResize = props.autoResize,
+    width = props.width,
+    onClick = props.onClick,
+    onBlur = props.onBlur,
+    isDisabled = props.isDisabled,
+    rest = _objectWithoutPropertiesLoose(props, _excluded$1);
+  var _useState = useState(false),
+    isOpenTooltip = _useState[0],
+    setIsOpenTooltip = _useState[1];
+  var toggleTooltip = function toggleTooltip() {
+    return setIsOpenTooltip(!isOpenTooltip);
   };
-  var _useGoogleLogout = useGoogleLogout({
-      clientId: GOOGLE_CLIENT_ID,
-      onLogoutSuccess: handleLogoutSuccess,
-      onFailure: handleLogoutFailure
-    }),
-    signOut = _useGoogleLogout.signOut,
-    loaded = _useGoogleLogout.loaded;
-  var handleSignOut = function handleSignOut() {
-    localStorage.clear();
-    try {
-      signOut();
-    } catch (error) {
-      console.log({
-        error: error
+  var textareaRef = useRef(null);
+  useEffect(function () {
+    if (autoResize && textareaRef.current) {
+      var el = textareaRef.current;
+      requestAnimationFrame(function () {
+        el.style.height = "auto";
+        el.style.height = el.scrollHeight + "px";
       });
     }
-    dispatch(reset());
-    window.location.href = "/login";
-  };
-  return {
-    handleSignOut: handleSignOut,
-    loaded: loaded
-  };
-};
-
-var LayoutContext = function LayoutContext(_ref) {
-  var children = _ref.children,
-    onNavigate = _ref.onNavigate;
-  var _useGoogleSignOut = useGoogleSignOut({
-      onNavigate: onNavigate
-    }),
-    handleSignOut = _useGoogleSignOut.handleSignOut;
-  var resetAuth = function resetAuth() {
-    handleSignOut();
-  };
-  var loadInfo = function loadInfo() {
-    try {
-      var token = firstCheckToken();
-      !token && resetAuth();
-      return Promise.resolve();
-    } catch (e) {
-      return Promise.reject(e);
+  }, [value, autoResize]);
+  return React.createElement("div", {
+    className: styles$8["editor"] + " " + (error ? styles$8["error"] : "") + " " + (noBorder ? styles$8["no-border"] : "") + " " + (smallHeight ? styles$8["small-height"] : ""),
+    style: {
+      width: width != null ? width : "100%"
     }
-  };
-  useEffect(function () {
-    loadInfo();
-  }, []);
-  return React.createElement(Fragment, null, children);
-};
-
-var ConfirmDialog = function ConfirmDialog(_ref) {
-  var open = _ref.open,
-    text = _ref.text,
-    _ref$cancelText = _ref.cancelText,
-    cancelText = _ref$cancelText === void 0 ? "No" : _ref$cancelText,
-    _ref$okText = _ref.okText,
-    okText = _ref$okText === void 0 ? "Yes" : _ref$okText,
-    isDelete = _ref.isDelete,
-    toggle = _ref.toggle,
-    onClose = _ref.onClose,
-    onConfirm = _ref.onConfirm;
-  return React.createElement(Modal, {
-    isOpen: open,
-    toggle: !!onClose ? onClose : toggle,
-    centered: true
-  }, React.createElement(ModalHeader, {
-    toggle: toggle
-  }, "Confirmation"), React.createElement(ModalBody, null, text), React.createElement(ModalFooter, null, React.createElement(Button, {
-    color: "secondary",
-    onClick: toggle
-  }, cancelText), React.createElement(Button, {
-    color: isDelete ? "danger" : "primary",
-    onClick: onConfirm
-  }, okText)));
-};
-
-var CommonDialog = function CommonDialog(_ref) {
-  var open = _ref.open,
-    children = _ref.children,
-    centered = _ref.centered,
-    title = _ref.title,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? "xs" : _ref$size,
-    _ref$isShowHeader = _ref.isShowHeader,
-    isShowHeader = _ref$isShowHeader === void 0 ? true : _ref$isShowHeader,
-    onClose = _ref.onClose,
-    backdrop = _ref.backdrop;
-  return React.createElement(Modal, {
-    backdrop: backdrop,
-    isOpen: open,
-    toggle: onClose,
-    centered: centered,
-    size: size,
-    zIndex: 1102
-  }, isShowHeader ? React.createElement(ModalHeader, {
-    toggle: onClose
-  }, title) : React.createElement(Box, {
-    className: "p-3"
-  }, React.createElement(Typography, {
-    className: "fs-5 text-center fw-bold"
-  }, title)), children);
-};
-
-var AuthenticationMessage;
-(function (AuthenticationMessage) {
-  AuthenticationMessage["NotAllowedToRegister"] = "NotAllowedToRegister";
-  AuthenticationMessage["InvalidGoogleToken"] = "InvalidGoogleToken";
-})(AuthenticationMessage || (AuthenticationMessage = {}));
-var Role;
-(function (Role) {
-  Role["Student"] = "Student";
-  Role["Teacher"] = "Teacher";
-  Role["Admin"] = "Admin";
-})(Role || (Role = {}));
-
-var CustomPagination = function CustomPagination(_ref) {
-  var currentPage = _ref.currentPage,
-    totalPage = _ref.totalPage,
-    onChangePage = _ref.onChangePage;
-  return React.createElement(Pagination, {
-    className: "w-fit"
-  }, React.createElement(PaginationItem, {
-    disabled: currentPage <= 1
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(currentPage - 1);
-    },
-    previous: true,
-    href: "#"
-  })), React.createElement(PaginationItem, {
-    active: 1 === currentPage,
-    key: 1
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(1);
-    },
-    href: "#"
-  }, 1)), totalPage > 2 && React.createElement(PaginationItem, {
-    active: 2 === currentPage,
-    key: 1
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(2);
-    },
-    href: "#"
-  }, 2)), currentPage > 4 && currentPage !== totalPage && totalPage !== 5 && React.createElement(PaginationItem, {
-    disabled: true,
-    key: "first"
-  }, React.createElement(PaginationLink, {
-    href: "#"
-  }, "...")), (currentPage === 1 || currentPage === totalPage) && totalPage === 5 && React.createElement(PaginationItem, {
-    key: 3
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(3);
-    },
-    href: "#"
-  }, "3")), [currentPage - 1, currentPage, currentPage + 1].filter(function (page) {
-    return page > 2 && page < totalPage - 1;
-  }).map(function (page) {
-    return React.createElement(PaginationItem, {
-      active: page === currentPage,
-      key: page
-    }, React.createElement(PaginationLink, {
-      onClick: function onClick(e) {
-        e.preventDefault();
-        onChangePage(page);
-      },
-      href: "#"
-    }, page));
-  }), totalPage - currentPage > 4 && React.createElement(PaginationItem, {
-    disabled: true,
-    key: "last"
-  }, React.createElement(PaginationLink, {
-    href: "#"
-  }, "...")), totalPage > 3 && React.createElement(PaginationItem, {
-    active: totalPage - 1 === currentPage,
-    key: totalPage - 1
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(totalPage - 1);
+  }, label && React.createElement("span", {
+    className: styles$8["label"]
+  }, React.createElement("div", {
+    className: styles$8["label-content"]
+  }, label), isOptional && React.createElement("div", {
+    className: styles$8["optional"]
+  }, "(optional)"), tooltip && React.createElement("div", {
+    id: name,
+    className: styles$8["icon"]
+  }, React.createElement(Info, null), React.createElement(Tooltip, {
+    target: name,
+    isOpen: isOpenTooltip,
+    toggle: toggleTooltip
+  }, tooltip))), React.createElement("textarea", Object.assign({
+    ref: textareaRef,
+    placeholder: placeholder,
+    style: {
+      whiteSpace: "pre-wrap",
+      width: "100%",
+      minHeight: minHeight ? minHeight : "123px",
+      resize: "none",
+      overflow: "hidden"
     },
-    href: "#"
-  }, totalPage - 1)), totalPage > 1 && React.createElement(PaginationItem, {
-    active: totalPage === currentPage,
-    key: totalPage
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(totalPage);
+    value: value,
+    cols: cols,
+    rows: rows,
+    onChange: function onChange(e) {
+      return _onChange(name, e.target.value);
     },
-    href: "#"
-  }, totalPage)), React.createElement(PaginationItem, {
-    disabled: currentPage >= totalPage
-  }, React.createElement(PaginationLink, {
-    onClick: function onClick(e) {
-      e.preventDefault();
-      onChangePage(currentPage + 1);
+    onKeyDown: function onKeyDown(e) {
+      return _onKeyDown === null || _onKeyDown === void 0 ? void 0 : _onKeyDown(e);
     },
-    next: true,
-    href: "#"
-  })));
+    onFocus: function onFocus(e) {
+      return onKeyFocus === null || onKeyFocus === void 0 ? void 0 : onKeyFocus(name, e.target.value);
+    },
+    className: className,
+    onClick: onClick,
+    onBlur: onBlur,
+    disabled: isDisabled
+  }, rest)));
 };
 
-function _extends() {
-  return _extends = Object.assign ? Object.assign.bind() : function (n) {
-    for (var e = 1; e < arguments.length; e++) {
-      var t = arguments[e];
-      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-    }
-    return n;
-  }, _extends.apply(null, arguments);
-}
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (-1 !== e.indexOf(n)) continue;
-    t[n] = r[n];
-  }
-  return t;
-}
+var styles$9 = {"core-search":"_wyI1K","input":"_9XW-D","icon":"_2iDm7","clear":"_1nhXy"};
 
-var useAmplitude = function useAmplitude() {
-  var _useState = useState(null),
-    userId = _useState[0],
-    setUserIdState = _useState[1];
-  var _useState2 = useState(true),
-    isTabActive = _useState2[0],
-    setIsTabActive = _useState2[1];
-  var sessionStartTime = useRef(null);
-  var currentSessionStart = useRef(null);
-  var savedUserProperties = useRef({});
-  var hasTrackedInitialSession = useRef(false);
-  var setUserProperties = useCallback(function (properties) {
-    savedUserProperties.current = _extends({}, savedUserProperties.current, properties);
-    var identify$1 = new Identify();
-    Object.entries(properties).forEach(function (_ref) {
-      var key = _ref[0],
-        value = _ref[1];
-      identify$1.set(key, value);
-    });
-    identify(identify$1);
-  }, []);
-  var trackEvent = useCallback(function (_ref2) {
-    var eventName = _ref2.eventName,
-      eventProperties = _ref2.eventProperties;
-    track(eventName, _extends({}, savedUserProperties.current, eventProperties, {
-      timestamp: new Date().toISOString()
-    }));
-  }, []);
-  var setUserId$1 = useCallback(function (newUserId) {
-    var prevUserId = userId;
-    setUserIdState(newUserId);
-    if (newUserId) {
-      var prefixedUserId = "edusfere:" + newUserId;
-      setUserId(prefixedUserId);
-      if (prevUserId !== newUserId && !hasTrackedInitialSession.current) {
-        hasTrackedInitialSession.current = true;
-        sessionStartTime.current = new Date();
-        currentSessionStart.current = new Date();
-        trackEvent({
-          eventName: AmplitudeEvent.SESSION_START,
-          eventProperties: {
-            start_time: new Date().toISOString()
-          }
-        });
+var CoreSearch = function CoreSearch(props) {
+  var _props$name = props.name,
+    name = _props$name === void 0 ? "" : _props$name,
+    value = props.value,
+    _onChange = props.onChange,
+    width = props.width,
+    onPressEnter = props.onPressEnter,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Search..." : _props$placeholder;
+  var handleClear = function handleClear() {
+    _onChange(name, "");
+    onPressEnter && onPressEnter("");
+  };
+  return React.createElement("div", {
+    className: styles$9["core-search"],
+    style: {
+      width: width != null ? width : "100%"
+    },
+    tabIndex: 1
+  }, React.createElement("div", {
+    className: styles$9["icon"]
+  }, React.createElement(Search, null)), React.createElement("input", {
+    className: styles$9["input"],
+    value: value,
+    onChange: function onChange(e) {
+      return _onChange(name, e.target.value);
+    },
+    placeholder: placeholder,
+    onKeyDown: function onKeyDown(e) {
+      if (e.key === "Enter") {
+        onPressEnter && onPressEnter(value);
       }
     }
-  }, [userId, trackEvent]);
-  var reset = useCallback(function () {
-    reset$1();
-    setUserIdState(null);
-    sessionStartTime.current = null;
-    currentSessionStart.current = null;
-    savedUserProperties.current = {};
-    hasTrackedInitialSession.current = false;
-  }, []);
-  var trackTabActivity = useCallback(function (isActive) {
-    if (!userId) return;
-    var now = new Date();
-    if (isActive) {
-      currentSessionStart.current = now;
-      trackEvent({
-        eventName: AmplitudeEvent.SESSION_START,
-        eventProperties: {
-          start_time: now.toISOString()
-        }
-      });
-    } else {
-      if (currentSessionStart.current) {
-        var sessionDuration = now.getTime() - currentSessionStart.current.getTime();
-        trackEvent({
-          eventName: AmplitudeEvent.SESSION_END,
-          eventProperties: {
-            session_duration_seconds: Math.round(sessionDuration / 1000),
-            start_time: currentSessionStart.current.toISOString(),
-            end_time: now.toISOString()
-          }
-        });
-        currentSessionStart.current = null;
+  }), value.length ? React.createElement("div", {
+    className: styles$9["clear"],
+    onClick: handleClear
+  }, React.createElement(Close, null)) : null);
+};
+
+var styles$a = {"core-select-compact":"_3ql5D","label":"_3fPQC"};
+
+var Option$1 = function Option(props) {
+  return React.createElement("div", null, React.createElement(components.Option, Object.assign({}, props), React.createElement(CoreInput$1, {
+    checked: props.isSelected,
+    onChange: function onChange() {
+      return null;
+    },
+    name: "",
+    label: props.label
+  })));
+};
+var CoreSelectCompact = function CoreSelectCompact(props) {
+  var _props$name = props.name,
+    name = _props$name === void 0 ? "" : _props$name,
+    options = props.options,
+    value = props.value,
+    onChange = props.onChange,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    label = props.label,
+    width = props.width,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Select" : _props$placeholder,
+    _props$isMulti = props.isMulti,
+    isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
+    _props$isShowDropdown = props.isShowDropdown,
+    isShowDropdown = _props$isShowDropdown === void 0 ? false : _props$isShowDropdown,
+    _props$error = props.error,
+    error = _props$error === void 0 ? false : _props$error,
+    _noOptionsMessage = props.noOptionsMessage;
+  var handleChange = function handleChange(value) {
+    var newValue = isMulti ? value === null || value === void 0 ? void 0 : value.map(function (item) {
+      return item.value;
+    }) : value === null || value === void 0 ? void 0 : value.value;
+    onChange(name, newValue);
+  };
+  var controlStyle = function controlStyle(base, state) {
+    var styles = _extends({}, base, {
+      fontSize: "14px",
+      fontWeight: "400",
+      padding: "0",
+      backgroundColor: state.isDisabled ? "transparent" : error ? COLORS.lightYellow : COLORS.white,
+      border: "none",
+      height: isMulti ? undefined : "26px",
+      minHeight: "26px",
+      boxShadow: "none",
+      cursor: "pointer",
+      "&:hover": {
+        backgroundColor: COLORS.lightBlueHover
+      },
+      "&>div": {
+        padding: "0 2px"
       }
-    }
-  }, [userId, trackEvent]);
-  var trackPageUnload = useCallback(function () {
-    if (!userId || !currentSessionStart.current) return;
-    var now = new Date();
-    var sessionDuration = now.getTime() - currentSessionStart.current.getTime();
-    trackEvent({
-      eventName: AmplitudeEvent.SESSION_END,
-      eventProperties: {
-        session_duration_seconds: Math.round(sessionDuration / 1000),
-        start_time: currentSessionStart.current.toISOString(),
-        end_time: now.toISOString(),
-        end_reason: 'page_unload'
+    });
+    return styles;
+  };
+  var inputStyles = function inputStyles(base) {
+    var styles = _extends({}, base, {
+      margin: "0",
+      padding: "0",
+      color: "inherit",
+      position: "relative",
+      top: "-2px"
+    });
+    return styles;
+  };
+  var placeholderStyles = function placeholderStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.lightGray
+    });
+    return styles;
+  };
+  var dropdownIndicatorStyles = function dropdownIndicatorStyles(base) {
+    var styles = _extends({}, base, {
+      position: "relative",
+      padding: "2px 0"
+    });
+    return styles;
+  };
+  var indicatorsContainerStyles = function indicatorsContainerStyles(base) {
+    var styles = _extends({}, base, {
+      display: isShowDropdown && !isMulti ? "block" : "none"
+    });
+    return styles;
+  };
+  var valueContainerStyles = function valueContainerStyles(base) {
+    var styles = _extends({}, base, {
+      height: isMulti ? undefined : "26px",
+      position: "relative"
+    });
+    return styles;
+  };
+  var singleValueStyles = function singleValueStyles(base) {
+    var styles = _extends({}, base);
+    return styles;
+  };
+  var optionStyles = function optionStyles(base, state) {
+    var styles = _extends({}, base, {
+      padding: "8px",
+      borderRadius: "8px",
+      cursor: "pointer",
+      fontSize: "14px",
+      fontWeight: 400,
+      color: COLORS.blackText,
+      backgroundColor: state.isSelected ? COLORS.lightBlueHover : "transparent",
+      "&:hover": {
+        backgroundColor: COLORS.lightBlueHover
       }
     });
-  }, [userId, trackEvent]);
-  useEffect(function () {
-    var handleVisibilityChange = function handleVisibilityChange() {
-      var isVisible = !document.hidden;
-      setIsTabActive(isVisible);
-      trackTabActivity(isVisible);
-    };
-    document.addEventListener('visibilitychange', handleVisibilityChange);
-    return function () {
-      return document.removeEventListener('visibilitychange', handleVisibilityChange);
-    };
-  }, [trackTabActivity]);
-  useEffect(function () {
-    var handleFocus = function handleFocus() {
-      setIsTabActive(true);
-      trackTabActivity(true);
-    };
-    var handleBlur = function handleBlur() {
-      setIsTabActive(false);
-      trackTabActivity(false);
-    };
-    window.addEventListener('focus', handleFocus);
-    window.addEventListener('blur', handleBlur);
-    return function () {
-      window.removeEventListener('focus', handleFocus);
-      window.removeEventListener('blur', handleBlur);
-    };
-  }, [trackTabActivity]);
-  useEffect(function () {
-    var handleBeforeUnload = function handleBeforeUnload() {
-      trackPageUnload();
-    };
-    window.addEventListener('beforeunload', handleBeforeUnload);
-    return function () {
-      return window.removeEventListener('beforeunload', handleBeforeUnload);
-    };
-  }, [trackPageUnload]);
-  return {
-    setUserId: setUserId$1,
-    setUserProperties: setUserProperties,
-    trackEvent: trackEvent,
-    reset: reset,
-    userId: userId,
-    isTabActive: isTabActive,
-    sessionStartTime: sessionStartTime.current,
-    currentSessionStart: currentSessionStart.current
+    return styles;
   };
-};
-
-var initializeAmplitude = function initializeAmplitude(apiKey) {
-  init(apiKey, {
-    defaultTracking: {
-      pageViews: true,
-      sessions: true,
-      formInteractions: true
+  var multiValueStyles = function multiValueStyles(base) {
+    var styles = _extends({}, base, {
+      backgroundColor: COLORS.lightBlue,
+      borderRadius: "4px",
+      padding: "0 4px",
+      display: "flex",
+      alignItems: "center",
+      fontSize: "13px",
+      color: COLORS.blackText
+    });
+    return styles;
+  };
+  var multiValueRemoveStyles = function multiValueRemoveStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.lightGray,
+      cursor: "pointer"
+    });
+    return styles;
+  };
+  var multiValueLabelStyles = function multiValueLabelStyles(base) {
+    var styles = _extends({}, base, {
+      color: COLORS.blackText,
+      fontWeight: "400",
+      fontSize: "13px",
+      padding: 0
+    });
+    return styles;
+  };
+  return React.createElement("div", {
+    className: "" + styles$a["core-select-compact"],
+    style: {
+      width: width != null ? width : "100%"
     }
-  });
+  }, label && React.createElement("div", {
+    className: styles$a["label"]
+  }, React.createElement("label", null, label), React.createElement(Info, null)), React.createElement(ReactSelect, {
+    name: name,
+    value: options.filter(function (i) {
+      return value && (isMulti ? value.includes(i.value) : i.value === value);
+    }),
+    onChange: handleChange,
+    placeholder: placeholder,
+    isDisabled: disabled,
+    isMulti: isMulti,
+    closeMenuOnSelect: !isMulti,
+    hideSelectedOptions: false,
+    options: options,
+    noOptionsMessage: function noOptionsMessage() {
+      return _noOptionsMessage ? _noOptionsMessage : "No options";
+    },
+    components: isMulti ? {
+      Option: Option$1
+    } : undefined,
+    styles: {
+      control: controlStyle,
+      input: inputStyles,
+      placeholder: placeholderStyles,
+      dropdownIndicator: dropdownIndicatorStyles,
+      indicatorSeparator: function indicatorSeparator() {
+        return {
+          display: "none"
+        };
+      },
+      indicatorsContainer: indicatorsContainerStyles,
+      valueContainer: valueContainerStyles,
+      singleValue: singleValueStyles,
+      option: optionStyles,
+      multiValue: multiValueStyles,
+      multiValueRemove: multiValueRemoveStyles,
+      multiValueLabel: multiValueLabelStyles
+    }
+  }));
 };
 
-var styles = {"core-button":"_xvNBN","primary":"_U9Qyp","secondary":"_1VzMy","text":"_pZNuj","danger":"_2uYm1","light":"_wxH5S"};
+var styles$b = {"core-input-compact":"_1qmXW","label":"_1argp","icon":"_3DPRG"};
 
-var _excluded = ["type", "children", "onClick", "icon", "disabled", "htmlType"];
-var CoreButton = function CoreButton(props) {
-  var _props$type = props.type,
-    type = _props$type === void 0 ? "primary" : _props$type,
-    children = props.children,
-    onClick = props.onClick,
-    icon = props.icon,
+var _excluded$2 = ["name", "value", "onChange", "disabled", "label", "width", "placeholder", "error", "tooltip", "onKeyDown"];
+var CoreInputCompact = function CoreInputCompact(props) {
+  var _props$name = props.name,
+    name = _props$name === void 0 ? "" : _props$name,
+    value = props.value,
+    _onChange = props.onChange,
     _props$disabled = props.disabled,
     disabled = _props$disabled === void 0 ? false : _props$disabled,
-    _props$htmlType = props.htmlType,
-    htmlType = _props$htmlType === void 0 ? "button" : _props$htmlType,
-    rest = _objectWithoutPropertiesLoose(props, _excluded);
-  return React.createElement("button", Object.assign({
-    className: styles["core-button"] + " " + styles[type],
-    onClick: onClick,
+    label = props.label,
+    width = props.width,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? "Type here" : _props$placeholder,
+    error = props.error,
+    tooltip = props.tooltip,
+    _onKeyDown = props.onKeyDown,
+    rest = _objectWithoutPropertiesLoose(props, _excluded$2);
+  var _useState = useState(false),
+    isOpenTooltip = _useState[0],
+    setIsOpenTooltip = _useState[1];
+  var toggleTooltip = function toggleTooltip() {
+    return setIsOpenTooltip(!isOpenTooltip);
+  };
+  return React.createElement("div", {
+    className: "" + styles$b["core-input-compact"],
+    style: {
+      width: width != null ? width : "100%"
+    }
+  }, label && React.createElement("div", {
+    className: styles$b["label"]
+  }, React.createElement("label", null, label), tooltip ? React.createElement("div", {
+    id: name,
+    className: styles$b["icon"]
+  }, React.createElement(Info, null)) : null), React.createElement("input", Object.assign({
+    style: {
+      backgroundColor: error ? COLORS.lightYellow : "transparent"
+    },
+    name: name,
+    value: value,
+    onChange: function onChange(e) {
+      return _onChange(name, e.target.value);
+    },
     disabled: disabled,
-    type: htmlType
-  }, rest), icon && icon, children);
+    placeholder: placeholder,
+    onKeyDown: function onKeyDown(e) {
+      _onKeyDown && _onKeyDown(e);
+    }
+  }, rest)), tooltip && React.createElement(Tooltip, {
+    target: name,
+    isOpen: isOpenTooltip,
+    toggle: toggleTooltip
+  }, tooltip));
 };
 
-var styles$1 = {"core-input":"_1WdX2","outline":"_3X2RJ","no-outline":"_bVYtv","error":"_n7n3Q"};
-
-var styles$2 = {"core-error":"_1Mmxr"};
-
-var CoreError = function CoreError(props) {
-  var message = props.message;
-  return React.createElement("div", {
-    className: "" + styles$2["core-error"]
-  }, React.createElement("p", null, message));
-};
+var styles$c = {"core-label-input":"_2YqZu","size-h1":"_23-uu","size-h2":"_16lQL"};
 
-var CoreInput = function CoreInput(props) {
-  var name = props.name,
+var CoreTitleInput = function CoreTitleInput(props) {
+  var _props$name = props.name,
+    name = _props$name === void 0 ? "" : _props$name,
     value = props.value,
     _onChange = props.onChange,
-    _props$type = props.type,
-    type = _props$type === void 0 ? "outline" : _props$type,
     _props$disabled = props.disabled,
     disabled = _props$disabled === void 0 ? false : _props$disabled,
-    label = props.label,
     width = props.width,
     _props$placeholder = props.placeholder,
     placeholder = _props$placeholder === void 0 ? "Type here" : _props$placeholder,
     error = props.error,
-    _props$errorMessage = props.errorMessage,
-    errorMessage = _props$errorMessage === void 0 ? "" : _props$errorMessage,
-    fontSize = props.fontSize,
-    fontWeight = props.fontWeight,
-    _onKeyDown = props.onKeyDown,
-    ref = props.ref,
-    maxLength = props.maxLength,
-    className = props.className,
-    onKeyFocus = props.onKeyFocus;
+    _props$size = props.size,
+    size = _props$size === void 0 ? "h1" : _props$size,
+    maxLength = props.maxLength;
   return React.createElement("div", {
-    className: styles$1["core-input"] + "  " + styles$1[type] + " " + (error ? styles$1["error"] : ""),
+    className: "" + styles$c["core-label-input"],
     style: {
       width: width != null ? width : "100%"
     }
-  }, label && React.createElement("label", null, label), React.createElement("input", Object.assign({
+  }, React.createElement("input", {
+    className: "" + styles$c["size-" + size],
     style: {
-      fontSize: fontSize,
-      fontWeight: fontWeight
+      backgroundColor: error ? COLORS.lightYellow : "transparent"
     },
     name: name,
     value: value,
@@ -1546,879 +1130,1409 @@ var CoreInput = function CoreInput(props) {
     },
     disabled: disabled,
     placeholder: placeholder,
-    onKeyDown: function onKeyDown(e) {
-      return _onKeyDown === null || _onKeyDown === void 0 ? void 0 : _onKeyDown(e);
-    },
-    onFocus: function onFocus(e) {
-      return onKeyFocus === null || onKeyFocus === void 0 ? void 0 : onKeyFocus(name, e.target.value);
-    }
-  }, ref, {
-    maxLength: maxLength,
-    className: className
-  })), error && React.createElement(CoreError, {
-    message: errorMessage
+    maxLength: maxLength
   }));
 };
 
-var styles$3 = {"core-select":"_2sg12","label":"_1-XBo"};
+var styles$d = {"core-tooltip":"_1Bmhs"};
 
-var Option = function Option(props) {
-  return React.createElement("div", null, React.createElement(components.Option, Object.assign({}, props), React.createElement(CoreInput$1, {
-    checked: props.isSelected,
-    onChange: function onChange() {
-      return null;
-    },
-    name: "",
-    label: props.label
-  })));
-};
-var CoreSelect = function CoreSelect(props) {
-  var name = props.name,
-    options = props.options,
-    value = props.value,
-    onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    label = props.label,
-    width = props.width,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? "Select" : _props$placeholder,
-    error = props.error,
-    _props$errorMessage = props.errorMessage,
-    errorMessage = _props$errorMessage === void 0 ? "" : _props$errorMessage,
-    _props$type = props.type,
-    type = _props$type === void 0 ? "outline" : _props$type,
-    _props$isMulti = props.isMulti,
-    isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
-    _props$closeMenuOnSel = props.closeMenuOnSelect,
-    closeMenuOnSelect = _props$closeMenuOnSel === void 0 ? true : _props$closeMenuOnSel,
-    _props$hideSelectedOp = props.hideSelectedOptions,
-    hideSelectedOptions = _props$hideSelectedOp === void 0 ? true : _props$hideSelectedOp;
-  var handleChange = function handleChange(e) {
-    var newValue = isMulti ? e.map(function (item) {
-      return item.value;
-    }) : e === null || e === void 0 ? void 0 : e.value;
-    onChange(name, newValue);
-  };
-  var controlStyle = function controlStyle(base, state) {
-    var styles = _extends({}, base, {
-      fontSize: "14px",
-      fontWeight: "400",
-      padding: "0 4px",
-      borderRadius: "8px",
-      backgroundColor: state.isDisabled ? COLORS.lightGrayBg : COLORS.white,
-      border: state.isFocused ? "2px solid " + (!error ? COLORS.brandBlue : COLORS.red) : "1px solid " + (!error ? COLORS.grayLines : COLORS.red),
-      height: isMulti ? undefined : "32px",
-      minHeight: 0,
-      boxShadow: "none"
-    });
-    switch (type) {
-      case "outline":
-        styles.overflow = "hidden";
-        styles[":hover"] = {
-          backgroundColor: COLORS.lightBlueHover
-        };
-        break;
-      case "no-outline":
-        styles.border = "none";
-        styles.padding = 0;
-        styles["&>div"] = {
-          padding: 0
-        };
-        break;
+var CoreTooltip = function CoreTooltip(props) {
+  var id = props.id,
+    content = props.content,
+    children = props.children,
+    placement = props.placement,
+    isDelay = props.isDelay,
+    _props$timeDelay = props.timeDelay,
+    timeDelay = _props$timeDelay === void 0 ? 1500 : _props$timeDelay,
+    innerClassName = props.innerClassName;
+  var timeoutRef = useRef(null);
+  var _useState = useState(false),
+    isOpenTooltip = _useState[0],
+    setIsOpenTooltip = _useState[1];
+  var handleMouseEnter = function handleMouseEnter() {
+    if (isDelay) {
+      timeoutRef.current = setTimeout(function () {
+        setIsOpenTooltip(true);
+      }, timeDelay);
+    } else {
+      setIsOpenTooltip(true);
     }
-    return styles;
-  };
-  var inputStyles = function inputStyles(base) {
-    var styles = _extends({}, base, {
-      margin: "0",
-      padding: "0",
-      color: "inherit"
-    });
-    return styles;
-  };
-  var placeholderStyles = function placeholderStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.lightGray
-    });
-    return styles;
-  };
-  var dropdownIndicatorStyles = function dropdownIndicatorStyles(base) {
-    var styles = _extends({}, base, {
-      position: "relative",
-      top: "-4px",
-      padding: "8px 0"
-    });
-    return styles;
   };
-  var valueContainerStyles = function valueContainerStyles(base) {
-    var styles = _extends({}, base, {
-      height: isMulti ? undefined : "32px",
-      position: "relative",
-      top: "-3px"
-    });
-    return styles;
-  };
-  var singleValueStyles = function singleValueStyles(base) {
-    var styles = _extends({}, base);
-    return styles;
+  var handleMouseLeave = function handleMouseLeave() {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+    setIsOpenTooltip(false);
   };
-  var optionStyles = function optionStyles(base, state) {
-    var styles = _extends({}, base, {
-      padding: "8px",
-      borderRadius: "8px",
-      cursor: "pointer",
-      fontSize: "14px",
-      fontWeight: 400,
-      backgroundColor: state.isSelected ? COLORS.lightBlueHover : "transparent",
-      "&:hover": {
-        backgroundColor: COLORS.lightBlueHover
+  return React.createElement("div", {
+    id: id,
+    className: styles$d["core-tooltip"],
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, React.createElement("div", {
+    className: styles$d["icon"]
+  }, children), content && React.createElement(Tooltip, {
+    target: id,
+    isOpen: isOpenTooltip,
+    placement: placement,
+    innerClassName: innerClassName
+  }, content));
+};
+
+var BlockLogin = function BlockLogin(_ref) {
+  var onNavigate = _ref.onNavigate,
+    role = _ref.role,
+    hiddenSignup = _ref.hiddenSignup,
+    email = _ref.email,
+    setEmail = _ref.setEmail,
+    loginWithEmail = _ref.loginWithEmail,
+    code = _ref.code,
+    setCode = _ref.setCode,
+    formatTime = _ref.formatTime,
+    loginWithEmailCode = _ref.loginWithEmailCode,
+    trackEvent = _ref.trackEvent;
+  var dispatch = useDispatch();
+  var _useState = useState(false),
+    isOTPModalOpen = _useState[0],
+    setIsOTPModalOpen = _useState[1];
+  var _useState2 = useState(""),
+    otpCode = _useState2[0],
+    setOtpCode = _useState2[1];
+  var _useState3 = useState(0),
+    resendCooldown = _useState3[0],
+    setResendCooldown = _useState3[1];
+  var _useState4 = useState(null),
+    resendTimer = _useState4[0],
+    setResendTimer = _useState4[1];
+  var googleLogin = useGoogleLogin({
+    onSuccess: function (tokenResponse) {
+      try {
+        return Promise.resolve(axios.get("https://www.googleapis.com/oauth2/v3/userinfo", {
+          headers: {
+            Authorization: "Bearer " + tokenResponse.access_token
+          }
+        })).then(function (userInfo) {
+          return function () {
+            if (userInfo && userInfo.data) {
+              var _userInfo$data = userInfo.data,
+                _email = _userInfo$data.email,
+                picture = _userInfo$data.picture,
+                family_name = _userInfo$data.family_name,
+                given_name = _userInfo$data.given_name,
+                name = _userInfo$data.name,
+                sub = _userInfo$data.sub;
+              var accessToken = tokenResponse.access_token;
+              var infoLogin = {
+                imageUrl: picture,
+                fullName: name,
+                firstName: family_name,
+                lastName: given_name,
+                email: _email,
+                token: accessToken,
+                googleId: sub,
+                role: role,
+                type: TypeLogin.Google
+              };
+              dispatch(setLoading(true));
+              return Promise.resolve(apiLoginGoogle(infoLogin)).then(function (authResult) {
+                var _authResult$data;
+                if (((_authResult$data = authResult.data) === null || _authResult$data === void 0 ? void 0 : _authResult$data.id) == null) {
+                  dispatch(setLoading(false));
+                  alert("Please contact admin.");
+                  return;
+                }
+                localStorage.clear();
+                var tokenJWT = authResult.data.token;
+                trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
+                  eventName: AmplitudeEvent.LOGIN,
+                  eventProperties: {
+                    email: _email,
+                    login_method: 'google',
+                    user_role: authResult.data.role,
+                    success: true,
+                    timestamp: new Date().toISOString()
+                  }
+                });
+                if (role === "LandingPage") {
+                  CookieService.setAuthCookie({
+                    token: tokenJWT,
+                    expiresAt: Date.now() + 24 * 60 * 60 * 1000
+                  });
+                  var getRedirectUrl = function getRedirectUrl(role) {
+                    switch (role) {
+                      case "Admin":
+                        return ADMIN_ORIGIN;
+                      case "Teacher":
+                        return TEACHER_ORIGIN;
+                      default:
+                        return role + "." + REQUEST_ORIGIN;
+                    }
+                  };
+                  var redirectUrl = getRedirectUrl(authResult.data.role);
+                  window.location.href = redirectUrl + "/dashboard";
+                  dispatch(setLoading(false));
+                }
+                localStorage.setItem(ACCESS_TOKEN, tokenJWT);
+                onNavigate("/dashboard");
+                dispatch(setLoading(false));
+              });
+            }
+          }();
+        });
+      } catch (e) {
+        return Promise.reject(e);
       }
-    });
-    return styles;
+    },
+    onError: function onError(errorResponse) {
+      return console.log(errorResponse);
+    }
+  });
+  React.useEffect(function () {
+    return function () {
+      if (resendTimer) {
+        clearInterval(resendTimer);
+      }
+    };
+  }, [resendTimer]);
+  var handleEmailLogin = function handleEmailLogin() {
+    if (!email.trim()) {
+      alert("Please enter your email");
+      return;
+    }
+    loginWithEmail(role);
+    setIsOTPModalOpen(true);
   };
-  var indicatorsContainerStyles = function indicatorsContainerStyles(base) {
-    var styles = _extends({}, base, {
-      display: type === "no-outline" ? "none" : "block"
-    });
-    return styles;
+  var startResendCooldown = function startResendCooldown() {
+    setResendCooldown(300);
+    if (resendTimer) {
+      clearInterval(resendTimer);
+    }
+    var timer = setInterval(function () {
+      setResendCooldown(function (prev) {
+        if (prev <= 1) {
+          clearInterval(timer);
+          return 0;
+        }
+        return prev - 1;
+      });
+    }, 1000);
+    setResendTimer(timer);
   };
-  var multiValueStyles = function multiValueStyles(base) {
-    var styles = _extends({}, base, {
-      backgroundColor: COLORS.lightBlue,
-      borderRadius: "4px",
-      padding: "2px 8px",
-      display: "flex",
-      alignItems: "center",
-      fontSize: "13px",
-      color: COLORS.blackText
-    });
-    return styles;
+  var handleResend = function handleResend() {
+    if (resendCooldown > 0) {
+      return;
+    }
+    if (!email.trim()) {
+      alert("Please enter your email");
+      return;
+    }
+    loginWithEmail(role);
+    startResendCooldown();
   };
-  var multiValueRemoveStyles = function multiValueRemoveStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.lightGray,
-      cursor: "pointer"
-    });
-    return styles;
+  var formatResendTime = function formatResendTime(seconds) {
+    var mins = Math.floor(seconds / 60);
+    var secs = seconds % 60;
+    return mins + ":" + secs.toString().padStart(2, '0');
   };
-  var multiValueLabelStyles = function multiValueLabelStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.blackText,
-      fontWeight: "400",
+  React.useEffect(function () {
+    return function () {
+      if (resendTimer) {
+        clearInterval(resendTimer);
+      }
+    };
+  }, [resendTimer]);
+  return React.createElement(React.Fragment, null, React.createElement(Row, {
+    style: {
+      height: "100%"
+    }
+  }, React.createElement(Col, {
+    sm: 12,
+    lg: role != "Admin" ? 7 : 12
+  }, React.createElement("div", {
+    className: "" + styleGlobal["box-signin-container"]
+  }, React.createElement("div", {
+    className: styleGlobal["box-signin-logo"] + " "
+  }, React.createElement(Link, {
+    to: "/",
+    className: "d-flex"
+  }, React.createElement("img", {
+    src: "/images/Logo.png",
+    alt: "",
+    height: 37,
+    width: 155,
+    className: "my-auto"
+  }))), React.createElement("div", {
+    className: styleGlobal["box-signin"] + " "
+  }, React.createElement("div", {
+    className: "" + styleGlobal["signin_title"]
+  }, React.createElement("span", null, "Welcome to Edusfere")), !hiddenSignup && React.createElement("div", {
+    className: "" + styleGlobal["signup_link"]
+  }, React.createElement("span", null, "Don't have an account?", " ", React.createElement(Link, {
+    to: "/",
+    style: {
+      color: "#00A0DA"
+    },
+    className: "text-decoration-none"
+  }, "Sign up"))), React.createElement("div", {
+    className: "" + styleGlobal["google_button"]
+  }, React.createElement("button", {
+    onClick: function onClick() {
+      return googleLogin();
+    }
+  }, React.createElement("img", {
+    width: 24,
+    height: 24,
+    alt: "Google sign-in",
+    src: "/images/icons/Google__G__logo.png"
+  }), "Sign in with Google")), React.createElement("span", {
+    className: "" + styleGlobal["box-field"]
+  }, "OR"), React.createElement("div", {
+    className: "" + styleGlobal["box-input"]
+  }, React.createElement("input", {
+    type: "email",
+    placeholder: "Email",
+    value: email,
+    onChange: function onChange(event) {
+      setEmail(event.target.value.trim());
+    }
+  })), React.createElement("button", {
+    onClick: handleEmailLogin,
+    className: "" + styleGlobal["box-button-email"],
+    disabled: !email.trim()
+  }, React.createElement("img", {
+    width: 20,
+    height: 20,
+    alt: "Email sign-in",
+    src: "/images/icons/Login_icon.png"
+  }), "Sign in with Email")), React.createElement("div", {
+    className: styleGlobal["box-signin-text"] + " "
+  }, React.createElement("span", {
+    style: {
       fontSize: "13px",
-      padding: 0
-    });
-    return styles;
-  };
-  return React.createElement("div", {
-    className: "" + styles$3["core-select"],
+      color: "#A6A6AD"
+    }
+  }, "By signing in, you agree to our Terms & Privacy Policy")))), role != "Admin" && role != 'LandingPage' && React.createElement(Col, {
+    sm: 12,
+    lg: 5,
+    className: "d-none d-lg-block " + styleGlobal["pr-30"]
+  }, React.createElement("div", {
+    className: "" + styleGlobal["box-right"],
     style: {
-      width: width != null ? width : "100%"
+      backgroundImage: "url('/images/bg_login.png')"
     }
-  }, label && React.createElement("span", {
-    className: styles$3["label"]
-  }, label), React.createElement(ReactSelect, {
-    name: name,
-    value: options.filter(function (i) {
-      return value && (isMulti ? value.includes(i.value) : i.value === value);
-    }),
-    onChange: handleChange,
-    placeholder: placeholder,
-    isDisabled: disabled,
-    isMulti: isMulti,
-    closeMenuOnSelect: closeMenuOnSelect,
-    hideSelectedOptions: hideSelectedOptions,
-    options: options,
-    components: isMulti ? {
-      Option: Option
-    } : undefined,
-    styles: {
-      control: controlStyle,
-      input: inputStyles,
-      placeholder: placeholderStyles,
-      dropdownIndicator: dropdownIndicatorStyles,
-      indicatorSeparator: function indicatorSeparator() {
-        return {
-          display: "none"
-        };
+  }, React.createElement("div", {
+    className: "" + styleGlobal["box-right-body"]
+  }, React.createElement("span", {
+    style: {
+      fontSize: "24px",
+      fontWeight: "700"
+    }
+  }, "As a teacher, your time and energy are too valuable to waste"), React.createElement("p", {
+    className: " fw-normal ",
+    style: {
+      marginTop: "12px",
+      marginBottom: "24px",
+      color: "#03191F"
+    }
+  }, "So we\u2019re building a curriculum hub and and workspace that puts everything you need to plan and prep within reach."), React.createElement("ul", null, itemLogin.map(function (item, it) {
+    return React.createElement("li", {
+      key: it,
+      className: "mb-2 ",
+      style: {
+        color: "#212126"
+      }
+    }, item);
+  })), React.createElement("div", {
+    className: "" + styleGlobal["box-right-footer"]
+  }, React.createElement("img", {
+    className: "img-fluid",
+    alt: "",
+    src: "/images/image_login.png",
+    style: {
+      width: "15vw"
+    }
+  }), React.createElement("div", null, React.createElement("p", null, "As one of our earliest users,", React.createElement("br", null), "you are a vital part of this process"), React.createElement("div", null, React.createElement("span", {
+    className: "d-block"
+  }, "Thank you!"), React.createElement("img", {
+    style: {
+      marginTop: "-15px"
+    },
+    alt: "",
+    src: "/images/icons/Vector 22.png"
+  }))))))), role === "LandingPage" && React.createElement(Col, {
+    sm: 12,
+    lg: 5,
+    className: "d-none d-lg-block " + styleGlobal["pr-30"]
+  }, React.createElement("div", {
+    className: "" + styleGlobal["box-right"],
+    style: {
+      backgroundImage: "url('/images/bg_login.png')"
+    }
+  }, React.createElement("div", {
+    className: "" + styleGlobal["box-right-body"]
+  }, React.createElement("span", {
+    style: {
+      fontSize: "24px",
+      fontWeight: "700"
+    }
+  }, "Get ready to manage your realm!"), React.createElement("p", {
+    className: " fw-normal ",
+    style: {
+      marginTop: "12px",
+      marginBottom: "24px",
+      color: "#03191F"
+    }
+  }, "So we\u2019re building a curriculum hub and and workspace that puts everything you need to plan and prep within reach."), React.createElement("ul", null, itemLogin.map(function (item, it) {
+    return React.createElement("li", {
+      key: it,
+      className: "mb-2 ",
+      style: {
+        color: "#212126"
+      }
+    }, item);
+  })), React.createElement("div", {
+    className: "" + styleGlobal["box-right-footer"]
+  }, React.createElement("img", {
+    className: "img-fluid",
+    alt: "",
+    src: "/images/image_login.png",
+    style: {
+      width: "15vw"
+    }
+  }), React.createElement("div", null, React.createElement("p", null, "As one of our earliest users,", React.createElement("br", null), "you are a vital part of this process"), React.createElement("div", null, React.createElement("span", {
+    className: "d-block"
+  }, "Thank you!"), React.createElement("img", {
+    style: {
+      marginTop: "-15px"
+    },
+    alt: "",
+    src: "/images/icons/Vector 22.png"
+  })))))))), React.createElement(CoreModal, {
+    open: isOTPModalOpen,
+    onClose: function onClose() {
+      setIsOTPModalOpen(false);
+      setResendCooldown(0);
+      if (resendTimer) {
+        clearInterval(resendTimer);
+      }
+    },
+    title: "Enter OTP Code",
+    footer: React.createElement(React.Fragment, null, React.createElement(CoreButton, {
+      onClick: function onClick() {
+        setIsOTPModalOpen(false);
+        setResendCooldown(0);
+        if (resendTimer) {
+          clearInterval(resendTimer);
+        }
       },
-      indicatorsContainer: indicatorsContainerStyles,
-      valueContainer: valueContainerStyles,
-      singleValue: singleValueStyles,
-      option: optionStyles,
-      multiValue: multiValueStyles,
-      multiValueRemove: multiValueRemoveStyles,
-      multiValueLabel: multiValueLabelStyles
+      type: "text"
+    }, "Cancel"), React.createElement(CoreButton, {
+      type: "primary",
+      htmlType: "submit",
+      onClick: function onClick() {
+        if (!otpCode.trim()) {
+          alert("Please enter the OTP code");
+          return;
+        }
+        loginWithEmailCode(role);
+        setIsOTPModalOpen(false);
+        setResendCooldown(0);
+        if (resendTimer) {
+          clearInterval(resendTimer);
+        }
+      }
+    }, "Login"))
+  }, React.createElement("div", {
+    className: "mx-auto",
+    style: {
+      maxWidth: 400,
+      width: 400
     }
-  }), error && React.createElement(CoreError, {
-    message: errorMessage
-  }));
+  }, React.createElement("p", {
+    className: "text-sm text-muted mb-2"
+  }, "A one-time verification code has just been sent to your registered email. Please enter it below."), React.createElement("div", {
+    className: "" + styleGlobal["box-input"]
+  }, React.createElement(CoreInput, {
+    name: "otpCode",
+    value: code,
+    onChange: function onChange(event) {
+      setCode(event.target.value);
+      setOtpCode(event.target.value);
+    },
+    placeholder: "Code OTP"
+  }), React.createElement("p", {
+    className: "mt-1 text-muted"
+  }, "Your code will expire: ", React.createElement("span", {
+    className: "text-danger"
+  }, formatTime()))), React.createElement("p", {
+    className: "mt-3 text-muted mb-0"
+  }, "Didn't receive the code?", " ", resendCooldown > 0 ? React.createElement("span", {
+    className: "text-muted"
+  }, "Resend available in ", formatResendTime(resendCooldown)) : React.createElement("span", {
+    className: "text-primary cursor-pointer",
+    style: {
+      cursor: "pointer"
+    },
+    onClick: handleResend
+  }, "Click here to resend"), " ", "or check your spam inbox."))));
 };
 
-var styles$4 = {"core-checkbox":"_3HY4f"};
+// A type of promise-like that resolves synchronously and supports only one observer
 
-var CoreInput$1 = function CoreInput(props) {
-  var name = props.name,
-    checked = props.checked,
-    _onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    label = props.label;
-  return React.createElement("div", {
-    className: "" + styles$4["core-checkbox"]
-  }, React.createElement(FormGroup, {
-    check: true,
-    inline: true
-  }, React.createElement(Input, {
-    id: "core-checkbox-" + name,
-    type: "checkbox",
-    name: name,
-    checked: checked,
-    onChange: function onChange(e) {
-      return _onChange === null || _onChange === void 0 ? void 0 : _onChange(name, e.target.checked);
-    },
-    disabled: disabled
-  }), React.createElement(Label, {
-    htmlFor: "core-checkbox-" + name,
-    check: true
-  }, label)));
-};
+const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator"))) : "@@iterator";
 
-var styles$5 = {"core-radio":"_kvUpe","form-check":"_3ToPe"};
+const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator"))) : "@@asyncIterator";
 
-var CoreRadio = function CoreRadio(props) {
-  var name = props.name,
-    value = props.value,
-    options = props.options,
-    onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled;
+// Asynchronously call a function and send errors to recovery continuation
+function _catch(body, recover) {
+	try {
+		var result = body();
+	} catch(e) {
+		return recover(e);
+	}
+	if (result && result.then) {
+		return result.then(void 0, recover);
+	}
+	return result;
+}
+
+var defaultInfo = {
+  email: "",
+  password: "",
+  captcha: "",
+  rememberMe: false
+};
+var minutes = 15;
+var useLogin = function useLogin(onNavigate, trackEvent) {
+  var _useState = useState(false),
+    openLogin = _useState[0],
+    setOpenLogin = _useState[1];
+  var _useState2 = useState(),
+    infoUser = _useState2[0],
+    setInfoUser = _useState2[1];
+  var dispatch = useDispatch();
+  var toggle = useCallback(function () {
+    setOpenLogin(!openLogin);
+  }, [openLogin]);
+  var _useState3 = useState(""),
+    email = _useState3[0],
+    setEmail = _useState3[1];
+  var _useState4 = useState(""),
+    code = _useState4[0],
+    setCode = _useState4[1];
+  var _useState5 = useState(false),
+    isScreenCode = _useState5[0],
+    setIsScreenCode = _useState5[1];
+  var _useState6 = useState(minutes * 60),
+    timeLeft = _useState6[0],
+    setTimeLeft = _useState6[1];
+  var loginWithEmail = function loginWithEmail(role) {
+    try {
+      var _temp2 = function _temp2() {
+        dispatch(setLoading(false));
+      };
+      dispatch(setLoading(true));
+      var _temp = _catch(function () {
+        var body = {
+          email: email,
+          role: role
+        };
+        return Promise.resolve(apiSendEmailCode(body)).then(function (res) {
+          var data = res.data;
+          if (data.status == 1) {
+            if (data.data.token != null) {
+              var tokenJWT = data.data.token;
+              localStorage.setItem(ACCESS_TOKEN, tokenJWT);
+              trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
+                eventName: AmplitudeEvent.LOGIN,
+                eventProperties: {
+                  email: email,
+                  login_method: 'email',
+                  timestamp: new Date().toISOString()
+                }
+              });
+              onNavigate("/dashboard");
+            } else {
+              setIsScreenCode(true);
+            }
+          } else {
+            dispatch(setLoading(false));
+            alert("Please contact admin.");
+          }
+        });
+      }, function (e) {
+        toast.error("An error occurred while sending the code. Please try again later.");
+        console.log(e);
+      });
+      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  var loginWithEmailCode = function loginWithEmailCode(role) {
+    try {
+      var _temp4 = function _temp4() {
+        dispatch(setLoading(false));
+      };
+      dispatch(setLoading(true));
+      var _temp3 = _catch(function () {
+        return Promise.resolve(apiCheckEmailCode({
+          email: email,
+          code: code,
+          role: role
+        })).then(function (res) {
+          var data = res.data;
+          if (data.status == 1) {
+            localStorage.clear();
+            var tokenJWT = data.data.token;
+            localStorage.setItem(ACCESS_TOKEN, tokenJWT);
+            trackEvent === null || trackEvent === void 0 ? void 0 : trackEvent({
+              eventName: AmplitudeEvent.LOGIN,
+              eventProperties: {
+                email: email,
+                login_method: 'email',
+                timestamp: new Date().toISOString()
+              }
+            });
+            onNavigate("/dashboard");
+          } else {
+            dispatch(setLoading(false));
+            alert("The code is not correct. Please check again.");
+          }
+        });
+      }, function (e) {
+        console.log(e);
+      });
+      return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  var formatTime = function formatTime() {
+    var m = Math.floor(timeLeft / 60);
+    var s = timeLeft % 60;
+    return m.toString().padStart(2, '0') + ":" + s.toString().padStart(2, '0');
+  };
+  useEffect(function () {
+    if (isScreenCode) {
+      var timer = setInterval(function () {
+        setTimeLeft(function (prev) {
+          if (prev <= 1) {
+            clearInterval(timer);
+            return 0;
+          }
+          return prev - 1;
+        });
+      }, 1000);
+      return function () {
+        return clearInterval(timer);
+      };
+    }
+    return;
+  }, [isScreenCode]);
+  return {
+    defaultInfo: defaultInfo,
+    openLogin: openLogin,
+    toggle: toggle,
+    email: email,
+    setEmail: setEmail,
+    loginWithEmail: loginWithEmail,
+    infoUser: infoUser,
+    setInfoUser: setInfoUser,
+    code: code,
+    setCode: setCode,
+    isScreenCode: isScreenCode,
+    formatTime: formatTime,
+    loginWithEmailCode: loginWithEmailCode
+  };
+};
+
+var Login = function Login(props) {
+  var onNavigate = props.onNavigate,
+    role = props.role,
+    hiddenSignup = props.hiddenSignup,
+    trackEvent = props.trackEvent;
+  var _useLogin = useLogin(onNavigate, trackEvent),
+    defaultInfo = _useLogin.defaultInfo,
+    email = _useLogin.email,
+    setEmail = _useLogin.setEmail,
+    loginWithEmail = _useLogin.loginWithEmail,
+    code = _useLogin.code,
+    setCode = _useLogin.setCode,
+    isScreenCode = _useLogin.isScreenCode,
+    formatTime = _useLogin.formatTime,
+    loginWithEmailCode = _useLogin.loginWithEmailCode;
   return React.createElement("div", {
-    className: "" + styles$5["core-radio"]
-  }, React.createElement(FormGroup, {
-    check: true
-  }, options.map(function (i) {
-    return React.createElement("div", {
-      key: i.value
-    }, React.createElement(Input, {
-      id: "core-radio-" + i.value,
-      type: "radio",
-      checked: value === i.value,
-      onClick: function onClick() {
-        onChange(name, i.value);
-      },
-      onChange: function onChange() {
-        return;
-      },
-      disabled: disabled || i.disabled
-    }), React.createElement(Label, {
-      htmlFor: "core-radio-" + i.value
-    }, i.label));
-  })));
+    className: styleGlobal["signup_wrap"] + " container-fluid font-family-lato"
+  }, React.createElement(BlockLogin, {
+    defaultInfo: defaultInfo,
+    email: email,
+    hiddenSignup: hiddenSignup,
+    setEmail: setEmail,
+    loginWithEmail: loginWithEmail,
+    code: code,
+    setCode: setCode,
+    formatTime: formatTime,
+    isScreenCode: isScreenCode,
+    onNavigate: onNavigate,
+    loginWithEmailCode: loginWithEmailCode,
+    role: role,
+    trackEvent: trackEvent
+  }));
 };
 
-var styles$6 = {"core-modal-header":"_2y5ln"};
+// src/utils/formatProdErrorMessage.ts
+function formatProdErrorMessage(code) {
+  return `Minified Redux error #${code}; visit https://redux.js.org/Errors?code=${code} for the full message or use the non-minified dev environment for full errors. `;
+}
 
-var CoreModal = function CoreModal(props) {
-  var open = props.open,
-    onClose = props.onClose,
-    children = props.children,
-    title = props.title,
-    footer = props.footer,
-    handleSubmit = props.handleSubmit,
-    onSubmit = props.onSubmit,
-    _props$bodyPadding = props.bodyPadding,
-    bodyPadding = _props$bodyPadding === void 0 ? "24px" : _props$bodyPadding,
-    className = props.className;
-  return React.createElement(Modal, {
-    isOpen: open,
-    toggle: onClose,
-    centered: true,
-    modalClassName: className
-  }, React.createElement("form", {
-    onSubmit: onSubmit ? handleSubmit(onSubmit) : undefined,
-    className: "" + styles$6["core-modal-container"]
-  }, React.createElement(ModalHeader, {
-    toggle: onClose,
-    className: styles$6["core-modal-header"]
-  }, title), React.createElement(ModalBody, {
-    style: {
-      padding: bodyPadding
-    }
-  }, children), footer && React.createElement(ModalFooter, null, footer)));
+// src/utils/actionTypes.ts
+var randomString = () => Math.random().toString(36).substring(7).split("").join(".");
+var ActionTypes = {
+  INIT: `@@redux/INIT${/* @__PURE__ */ randomString()}`,
+  REPLACE: `@@redux/REPLACE${/* @__PURE__ */ randomString()}`,
+  PROBE_UNKNOWN_ACTION: () => `@@redux/PROBE_UNKNOWN_ACTION${randomString()}`
 };
+var actionTypes_default = ActionTypes;
 
-var styles$7 = {"core-range":"_1dzD7"};
+// src/utils/isPlainObject.ts
+function isPlainObject(obj) {
+  if (typeof obj !== "object" || obj === null)
+    return false;
+  let proto = obj;
+  while (Object.getPrototypeOf(proto) !== null) {
+    proto = Object.getPrototypeOf(proto);
+  }
+  return Object.getPrototypeOf(obj) === proto || Object.getPrototypeOf(obj) === null;
+}
 
-var CoreRange = function CoreRange(props) {
-  var name = props.name,
-    value = props.value,
-    _onChange = props.onChange,
-    label = props.label,
-    width = props.width,
-    min = props.min,
-    max = props.max,
-    step = props.step;
-  return React.createElement("div", {
-    className: "" + styles$7["core-range"],
-    style: {
-      width: width != null ? width : "100%"
+// src/utils/kindOf.ts
+function miniKindOf(val) {
+  if (val === void 0)
+    return "undefined";
+  if (val === null)
+    return "null";
+  const type = typeof val;
+  switch (type) {
+    case "boolean":
+    case "string":
+    case "number":
+    case "symbol":
+    case "function": {
+      return type;
     }
-  }, label && React.createElement("label", null, label), React.createElement("input", {
-    type: "range",
-    name: name,
-    value: value,
-    onChange: function onChange(e) {
-      return _onChange(name, +e.target.value);
-    },
-    min: min,
-    max: max,
-    step: step
-  }));
+  }
+  if (Array.isArray(val))
+    return "array";
+  if (isDate(val))
+    return "date";
+  if (isError(val))
+    return "error";
+  const constructorName = ctorName(val);
+  switch (constructorName) {
+    case "Symbol":
+    case "Promise":
+    case "WeakMap":
+    case "WeakSet":
+    case "Map":
+    case "Set":
+      return constructorName;
+  }
+  return Object.prototype.toString.call(val).slice(8, -1).toLowerCase().replace(/\s/g, "");
+}
+function ctorName(val) {
+  return typeof val.constructor === "function" ? val.constructor.name : null;
+}
+function isError(val) {
+  return val instanceof Error || typeof val.message === "string" && val.constructor && typeof val.constructor.stackTraceLimit === "number";
+}
+function isDate(val) {
+  if (val instanceof Date)
+    return true;
+  return typeof val.toDateString === "function" && typeof val.getDate === "function" && typeof val.setDate === "function";
+}
+function kindOf(val) {
+  let typeOfVal = typeof val;
+  if (process.env.NODE_ENV !== "production") {
+    typeOfVal = miniKindOf(val);
+  }
+  return typeOfVal;
+}
+
+// src/utils/warning.ts
+function warning(message) {
+  if (typeof console !== "undefined" && typeof console.error === "function") {
+    console.error(message);
+  }
+  try {
+    throw new Error(message);
+  } catch (e) {
+  }
+}
+
+// src/combineReducers.ts
+function getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) {
+  const reducerKeys = Object.keys(reducers);
+  const argumentName = action && action.type === actionTypes_default.INIT ? "preloadedState argument passed to createStore" : "previous state received by the reducer";
+  if (reducerKeys.length === 0) {
+    return "Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.";
+  }
+  if (!isPlainObject(inputState)) {
+    return `The ${argumentName} has unexpected type of "${kindOf(inputState)}". Expected argument to be an object with the following keys: "${reducerKeys.join('", "')}"`;
+  }
+  const unexpectedKeys = Object.keys(inputState).filter((key) => !reducers.hasOwnProperty(key) && !unexpectedKeyCache[key]);
+  unexpectedKeys.forEach((key) => {
+    unexpectedKeyCache[key] = true;
+  });
+  if (action && action.type === actionTypes_default.REPLACE)
+    return;
+  if (unexpectedKeys.length > 0) {
+    return `Unexpected ${unexpectedKeys.length > 1 ? "keys" : "key"} "${unexpectedKeys.join('", "')}" found in ${argumentName}. Expected to find one of the known reducer keys instead: "${reducerKeys.join('", "')}". Unexpected keys will be ignored.`;
+  }
+}
+function assertReducerShape(reducers) {
+  Object.keys(reducers).forEach((key) => {
+    const reducer = reducers[key];
+    const initialState = reducer(void 0, {
+      type: actionTypes_default.INIT
+    });
+    if (typeof initialState === "undefined") {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(12) : `The slice reducer for key "${key}" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.`);
+    }
+    if (typeof reducer(void 0, {
+      type: actionTypes_default.PROBE_UNKNOWN_ACTION()
+    }) === "undefined") {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(13) : `The slice reducer for key "${key}" returned undefined when probed with a random type. Don't try to handle '${actionTypes_default.INIT}' or other actions in "redux/*" namespace. They are considered private. Instead, you must return the current state for any unknown actions, unless it is undefined, in which case you must return the initial state, regardless of the action type. The initial state may not be undefined, but can be null.`);
+    }
+  });
+}
+function combineReducers(reducers) {
+  const reducerKeys = Object.keys(reducers);
+  const finalReducers = {};
+  for (let i = 0; i < reducerKeys.length; i++) {
+    const key = reducerKeys[i];
+    if (process.env.NODE_ENV !== "production") {
+      if (typeof reducers[key] === "undefined") {
+        warning(`No reducer provided for key "${key}"`);
+      }
+    }
+    if (typeof reducers[key] === "function") {
+      finalReducers[key] = reducers[key];
+    }
+  }
+  const finalReducerKeys = Object.keys(finalReducers);
+  let unexpectedKeyCache;
+  if (process.env.NODE_ENV !== "production") {
+    unexpectedKeyCache = {};
+  }
+  let shapeAssertionError;
+  try {
+    assertReducerShape(finalReducers);
+  } catch (e) {
+    shapeAssertionError = e;
+  }
+  return function combination(state = {}, action) {
+    if (shapeAssertionError) {
+      throw shapeAssertionError;
+    }
+    if (process.env.NODE_ENV !== "production") {
+      const warningMessage = getUnexpectedStateShapeWarningMessage(state, finalReducers, action, unexpectedKeyCache);
+      if (warningMessage) {
+        warning(warningMessage);
+      }
+    }
+    let hasChanged = false;
+    const nextState = {};
+    for (let i = 0; i < finalReducerKeys.length; i++) {
+      const key = finalReducerKeys[i];
+      const reducer = finalReducers[key];
+      const previousStateForKey = state[key];
+      const nextStateForKey = reducer(previousStateForKey, action);
+      if (typeof nextStateForKey === "undefined") {
+        const actionType = action && action.type;
+        throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(14) : `When called with an action of type ${actionType ? `"${String(actionType)}"` : "(unknown type)"}, the slice reducer for key "${key}" returned undefined. To ignore an action, you must explicitly return the previous state. If you want this reducer to hold no value, you can return null instead of undefined.`);
+      }
+      nextState[key] = nextStateForKey;
+      hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
+    }
+    hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;
+    return hasChanged ? nextState : state;
+  };
+}
+//# sourceMappingURL=redux.mjs.map
+
+var initialState = {
+  isLoading: false,
+  isLoadingPage: false,
+  alert: {
+    type: "",
+    message: ""
+  },
+  user: null,
+  academy: null,
+  menuCollapse: false,
+  isRefetchSidebar: false
 };
+var commonReducer = createReducer(initialState, function (builder) {
+  builder.addCase(setLoading, function (state, action) {
+    state.isLoading = action.payload;
+  }).addCase(setLoadingPage, function (state, action) {
+    state.isLoadingPage = action.payload;
+  }).addCase(setAlert, function (state, action) {
+    state.alert = action.payload;
+  }).addCase(setUser, function (state, action) {
+    state.user = action.payload;
+  }).addCase(setLanguage, function (state, action) {
+    state.language = action.payload;
+  }).addCase(reset, function (_state, _action) {
+    return initialState;
+  }).addCase(setMenuCollapse, function (state, action) {
+    state.menuCollapse = action.payload;
+  }).addCase(setIsRefetchSidebar, function (state) {
+    state.isRefetchSidebar = !state.isRefetchSidebar;
+  }).addCase(setTenant, function (state, action) {
+    state.user.currentTenantId = action.payload;
+  }).addCase(setAddTenant, function (state, action) {
+    state.user.tenantInfo = action.payload;
+  }).addCase(setTeam, function (state, action) {
+    state.user.currentTeamId = action.payload;
+  });
+});
 
-var styles$8 = {"editor":"_3TUh3","label":"_15n2K","optional":"_1fHZB","icon":"_38AfS","error":"_DaofN","no-border":"_2JOcF","small-height":"_1EXev"};
+var rootReducer = combineReducers({
+  common: commonReducer
+});
 
-var Search = function Search(props) {
-  var _props$size = props.size,
-    size = _props$size === void 0 ? 16 : _props$size,
-    _props$color = props.color,
-    color = _props$color === void 0 ? "#A6A6AD" : _props$color;
-  return React.createElement("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 16 16",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M9.40376 9.40352C9.63808 9.1692 10.018 9.1692 10.2523 9.40352L13.4243 12.5755C13.6586 12.8098 13.6586 13.1897 13.4243 13.424C13.19 13.6584 12.8101 13.6584 12.5758 13.424L9.40376 10.252C9.16945 10.0177 9.16945 9.63783 9.40376 9.40352Z",
-    fill: color
-  }), React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M6.9999 3.5999C5.12213 3.5999 3.5999 5.12213 3.5999 6.9999C3.5999 8.87767 5.12213 10.3999 6.9999 10.3999C8.87767 10.3999 10.3999 8.87767 10.3999 6.9999C10.3999 5.12213 8.87767 3.5999 6.9999 3.5999ZM2.3999 6.9999C2.3999 4.45939 4.45939 2.3999 6.9999 2.3999C9.54041 2.3999 11.5999 4.45939 11.5999 6.9999C11.5999 9.54041 9.54041 11.5999 6.9999 11.5999C4.45939 11.5999 2.3999 9.54041 2.3999 6.9999Z",
-    fill: color
-  }));
-};
+var store = configureStore({
+  reducer: rootReducer,
+  middleware: function middleware(getDefaultMiddleware) {
+    return getDefaultMiddleware({
+      serializableCheck: false
+    });
+  }
+});
 
-var Close = function Close(props) {
-  var _props$color = props.color,
-    color = _props$color === void 0 ? "#A6A6AD" : _props$color,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 16 : _props$size;
-  return React.createElement("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 16 16",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, React.createElement("g", {
-    clipPath: "url(#clip0_1060_48455)"
-  }, React.createElement("rect", {
-    x: "2.48438",
-    y: "3.61597",
-    width: "1.6",
-    height: "14",
-    rx: "0.8",
-    transform: "rotate(-45 2.48438 3.61597)",
-    fill: color
-  }), React.createElement("rect", {
-    x: "12.2427",
-    y: "2.34326",
-    width: "1.6",
-    height: "14",
-    rx: "0.8",
-    transform: "rotate(45 12.2427 2.34326)",
-    fill: color
-  })), React.createElement("defs", null, React.createElement("clipPath", {
-    id: "clip0_1060_48455"
-  }, React.createElement("rect", {
-    width: "16",
-    height: "16",
-    fill: "white"
-  }))));
-};
+var getAccessToken$1 = (function () {
+  try {
+    return localStorage.getItem(ACCESS_TOKEN);
+  } catch (err) {
+    return null;
+  }
+});
 
-var Info = function Info() {
-  return React.createElement("svg", {
-    width: "16",
-    height: "16",
-    viewBox: "0 0 12 12",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M6.0002 2.1002C3.84628 2.1002 2.1002 3.84628 2.1002 6.0002C2.1002 8.15411 3.84628 9.9002 6.0002 9.9002C8.15411 9.9002 9.9002 8.15411 9.9002 6.0002C9.9002 3.84628 8.15411 2.1002 6.0002 2.1002ZM1.2002 6.0002C1.2002 3.34923 3.34923 1.2002 6.0002 1.2002C8.65116 1.2002 10.8002 3.34923 10.8002 6.0002C10.8002 8.65116 8.65116 10.8002 6.0002 10.8002C3.34923 10.8002 1.2002 8.65116 1.2002 6.0002Z",
-    fill: "#A6A6AD"
-  }), React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M5.9998 5.1001C6.24833 5.1001 6.4498 5.30157 6.4498 5.5501V8.2915C6.4498 8.54003 6.24833 8.7415 5.9998 8.7415C5.75128 8.7415 5.5498 8.54003 5.5498 8.2915V5.5501C5.5498 5.30157 5.75128 5.1001 5.9998 5.1001Z",
-    fill: "#A6A6AD"
-  }), React.createElement("path", {
-    d: "M5.9999 4.6502C5.6687 4.6502 5.3999 4.3808 5.3999 4.0502C5.3999 3.7196 5.6687 3.4502 5.9999 3.4502C6.3311 3.4502 6.5999 3.7196 6.5999 4.0502C6.5999 4.3808 6.3311 4.6502 5.9999 4.6502Z",
-    fill: "#A6A6AD"
-  }));
-};
+var encodeParams$1 = (function (params) {
+  return Object.keys(params).filter(function (key) {
+    return params[key] || params[key] === 0 || params[key] === false;
+  }).map(function (key) {
+    if (Array.isArray(params[key])) {
+      return params[key].map(function (i) {
+        return encodeURIComponent(key) + "=" + encodeURIComponent(i);
+      }).join('&');
+    }
+    return encodeURIComponent(key) + "=" + encodeURIComponent(params[key]);
+  }).join('&');
+});
 
-var _excluded$1 = ["name", "value", "onChange", "placeholder", "error", "label", "isOptional", "tooltip", "noBorder", "smallHeight", "cols", "rows", "minHeight", "className", "onKeyDown", "onKeyFocus", "autoResize", "width", "onClick", "onBlur", "isDisabled"];
-var CoreTextArea = function CoreTextArea(props) {
-  var _props$name = props.name,
-    name = _props$name === void 0 ? "" : _props$name,
-    value = props.value,
-    _onChange = props.onChange,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? "Type here..." : _props$placeholder,
-    _props$error = props.error,
-    error = _props$error === void 0 ? false : _props$error,
-    label = props.label,
-    _props$isOptional = props.isOptional,
-    isOptional = _props$isOptional === void 0 ? false : _props$isOptional,
-    tooltip = props.tooltip,
-    _props$noBorder = props.noBorder,
-    noBorder = _props$noBorder === void 0 ? false : _props$noBorder,
-    _props$smallHeight = props.smallHeight,
-    smallHeight = _props$smallHeight === void 0 ? false : _props$smallHeight,
-    cols = props.cols,
-    rows = props.rows,
-    minHeight = props.minHeight,
-    className = props.className,
-    _onKeyDown = props.onKeyDown,
-    onKeyFocus = props.onKeyFocus,
-    autoResize = props.autoResize,
-    width = props.width,
-    onClick = props.onClick,
-    onBlur = props.onBlur,
-    isDisabled = props.isDisabled,
-    rest = _objectWithoutPropertiesLoose(props, _excluded$1);
-  var _useState = useState(false),
-    isOpenTooltip = _useState[0],
-    setIsOpenTooltip = _useState[1];
-  var toggleTooltip = function toggleTooltip() {
-    return setIsOpenTooltip(!isOpenTooltip);
-  };
-  var textareaRef = useRef(null);
-  useEffect(function () {
-    if (autoResize && textareaRef.current) {
-      var el = textareaRef.current;
-      requestAnimationFrame(function () {
-        el.style.height = "auto";
-        el.style.height = el.scrollHeight + "px";
-      });
+var api$1 = axios.create({
+  baseURL: BASE_URL,
+  timeout: 0,
+  headers: {
+    "Content-Type": "application/json"
+  },
+  paramsSerializer: function paramsSerializer(params) {
+    return encodeParams$1(params);
+  }
+});
+var apiUpload$1 = axios.create({
+  baseURL: BASE_URL,
+  timeout: 60000,
+  headers: {
+    "Content-Type": "multipart/form-data"
+  }
+});
+[api$1, apiUpload$1].forEach(function (i) {
+  return i.interceptors.request.use(function (config) {
+    var token = getAccessToken$1();
+    if (token) {
+      config.headers.Authorization = "Bearer " + token;
     }
-  }, [value, autoResize]);
-  return React.createElement("div", {
-    className: styles$8["editor"] + " " + (error ? styles$8["error"] : "") + " " + (noBorder ? styles$8["no-border"] : "") + " " + (smallHeight ? styles$8["small-height"] : ""),
-    style: {
-      width: width != null ? width : "100%"
+    return config;
+  }, function (error) {
+    return Promise.reject(error);
+  });
+});
+[api$1, apiUpload$1].forEach(function (i) {
+  return i.interceptors.response.use(function (response) {
+    return response;
+  }, function (error) {
+    if (error.response.status === 401) {
+      window.location.href = "/login";
     }
-  }, label && React.createElement("span", {
-    className: styles$8["label"]
-  }, React.createElement("div", {
-    className: styles$8["label-content"]
-  }, label), isOptional && React.createElement("div", {
-    className: styles$8["optional"]
-  }, "(optional)"), tooltip && React.createElement("div", {
-    id: name,
-    className: styles$8["icon"]
-  }, React.createElement(Info, null), React.createElement(Tooltip, {
-    target: name,
-    isOpen: isOpenTooltip,
-    toggle: toggleTooltip
-  }, tooltip))), React.createElement("textarea", Object.assign({
-    ref: textareaRef,
-    placeholder: placeholder,
-    style: {
-      whiteSpace: "pre-wrap",
-      width: "100%",
-      minHeight: minHeight ? minHeight : "123px",
-      resize: "none",
-      overflow: "hidden"
-    },
-    value: value,
-    cols: cols,
-    rows: rows,
-    onChange: function onChange(e) {
-      return _onChange(name, e.target.value);
-    },
-    onKeyDown: function onKeyDown(e) {
-      return _onKeyDown === null || _onKeyDown === void 0 ? void 0 : _onKeyDown(e);
-    },
-    onFocus: function onFocus(e) {
-      return onKeyFocus === null || onKeyFocus === void 0 ? void 0 : onKeyFocus(name, e.target.value);
-    },
-    className: className,
-    onClick: onClick,
-    onBlur: onBlur,
-    disabled: isDisabled
-  }, rest)));
+    if (error.response.status == 403) {
+      var hostname = window.location.hostname;
+      var parts = hostname.split('.');
+      var domain = parts.slice(-2).join('.');
+      localStorage.removeItem(ACCESS_TOKEN);
+      localStorage.removeItem(ORGANIZATION_TENANT);
+      localStorage.removeItem(ORGANIZATION_TEAM);
+      Cookies.remove('auth', {
+        path: '/',
+        domain: "." + domain
+      });
+      localStorage.removeItem("USER_EMAIL");
+      window.location.href = "/login";
+    }
+    return Promise.reject(error);
+  });
+});
+
+var AUTH_URL = BASE_URL + "/api/auth";
+var checkToken = function checkToken(token) {
+  return api$1.post(AUTH_URL + "/checktoken", {
+    token: token
+  });
 };
 
-var styles$9 = {"core-search":"_wyI1K","input":"_9XW-D","icon":"_2iDm7","clear":"_1nhXy"};
+var firstCheckToken = function firstCheckToken() {
+  return Promise.resolve(_catch(function () {
+    var token = getAccessToken$1();
+    return token ? Promise.resolve(checkToken(token)).then(function (tokenStatus) {
+      return tokenStatus.data ? true : false;
+    }) : false;
+  }, function () {
+    return false;
+  }));
+};
 
-var CoreSearch = function CoreSearch(props) {
-  var _props$name = props.name,
-    name = _props$name === void 0 ? "" : _props$name,
-    value = props.value,
-    _onChange = props.onChange,
-    width = props.width,
-    onPressEnter = props.onPressEnter;
-  var handleClear = function handleClear() {
-    _onChange(name, "");
-    onPressEnter && onPressEnter("");
-  };
-  return React.createElement("div", {
-    className: styles$9["core-search"],
-    style: {
-      width: width != null ? width : "100%"
-    },
-    tabIndex: 1
-  }, React.createElement("div", {
-    className: styles$9["icon"]
-  }, React.createElement(Search, null)), React.createElement("input", {
-    className: styles$9["input"],
-    value: value,
-    onChange: function onChange(e) {
-      return _onChange(name, e.target.value);
-    },
-    placeholder: "Search...",
-    onKeyDown: function onKeyDown(e) {
-      if (e.key === "Enter") {
-        onPressEnter && onPressEnter(value);
+var getImageUrl = function getImageUrl(imageUrl) {
+  try {
+    if (!!imageUrl) {
+      var imageTrimmed = imageUrl.trim();
+      if (imageTrimmed.startsWith('http://') || imageTrimmed.startsWith('https://')) {
+        return imageTrimmed;
       }
+      return BASE_URL + "/images/" + imageTrimmed;
     }
-  }), value.length ? React.createElement("div", {
-    className: styles$9["clear"],
-    onClick: handleClear
-  }, React.createElement(Close, null)) : null);
+    return "/images/avatar-default.png";
+  } catch (err) {
+    return "/images/avatar-default.png";
+  }
 };
 
-var styles$a = {"core-select-compact":"_3ql5D","label":"_3fPQC"};
+var NotFound = function NotFound() {
+  return React.createElement("div", {
+    className: "not-found"
+  }, React.createElement("div", {
+    className: "clearfix"
+  }, React.createElement("h1", {
+    className: "float-left display-3 mr-4"
+  }, "404"), React.createElement("div", {
+    className: "float-left"
+  }, React.createElement("h4", {
+    className: "pt-3"
+  }, "Oops! You are lost."), React.createElement("p", {
+    className: "text-muted mb-2"
+  }, "The page you are looking for was not found."), React.createElement("div", null))));
+};
 
-var Option$1 = function Option(props) {
-  return React.createElement("div", null, React.createElement(components.Option, Object.assign({}, props), React.createElement(CoreInput$1, {
-    checked: props.isSelected,
-    onChange: function onChange() {
-      return null;
-    },
-    name: "",
-    label: props.label
-  })));
+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 CoreSelectCompact = function CoreSelectCompact(props) {
-  var _props$name = props.name,
-    name = _props$name === void 0 ? "" : _props$name,
-    options = props.options,
-    value = props.value,
-    onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    label = props.label,
-    width = props.width,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? "Select" : _props$placeholder,
-    _props$isMulti = props.isMulti,
-    isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
-    _props$isShowDropdown = props.isShowDropdown,
-    isShowDropdown = _props$isShowDropdown === void 0 ? false : _props$isShowDropdown,
-    _props$error = props.error,
-    error = _props$error === void 0 ? false : _props$error,
-    _noOptionsMessage = props.noOptionsMessage;
-  var handleChange = function handleChange(value) {
-    var newValue = isMulti ? value === null || value === void 0 ? void 0 : value.map(function (item) {
-      return item.value;
-    }) : value === null || value === void 0 ? void 0 : value.value;
-    onChange(name, newValue);
-  };
-  var controlStyle = function controlStyle(base, state) {
-    var styles = _extends({}, base, {
-      fontSize: "14px",
-      fontWeight: "400",
-      padding: "0",
-      backgroundColor: state.isDisabled ? "transparent" : error ? COLORS.lightYellow : COLORS.white,
-      border: "none",
-      height: isMulti ? undefined : "26px",
-      minHeight: "26px",
-      boxShadow: "none",
-      cursor: "pointer",
-      "&:hover": {
-        backgroundColor: COLORS.lightBlueHover
-      },
-      "&>div": {
-        padding: "0 2px"
-      }
-    });
-    return styles;
-  };
-  var inputStyles = function inputStyles(base) {
-    var styles = _extends({}, base, {
-      margin: "0",
-      padding: "0",
-      color: "inherit",
-      position: "relative",
-      top: "-2px"
-    });
-    return styles;
-  };
-  var placeholderStyles = function placeholderStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.lightGray
-    });
-    return styles;
-  };
-  var dropdownIndicatorStyles = function dropdownIndicatorStyles(base) {
-    var styles = _extends({}, base, {
-      position: "relative",
-      padding: "2px 0"
-    });
-    return styles;
-  };
-  var indicatorsContainerStyles = function indicatorsContainerStyles(base) {
-    var styles = _extends({}, base, {
-      display: isShowDropdown && !isMulti ? "block" : "none"
-    });
-    return styles;
-  };
-  var valueContainerStyles = function valueContainerStyles(base) {
-    var styles = _extends({}, base, {
-      height: isMulti ? undefined : "26px",
-      position: "relative"
-    });
-    return styles;
-  };
-  var singleValueStyles = function singleValueStyles(base) {
-    var styles = _extends({}, base);
-    return styles;
-  };
-  var optionStyles = function optionStyles(base, state) {
-    var styles = _extends({}, base, {
-      padding: "8px",
-      borderRadius: "8px",
-      cursor: "pointer",
-      fontSize: "14px",
-      fontWeight: 400,
-      color: COLORS.blackText,
-      backgroundColor: state.isSelected ? COLORS.lightBlueHover : "transparent",
-      "&:hover": {
-        backgroundColor: COLORS.lightBlueHover
-      }
-    });
-    return styles;
-  };
-  var multiValueStyles = function multiValueStyles(base) {
-    var styles = _extends({}, base, {
-      backgroundColor: COLORS.lightBlue,
-      borderRadius: "4px",
-      padding: "0 4px",
-      display: "flex",
-      alignItems: "center",
-      fontSize: "13px",
-      color: COLORS.blackText
-    });
-    return styles;
-  };
-  var multiValueRemoveStyles = function multiValueRemoveStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.lightGray,
-      cursor: "pointer"
-    });
-    return styles;
+var Loading = function Loading() {
+  var isLoading = useSelector(function (state) {
+    return state.common.isLoading;
+  });
+  localStorage.setItem("LAST_TIME_REQUETST", moment().utc().format("YYYY-MM-DD HH:mm:ss"));
+  return isLoading ? React.createElement("div", {
+    style: loadingStyle
+  }, React.createElement("div", {
+    className: "spinner-border text-secondary",
+    role: "status"
+  }, React.createElement("span", {
+    className: "sr-only"
+  }))) : null;
+};
+
+var useGoogleSignOut = function useGoogleSignOut(props) {
+  var dispatch = useDispatch();
+  var onLogoutSuccess = props.onLogoutSuccess,
+    onFailure = props.onFailure;
+  var handleLogoutSuccess = function handleLogoutSuccess() {
+    onLogoutSuccess === null || onLogoutSuccess === void 0 ? void 0 : onLogoutSuccess();
   };
-  var multiValueLabelStyles = function multiValueLabelStyles(base) {
-    var styles = _extends({}, base, {
-      color: COLORS.blackText,
-      fontWeight: "400",
-      fontSize: "13px",
-      padding: 0
-    });
-    return styles;
+  var handleLogoutFailure = function handleLogoutFailure() {
+    onFailure === null || onFailure === void 0 ? void 0 : onFailure();
   };
-  return React.createElement("div", {
-    className: "" + styles$a["core-select-compact"],
-    style: {
-      width: width != null ? width : "100%"
-    }
-  }, label && React.createElement("div", {
-    className: styles$a["label"]
-  }, React.createElement("label", null, label), React.createElement(Info, null)), React.createElement(ReactSelect, {
-    name: name,
-    value: options.filter(function (i) {
-      return value && (isMulti ? value.includes(i.value) : i.value === value);
+  var _useGoogleLogout = useGoogleLogout({
+      clientId: GOOGLE_CLIENT_ID,
+      onLogoutSuccess: handleLogoutSuccess,
+      onFailure: handleLogoutFailure
     }),
-    onChange: handleChange,
-    placeholder: placeholder,
-    isDisabled: disabled,
-    isMulti: isMulti,
-    closeMenuOnSelect: !isMulti,
-    hideSelectedOptions: false,
-    options: options,
-    noOptionsMessage: function noOptionsMessage() {
-      return _noOptionsMessage ? _noOptionsMessage : "No options";
-    },
-    components: isMulti ? {
-      Option: Option$1
-    } : undefined,
-    styles: {
-      control: controlStyle,
-      input: inputStyles,
-      placeholder: placeholderStyles,
-      dropdownIndicator: dropdownIndicatorStyles,
-      indicatorSeparator: function indicatorSeparator() {
-        return {
-          display: "none"
-        };
-      },
-      indicatorsContainer: indicatorsContainerStyles,
-      valueContainer: valueContainerStyles,
-      singleValue: singleValueStyles,
-      option: optionStyles,
-      multiValue: multiValueStyles,
-      multiValueRemove: multiValueRemoveStyles,
-      multiValueLabel: multiValueLabelStyles
+    signOut = _useGoogleLogout.signOut,
+    loaded = _useGoogleLogout.loaded;
+  var handleSignOut = function handleSignOut() {
+    localStorage.clear();
+    try {
+      signOut();
+    } catch (error) {
+      console.log({
+        error: error
+      });
     }
-  }));
+    dispatch(reset());
+    window.location.href = "/login";
+  };
+  return {
+    handleSignOut: handleSignOut,
+    loaded: loaded
+  };
 };
 
-var styles$b = {"core-input-compact":"_1qmXW","label":"_1argp","icon":"_3DPRG"};
-
-var _excluded$2 = ["name", "value", "onChange", "disabled", "label", "width", "placeholder", "error", "tooltip", "onKeyDown"];
-var CoreInputCompact = function CoreInputCompact(props) {
-  var _props$name = props.name,
-    name = _props$name === void 0 ? "" : _props$name,
-    value = props.value,
-    _onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    label = props.label,
-    width = props.width,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? "Type here" : _props$placeholder,
-    error = props.error,
-    tooltip = props.tooltip,
-    _onKeyDown = props.onKeyDown,
-    rest = _objectWithoutPropertiesLoose(props, _excluded$2);
-  var _useState = useState(false),
-    isOpenTooltip = _useState[0],
-    setIsOpenTooltip = _useState[1];
-  var toggleTooltip = function toggleTooltip() {
-    return setIsOpenTooltip(!isOpenTooltip);
+var LayoutContext = function LayoutContext(_ref) {
+  var children = _ref.children,
+    onNavigate = _ref.onNavigate;
+  var _useGoogleSignOut = useGoogleSignOut({
+      onNavigate: onNavigate
+    }),
+    handleSignOut = _useGoogleSignOut.handleSignOut;
+  var resetAuth = function resetAuth() {
+    handleSignOut();
   };
-  return React.createElement("div", {
-    className: "" + styles$b["core-input-compact"],
-    style: {
-      width: width != null ? width : "100%"
+  var loadInfo = function loadInfo() {
+    try {
+      var token = firstCheckToken();
+      !token && resetAuth();
+      return Promise.resolve();
+    } catch (e) {
+      return Promise.reject(e);
     }
-  }, label && React.createElement("div", {
-    className: styles$b["label"]
-  }, React.createElement("label", null, label), tooltip ? React.createElement("div", {
-    id: name,
-    className: styles$b["icon"]
-  }, React.createElement(Info, null)) : null), React.createElement("input", Object.assign({
-    style: {
-      backgroundColor: error ? COLORS.lightYellow : "transparent"
+  };
+  useEffect(function () {
+    loadInfo();
+  }, []);
+  return React.createElement(Fragment, null, children);
+};
+
+var ConfirmDialog = function ConfirmDialog(_ref) {
+  var open = _ref.open,
+    text = _ref.text,
+    _ref$cancelText = _ref.cancelText,
+    cancelText = _ref$cancelText === void 0 ? "No" : _ref$cancelText,
+    _ref$okText = _ref.okText,
+    okText = _ref$okText === void 0 ? "Yes" : _ref$okText,
+    isDelete = _ref.isDelete,
+    toggle = _ref.toggle,
+    onClose = _ref.onClose,
+    onConfirm = _ref.onConfirm;
+  return React.createElement(Modal, {
+    isOpen: open,
+    toggle: !!onClose ? onClose : toggle,
+    centered: true
+  }, React.createElement(ModalHeader, {
+    toggle: toggle
+  }, "Confirmation"), React.createElement(ModalBody, null, text), React.createElement(ModalFooter, null, React.createElement(Button, {
+    color: "secondary",
+    onClick: toggle
+  }, cancelText), React.createElement(Button, {
+    color: isDelete ? "danger" : "primary",
+    onClick: onConfirm
+  }, okText)));
+};
+
+var CommonDialog = function CommonDialog(_ref) {
+  var open = _ref.open,
+    children = _ref.children,
+    centered = _ref.centered,
+    title = _ref.title,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "xs" : _ref$size,
+    _ref$isShowHeader = _ref.isShowHeader,
+    isShowHeader = _ref$isShowHeader === void 0 ? true : _ref$isShowHeader,
+    onClose = _ref.onClose,
+    backdrop = _ref.backdrop;
+  return React.createElement(Modal, {
+    backdrop: backdrop,
+    isOpen: open,
+    toggle: onClose,
+    centered: centered,
+    size: size,
+    zIndex: 1102
+  }, isShowHeader ? React.createElement(ModalHeader, {
+    toggle: onClose
+  }, title) : React.createElement(Box, {
+    className: "p-3"
+  }, React.createElement(Typography, {
+    className: "fs-5 text-center fw-bold"
+  }, title)), children);
+};
+
+var AuthenticationMessage;
+(function (AuthenticationMessage) {
+  AuthenticationMessage["NotAllowedToRegister"] = "NotAllowedToRegister";
+  AuthenticationMessage["InvalidGoogleToken"] = "InvalidGoogleToken";
+})(AuthenticationMessage || (AuthenticationMessage = {}));
+var Role;
+(function (Role) {
+  Role["Student"] = "Student";
+  Role["Teacher"] = "Teacher";
+  Role["Admin"] = "Admin";
+})(Role || (Role = {}));
+
+var CustomPagination = function CustomPagination(_ref) {
+  var currentPage = _ref.currentPage,
+    totalPage = _ref.totalPage,
+    onChangePage = _ref.onChangePage;
+  return React.createElement(Pagination, {
+    className: "w-fit"
+  }, React.createElement(PaginationItem, {
+    disabled: currentPage <= 1
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(currentPage - 1);
     },
-    name: name,
-    value: value,
-    onChange: function onChange(e) {
-      return _onChange(name, e.target.value);
+    previous: true,
+    href: "#"
+  })), React.createElement(PaginationItem, {
+    active: 1 === currentPage,
+    key: 1
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(1);
+    },
+    href: "#"
+  }, 1)), totalPage > 2 && React.createElement(PaginationItem, {
+    active: 2 === currentPage,
+    key: 1
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(2);
+    },
+    href: "#"
+  }, 2)), currentPage > 4 && currentPage !== totalPage && totalPage !== 5 && React.createElement(PaginationItem, {
+    disabled: true,
+    key: "first"
+  }, React.createElement(PaginationLink, {
+    href: "#"
+  }, "...")), (currentPage === 1 || currentPage === totalPage) && totalPage === 5 && React.createElement(PaginationItem, {
+    key: 3
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(3);
+    },
+    href: "#"
+  }, "3")), [currentPage - 1, currentPage, currentPage + 1].filter(function (page) {
+    return page > 2 && page < totalPage - 1;
+  }).map(function (page) {
+    return React.createElement(PaginationItem, {
+      active: page === currentPage,
+      key: page
+    }, React.createElement(PaginationLink, {
+      onClick: function onClick(e) {
+        e.preventDefault();
+        onChangePage(page);
+      },
+      href: "#"
+    }, page));
+  }), totalPage - currentPage > 4 && React.createElement(PaginationItem, {
+    disabled: true,
+    key: "last"
+  }, React.createElement(PaginationLink, {
+    href: "#"
+  }, "...")), totalPage > 3 && React.createElement(PaginationItem, {
+    active: totalPage - 1 === currentPage,
+    key: totalPage - 1
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(totalPage - 1);
     },
-    disabled: disabled,
-    placeholder: placeholder,
-    onKeyDown: function onKeyDown(e) {
-      _onKeyDown && _onKeyDown(e);
-    }
-  }, rest)), tooltip && React.createElement(Tooltip, {
-    target: name,
-    isOpen: isOpenTooltip,
-    toggle: toggleTooltip
-  }, tooltip));
-};
-
-var styles$c = {"core-label-input":"_2YqZu","size-h1":"_23-uu","size-h2":"_16lQL"};
-
-var CoreTitleInput = function CoreTitleInput(props) {
-  var _props$name = props.name,
-    name = _props$name === void 0 ? "" : _props$name,
-    value = props.value,
-    _onChange = props.onChange,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    width = props.width,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? "Type here" : _props$placeholder,
-    error = props.error,
-    _props$size = props.size,
-    size = _props$size === void 0 ? "h1" : _props$size,
-    maxLength = props.maxLength;
-  return React.createElement("div", {
-    className: "" + styles$c["core-label-input"],
-    style: {
-      width: width != null ? width : "100%"
-    }
-  }, React.createElement("input", {
-    className: "" + styles$c["size-" + size],
-    style: {
-      backgroundColor: error ? COLORS.lightYellow : "transparent"
+    href: "#"
+  }, totalPage - 1)), totalPage > 1 && React.createElement(PaginationItem, {
+    active: totalPage === currentPage,
+    key: totalPage
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(totalPage);
     },
-    name: name,
-    value: value,
-    onChange: function onChange(e) {
-      return _onChange(name, e.target.value);
+    href: "#"
+  }, totalPage)), React.createElement(PaginationItem, {
+    disabled: currentPage >= totalPage
+  }, React.createElement(PaginationLink, {
+    onClick: function onClick(e) {
+      e.preventDefault();
+      onChangePage(currentPage + 1);
     },
-    disabled: disabled,
-    placeholder: placeholder,
-    maxLength: maxLength
-  }));
+    next: true,
+    href: "#"
+  })));
 };
 
-var styles$d = {"core-tooltip":"_1Bmhs"};
-
-var CoreTooltip = function CoreTooltip(props) {
-  var id = props.id,
-    content = props.content,
-    children = props.children,
-    placement = props.placement,
-    isDelay = props.isDelay,
-    _props$timeDelay = props.timeDelay,
-    timeDelay = _props$timeDelay === void 0 ? 1500 : _props$timeDelay,
-    innerClassName = props.innerClassName;
-  var timeoutRef = useRef(null);
-  var _useState = useState(false),
-    isOpenTooltip = _useState[0],
-    setIsOpenTooltip = _useState[1];
-  var handleMouseEnter = function handleMouseEnter() {
-    if (isDelay) {
-      timeoutRef.current = setTimeout(function () {
-        setIsOpenTooltip(true);
-      }, timeDelay);
+var useAmplitude = function useAmplitude() {
+  var _useState = useState(null),
+    userId = _useState[0],
+    setUserIdState = _useState[1];
+  var _useState2 = useState(true),
+    isTabActive = _useState2[0],
+    setIsTabActive = _useState2[1];
+  var sessionStartTime = useRef(null);
+  var currentSessionStart = useRef(null);
+  var savedUserProperties = useRef({});
+  var hasTrackedInitialSession = useRef(false);
+  var setUserProperties = useCallback(function (properties) {
+    savedUserProperties.current = _extends({}, savedUserProperties.current, properties);
+    var identify$1 = new Identify();
+    Object.entries(properties).forEach(function (_ref) {
+      var key = _ref[0],
+        value = _ref[1];
+      identify$1.set(key, value);
+    });
+    identify(identify$1);
+  }, []);
+  var trackEvent = useCallback(function (_ref2) {
+    var eventName = _ref2.eventName,
+      eventProperties = _ref2.eventProperties;
+    track(eventName, _extends({}, savedUserProperties.current, eventProperties, {
+      timestamp: new Date().toISOString()
+    }));
+  }, []);
+  var setUserId$1 = useCallback(function (newUserId) {
+    var prevUserId = userId;
+    setUserIdState(newUserId);
+    if (newUserId) {
+      var prefixedUserId = "edusfere:" + newUserId;
+      setUserId(prefixedUserId);
+      if (prevUserId !== newUserId && !hasTrackedInitialSession.current) {
+        hasTrackedInitialSession.current = true;
+        sessionStartTime.current = new Date();
+        currentSessionStart.current = new Date();
+        trackEvent({
+          eventName: AmplitudeEvent.SESSION_START,
+          eventProperties: {
+            start_time: new Date().toISOString()
+          }
+        });
+      }
+    }
+  }, [userId, trackEvent]);
+  var reset = useCallback(function () {
+    reset$1();
+    setUserIdState(null);
+    sessionStartTime.current = null;
+    currentSessionStart.current = null;
+    savedUserProperties.current = {};
+    hasTrackedInitialSession.current = false;
+  }, []);
+  var trackTabActivity = useCallback(function (isActive) {
+    if (!userId) return;
+    var now = new Date();
+    if (isActive) {
+      currentSessionStart.current = now;
+      trackEvent({
+        eventName: AmplitudeEvent.SESSION_START,
+        eventProperties: {
+          start_time: now.toISOString()
+        }
+      });
     } else {
-      setIsOpenTooltip(true);
+      if (currentSessionStart.current) {
+        var sessionDuration = now.getTime() - currentSessionStart.current.getTime();
+        trackEvent({
+          eventName: AmplitudeEvent.SESSION_END,
+          eventProperties: {
+            session_duration_seconds: Math.round(sessionDuration / 1000),
+            start_time: currentSessionStart.current.toISOString(),
+            end_time: now.toISOString()
+          }
+        });
+        currentSessionStart.current = null;
+      }
     }
+  }, [userId, trackEvent]);
+  var trackPageUnload = useCallback(function () {
+    if (!userId || !currentSessionStart.current) return;
+    var now = new Date();
+    var sessionDuration = now.getTime() - currentSessionStart.current.getTime();
+    trackEvent({
+      eventName: AmplitudeEvent.SESSION_END,
+      eventProperties: {
+        session_duration_seconds: Math.round(sessionDuration / 1000),
+        start_time: currentSessionStart.current.toISOString(),
+        end_time: now.toISOString(),
+        end_reason: 'page_unload'
+      }
+    });
+  }, [userId, trackEvent]);
+  useEffect(function () {
+    var handleVisibilityChange = function handleVisibilityChange() {
+      var isVisible = !document.hidden;
+      setIsTabActive(isVisible);
+      trackTabActivity(isVisible);
+    };
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+    return function () {
+      return document.removeEventListener('visibilitychange', handleVisibilityChange);
+    };
+  }, [trackTabActivity]);
+  useEffect(function () {
+    var handleFocus = function handleFocus() {
+      setIsTabActive(true);
+      trackTabActivity(true);
+    };
+    var handleBlur = function handleBlur() {
+      setIsTabActive(false);
+      trackTabActivity(false);
+    };
+    window.addEventListener('focus', handleFocus);
+    window.addEventListener('blur', handleBlur);
+    return function () {
+      window.removeEventListener('focus', handleFocus);
+      window.removeEventListener('blur', handleBlur);
+    };
+  }, [trackTabActivity]);
+  useEffect(function () {
+    var handleBeforeUnload = function handleBeforeUnload() {
+      trackPageUnload();
+    };
+    window.addEventListener('beforeunload', handleBeforeUnload);
+    return function () {
+      return window.removeEventListener('beforeunload', handleBeforeUnload);
+    };
+  }, [trackPageUnload]);
+  return {
+    setUserId: setUserId$1,
+    setUserProperties: setUserProperties,
+    trackEvent: trackEvent,
+    reset: reset,
+    userId: userId,
+    isTabActive: isTabActive,
+    sessionStartTime: sessionStartTime.current,
+    currentSessionStart: currentSessionStart.current
   };
-  var handleMouseLeave = function handleMouseLeave() {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = null;
+};
+
+var initializeAmplitude = function initializeAmplitude(apiKey) {
+  init(apiKey, {
+    defaultTracking: {
+      pageViews: true,
+      sessions: true,
+      formInteractions: true
     }
-    setIsOpenTooltip(false);
-  };
-  return React.createElement("div", {
-    id: id,
-    className: styles$d["core-tooltip"],
-    onMouseEnter: handleMouseEnter,
-    onMouseLeave: handleMouseLeave
-  }, React.createElement("div", {
-    className: styles$d["icon"]
-  }, children), content && React.createElement(Tooltip, {
-    target: id,
-    isOpen: isOpenTooltip,
-    placement: placement,
-    innerClassName: innerClassName
-  }, content));
+  });
 };
 
 var getErrorMessage = function getErrorMessage(error, defaultErrorMessage) {