mario-core 2.9.63-beta → 2.9.67-beta

package/dist/index.js

@@ -26,7 +26,6 @@ var fa = require('react-icons/fa');
 var dateFns = require('date-fns');
 var tinymceReact = require('@tinymce/tinymce-react');
 var differenceInCalendarYears = _interopDefault(require('date-fns/differenceInCalendarYears'));
-var moment = _interopDefault(require('moment'));
 var DatePicker = _interopDefault(require('react-datepicker'));
 var toDate = _interopDefault(require('date-fns/toDate'));
 var md = require('react-icons/md');
@@ -34,6 +33,7 @@ var Creatable = _interopDefault(require('react-select/creatable'));
 var ReactNotification$1 = _interopDefault(require('react-notifications-component'));
 require('react-notifications-component/dist/theme.css');
 var ai = require('react-icons/ai');
+var moment = _interopDefault(require('moment'));
 
 var dashboard = "Dashboard";
 var user = "User";
@@ -50,7 +50,6 @@ var cancel = "Cancel";
 var hey = "Hey";
 var readiness_to_learn = "Readiness to Learn";
 var high_impact_learning_strategies = "High Impact Learning Strategies";
-var check_in = "Check In";
 var reflection = "Reflection";
 var conferences = "Conferences";
 var safety = "Safety";
@@ -73,7 +72,6 @@ var tooltip_content_safety_chart = "The visual represenation of all the response
 var tooltip_content_student_by_age_chart = "The specific representation of students by gender and grade level at your school.";
 var tooltip_content_students_by_designation = "The composite representation of students by individual grades in your school with specific designations.";
 var total_1_to_1 = "Total 1-to-1";
-var total_check_in = "Total Check In";
 var total_1_to_1_time = "Total 1-to-1 Time";
 var total_conferences = "Total Conferences";
 var total_conferences_time = "Total Conferences Time";
@@ -103,14 +101,12 @@ var current_password = "Current password";
 var new_password = "New password";
 var confirm_password = "Confirm password";
 var save = "Save";
-var type_something_to_search_question = "Type something to search question";
-var type_something_to_search_category = "Type something to search category";
+var type_something_to_search_question = "Type something to Search question";
 var total_of_questions = "Total of questions";
 var create_question = "Create question";
 var edit_question = "Edit question";
 var question_type = "Question Type";
 var category = "Category";
-var sub_category = "Sub Category";
 var is_default_question_for_one_to_one = "Is default question for one-to-one";
 var default_question_for_students_or_teachers = "Default question for students or teachers";
 var is_default_question_general_class = "Is default question general class";
@@ -221,7 +217,6 @@ var edit_destination = "Edit Destination";
 var confirm = "Confirm";
 var hello = "Hello";
 var todays_1_1 = "Today’s 1-1";
-var todays_check_in = "Today’s Check In";
 var todays_Conferences = "Today’s Conferences";
 var next_meeting = "Next Meeting";
 var next_conference = "Next Conference";
@@ -250,7 +245,6 @@ var import_csv = "Import CSV";
 var add_new = "Add New";
 var show_only_work_as_assistant = "Show only work as assistant";
 var last_1_to_1 = "Last 1-TO-1";
-var last_check_in = "Last Check In";
 var last_conference = "Last conference";
 var total_time = "Total time";
 var assistant_name = "Assistant Name";
@@ -267,7 +261,6 @@ var after = "After";
 var pick_a_date = "Pick a date";
 var apply = "Apply";
 var new_1_to_1 = "New 1-to-1";
-var new_check_in = "New Check In";
 var do_you_want_to_talk_with_teacher = "Do you want to talk with teacher";
 var start_now = "Start now";
 var book_for_later = "Book for later";
@@ -278,7 +271,6 @@ var select_question = "Select question";
 var select_student = "Select student";
 var select_date_time = "Select Date & Time";
 var book_1_to_1 = "Book 1-to-1";
-var book_new_check_in = "Book new Check In";
 var schedule = "Schedule";
 var sessions_are_booked_as_10_minute_slots = "Sessions are booked as 10 minute slots";
 var does_not_reoccur = "Does not reoccur";
@@ -286,15 +278,13 @@ var time_must_be_between_8_am_and_6_pm = "Time must be between 8 AM and 6 PM";
 var from = "From";
 var to = "To";
 var show_only_favorites = "Show only favorites";
-var show_only_conversation = "Show 1-1 conversation only";
 var duration = "Duration";
 var favorite = "Favorite";
 var open = "Open";
 var no_data = "No Data";
 var schedule_detail = "Schedule Detail";
 var are_you_sure_you_want_to_cancel_this_schedule = "Are you sure you want to Cancel this schedule?";
-var completed_1_to_1 = "Completed 1-1 Conversation";
-var completed_check_in = "Completed Check In";
+var completed_1_to_1 = "Completed 1-to-1";
 var done = "Done";
 var what_do_you_want_to_talk_about = "What do you want to talk about?";
 var session_type = "Session Type";
@@ -415,7 +405,6 @@ var student_request = "Student Request";
 var overview = "Overview";
 var plp = "PLP";
 var my_student_1_to_1 = "My Student 1-to-1";
-var my_student_check_in = "My Student Check In";
 var my_student_conference = "My Student Conference";
 var received_date = "Received Date";
 var class_impact_score = "Class Impact Score";
@@ -605,7 +594,6 @@ var lang_us = {
 	readiness_to_learn: readiness_to_learn,
 	high_impact_learning_strategies: high_impact_learning_strategies,
 	"1_to_1": "1 To 1",
-	check_in: check_in,
 	reflection: reflection,
 	conferences: conferences,
 	safety: safety,
@@ -628,7 +616,6 @@ var lang_us = {
 	tooltip_content_student_by_age_chart: tooltip_content_student_by_age_chart,
 	tooltip_content_students_by_designation: tooltip_content_students_by_designation,
 	total_1_to_1: total_1_to_1,
-	total_check_in: total_check_in,
 	total_1_to_1_time: total_1_to_1_time,
 	total_conferences: total_conferences,
 	total_conferences_time: total_conferences_time,
@@ -660,13 +647,11 @@ var lang_us = {
 	confirm_password: confirm_password,
 	save: save,
 	type_something_to_search_question: type_something_to_search_question,
-	type_something_to_search_category: type_something_to_search_category,
 	total_of_questions: total_of_questions,
 	create_question: create_question,
 	edit_question: edit_question,
 	question_type: question_type,
 	category: category,
-	sub_category: sub_category,
 	"Question text": "Question text",
 	is_default_question_for_one_to_one: is_default_question_for_one_to_one,
 	default_question_for_students_or_teachers: default_question_for_students_or_teachers,
@@ -778,7 +763,6 @@ var lang_us = {
 	confirm: confirm,
 	hello: hello,
 	todays_1_1: todays_1_1,
-	todays_check_in: todays_check_in,
 	todays_Conferences: todays_Conferences,
 	next_meeting: next_meeting,
 	next_conference: next_conference,
@@ -809,7 +793,6 @@ var lang_us = {
 	add_new: add_new,
 	show_only_work_as_assistant: show_only_work_as_assistant,
 	last_1_to_1: last_1_to_1,
-	last_check_in: last_check_in,
 	last_conference: last_conference,
 	total_time: total_time,
 	assistant_name: assistant_name,
@@ -826,7 +809,6 @@ var lang_us = {
 	pick_a_date: pick_a_date,
 	apply: apply,
 	new_1_to_1: new_1_to_1,
-	new_check_in: new_check_in,
 	do_you_want_to_talk_with_teacher: do_you_want_to_talk_with_teacher,
 	start_now: start_now,
 	book_for_later: book_for_later,
@@ -837,7 +819,6 @@ var lang_us = {
 	select_student: select_student,
 	select_date_time: select_date_time,
 	book_1_to_1: book_1_to_1,
-	book_new_check_in: book_new_check_in,
 	schedule: schedule,
 	sessions_are_booked_as_10_minute_slots: sessions_are_booked_as_10_minute_slots,
 	does_not_reoccur: does_not_reoccur,
@@ -845,7 +826,6 @@ var lang_us = {
 	from: from,
 	to: to,
 	show_only_favorites: show_only_favorites,
-	show_only_conversation: show_only_conversation,
 	duration: duration,
 	favorite: favorite,
 	open: open,
@@ -853,7 +833,6 @@ var lang_us = {
 	schedule_detail: schedule_detail,
 	are_you_sure_you_want_to_cancel_this_schedule: are_you_sure_you_want_to_cancel_this_schedule,
 	completed_1_to_1: completed_1_to_1,
-	completed_check_in: completed_check_in,
 	done: done,
 	what_do_you_want_to_talk_about: what_do_you_want_to_talk_about,
 	session_type: session_type,
@@ -975,7 +954,6 @@ var lang_us = {
 	overview: overview,
 	plp: plp,
 	my_student_1_to_1: my_student_1_to_1,
-	my_student_check_in: my_student_check_in,
 	my_student_conference: my_student_conference,
 	received_date: received_date,
 	class_impact_score: class_impact_score,
@@ -1167,7 +1145,6 @@ var cancel$1 = "Cancel";
 var hey$1 = "Hey";
 var readiness_to_learn$1 = "Readiness to Learn";
 var high_impact_learning_strategies$1 = "High Impact Learning Strategies";
-var check_in$1 = "Check In";
 var reflection$1 = "Reflection";
 var conferences$1 = "Conferences";
 var safety$1 = "Safety";
@@ -1190,7 +1167,6 @@ var tooltip_content_safety_chart$1 = "The visual represenation of all the respon
 var tooltip_content_student_by_age_chart$1 = "The specific representation of students by gender and grade level at your school.";
 var tooltip_content_students_by_designation$1 = "The composite representation of students by individual grades in your school with specific designations.";
 var total_1_to_1$1 = "Total 1-to-1";
-var total_check_in$1 = "Total Check In";
 var total_1_to_1_time$1 = "Total 1-to-1 Time";
 var total_conferences$1 = "Total Conferences";
 var total_conferences_time$1 = "Total Conferences Time";
@@ -1221,14 +1197,12 @@ var current_password$1 = "Current password";
 var new_password$1 = "New password";
 var confirm_password$1 = "Confirm password";
 var save$1 = "Save";
-var type_something_to_search_question$1 = "Type something to search question";
-var type_something_to_search_category$1 = "Type something to search category";
+var type_something_to_search_question$1 = "Type something to Search question";
 var total_of_questions$1 = "Total of questions";
 var create_question$1 = "Create question";
 var edit_question$1 = "Edit question";
 var question_type$1 = "Question Type";
 var category$1 = "Category";
-var sub_category$1 = "Sub Category";
 var question_text = "Question text";
 var is_default_question_for_one_to_one$1 = "Is default question for one-to-one";
 var default_question_for_students_or_teachers$1 = "Default question for students or teachers";
@@ -1331,7 +1305,7 @@ var use_for$1 = "Use for";
 var admin_training$1 = "Admin training";
 var teacher_training$1 = "Teacher training";
 var created_time$1 = "Create time";
-var total_reflections$1 = "Total Reflections";
+var total_reflections$1 = "Total Reflections:";
 var student_training$1 = "Student training";
 var create_destination$1 = "Create Destination";
 var total_of_designation$1 = "Total of Designation";
@@ -1340,7 +1314,6 @@ var edit_destination$1 = "Edit Destination";
 var confirm$1 = "Confirm";
 var hello$1 = "Hello";
 var todays_1_1$1 = "Today’s 1-1";
-var todays_check_in$1 = "Today’s Check In";
 var todays_Conferences$1 = "Today’s Conferences";
 var next_meeting$1 = "Next Meeting";
 var next_conference$1 = "Next Conference";
@@ -1369,7 +1342,6 @@ var import_csv$1 = "Import CSV";
 var add_new$1 = "Add New";
 var show_only_work_as_assistant$1 = "Show only work as assistant";
 var last_1_to_1$1 = "Last 1-TO-1";
-var last_check_in$1 = "Last Check In";
 var last_conference$1 = "Last conference";
 var total_time$1 = "Total time";
 var assistant_name$1 = "Assistant Name";
@@ -1386,7 +1358,6 @@ var after$1 = "After";
 var pick_a_date$1 = "Pick a date";
 var apply$1 = "Apply";
 var new_1_to_1$1 = "New 1-to-1";
-var new_check_in$1 = "New Check In";
 var do_you_want_to_talk_with_teacher$1 = "Do you want to talk with teacher";
 var start_now$1 = "Start now";
 var book_for_later$1 = "Book for later";
@@ -1397,7 +1368,6 @@ var select_question$1 = "Select question";
 var select_student$1 = "Select student";
 var select_date_time$1 = "Select Date & Time";
 var book_1_to_1$1 = "Book 1-to-1";
-var book_new_check_in$1 = "Book new Check In";
 var schedule$1 = "Schedule";
 var sessions_are_booked_as_10_minute_slots$1 = "Sessions are booked as 10 minute slots";
 var does_not_reoccur$1 = "Does not reoccur";
@@ -1405,15 +1375,13 @@ var time_must_be_between_8_am_and_6_pm$1 = "Time must be between 8 AM and 6 PM";
 var from$1 = "From";
 var to$1 = "To";
 var show_only_favorites$1 = "Show only favorites";
-var show_only_conversation$1 = "Show 1-1 conversation only";
 var duration$1 = "Duration";
 var favorite$1 = "Favorite";
 var open$1 = "Open";
 var no_data$1 = "No Data";
 var schedule_detail$1 = "Schedule Detail";
 var are_you_sure_you_want_to_cancel_this_schedule$1 = "Are you sure you want to Cancel this schedule?";
-var completed_1_to_1$1 = "Completed 1-1 Conversation";
-var completed_check_in$1 = "Completed Check In";
+var completed_1_to_1$1 = "Completed 1-to-1";
 var done$1 = "Done";
 var what_do_you_want_to_talk_about$1 = "What do you want to talk about?";
 var session_type$1 = "Session Type";
@@ -1534,7 +1502,6 @@ var student_request$1 = "Student Request";
 var overview$1 = "Overview";
 var plp$1 = "PLP";
 var my_student_1_to_1$1 = "My Student 1-to-1";
-var my_student_check_in$1 = "My Student Check In";
 var my_student_conference$1 = "My Student Conference";
 var received_date$1 = "Received Date";
 var class_impact_score$1 = "Class Impact Score";
@@ -1724,7 +1691,6 @@ var lang_uk = {
 	readiness_to_learn: readiness_to_learn$1,
 	high_impact_learning_strategies: high_impact_learning_strategies$1,
 	"1_to_1": "1 to 1",
-	check_in: check_in$1,
 	reflection: reflection$1,
 	conferences: conferences$1,
 	safety: safety$1,
@@ -1747,7 +1713,6 @@ var lang_uk = {
 	tooltip_content_student_by_age_chart: tooltip_content_student_by_age_chart$1,
 	tooltip_content_students_by_designation: tooltip_content_students_by_designation$1,
 	total_1_to_1: total_1_to_1$1,
-	total_check_in: total_check_in$1,
 	total_1_to_1_time: total_1_to_1_time$1,
 	total_conferences: total_conferences$1,
 	total_conferences_time: total_conferences_time$1,
@@ -1779,13 +1744,11 @@ var lang_uk = {
 	confirm_password: confirm_password$1,
 	save: save$1,
 	type_something_to_search_question: type_something_to_search_question$1,
-	type_something_to_search_category: type_something_to_search_category$1,
 	total_of_questions: total_of_questions$1,
 	create_question: create_question$1,
 	edit_question: edit_question$1,
 	question_type: question_type$1,
 	category: category$1,
-	sub_category: sub_category$1,
 	question_text: question_text,
 	is_default_question_for_one_to_one: is_default_question_for_one_to_one$1,
 	default_question_for_students_or_teachers: default_question_for_students_or_teachers$1,
@@ -1897,7 +1860,6 @@ var lang_uk = {
 	confirm: confirm$1,
 	hello: hello$1,
 	todays_1_1: todays_1_1$1,
-	todays_check_in: todays_check_in$1,
 	todays_Conferences: todays_Conferences$1,
 	next_meeting: next_meeting$1,
 	next_conference: next_conference$1,
@@ -1928,7 +1890,6 @@ var lang_uk = {
 	add_new: add_new$1,
 	show_only_work_as_assistant: show_only_work_as_assistant$1,
 	last_1_to_1: last_1_to_1$1,
-	last_check_in: last_check_in$1,
 	last_conference: last_conference$1,
 	total_time: total_time$1,
 	assistant_name: assistant_name$1,
@@ -1945,7 +1906,6 @@ var lang_uk = {
 	pick_a_date: pick_a_date$1,
 	apply: apply$1,
 	new_1_to_1: new_1_to_1$1,
-	new_check_in: new_check_in$1,
 	do_you_want_to_talk_with_teacher: do_you_want_to_talk_with_teacher$1,
 	start_now: start_now$1,
 	book_for_later: book_for_later$1,
@@ -1956,7 +1916,6 @@ var lang_uk = {
 	select_student: select_student$1,
 	select_date_time: select_date_time$1,
 	book_1_to_1: book_1_to_1$1,
-	book_new_check_in: book_new_check_in$1,
 	schedule: schedule$1,
 	sessions_are_booked_as_10_minute_slots: sessions_are_booked_as_10_minute_slots$1,
 	does_not_reoccur: does_not_reoccur$1,
@@ -1964,7 +1923,6 @@ var lang_uk = {
 	from: from$1,
 	to: to$1,
 	show_only_favorites: show_only_favorites$1,
-	show_only_conversation: show_only_conversation$1,
 	duration: duration$1,
 	favorite: favorite$1,
 	open: open$1,
@@ -1972,7 +1930,6 @@ var lang_uk = {
 	schedule_detail: schedule_detail$1,
 	are_you_sure_you_want_to_cancel_this_schedule: are_you_sure_you_want_to_cancel_this_schedule$1,
 	completed_1_to_1: completed_1_to_1$1,
-	completed_check_in: completed_check_in$1,
 	done: done$1,
 	what_do_you_want_to_talk_about: what_do_you_want_to_talk_about$1,
 	session_type: session_type$1,
@@ -2094,7 +2051,6 @@ var lang_uk = {
 	overview: overview$1,
 	plp: plp$1,
 	my_student_1_to_1: my_student_1_to_1$1,
-	my_student_check_in: my_student_check_in$1,
 	my_student_conference: my_student_conference$1,
 	received_date: received_date$1,
 	class_impact_score: class_impact_score$1,
@@ -2448,7 +2404,8 @@ function _createForOfIteratorHelperLoose(o, allowArrayLike) {
 
 var TINY_MCE_API_KEY = "adpshj9swgsscf83gw4gs2f74nx0vicpd5ydka20iqjd7l8r";
 var GOOGLE_RECAPTCHA_KEY = "6LfNtLUaAAAAAL24lbBV11jS-gBtt1mhtxb4NXs0";
-var INIT_AMPLITUDE_KEY = "c617d0950cfdcae12953907273a1920f";
+var INIT_AMPLITUDE_KEY_PROD = "860fa99c52ae79d98e904b4c862ddaac";
+var INIT_AMPLITUDE_KEY_STAGE = "c617d0950cfdcae12953907273a1920f";
 var ACCESS_TOKEN = "ACCESS_TOKEN";
 var DEFAULT_PAGE_SIZE_VALUES = [{
   label: "10",
@@ -2491,6 +2448,7 @@ var BASE_URL = function () {
   var url = windowUrl.split("//")[0] + "//" + windowUrl.split("//")[1].split("/")[0];
   return url;
 }();
+var isLocalhost = Boolean(window.location.hostname === "localhost" || window.location.hostname.includes("stage") || window.location.hostname === "[::1]" || window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));
 var QUESTION_TYPES_OPTIONS = [{
   label: "Single choice",
   value: "SingleChoice"
@@ -2500,6 +2458,18 @@ var QUESTION_TYPES_OPTIONS = [{
 }, {
   label: "Text input",
   value: "TextInput"
+}, {
+  label: "Slider",
+  value: "Slider"
+}, {
+  label: "Progress bar",
+  value: "ProgressBar"
+}, {
+  label: "Star rating",
+  value: "StarRating"
+}, {
+  label: "Text input with sub questions",
+  value: "TextInputWithSuggestions"
 }, {
   label: "Emotional",
   value: "Emotional"
@@ -2788,7 +2758,7 @@ var useLogin = function useLogin() {
           }));
 
           if (data !== null && data !== void 0 && data.email && !roles.includes("Admin")) {
-            amplitude.getInstance().init(INIT_AMPLITUDE_KEY, data.email, {
+            amplitude.getInstance().init(!isLocalhost ? INIT_AMPLITUDE_KEY_PROD : INIT_AMPLITUDE_KEY_STAGE, data.email, {
               includeReferrer: false,
               includeUtm: false
             });
@@ -3901,7 +3871,7 @@ var TheSidebar = function TheSidebar(_ref) {
     className: "" + styles["sidebar-logout"]
   }), React__default.createElement("p", {
     onClick: signOut
-  }, "Log out 123")));
+  }, "Log out")));
 };
 
 var setNotification = toolkit.createAction("notifications/setNotification");
@@ -6672,13 +6642,94 @@ var SkillList = function SkillList() {
   }))));
 };
 
-var setUserList = toolkit.createAction("users/setUserList");
-var setStudentList = toolkit.createAction("users/setStudentList");
+var MAX_FILE_SIZE = 20097152;
+
+var UploadFileButton = function UploadFileButton(_ref) {
+  var fileName = _ref.fileName,
+      maxWidth = _ref.maxWidth,
+      maxHeight = _ref.maxHeight,
+      setFile = _ref.setFile,
+      canDelete = _ref.canDelete,
+      onDelete = _ref.onDelete,
+      isCheckFeedBack = _ref.isCheckFeedBack,
+      onAddImage = _ref.onAddImage;
+  var dispatch = reactRedux.useDispatch();
+
+  var _useState = React.useState(""),
+      imagePreviewUrl = _useState[0],
+      setImagePreviewUrl = _useState[1];
+
+  var imageStyle = {
+    maxWidth: maxWidth || "100%",
+    maxHeight: maxHeight || "100%"
+  };
+  var imageSrc = imagePreviewUrl || getFileUrl(fileName);
+
+  var handleImageChange = function handleImageChange(e) {
+    e.preventDefault();
+    var reader = new FileReader();
+    var newFile = e.target.files[0];
+
+    if (newFile.size > MAX_FILE_SIZE) {
+      dispatch(setAlert({
+        type: "danger",
+        message: "File can't be larger than 2MB"
+      }));
+      return;
+    }
+
+    reader.onloadend = function () {
+      setFile(newFile);
+      setImagePreviewUrl(reader.result);
+    };
+
+    if (newFile) {
+      reader.readAsDataURL(newFile);
+    }
+
+    !!onAddImage && onAddImage();
+  };
+
+  var imagePreviewContainer = imagePreviewUrl || fileName ? React__default.createElement("img", {
+    style: imageStyle,
+    src: imageSrc,
+    alt: "image"
+  }) : null;
+  return React__default.createElement("div", {
+    className: "mb-2"
+  }, React__default.createElement(reactstrap.Form, {
+    className: "mb-2"
+  }, React__default.createElement(reactstrap.Input, {
+    className: "d-none",
+    type: "file",
+    id: "uploadFile",
+    onChange: handleImageChange,
+    accept: "image/*"
+  }), React__default.createElement("div", {
+    className: "d-flex align-items-center"
+  }, React__default.createElement(reactstrap.Label, {
+    htmlFor: "uploadFile",
+    role: "button",
+    tabIndex: 0,
+    className: styles["input-file-label"]
+  }, isCheckFeedBack == true ? React__default.createElement(md.MdAttachFile, null) : React__default.createElement(React__default.Fragment, null, React__default.createElement("i", {
+    className: "fa fa-paperclip mr-1",
+    "aria-hidden": "true"
+  }), imagePreviewUrl || fileName ? "Change file" : "Choose file")), canDelete && imagePreviewContainer && React__default.createElement(reactstrap.Button, {
+    size: "sm",
+    color: "danger",
+    className: styles["delete-avatar-button"] + " ml-2 d-flex align-items-center justify-content-center",
+    onClick: function onClick() {
+      setImagePreviewUrl(null);
+      onDelete && onDelete();
+    }
+  }, React__default.createElement(fa.FaTrashAlt, null)))), imagePreviewContainer);
+};
 
 var USER_URL$1 = BASE_URL + "/api/user";
 var CHANGE_PASSWORD = BASE_URL + "/api/Account/changePassword";
 var ACCOUNT_URL$1 = BASE_URL + "/api/account";
-var EDU_USER_URL = BASE_URL + "/api/User/delete-item-user";
+var EDU_USER_URL = BASE_URL + "/api/User";
 var get$5 = function get(filter) {
   return api.get("" + USER_URL$1, {
     params: filter
@@ -6694,7 +6745,7 @@ var update$5 = function update(data) {
   return api.put(USER_URL$1 + "/" + data.id, data);
 };
 var remove$3 = function remove(id) {
-  return api["delete"](EDU_USER_URL + "/" + id);
+  return api["delete"](EDU_USER_URL + "/delete-item-user/" + id);
 };
 var changePassword = function changePassword(formData) {
   return api.post(CHANGE_PASSWORD, formData);
@@ -6702,32 +6753,58 @@ var changePassword = function changePassword(formData) {
 var forgotChangePassword = function forgotChangePassword(data) {
   return api.post(ACCOUNT_URL$1 + "/forgotchangepassword", data);
 };
+var switchAccountUser = function switchAccountUser(id) {
+  return api.post(EDU_USER_URL + "/switch-user/" + id);
+};
 
-var USER_URL$2 = "/admin/user";
-var CREATE_USER_URL = "/admin/create-user";
-var TITLE$7 = "User list";
+var initValue$3 = {
+  id: "",
+  firstName: "",
+  lastName: "",
+  email: "",
+  dateOfBirth: "",
+  roles: [],
+  isActive: true,
+  profileImageFileName: ""
+};
+var USER_LIST_URL = "/admin/user";
+var TITLE$7 = "User detail";
 
-var useUserList = function useUserList() {
+var useUserDetail = function useUserDetail(id) {
+  var dispatch = reactRedux.useDispatch();
   var history = reactRouterDom.useHistory();
-  var query = new URLSearchParams(location.search);
-  var queryName = query.get("query");
-  var userList = reactRedux.useSelector(function (state) {
-    return state.users.userList;
-  });
-  var totalItems = reactRedux.useSelector(function (state) {
-    return state.users.totalItems;
-  });
 
-  var _useFilters = useFilters(),
-      filters = _useFilters.filters,
-      changeFilters = _useFilters.changeFilters;
+  var _useState = React.useState(initValue$3),
+      userDetail = _useState[0],
+      setUserDetail = _useState[1];
 
-  var _useState = React.useState(!!queryName ? queryName : ""),
-      fullName = _useState[0],
-      setFullName = _useState[1];
+  var _useState2 = React.useState(null),
+      file = _useState2[0],
+      setFile = _useState2[1];
 
-  var dispatch = reactRedux.useDispatch();
-  var getData = React.useCallback(function (fullName) {
+  var _useState3 = React.useState(false),
+      edited = _useState3[0],
+      setEdited = _useState3[1];
+
+  var setEditedTrue = function setEditedTrue() {
+    try {
+      localStorage.setItem(window.location.href, "true");
+      setEdited(true);
+      return Promise.resolve();
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+
+  React.useEffect(function () {
+    document.title = TITLE$7;
+    setEdited(false);
+    if (!!localStorage.getItem(window.location.href)) localStorage.removeItem(window.location.href);
+  }, []);
+  React.useEffect(function () {
+    !!id && getData();
+  }, [id]);
+  var getData = React.useCallback(function () {
     try {
       var _temp3 = function _temp3() {
         dispatch(setLoading(false));
@@ -6736,22 +6813,14 @@ var useUserList = function useUserList() {
       dispatch(setLoading(true));
 
       var _temp4 = _catch(function () {
-        return Promise.resolve(fullName ? get$5(_extends({}, filters, {
-          searchString: fullName
-        })) : get$5(filters)).then(function (res) {
-          var _res$data = res.data,
-              items = _res$data.items,
-              totalItems = _res$data.totalItems;
-
-          for (var _iterator = _createForOfIteratorHelperLoose(items), _step; !(_step = _iterator()).done;) {
-            var user = _step.value;
-            user.roles = user.roles.includes("EduTeacher") ? [ROLES.EDUTEACHER] : user.roles;
-          }
+        return Promise.resolve(getById$3(id)).then(function (res) {
+          var _res$data;
 
-          dispatch(setUserList({
-            userList: items,
-            totalItems: totalItems
+          setUserDetail(_extends({}, res.data, {
+            dateOfBirth: dateFns.format(new Date(res.data.dateOfBirth), DATE_FORMAT),
+            roles: res.data.roles.includes("EduTeacher") ? [ROLES.EDUTEACHER] : res.data.roles
           }));
+          document.title = (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.fullName;
         });
       }, function (err) {
         var _err$response, _err$response$data;
@@ -6766,458 +6835,47 @@ var useUserList = function useUserList() {
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [dispatch, filters]);
-  React.useEffect(function () {
-    document.title = TITLE$7;
+  }, [id]);
+  var backToList = React.useCallback(function (user) {
+    !!user && typeof user === "string" ? history.push(USER_LIST_URL + ("?query=" + user)) : history.push(USER_LIST_URL);
   }, []);
-  React.useEffect(function () {
-    if (!!fullName) {
-      getData(fullName);
-      setFullName(null);
-    } else {
-      getData();
-    }
-  }, [filters]);
-  var removeData = React.useCallback(function (id) {
-    dispatch(setLoading(true));
-
+  var confirmData = React.useCallback(function (data) {
     try {
-      dispatch(setModal({
-        isOpen: true,
-        type: "warning",
-        message: "Do you want to remove this user?",
-        onConfirm: function () {
-          try {
-            return Promise.resolve(remove$3(id)).then(function () {
-              dispatch(setAlert({
-                type: "success",
-                message: "Remove user successfully"
-              }));
-              changeFilters({
-                currentPage: 1
+      var _temp9 = function _temp9() {
+        dispatch(setLoading(false));
+      };
+
+      dispatch(setLoading(true));
+
+      var _temp10 = _catch(function () {
+        function _temp6() {
+          var next = !!id ? update$5 : create$5;
+          !id && delete data.id;
+          return Promise.resolve(next(data)).then(function (result) {
+            if (!!result) {
+              getById$3(result.data.id).then(function (e) {
+                backToList(e.data.fullName);
               });
-            });
-          } catch (e) {
-            return Promise.reject(e);
-          }
-        }
-      }));
-    } catch (err) {
-      var _err$response2, _err$response2$data;
+            }
 
-      dispatch(setAlert({
-        type: "danger",
-        message: ((_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : (_err$response2$data = _err$response2.data) === null || _err$response2$data === void 0 ? void 0 : _err$response2$data.title) || err.message
-      }));
-    }
+            if (!id) {
+              alert("Password of " + result.data.email + " is " + ("\"" + result.data.password + "\""));
+            }
 
-    dispatch(setLoading(false));
-  }, [filters]);
+            dispatch(setAlert({
+              type: "success",
+              message: (!!id ? "Update" : "Create") + " user successfully"
+            }));
+          });
+        }
 
-  var reDirectDetailPage = function reDirectDetailPage(id) {
-    var url = !!id ? USER_URL$2 + "/" + id : CREATE_USER_URL;
-    history.push(url);
-  };
-
-  return {
-    userList: userList,
-    totalItems: totalItems,
-    filters: filters,
-    queryName: queryName,
-    getData: getData,
-    removeData: removeData,
-    changeFilters: changeFilters,
-    reDirectDetailPage: reDirectDetailPage
-  };
-};
-
-var SearchBox = function SearchBox(_ref) {
-  var initValue = _ref.initValue,
-      onSearch = _ref.onSearch,
-      placeholder = _ref.placeholder,
-      className = _ref.className,
-      style = _ref.style;
-
-  var _useState = React.useState(initValue),
-      searchString = _useState[0],
-      setSearchString = _useState[1];
-
-  React.useEffect(function () {
-    setSearchString(initValue);
-  }, [initValue]);
-  var onKeyUp = React.useCallback(function (e) {
-    e.key === "Enter" && onSearch(searchString);
-  }, [searchString, onSearch]);
-  return React__default.createElement(reactstrap.Input, {
-    placeholder: placeholder,
-    value: searchString,
-    onChange: function onChange(e) {
-      return setSearchString(e.target.value);
-    },
-    onKeyUp: onKeyUp,
-    className: className,
-    style: style
-  });
-};
-
-SearchBox.defaultProps = {
-  placeholder: "Type something to search",
-  className: "",
-  style: {}
-};
-var SearchBox$1 = React.memo(SearchBox);
-
-var searchInputStyle = {
-  height: 38
-};
-
-var SearchBoxContainer = function SearchBoxContainer(_ref) {
-  var text = _ref.text,
-      initValue = _ref.initValue,
-      onClick = _ref.onClick,
-      onSearch = _ref.onSearch,
-      placeholder = _ref.placeholder;
-  return React__default.createElement("div", {
-    className: "d-flex align-items-center"
-  }, React__default.createElement("div", null, React__default.createElement(AddButton, {
-    text: text,
-    onClick: onClick
-  })), React__default.createElement("div", {
-    className: "flex-grow-1 ml-2"
-  }, React__default.createElement(SearchBox$1, {
-    initValue: initValue,
-    onSearch: onSearch,
-    placeholder: placeholder,
-    style: searchInputStyle
-  })));
-};
-
-SearchBoxContainer.defaultProps = {
-  placeholder: "Type something to search"
-};
-
-var utcToLocalTime = (function (time, FORMAT) {
-  if (time === DATE_MIN_VALUE) return "";
-
-  try {
-    return moment.utc(time).local().format(FORMAT || "yyyy-MM-DD");
-  } catch (_unused) {
-    return "";
-  }
-});
-
-var header$2 = "User";
-
-var UserList = function UserList() {
-  var _useUserList = useUserList(),
-      queryName = _useUserList.queryName,
-      userList = _useUserList.userList,
-      totalItems = _useUserList.totalItems,
-      filters = _useUserList.filters,
-      removeData = _useUserList.removeData,
-      changeFilters = _useUserList.changeFilters,
-      reDirectDetailPage = _useUserList.reDirectDetailPage;
-
-  var _useTranslation = reactI18next.useTranslation(),
-      t = _useTranslation.t;
-
-  return React__default.createElement("div", {
-    className: "fadeIn animated"
-  }, React__default.createElement("h5", {
-    className: "mb-2"
-  }, t("" + header$2)), React__default.createElement(reactstrap.Row, {
-    className: "my-2"
-  }, React__default.createElement(reactstrap.Col, {
-    md: 8
-  }, React__default.createElement(SearchBoxContainer, {
-    text: t("create_user"),
-    onClick: function onClick() {
-      return reDirectDetailPage();
-    },
-    initValue: !!queryName ? queryName : "",
-    onSearch: function onSearch(searchString) {
-      return changeFilters({
-        searchString: searchString
-      });
-    },
-    placeholder: t("type_something_to_search_by_user_name")
-  })), React__default.createElement(reactstrap.Col, {
-    md: 4,
-    className: "d-flex justify-content-end align-items-center"
-  }, t("total_of_users"), " : ", totalItems)), React__default.createElement(reactstrap.Row, {
-    className: "mb-2"
-  }, React__default.createElement(reactstrap.Col, {
-    md: 12
-  }, userList && userList.length > 0 ? React__default.createElement("div", null, React__default.createElement(reactstrap.Table, {
-    bordered: true,
-    hover: true,
-    striped: true,
-    responsive: true,
-    size: "sm"
-  }, React__default.createElement("thead", null, React__default.createElement("tr", null, React__default.createElement("th", {
-    className: "align-top"
-  }, t("name")), React__default.createElement("th", {
-    className: "align-top"
-  }, t("email")), React__default.createElement("th", {
-    className: "align-top"
-  }, t("age")), React__default.createElement("th", {
-    className: "align-top"
-  }, t("role")), React__default.createElement("th", {
-    className: "align-top"
-  }, t("active_status")), React__default.createElement("th", {
-    className: "align-top"
-  }, t("created_time")), React__default.createElement("th", {
-    className: "text-center"
-  }, t("action")))), React__default.createElement("tbody", null, userList.map(function (record) {
-    return React__default.createElement("tr", {
-      key: record.id
-    }, React__default.createElement("td", {
-      className: "align-middle"
-    }, React__default.createElement(LinkEditButton, {
-      label: "" + record.fullName,
-      onClick: function onClick() {
-        return reDirectDetailPage(record.id);
-      }
-    })), React__default.createElement("td", {
-      className: "align-middle"
-    }, record.email), React__default.createElement("td", {
-      className: "align-middle"
-    }, differenceInCalendarYears(new Date(), new Date(record.dateOfBirth))), React__default.createElement("td", {
-      className: "align-middle"
-    }, !!record.roles && record.roles.join(", ")), React__default.createElement("td", {
-      className: "align-middle"
-    }, record.isActive ? t("active") : t("inactive")), React__default.createElement("td", {
-      className: "align-middle"
-    }, utcToLocalTime(record === null || record === void 0 ? void 0 : record.createTime, "yyyy-MM-DD HH:mm")), React__default.createElement("td", {
-      className: "text-center align-middle"
-    }, React__default.createElement(DeleteButtonIcon, {
-      onClick: function onClick() {
-        return removeData(record.id);
-      }
-    })));
-  })))) : React__default.createElement(EmptyDataAlert, {
-    label: t("user")
-  })), React__default.createElement(reactstrap.Col, {
-    md: 12
-  }, React__default.createElement(CustomPagination, {
-    filters: filters,
-    totalRecordCount: totalItems,
-    changePageSize: function changePageSize(pageSize) {
-      return changeFilters({
-        pageSize: pageSize
-      });
-    },
-    changePage: function changePage(currentPage) {
-      return changeFilters({
-        currentPage: currentPage
-      });
-    }
-  }))));
-};
-
-var MAX_FILE_SIZE = 20097152;
-
-var UploadFileButton = function UploadFileButton(_ref) {
-  var fileName = _ref.fileName,
-      maxWidth = _ref.maxWidth,
-      maxHeight = _ref.maxHeight,
-      setFile = _ref.setFile,
-      canDelete = _ref.canDelete,
-      onDelete = _ref.onDelete,
-      isCheckFeedBack = _ref.isCheckFeedBack,
-      onAddImage = _ref.onAddImage;
-  var dispatch = reactRedux.useDispatch();
-
-  var _useState = React.useState(""),
-      imagePreviewUrl = _useState[0],
-      setImagePreviewUrl = _useState[1];
-
-  var imageStyle = {
-    maxWidth: maxWidth || "100%",
-    maxHeight: maxHeight || "100%"
-  };
-  var imageSrc = imagePreviewUrl || getFileUrl(fileName);
-
-  var handleImageChange = function handleImageChange(e) {
-    e.preventDefault();
-    var reader = new FileReader();
-    var newFile = e.target.files[0];
-
-    if (newFile.size > MAX_FILE_SIZE) {
-      dispatch(setAlert({
-        type: "danger",
-        message: "File can't be larger than 2MB"
-      }));
-      return;
-    }
-
-    reader.onloadend = function () {
-      setFile(newFile);
-      setImagePreviewUrl(reader.result);
-    };
-
-    if (newFile) {
-      reader.readAsDataURL(newFile);
-    }
-
-    !!onAddImage && onAddImage();
-  };
-
-  var imagePreviewContainer = imagePreviewUrl || fileName ? React__default.createElement("img", {
-    style: imageStyle,
-    src: imageSrc,
-    alt: "image"
-  }) : null;
-  return React__default.createElement("div", {
-    className: "mb-2"
-  }, React__default.createElement(reactstrap.Form, {
-    className: "mb-2"
-  }, React__default.createElement(reactstrap.Input, {
-    className: "d-none",
-    type: "file",
-    id: "uploadFile",
-    onChange: handleImageChange,
-    accept: "image/*"
-  }), React__default.createElement("div", {
-    className: "d-flex align-items-center"
-  }, React__default.createElement(reactstrap.Label, {
-    htmlFor: "uploadFile",
-    role: "button",
-    tabIndex: 0,
-    className: styles["input-file-label"]
-  }, isCheckFeedBack == true ? React__default.createElement(md.MdAttachFile, null) : React__default.createElement(React__default.Fragment, null, React__default.createElement("i", {
-    className: "fa fa-paperclip mr-1",
-    "aria-hidden": "true"
-  }), imagePreviewUrl || fileName ? "Change file" : "Choose file")), canDelete && imagePreviewContainer && React__default.createElement(reactstrap.Button, {
-    size: "sm",
-    color: "danger",
-    className: styles["delete-avatar-button"] + " ml-2 d-flex align-items-center justify-content-center",
-    onClick: function onClick() {
-      setImagePreviewUrl(null);
-      onDelete && onDelete();
-    }
-  }, React__default.createElement(fa.FaTrashAlt, null)))), imagePreviewContainer);
-};
-
-var initValue$3 = {
-  id: "",
-  firstName: "",
-  lastName: "",
-  email: "",
-  dateOfBirth: "",
-  roles: [],
-  isActive: true,
-  profileImageFileName: ""
-};
-var USER_LIST_URL = "/admin/user";
-var TITLE$8 = "User detail";
-
-var useUserDetail = function useUserDetail(id) {
-  var dispatch = reactRedux.useDispatch();
-  var history = reactRouterDom.useHistory();
-
-  var _useState = React.useState(initValue$3),
-      userDetail = _useState[0],
-      setUserDetail = _useState[1];
-
-  var _useState2 = React.useState(null),
-      file = _useState2[0],
-      setFile = _useState2[1];
-
-  var _useState3 = React.useState(false),
-      edited = _useState3[0],
-      setEdited = _useState3[1];
-
-  var setEditedTrue = function setEditedTrue() {
-    try {
-      localStorage.setItem(window.location.href, "true");
-      setEdited(true);
-      return Promise.resolve();
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  };
-
-  React.useEffect(function () {
-    document.title = TITLE$8;
-    setEdited(false);
-    if (!!localStorage.getItem(window.location.href)) localStorage.removeItem(window.location.href);
-  }, []);
-  React.useEffect(function () {
-    !!id && getData();
-  }, [id]);
-  var getData = React.useCallback(function () {
-    try {
-      var _temp3 = function _temp3() {
-        dispatch(setLoading(false));
-      };
-
-      dispatch(setLoading(true));
-
-      var _temp4 = _catch(function () {
-        return Promise.resolve(getById$3(id)).then(function (res) {
-          var _res$data;
-
-          setUserDetail(_extends({}, res.data, {
-            dateOfBirth: dateFns.format(new Date(res.data.dateOfBirth), DATE_FORMAT),
-            roles: res.data.roles.includes("EduTeacher") ? [ROLES.EDUTEACHER] : res.data.roles
-          }));
-          document.title = (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.fullName;
-        });
-      }, function (err) {
-        var _err$response, _err$response$data;
-
-        dispatch(setAlert({
-          type: "danger",
-          message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : _err$response$data.title) || err.message
-        }));
-      });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  }, [id]);
-  var backToList = React.useCallback(function (user) {
-    !!user && typeof user === "string" ? history.push(USER_LIST_URL + ("?query=" + user)) : history.push(USER_LIST_URL);
-  }, []);
-  var confirmData = React.useCallback(function (data) {
-    try {
-      var _temp9 = function _temp9() {
-        dispatch(setLoading(false));
-      };
-
-      dispatch(setLoading(true));
-
-      var _temp10 = _catch(function () {
-        function _temp6() {
-          var next = !!id ? update$5 : create$5;
-          !id && delete data.id;
-          return Promise.resolve(next(data)).then(function (result) {
-            if (!!result) {
-              getById$3(result.data.id).then(function (e) {
-                backToList(e.data.fullName);
-              });
-            }
-
-            if (!id) {
-              alert("Password of " + result.data.email + " is " + ("\"" + result.data.password + "\""));
-            }
-
-            dispatch(setAlert({
-              type: "success",
-              message: (!!id ? "Update" : "Create") + " user successfully"
-            }));
-          });
-        }
-
-        var _temp5 = function () {
-          if (!!file) {
-            var formData = new FormData();
-            var name = file.name;
-            formData.append("file", file, name);
-            return Promise.resolve(systemProfileUpload(formData)).then(function (res) {
-              var _res$data2;
+        var _temp5 = function () {
+          if (!!file) {
+            var formData = new FormData();
+            var name = file.name;
+            formData.append("file", file, name);
+            return Promise.resolve(systemProfileUpload(formData)).then(function (res) {
+              var _res$data2;
 
               var imageUrl = res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.key;
               data.profileImageFileName = imageUrl;
@@ -7803,6 +7461,42 @@ var CreatableSelector = function CreatableSelector(props) {
   });
 };
 
+var SearchBox = function SearchBox(_ref) {
+  var initValue = _ref.initValue,
+      onSearch = _ref.onSearch,
+      placeholder = _ref.placeholder,
+      className = _ref.className,
+      style = _ref.style;
+
+  var _useState = React.useState(initValue),
+      searchString = _useState[0],
+      setSearchString = _useState[1];
+
+  React.useEffect(function () {
+    setSearchString(initValue);
+  }, [initValue]);
+  var onKeyUp = React.useCallback(function (e) {
+    e.key === "Enter" && onSearch(searchString);
+  }, [searchString, onSearch]);
+  return React__default.createElement(reactstrap.Input, {
+    placeholder: placeholder,
+    value: searchString,
+    onChange: function onChange(e) {
+      return setSearchString(e.target.value);
+    },
+    onKeyUp: onKeyUp,
+    className: className,
+    style: style
+  });
+};
+
+SearchBox.defaultProps = {
+  placeholder: "Type something to search",
+  className: "",
+  style: {}
+};
+var SearchBox$1 = React.memo(SearchBox);
+
 var QuestionTypeSelector = function QuestionTypeSelector(props) {
   var id = props.id;
   var initValue = !!id ? QUESTION_TYPES_OPTIONS.find(function (option) {
@@ -7862,17 +7556,8 @@ var SuggestionCategorySelector = function SuggestionCategorySelector(props) {
 };
 
 var CATEGORY_URL$1 = BASE_URL + "/api/QuestionCategory";
-var get$7 = function get(parentCategoryId) {
-  return api.get(CATEGORY_URL$1, {
-    params: {
-      parentCategoryId: parentCategoryId
-    }
-  });
-};
-var getByFilter = function getByFilter(filter) {
-  return api.get(CATEGORY_URL$1, {
-    params: filter
-  });
+var get$7 = function get() {
+  return api.get(CATEGORY_URL$1);
 };
 
 var QuestionCategorySelector = function QuestionCategorySelector(props) {
@@ -7880,8 +7565,6 @@ var QuestionCategorySelector = function QuestionCategorySelector(props) {
       getCategoryList = _useState[0],
       setCategoryList = _useState[1];
 
-  var id = props.id,
-      parentCategoryId = props.parentCategoryId;
   React.useEffect(function () {
     fetchCategory();
   }, []);
@@ -7889,7 +7572,7 @@ var QuestionCategorySelector = function QuestionCategorySelector(props) {
   var fetchCategory = function fetchCategory() {
     try {
       var _temp2 = _catch(function () {
-        return Promise.resolve(get$7(parentCategoryId)).then(function (res) {
+        return Promise.resolve(get$7()).then(function (res) {
           setCategoryList(res.data.items);
         });
       }, function (err) {
@@ -7902,6 +7585,7 @@ var QuestionCategorySelector = function QuestionCategorySelector(props) {
     }
   };
 
+  var id = props.id;
   var arrCategory = getCategoryList.map(function (i) {
     return {
       id: i.id,
@@ -7918,131 +7602,6 @@ var QuestionCategorySelector = function QuestionCategorySelector(props) {
   }, props));
 };
 
-var useCategorySelector = function useCategorySelector() {
-  var _useState = React.useState([]),
-      categories = _useState[0],
-      setCategories = _useState[1];
-
-  var dispatch = reactRedux.useDispatch();
-  var getData = React.useCallback(function () {
-    try {
-      var _temp3 = function _temp3() {
-        dispatch(setLoading(false));
-      };
-
-      dispatch(setLoading(true));
-
-      var _temp4 = _catch(function () {
-        return Promise.resolve(getByFilter(_extends({}, DEFAULT_FILTER, {
-          pageSize: -1
-        }))).then(function (res) {
-          var convertedCategories = convertOptions(res.data.items);
-          setCategories(convertedCategories);
-        });
-      }, function (err) {
-        var _err$response, _err$response$data;
-
-        dispatch(setAlert({
-          type: "danger",
-          message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : _err$response$data.title) || err.message
-        }));
-      });
-
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
-    } catch (e) {
-      return Promise.reject(e);
-    }
-  }, []);
-
-  var convertOptions = function convertOptions(categories, parent, children) {
-    var result = [];
-
-    if (!parent) {
-      var noParentCategories = categories.filter(function (c) {
-        return !c.parentCategoryId;
-      });
-      noParentCategories.forEach(function (c) {
-        var childrenOfCategory = categories.filter(function (cg) {
-          return cg.parentCategoryId === c.id;
-        });
-
-        var category = _extends({}, c, {
-          label: c.name,
-          value: c.id,
-          level: 0,
-          isDisabled: childrenOfCategory.length > 0
-        });
-
-        result = result.concat(convertOptions(categories, category, childrenOfCategory));
-      });
-    } else {
-      result.push(parent);
-      children === null || children === void 0 ? void 0 : children.forEach(function (c) {
-        var childrenOfCategory = categories.filter(function (cg) {
-          return cg.parentCategoryId === c.id;
-        });
-
-        var category = _extends({}, c, {
-          label: c.name,
-          value: c.id,
-          level: parent.level ? parent.level + 1 : 1,
-          isDisabled: childrenOfCategory.length > 0
-        });
-
-        result = result.concat(convertOptions(categories, category, childrenOfCategory));
-      });
-    }
-
-    return result;
-  };
-
-  React.useEffect(function () {
-    getData();
-  }, []);
-  return {
-    categories: categories
-  };
-};
-
-var optionStyles = {
-  control: function control(styles) {
-    return _extends({}, styles, {
-      backgroundColor: 'white'
-    });
-  },
-  option: function option(styles, _ref) {
-    var data = _ref.data;
-    return _extends({}, styles, {
-      fontWeight: !(data !== null && data !== void 0 && data.level) ? "bold" : "normal",
-      paddingLeft: ((data === null || data === void 0 ? void 0 : data.level) || 0) + 1 + "rem",
-      paddingRight: "1rem",
-      cursor: data.isDisabled ? 'not-allowed' : 'pointer',
-      color: "var(--color)",
-      "&:first-letter": {
-        textTransform: "uppercase"
-      }
-    });
-  }
-};
-
-var CategorySelector = function CategorySelector(_ref2) {
-  var value = _ref2.value,
-      rest = _objectWithoutPropertiesLoose(_ref2, ["value"]);
-
-  var _useCategorySelector = useCategorySelector(),
-      categories = _useCategorySelector.categories;
-
-  var initialValue = !!value ? categories.find(function (option) {
-    return option.value === value;
-  }) || null : null;
-  return React__default.createElement(Select, Object.assign({
-    value: initialValue,
-    options: categories,
-    styles: optionStyles,
-    placeholder: "Select category..."
-  }, rest));
-};
-
 var StarRatingSelector = function StarRatingSelector(props) {
   var id = props.id;
   var initValue = !!id ? STAR_OPTIONS.find(function (option) {
@@ -8158,13 +7717,23 @@ var NotificationStatusSelector = function NotificationStatusSelector(_ref) {
 
 var NotificationStatusSelector$1 = React.memo(NotificationStatusSelector);
 
+var utcToLocalTime = (function (time, FORMAT) {
+  if (time === DATE_MIN_VALUE) return "";
+
+  try {
+    return moment.utc(time).local().format(FORMAT || "yyyy-MM-DD");
+  } catch (_unused) {
+    return "";
+  }
+});
+
 var defaultFilters = {
   currentPage: 1,
   pageSize: 30,
   searchString: "",
   isRead: false
 };
-var TITLE$9 = "Notification list";
+var TITLE$8 = "Notification list";
 var NOTIFICATION_CHANNEL$1 = "NOTIFICATION_CHANNEL";
 var NEW_NOTIFICATION$1 = "NEW_NOTIFICATION";
 
@@ -8289,7 +7858,7 @@ var useNotificationList = function useNotificationList() {
     }
   }, [filters]);
   React.useEffect(function () {
-    document.title = TITLE$9;
+    document.title = TITLE$8;
   }, []);
   React.useEffect(function () {
     getData();
@@ -8374,7 +7943,7 @@ var useNotificationList = function useNotificationList() {
   };
 };
 
-var header$3 = "Notification list";
+var header$2 = "Notification list";
 var ICON_SIZE = 20;
 
 var NotificationList = function NotificationList() {
@@ -8395,7 +7964,7 @@ var NotificationList = function NotificationList() {
     }
   }, React__default.createElement("h5", {
     className: "mb-2"
-  }, header$3), React__default.createElement(reactstrap.Row, {
+  }, header$2), React__default.createElement(reactstrap.Row, {
     className: "my-2"
   }, React__default.createElement(reactstrap.Col, {
     md: 8
@@ -8495,6 +8064,35 @@ var NotificationList = function NotificationList() {
   }))));
 };
 
+var searchInputStyle = {
+  height: 38
+};
+
+var SearchBoxContainer = function SearchBoxContainer(_ref) {
+  var text = _ref.text,
+      initValue = _ref.initValue,
+      onClick = _ref.onClick,
+      onSearch = _ref.onSearch,
+      placeholder = _ref.placeholder;
+  return React__default.createElement("div", {
+    className: "d-flex align-items-center"
+  }, React__default.createElement("div", null, React__default.createElement(AddButton, {
+    text: text,
+    onClick: onClick
+  })), React__default.createElement("div", {
+    className: "flex-grow-1 ml-2"
+  }, React__default.createElement(SearchBox$1, {
+    initValue: initValue,
+    onSearch: onSearch,
+    placeholder: placeholder,
+    style: searchInputStyle
+  })));
+};
+
+SearchBoxContainer.defaultProps = {
+  placeholder: "Type something to search"
+};
+
 var CustomTabs = function CustomTabs(props) {
   var history = reactRouterDom.useHistory();
   var location = reactRouterDom.useLocation();
@@ -8899,7 +8497,7 @@ var get$8 = function get(filter) {
   });
 };
 
-var TITLE$a = "Gallery";
+var TITLE$9 = "Gallery";
 var defaultFilter = {
   searchString: ""
 };
@@ -9136,7 +8734,7 @@ var useGalleryList = function useGalleryList(isLibrary) {
     }
   }, [dispatch, filters]);
   React.useEffect(function () {
-    document.title = TITLE$a;
+    document.title = TITLE$9;
     dispatch(setTargetMedia({
       targetMedia: undefined
     }));
@@ -9328,7 +8926,7 @@ var MediaDetail = function MediaDetail(_ref) {
 
 var MediaDetail$1 = React__default.memo(MediaDetail);
 
-var header$4 = "Gallery";
+var header$3 = "Gallery";
 
 var GalleryList = function GalleryList(_ref) {
   var isLibrary = _ref.isLibrary;
@@ -9339,7 +8937,7 @@ var GalleryList = function GalleryList(_ref) {
     className: "fadeIn animated"
   }, !isLibrary && React__default.createElement("h5", {
     className: "mb-2"
-  }, header$4), React__default.createElement(reactstrap.Row, {
+  }, header$3), React__default.createElement(reactstrap.Row, {
     className: "mb-2"
   }, React__default.createElement(reactstrap.Col, {
     md: 8
@@ -9963,6 +9561,9 @@ var commonReducer$8 = toolkit.createReducer(initialState$e, function (builder) {
   });
 });
 
+var setUserList = toolkit.createAction("users/setUserList");
+var setStudentList = toolkit.createAction("users/setStudentList");
+
 var initialState$f = {
   userList: [],
   totalItems: 0,
@@ -10542,133 +10143,489 @@ var widgetReducer = toolkit.createReducer(initialState$y, function (builder) {
 
 var setBandScoreList = toolkit.createAction("bandScores/setBandScoreList");
 
-var initialState$z = {
-  bandScoreList: [],
-  totalItems: 0
-};
-var commonReducer$h = toolkit.createReducer(initialState$z, function (builder) {
-  builder.addCase(setBandScoreList, function (state, action) {
-    state.bandScoreList = action.payload.bandScoreList;
-    state.totalItems = action.payload.totalItems;
-  }).addCase(reset, function (_state, _action) {
-    return initialState$z;
-  });
-});
+var initialState$z = {
+  bandScoreList: [],
+  totalItems: 0
+};
+var commonReducer$h = toolkit.createReducer(initialState$z, function (builder) {
+  builder.addCase(setBandScoreList, function (state, action) {
+    state.bandScoreList = action.payload.bandScoreList;
+    state.totalItems = action.payload.totalItems;
+  }).addCase(reset, function (_state, _action) {
+    return initialState$z;
+  });
+});
+
+var setSchoolBlankDayList = toolkit.createAction("schoolBlankDays/setSchoolBlankDayList");
+
+var initialState$A = {
+  schoolBlankDayList: [],
+  totalItems: 0
+};
+var commonReducer$i = toolkit.createReducer(initialState$A, function (builder) {
+  builder.addCase(setSchoolBlankDayList, function (state, action) {
+    state.schoolBlankDayList = action.payload.schoolBlankDayList;
+    state.totalItems = action.payload.totalItems;
+  }).addCase(reset, function (_state, _action) {
+    return initialState$A;
+  });
+});
+
+var setStudentIdSelectedByTeacher = toolkit.createAction("navMobile/setStudentIdSelectedByTeacher");
+
+var initialState$B = {
+  studentIdSelectedByTeacher: 0
+};
+var navMobileReducer = toolkit.createReducer(initialState$B, function (builder) {
+  builder.addCase(setStudentIdSelectedByTeacher, function (state, action) {
+    state.studentIdSelectedByTeacher = action.payload;
+  }).addCase(reset, function (_state, _action) {
+    return initialState$B;
+  });
+});
+
+var rootReducer = combineReducers({
+  common: commonReducer,
+  classes: classReducer,
+  conferenceRubrics: conferenceRubricReducer,
+  faqs: commonReducer$1,
+  skills: commonReducer$2,
+  emailTemplate: emailTemplateReducer,
+  suggestionBank: suggestionBankReducer,
+  learningStrategy: learningStrategyReducer,
+  subjects: commonReducer$3,
+  learningSupportCategories: commonReducer$4,
+  questionBank: questionBankReducer,
+  badges: commonReducer$5,
+  semester: commonReducer$6,
+  goalExamples: commonReducer$8,
+  users: commonReducer$9,
+  reflections: reflectionReducer,
+  reflectionResults: reflectionReducer$1,
+  feedbacks: commonReducer$a,
+  assessments: commonReducer$b,
+  questionByCategory: questionCategoryReducer,
+  mailCategory: questionBankReducer$1,
+  questionCate: questionCateReducer,
+  notification: questionBankReducer$2,
+  myStudent: commonReducer$c,
+  assignments: commonReducer$7,
+  assistants: assistantReducer,
+  sesstionTemplates: sessionTemplateReducer,
+  sessionTemplateGeneralClasses: sessionTemplateGeneralClassReducer,
+  tutorialScreens: tutorialScreenReducer,
+  customAlerts: commonReducer$d,
+  gallery: commonReducer$e,
+  dashboard: dashboardReducer,
+  sessionPlayer: sessionPlayerReducer,
+  dataPlayer: dataPlayer,
+  certificate: commonReducer$f,
+  improveMyClass: commonReducer$g,
+  widget: widgetReducer,
+  bandScores: commonReducer$h,
+  schoolBlankDays: commonReducer$i,
+  navMobileReducer: navMobileReducer
+});
+
+var store = toolkit.configureStore({
+  reducer: rootReducer,
+  middleware: function middleware(getDefaultMiddleware) {
+    return getDefaultMiddleware({
+      serializableCheck: false
+    }).concat(logger);
+  }
+});
+
+var isInViewport = function isInViewport(el) {
+  var rect = el === null || el === void 0 ? void 0 : el.getBoundingClientRect();
+  return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
+};
+
+var debounce = function debounce(callback, wait) {
+  var timeout = null;
+  return function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    var next = function next() {
+      return callback.apply(void 0, args);
+    };
+
+    clearTimeout(timeout);
+    timeout = setTimeout(next, wait);
+  };
+};
+
+var getTextFromHTML = function getTextFromHTML(htmlString) {
+  var p = document.createElement("p");
+  p.innerHTML = htmlString;
+  var text = p.innerText;
+  p.remove();
+  return text;
+};
+
+var generateRandomString = (function () {
+  return (Math.random() + 1).toString(36).substring(7);
+});
+
+var amplitudeClient = amplitude.getInstance();
+
+var USER_URL$2 = "/admin/user";
+var CREATE_USER_URL = "/admin/create-user";
+var TITLE$a = "User list";
+var HOMEPAGE_TEACHER$1 = "/home";
+var HOMEPAGE_STUDENT$1 = "/home";
+var HOMEPAGE_ADMIN$1 = "/admin/dashboard";
+var HOMEPAGE_PARENT$1 = "/parent";
+var HOMEPAGE_DISTRICT$1 = "/admin/schools";
+var HOMEPAGE_EDU_TEACHER$1 = "/list-student";
+
+var useUserList = function useUserList() {
+  var history = reactRouterDom.useHistory();
+  var query = new URLSearchParams(location.search);
+  var queryName = query.get("query");
+  var userList = reactRedux.useSelector(function (state) {
+    return state.users.userList;
+  });
+  var totalItems = reactRedux.useSelector(function (state) {
+    return state.users.totalItems;
+  });
+
+  var _useFilters = useFilters(),
+      filters = _useFilters.filters,
+      changeFilters = _useFilters.changeFilters;
+
+  var _useState = React.useState(!!queryName ? queryName : ""),
+      fullName = _useState[0],
+      setFullName = _useState[1];
+
+  var isDistrict = window.location.host.includes("-district");
+  var dispatch = reactRedux.useDispatch();
+  var getData = React.useCallback(function (fullName) {
+    try {
+      var _temp3 = function _temp3() {
+        dispatch(setLoading(false));
+      };
+
+      dispatch(setLoading(true));
+
+      var _temp4 = _catch(function () {
+        return Promise.resolve(fullName ? get$5(_extends({}, filters, {
+          searchString: fullName
+        })) : get$5(filters)).then(function (res) {
+          var _res$data = res.data,
+              items = _res$data.items,
+              totalItems = _res$data.totalItems;
+
+          for (var _iterator = _createForOfIteratorHelperLoose(items), _step; !(_step = _iterator()).done;) {
+            var user = _step.value;
+            user.roles = user.roles.includes("EduTeacher") ? [ROLES.EDUTEACHER] : user.roles;
+          }
+
+          dispatch(setUserList({
+            userList: items,
+            totalItems: totalItems
+          }));
+        });
+      }, function (err) {
+        var _err$response, _err$response$data;
+
+        dispatch(setAlert({
+          type: "danger",
+          message: ((_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : _err$response$data.title) || err.message
+        }));
+      });
+
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }, [dispatch, filters]);
+  React.useEffect(function () {
+    document.title = TITLE$a;
+  }, []);
+  React.useEffect(function () {
+    if (!!fullName) {
+      getData(fullName);
+      setFullName(null);
+    } else {
+      getData();
+    }
+  }, [filters]);
+  var removeData = React.useCallback(function (id) {
+    dispatch(setLoading(true));
+
+    try {
+      dispatch(setModal({
+        isOpen: true,
+        type: "warning",
+        message: "Do you want to remove this user?",
+        onConfirm: function () {
+          try {
+            return Promise.resolve(remove$3(id)).then(function () {
+              dispatch(setAlert({
+                type: "success",
+                message: "Remove user successfully"
+              }));
+              changeFilters({
+                currentPage: 1
+              });
+            });
+          } catch (e) {
+            return Promise.reject(e);
+          }
+        }
+      }));
+    } catch (err) {
+      var _err$response2, _err$response2$data;
+
+      dispatch(setAlert({
+        type: "danger",
+        message: ((_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : (_err$response2$data = _err$response2.data) === null || _err$response2$data === void 0 ? void 0 : _err$response2$data.title) || err.message
+      }));
+    }
+
+    dispatch(setLoading(false));
+  }, [filters]);
+
+  var redirectLoginUser = function redirectLoginUser(res) {
+    var _res$data2 = res.data,
+        token = _res$data2.token,
+        id = _res$data2.id,
+        firstName = _res$data2.firstName,
+        lastName = _res$data2.lastName,
+        roles = _res$data2.roles,
+        email = _res$data2.email,
+        profileImageFileName = _res$data2.profileImageFileName;
+    localStorage.setItem(ACCESS_TOKEN, token);
+    localStorage.removeItem(NOTIFICATION_ALERT_KEY);
+    dispatch(setUser({
+      id: id,
+      firstName: firstName,
+      lastName: lastName,
+      roles: roles,
+      email: email,
+      profileImageFileName: profileImageFileName
+    }));
+
+    if (isDistrict) {
+      history.push(HOMEPAGE_DISTRICT$1);
+    } else if (roles.includes("Admin")) {
+      history.push(HOMEPAGE_ADMIN$1);
+    } else if (roles.includes("Teacher") || roles.includes("Assistant")) {
+      history.push(HOMEPAGE_TEACHER$1);
+    } else if (roles.includes("Student")) {
+      history.push(HOMEPAGE_STUDENT$1);
+    } else if (roles.includes("Parent")) {
+      history.push(HOMEPAGE_PARENT$1);
+    } else if (roles.includes("EduTeacher")) {
+      history.push(HOMEPAGE_EDU_TEACHER$1);
+    }
+  };
 
-var setSchoolBlankDayList = toolkit.createAction("schoolBlankDays/setSchoolBlankDayList");
+  var swicthUser = React.useCallback(function (id) {
+    try {
+      var _temp7 = function _temp7() {
+        dispatch(setLoading(false));
+      };
 
-var initialState$A = {
-  schoolBlankDayList: [],
-  totalItems: 0
-};
-var commonReducer$i = toolkit.createReducer(initialState$A, function (builder) {
-  builder.addCase(setSchoolBlankDayList, function (state, action) {
-    state.schoolBlankDayList = action.payload.schoolBlankDayList;
-    state.totalItems = action.payload.totalItems;
-  }).addCase(reset, function (_state, _action) {
-    return initialState$A;
-  });
-});
+      dispatch(setLoading(true));
 
-var setStudentIdSelectedByTeacher = toolkit.createAction("navMobile/setStudentIdSelectedByTeacher");
+      var _temp8 = _catch(function () {
+        return Promise.resolve(switchAccountUser(id)).then(function (res) {
+          var data = res.data;
+          dispatch(setModal({
+            isOpen: true,
+            type: "warning",
+            message: "Do you want to impersonate this user?",
+            onConfirm: function () {
+              try {
+                var _temp11 = function _temp11() {
+                  dispatch(setLoading(false));
+                };
 
-var initialState$B = {
-  studentIdSelectedByTeacher: 0
-};
-var navMobileReducer = toolkit.createReducer(initialState$B, function (builder) {
-  builder.addCase(setStudentIdSelectedByTeacher, function (state, action) {
-    state.studentIdSelectedByTeacher = action.payload;
-  }).addCase(reset, function (_state, _action) {
-    return initialState$B;
-  });
-});
+                dispatch(setLoading(true));
+
+                var _temp12 = _catch(function () {
+                  var req = {
+                    email: data.email,
+                    password: "default",
+                    accessToken: data.token
+                  };
+                  return Promise.resolve(logIn(req)).then(function (res) {
+                    localStorage.clear();
+                    redirectLoginUser(res);
+                  });
+                }, function (err) {
+                  var _err$response3, _err$response3$data;
 
-var rootReducer = combineReducers({
-  common: commonReducer,
-  classes: classReducer,
-  conferenceRubrics: conferenceRubricReducer,
-  faqs: commonReducer$1,
-  skills: commonReducer$2,
-  emailTemplate: emailTemplateReducer,
-  suggestionBank: suggestionBankReducer,
-  learningStrategy: learningStrategyReducer,
-  subjects: commonReducer$3,
-  learningSupportCategories: commonReducer$4,
-  questionBank: questionBankReducer,
-  badges: commonReducer$5,
-  semester: commonReducer$6,
-  goalExamples: commonReducer$8,
-  users: commonReducer$9,
-  reflections: reflectionReducer,
-  reflectionResults: reflectionReducer$1,
-  feedbacks: commonReducer$a,
-  assessments: commonReducer$b,
-  questionByCategory: questionCategoryReducer,
-  mailCategory: questionBankReducer$1,
-  questionCate: questionCateReducer,
-  notification: questionBankReducer$2,
-  myStudent: commonReducer$c,
-  assignments: commonReducer$7,
-  assistants: assistantReducer,
-  sesstionTemplates: sessionTemplateReducer,
-  sessionTemplateGeneralClasses: sessionTemplateGeneralClassReducer,
-  tutorialScreens: tutorialScreenReducer,
-  customAlerts: commonReducer$d,
-  gallery: commonReducer$e,
-  dashboard: dashboardReducer,
-  sessionPlayer: sessionPlayerReducer,
-  dataPlayer: dataPlayer,
-  certificate: commonReducer$f,
-  improveMyClass: commonReducer$g,
-  widget: widgetReducer,
-  bandScores: commonReducer$h,
-  schoolBlankDays: commonReducer$i,
-  navMobileReducer: navMobileReducer
-});
+                  setAlert({
+                    type: "danger",
+                    message: ((_err$response3 = err.response) === null || _err$response3 === void 0 ? void 0 : (_err$response3$data = _err$response3.data) === null || _err$response3$data === void 0 ? void 0 : _err$response3$data.title) || err.message
+                  });
+                });
 
-var store = toolkit.configureStore({
-  reducer: rootReducer,
-  middleware: function middleware(getDefaultMiddleware) {
-    return getDefaultMiddleware({
-      serializableCheck: false
-    }).concat(logger);
-  }
-});
+                return Promise.resolve(_temp12 && _temp12.then ? _temp12.then(_temp11) : _temp11(_temp12));
+              } catch (e) {
+                return Promise.reject(e);
+              }
+            }
+          }));
+        });
+      }, function (err) {
+        var _err$response4, _err$response4$data;
 
-var isInViewport = function isInViewport(el) {
-  var rect = el === null || el === void 0 ? void 0 : el.getBoundingClientRect();
-  return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
-};
+        dispatch(setAlert({
+          type: "danger",
+          message: ((_err$response4 = err.response) === null || _err$response4 === void 0 ? void 0 : (_err$response4$data = _err$response4.data) === null || _err$response4$data === void 0 ? void 0 : _err$response4$data.title) || err.message
+        }));
+      });
 
-var debounce = function debounce(callback, wait) {
-  var timeout = null;
-  return function () {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+      return Promise.resolve(_temp8 && _temp8.then ? _temp8.then(_temp7) : _temp7(_temp8));
+    } catch (e) {
+      return Promise.reject(e);
     }
+  }, [filters]);
 
-    var next = function next() {
-      return callback.apply(void 0, args);
-    };
+  var reDirectDetailPage = function reDirectDetailPage(id) {
+    var url = !!id ? USER_URL$2 + "/" + id : CREATE_USER_URL;
+    history.push(url);
+  };
 
-    clearTimeout(timeout);
-    timeout = setTimeout(next, wait);
+  return {
+    userList: userList,
+    totalItems: totalItems,
+    filters: filters,
+    queryName: queryName,
+    getData: getData,
+    removeData: removeData,
+    changeFilters: changeFilters,
+    reDirectDetailPage: reDirectDetailPage,
+    swicthUser: swicthUser
   };
 };
 
-var getTextFromHTML = function getTextFromHTML(htmlString) {
-  var p = document.createElement("p");
-  p.innerHTML = htmlString;
-  var text = p.innerText;
-  p.remove();
-  return text;
-};
+var header$4 = "User";
 
-var generateRandomString = (function () {
-  return (Math.random() + 1).toString(36).substring(7);
-});
+var UserList = function UserList() {
+  var _useUserList = useUserList(),
+      queryName = _useUserList.queryName,
+      userList = _useUserList.userList,
+      totalItems = _useUserList.totalItems,
+      filters = _useUserList.filters,
+      removeData = _useUserList.removeData,
+      changeFilters = _useUserList.changeFilters,
+      reDirectDetailPage = _useUserList.reDirectDetailPage,
+      swicthUser = _useUserList.swicthUser;
 
-var amplitudeClient = amplitude.getInstance();
+  var _useTranslation = reactI18next.useTranslation(),
+      t = _useTranslation.t;
+
+  return React__default.createElement("div", {
+    className: "fadeIn animated"
+  }, React__default.createElement("h5", {
+    className: "mb-2"
+  }, t("" + header$4)), React__default.createElement(reactstrap.Row, {
+    className: "my-2"
+  }, React__default.createElement(reactstrap.Col, {
+    md: 8
+  }, React__default.createElement(SearchBoxContainer, {
+    text: t("create_user"),
+    onClick: function onClick() {
+      return reDirectDetailPage();
+    },
+    initValue: !!queryName ? queryName : "",
+    onSearch: function onSearch(searchString) {
+      return changeFilters({
+        searchString: searchString
+      });
+    },
+    placeholder: t("type_something_to_search_by_user_name")
+  })), React__default.createElement(reactstrap.Col, {
+    md: 4,
+    className: "d-flex justify-content-end align-items-center"
+  }, t("total_of_users"), " : ", totalItems)), React__default.createElement(reactstrap.Row, {
+    className: "mb-2"
+  }, React__default.createElement(reactstrap.Col, {
+    md: 12
+  }, userList && userList.length > 0 ? React__default.createElement("div", null, React__default.createElement(reactstrap.Table, {
+    bordered: true,
+    hover: true,
+    striped: true,
+    responsive: true,
+    size: "sm"
+  }, React__default.createElement("thead", null, React__default.createElement("tr", null, React__default.createElement("th", {
+    className: "align-top"
+  }, t("name")), React__default.createElement("th", {
+    className: "align-top"
+  }, t("email")), React__default.createElement("th", {
+    className: "align-top"
+  }, t("age")), React__default.createElement("th", {
+    className: "align-top"
+  }, t("role")), React__default.createElement("th", {
+    className: "align-top"
+  }, t("active_status")), React__default.createElement("th", {
+    className: "align-top"
+  }, t("created_time")), React__default.createElement("th", {
+    className: "text-center"
+  }, t("action")))), React__default.createElement("tbody", null, userList.map(function (record) {
+    return React__default.createElement("tr", {
+      key: record.id
+    }, React__default.createElement("td", {
+      className: "align-middle"
+    }, React__default.createElement(LinkEditButton, {
+      label: "" + record.fullName,
+      onClick: function onClick() {
+        return reDirectDetailPage(record.id);
+      }
+    })), React__default.createElement("td", {
+      className: "align-middle"
+    }, record.email), React__default.createElement("td", {
+      className: "align-middle"
+    }, differenceInCalendarYears(new Date(), new Date(record.dateOfBirth))), React__default.createElement("td", {
+      className: "align-middle"
+    }, !!record.roles && record.roles.join(", ")), React__default.createElement("td", {
+      className: "align-middle"
+    }, record.isActive ? t("active") : t("inactive")), React__default.createElement("td", {
+      className: "align-middle"
+    }, utcToLocalTime(record === null || record === void 0 ? void 0 : record.createTime, "yyyy-MM-DD HH:mm")), React__default.createElement("td", {
+      className: "text-center align-middle"
+    }, React__default.createElement(fa.FaUsersCog, {
+      style: {
+        fontSize: "18px",
+        marginRight: "10px",
+        cursor: "pointer"
+      },
+      onClick: function onClick() {
+        return swicthUser(record.id);
+      }
+    }), React__default.createElement(DeleteButtonIcon, {
+      onClick: function onClick() {
+        return removeData(record.id);
+      }
+    })));
+  })))) : React__default.createElement(EmptyDataAlert, {
+    label: t("user")
+  })), React__default.createElement(reactstrap.Col, {
+    md: 12
+  }, React__default.createElement(CustomPagination, {
+    filters: filters,
+    totalRecordCount: totalItems,
+    changePageSize: function changePageSize(pageSize) {
+      return changeFilters({
+        pageSize: pageSize
+      });
+    },
+    changePage: function changePage(currentPage) {
+      return changeFilters({
+        currentPage: currentPage
+      });
+    }
+  }))));
+};
+
+var amplitudeClient$1 = amplitude.getInstance();
 
 Object.defineProperty(exports, 'I18nextProvider', {
     enumerable: true,
@@ -10688,7 +10645,6 @@ exports.AcademicClassSelector = AcademicClassSelector;
 exports.AddButton = AddButton;
 exports.BASE_URL = BASE_URL;
 exports.CHAT_CHANNEL = CHAT_CHANNEL;
-exports.CategorySelector = CategorySelector;
 exports.CommonAlert = CommonAlert;
 exports.CommonHeader = CommonHeader;
 exports.CommonModal = CommonModal$1;
@@ -10713,7 +10669,8 @@ exports.FaqList = FaqList;
 exports.FileInput = InputFile;
 exports.GOOGLE_RECAPTCHA_KEY = GOOGLE_RECAPTCHA_KEY;
 exports.GalleryList = GalleryList;
-exports.INIT_AMPLITUDE_KEY = INIT_AMPLITUDE_KEY;
+exports.INIT_AMPLITUDE_KEY_PROD = INIT_AMPLITUDE_KEY_PROD;
+exports.INIT_AMPLITUDE_KEY_STAGE = INIT_AMPLITUDE_KEY_STAGE;
 exports.Images = Images;
 exports.LICENSE_AGGRID = LICENSE_AGGRID;
 exports.LinkEditButton = LinkEditButton;
@@ -10748,7 +10705,7 @@ exports.UploadFileButton = UploadFileButton;
 exports.UserDetail = UserDetail;
 exports.UserList = UserList;
 exports.addTab = addTab;
-exports.amplitudeClient = amplitudeClient;
+exports.amplitudeClient = amplitudeClient$1;
 exports.answerQuestion = answerQuestion;
 exports.answerQuestionDataPlayer = answerQuestionDataPlayer;
 exports.api = api;
@@ -10769,6 +10726,7 @@ exports.getTextFromHTML = getTextFromHTML;
 exports.i18n = i18n;
 exports.initAmplitude = initAmplitude;
 exports.isInViewport = isInViewport;
+exports.isLocalhost = isLocalhost;
 exports.reset = reset;
 exports.setAlert = setAlert;
 exports.setAssessmentList = setAssessmentList;