mario-education 2.2.6 → 2.3.0

package/dist/index.modern.js

@@ -1,4 +1,4 @@
-import { api, BASE_URL, setAlert, CustomSelector, LinkEditButton, DeleteButtonIcon, EmptyDataAlert, CommonModal, RequiredLabel, ErrorHandler, useFilters, setLoading, setClassList, setModal, QuitPrompt, AddButton, CustomPagination, setConferenceRubricList, SearchBoxContainer, getTextFromHTML, generateRandomString, QuestionCategorySelector, DetailActionButtons, SuggestionCategorySelector, CreatableSelector, setSuggestionList, setStrategyList, UploadFileButton, systemStudentBadge, setBadgeList, getFileUrl, setGoalExampleList, setSubjectList, setLearningSupportCategoryList, apiUpload, utcToLocalTime, DATE_FORMAT, setSemesterList, setBandScoreList, EditButtonIcon, setSchoolBlankDayList, SearchBox, CustomTab, SkillList, QUESTION_TYPES, EMOTIONS, QUESTION_TYPES_OPTIONS, setQuestionList, setQuestionByCategory, setSelectQuestion, setResetQuestionList, setMoveItemQuestion, setEditItemQuesion, DEFAULT_FILTER, setReflectionList, setReflectionResultList, DATE_RESULT, StarRatingSelector, editorConfig, TINY_MCE_API_KEY, QuestionTypeSelector, setAssessmentList, FULL_DATE_RESULT, setFeedbackList, setTutorialScreenList, setQuestionCateList, setAssignmentList, setSessionTemplateList, setSessionTemplateGeneralClassList, setCustomAlertList, systemCertificateUpload, setCertificateList, Loading as Loading$1, LICENSE_AGGRID } from 'mario-core';
+import { api, BASE_URL, setAlert, CustomSelector, LinkEditButton, DeleteButtonIcon, EmptyDataAlert, CommonModal, RequiredLabel, ErrorHandler, useFilters, setLoading, setClassList, setModal, QuitPrompt, AddButton, CustomPagination, setConferenceRubricList, SearchBoxContainer, getTextFromHTML, generateRandomString, QuestionCategorySelector, DetailActionButtons, SuggestionCategorySelector, CreatableSelector, setSuggestionList, setStrategyList, UploadFileButton, systemStudentBadge, setBadgeList, getFileUrl, setGoalExampleList, setSubjectList, setLearningSupportCategoryList, apiUpload, utcToLocalTime, DATE_FORMAT, setSemesterList, setBandScoreList, EditButtonIcon, setSchoolBlankDayList, SearchBox, CustomTab, SkillList, QUESTION_TYPES, EMOTIONS, QUESTION_TYPES_OPTIONS, setQuestionList, setQuestionByCategory, setSelectQuestion, setResetQuestionList, setMoveItemQuestion, setEditItemQuesion, DEFAULT_FILTER, setReflectionList, setReflectionResultList, DATE_RESULT, StarRatingSelector, editorConfig, TINY_MCE_API_KEY, QuestionTypeSelector, setAssessmentList, FULL_DATE_RESULT, setFeedbackList, setTutorialScreenList, setQuestionCateList, setAssignmentList, setSessionTemplateList, setSessionTemplateGeneralClassList, setCustomAlertList, systemCertificateUpload, setCertificateList, LICENSE_AGGRID } from 'mario-core';
 import { LicenseManager } from '@ag-grid-enterprise/core';
 import React, { useState, useRef, useCallback, useEffect, forwardRef, useMemo, Fragment, memo } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
@@ -5410,7 +5410,7 @@ var SemesterDetailModal = function SemesterDetailModal(props, ref) {
     })), React.createElement(Col, {
       md: 6
     }, React.createElement(DatePicker, {
-      value: utcToLocalTime(values.startTime, "MMM dd, yyyy"),
+      value: !!values.startTime ? utcToLocalTime(values.startTime, "Do MMMM YYYY") : "",
       todayButton: "Today",
       peekNextMonth: true,
       showMonthDropdown: true,
@@ -5441,7 +5441,7 @@ var SemesterDetailModal = function SemesterDetailModal(props, ref) {
     })), React.createElement(Col, {
       md: 6
     }, React.createElement(DatePicker, {
-      value: utcToLocalTime(values.endTime, "MMM dd, yyyy"),
+      value: !!values.endTime ? utcToLocalTime(values.endTime, "Do MMMM YYYY") : "",
       todayButton: "Today",
       peekNextMonth: true,
       showMonthDropdown: true,
@@ -6057,9 +6057,9 @@ var SemesterList = function SemesterList() {
       }
     })), React.createElement("td", {
       className: "align-middle"
-    }, utcToLocalTime(record.startTime, "MMM dd, yyyy")), React.createElement("td", {
+    }, utcToLocalTime(record.startTime, "Do MMMM YYYY")), React.createElement("td", {
       className: "align-middle"
-    }, utcToLocalTime(record.endTime, "MMM dd, yyyy")), React.createElement("td", {
+    }, utcToLocalTime(record.endTime, "Do MMMM YYYY")), React.createElement("td", {
       className: "text-center align-middle"
     }, React.createElement(DeleteButtonIcon, {
       onClick: function onClick() {
@@ -7241,9 +7241,9 @@ var SchoolBlankDayList = function SchoolBlankDayList() {
       }
     })), React.createElement("td", {
       className: "align-middle"
-    }, utcToLocalTime(record.startTime, DATE_FORMAT)), React.createElement("td", {
+    }, utcToLocalTime(record.startTime, "Do MMMM YYYY")), React.createElement("td", {
       className: "align-middle"
-    }, utcToLocalTime(record.endTime, DATE_FORMAT)), React.createElement("td", {
+    }, utcToLocalTime(record.endTime, "Do MMMM YYYY")), React.createElement("td", {
       className: "text-center align-middle"
     }, React.createElement(DeleteButtonIcon, {
       onClick: function onClick() {
@@ -11729,109 +11729,6 @@ var TutorialScreenContainer = function TutorialScreenContainer() {
   });
 };
 
-var QuestionBankList$1 = function QuestionBankList(_ref) {
-  var isDefaultQuestion = _ref.isDefaultQuestion,
-      isDefaultQuestionGeneral = _ref.isDefaultQuestionGeneral;
-
-  var _useQuestionList = useQuestionList(isDefaultQuestion, isDefaultQuestionGeneral),
-      totalItems = _useQuestionList.totalItems,
-      gridOptions = _useQuestionList.gridOptions,
-      setRef = _useQuestionList.setRef,
-      goToDetail = _useQuestionList.goToDetail,
-      filters = _useQuestionList.filters,
-      changeFilters = _useQuestionList.changeFilters,
-      updateOrderQuestions = _useQuestionList.updateOrderQuestions;
-
-  var onRowDragEnd = function onRowDragEnd(e) {
-    var dataAfterDrag = e.node.parent.childrenAfterFilter.map(function (item, index) {
-      return {
-        id: item.data.id,
-        orderDrag: ++index
-      };
-    });
-    updateOrderQuestions(dataAfterDrag, isDefaultQuestionGeneral);
-  };
-
-  return React.createElement("div", {
-    className: "animated fadeIn"
-  }, React.createElement(Row, {
-    className: "my-2"
-  }, React.createElement(Col, {
-    md: 8
-  }, React.createElement(SearchBoxContainer, {
-    text: "Create question",
-    onClick: function onClick() {
-      return goToDetail();
-    },
-    initValue: filters.searchString,
-    onSearch: function onSearch(searchString) {
-      return changeFilters({
-        searchString: searchString
-      });
-    },
-    placeholder: "Type something to Search question"
-  })), isDefaultQuestion && React.createElement(Col, {
-    md: 2
-  }, React.createElement(DefaultQuestionStudentTeacherFilter, {
-    isDefaultQuestionTeacher: filters.isDefaultQuestionTeacher,
-    onChange: function onChange(e) {
-      return changeFilters({
-        isDefaultQuestionTeacher: e ? e.value : null
-      });
-    }
-  })), isDefaultQuestionGeneral && React.createElement(Col, {
-    md: 2
-  }, React.createElement(DefaultQuestionStudentTeacherFilter, {
-    isDefaultQuestionTeacher: filters.isDefaultQuestionGeneralClassTeacher,
-    onChange: function onChange(e) {
-      return changeFilters({
-        isDefaultQuestionGeneralClassTeacher: e ? e.value : null
-      });
-    },
-    isDefaultGeneralClass: true
-  })), React.createElement(Col, {
-    md: isDefaultQuestion || isDefaultQuestionGeneral ? 2 : 4,
-    className: "d-flex align-items-center justify-content-end"
-  }, "Total of questions: ", totalItems)), React.createElement(Row, {
-    className: "mb-2"
-  }, React.createElement(Col, {
-    md: 12,
-    className: "mb-2"
-  }, React.createElement("div", {
-    className: "ag-theme-balham w-100"
-  }, React.createElement(AgGridReact, {
-    domLayout: "autoHeight",
-    gridOptions: gridOptions,
-    masterDetail: true,
-    onGridReady: function onGridReady(params) {
-      setRef(params.api);
-    },
-    rowDragManaged: true,
-    animateRows: true,
-    modules: [MasterDetailModule, ClientSideRowModelModule],
-    onRowDragEnd: onRowDragEnd
-  }))), React.createElement(Col, {
-    md: 12
-  }, React.createElement(CustomPagination, {
-    filters: filters,
-    totalRecordCount: totalItems,
-    changePageSize: function changePageSize(pageSize) {
-      return changeFilters({
-        pageSize: pageSize
-      });
-    },
-    changePage: function changePage(currentPage) {
-      return changeFilters({
-        currentPage: currentPage
-      });
-    }
-  }))));
-};
-
-QuestionBankList$1.defaultProps = {
-  isDefaultQuestion: false
-};
-
 var schema$c = object({
   name: string().required("Name is required")
 });
@@ -12260,25 +12157,7 @@ var QuestionCateList = function QuestionCateList() {
 var tabs$3 = [{
   path: "/admin/question/question-list",
   title: "Question list",
-  component: QuestionBankList$1
-}, {
-  path: "/admin/question/default-question-list",
-  title: "Default question list",
-  component: function component() {
-    return React.createElement(QuestionBankList$1, {
-      isDefaultQuestion: true,
-      isDefaultQuestionGeneral: false
-    });
-  }
-}, {
-  path: "/admin/question/default-question-general-list",
-  title: "Default question general class list",
-  component: function component() {
-    return React.createElement(QuestionBankList$1, {
-      isDefaultQuestion: false,
-      isDefaultQuestionGeneral: true
-    });
-  }
+  component: QuestionBankList
 }, {
   path: "/admin/question/question-category",
   title: "Question category",
@@ -17265,107 +17144,6 @@ var DashboardCard = function DashboardCard(_ref) {
   }, children));
 };
 
-var colors = ["#1C77AC", "#00979B", "#8B0000", "#87E0E0", "#2EB82E"];
-var levels = [{
-  name: "No progress",
-  field: "noProgress"
-}, {
-  name: "Slight",
-  field: "slight"
-}, {
-  name: "Moderate",
-  field: "moderate"
-}, {
-  name: "Significant",
-  field: "significant"
-}, {
-  name: "Achieved",
-  field: "achieved"
-}];
-
-var GoalProgressReport = function GoalProgressReport(_ref) {
-  var data = _ref.data;
-  var series = useMemo(function () {
-    if (!data) return [];
-
-    try {
-      return levels.map(function (level) {
-        return {
-          name: level.name,
-          data: data.map(function (item) {
-            return item[level.field];
-          })
-        };
-      });
-    } catch (_unused) {
-      return [];
-    }
-  }, [data]);
-  var categories = useMemo(function () {
-    if (!data) return [];
-
-    try {
-      return data.map(function (item) {
-        return item.createdAt;
-      });
-    } catch (_unused2) {
-      return [];
-    }
-  }, [data]);
-  if (!data) return React.createElement(Loading$1, null);
-  var options = {
-    chart: {
-      type: "bar",
-      height: 350,
-      stacked: true,
-      stackType: "100%",
-      toolbar: {
-        show: false
-      }
-    },
-    plotOptions: {
-      bar: {
-        horizontal: false,
-        columnWidth: "80%"
-      }
-    },
-    colors: colors,
-    responsive: [{
-      breakpoint: 480,
-      options: {
-        legend: {
-          position: "bottom",
-          offsetX: -10,
-          offsetY: 0
-        }
-      }
-    }],
-    xaxis: {
-      categories: categories
-    },
-    fill: {
-      opacity: 1
-    },
-    legend: {
-      position: "right",
-      offsetX: 0,
-      offsetY: 50,
-      onItemClick: {
-        toggleDataSeries: false
-      },
-      onItemHover: {
-        highlightDataSeries: false
-      }
-    }
-  };
-  return React.createElement("div", null, React.createElement(ReactApexChart, {
-    options: options,
-    series: series,
-    type: "bar",
-    height: 350
-  }));
-};
-
 var Loading = function Loading() {
   return React.createElement("div", {
     className: "d-flex align-items-center justify-content-center"
@@ -17387,14 +17165,14 @@ var Loading = function Loading() {
   }, "Loading...")));
 };
 
-var colors$1 = ["rgba(129, 236, 236, 0.8)", "rgba(116, 185, 255, 0.8)", "rgba(250, 177, 160, 0.8)", "rgba(255, 234, 167, 0.8)", "rgba(178, 190, 195, 0.8)", "rgba(85, 239, 196, 0.8)", "rgba(120, 111, 166, 0.8)", "rgba(243, 166, 131, 0.8)"];
+var colors = ["rgba(129, 236, 236, 0.8)", "rgba(116, 185, 255, 0.8)", "rgba(250, 177, 160, 0.8)", "rgba(255, 234, 167, 0.8)", "rgba(178, 190, 195, 0.8)", "rgba(85, 239, 196, 0.8)", "rgba(120, 111, 166, 0.8)", "rgba(243, 166, 131, 0.8)"];
 
 var getColors = function getColors(length) {
-  if (colors$1.length >= length) return colors$1;
-  var newColors = [].concat(colors$1);
+  if (colors.length >= length) return colors;
+  var newColors = [].concat(colors);
 
   while (newColors.length < length) {
-    newColors = [].concat(newColors, colors$1);
+    newColors = [].concat(newColors, colors);
   }
 
   return newColors;
@@ -17429,6 +17207,7 @@ var HighImpact = function HighImpact(_ref) {
   }, [data]);
   if (!data) return React.createElement(Loading, null);
   var series = [{
+    name: "",
     data: ratings
   }];
   var options = {
@@ -17485,7 +17264,7 @@ var HighImpact = function HighImpact(_ref) {
   })));
 };
 
-var colors$2 = ["#1abc9c", "#c0392b"];
+var colors$1 = ["#1abc9c", "#c0392b"];
 
 var LoginCouting = function LoginCouting(_ref) {
   var data = _ref.data;
@@ -17502,11 +17281,11 @@ var LoginCouting = function LoginCouting(_ref) {
   var series = [{
     name: "Teacher",
     data: teacherCount,
-    color: colors$2[0]
+    color: colors$1[0]
   }, {
     name: "Student",
     data: studentCount,
-    color: colors$2[1]
+    color: colors$1[1]
   }];
   var options = {
     chart: {
@@ -17523,7 +17302,7 @@ var LoginCouting = function LoginCouting(_ref) {
     markers: {
       size: 4,
       colors: ["#fff"],
-      strokeColors: colors$2,
+      strokeColors: colors$1,
       strokeWidth: 2,
       strokeOpacity: 0.9,
       strokeDashArray: 0,
@@ -17555,17 +17334,12 @@ var LoginCouting = function LoginCouting(_ref) {
   }));
 };
 
-var colors$3 = ["#00cec9", "#00b894"];
+var colors$2 = ["#00cec9", "#00b894"];
 
 var PerceivedImpact = function PerceivedImpact(_ref) {
   var data = _ref.data;
   if (!data) return React.createElement(Loading, null);
   var series = [{
-    name: "Teacher",
-    data: data.map(function (item) {
-      return item.teacherRating;
-    })
-  }, {
     name: "Student",
     data: data.map(function (item) {
       return item.studentRating;
@@ -17582,7 +17356,7 @@ var PerceivedImpact = function PerceivedImpact(_ref) {
         show: false
       }
     },
-    colors: colors$3,
+    colors: colors$2,
     plotOptions: {
       bar: {
         horizontal: false,
@@ -17620,14 +17394,17 @@ var PerceivedImpact = function PerceivedImpact(_ref) {
   }));
 };
 
-var colors$4 = ["#00b894", "#00cec9", "#0984e3"];
+var colors$3 = ["#00b894", "#00cec9", "#0984e3"];
 
 var Quantity = function Quantity(_ref) {
   var data = _ref.data;
   if (!data) return React.createElement(Loading, null);
   var teacherPercentage = data.teacherPercentage,
       studentPercentage = data.studentPercentage,
-      assistantPercentage = data.assistantPercentage;
+      assistantPercentage = data.assistantPercentage,
+      numberOfTeachers = data.numberOfTeachers,
+      numberOfStudents = data.numberOfStudents,
+      numberOfAssistants = data.numberOfAssistants;
   var series = [teacherPercentage, studentPercentage, assistantPercentage].map(function (number) {
     return Number(number.toFixed(2));
   });
@@ -17637,7 +17414,7 @@ var Quantity = function Quantity(_ref) {
       type: "pie"
     },
     labels: ["Teachers", "Students", "Assistants"],
-    colors: colors$4,
+    colors: colors$3,
     legend: {
       show: false
     },
@@ -17652,16 +17429,16 @@ var Quantity = function Quantity(_ref) {
   };
   var details = [{
     label: "Teachers",
-    color: colors$4[0],
-    value: teacherPercentage
+    color: colors$3[0],
+    value: numberOfTeachers
   }, {
     label: "Students",
-    color: colors$4[1],
-    value: studentPercentage
+    color: colors$3[1],
+    value: numberOfStudents
   }, {
     label: "Assistants",
-    color: colors$4[2],
-    value: assistantPercentage
+    color: colors$3[2],
+    value: numberOfAssistants
   }];
   return React.createElement("div", {
     className: "d-flex h-100"
@@ -17675,8 +17452,6 @@ var Quantity = function Quantity(_ref) {
     bordered: true,
     size: "sm"
   }, React.createElement("tbody", null, details.map(function (item) {
-    var _item$value;
-
     return React.createElement("tr", {
       key: item.label
     }, React.createElement("td", null, item.label), React.createElement("td", {
@@ -17686,8 +17461,8 @@ var Quantity = function Quantity(_ref) {
       style: {
         backgroundColor: item.color
       }
-    })), React.createElement("td", null, Number(((_item$value = item.value) === null || _item$value === void 0 ? void 0 : _item$value.toFixed(2)) || "0"), "%"));
-  }))))), React.createElement("div", {
+    })), React.createElement("td", null, item.value));
+  }))), React.createElement("p", null, "The number of user for each role"))), React.createElement("div", {
     className: "d-flex align-items-end"
   }, React.createElement(ReactApexChart, {
     options: options,
@@ -17697,95 +17472,12 @@ var Quantity = function Quantity(_ref) {
   })));
 };
 
-var colors$5 = ["#f0932b", "#22a6b3", "#6ab04c"];
-var categories = ["Before intervention", "During intervention", "After intervention"];
-
-var findGradeLabel = function findGradeLabel(value, bandScores) {
-  var sortedBandScores = bandScores === null || bandScores === void 0 ? void 0 : bandScores.sort(function (item1, item2) {
-    return item1.value - item2.value;
-  });
-
-  if ((sortedBandScores === null || sortedBandScores === void 0 ? void 0 : sortedBandScores.length) > 0) {
-    for (var i = 0; i < sortedBandScores.length; i++) {
-      var _sortedBandScores$i, _sortedBandScores;
-
-      if (((_sortedBandScores$i = sortedBandScores[i]) === null || _sortedBandScores$i === void 0 ? void 0 : _sortedBandScores$i.value) <= value && value <= ((_sortedBandScores = sortedBandScores[i + 1]) === null || _sortedBandScores === void 0 ? void 0 : _sortedBandScores.value)) {
-        var _sortedBandScores$i2, _sortedBandScores2, _sortedBandScores3;
-
-        if (value - ((_sortedBandScores$i2 = sortedBandScores[i]) === null || _sortedBandScores$i2 === void 0 ? void 0 : _sortedBandScores$i2.value) <= ((_sortedBandScores2 = sortedBandScores[i + 1]) === null || _sortedBandScores2 === void 0 ? void 0 : _sortedBandScores2.value) - value) {
-          var _sortedBandScores$i3;
-
-          return (_sortedBandScores$i3 = sortedBandScores[i]) === null || _sortedBandScores$i3 === void 0 ? void 0 : _sortedBandScores$i3.label;
-        }
-
-        return (_sortedBandScores3 = sortedBandScores[i + 1]) === null || _sortedBandScores3 === void 0 ? void 0 : _sortedBandScores3.label;
-      }
-    }
-  }
-
-  return "";
-};
-
-var Grade = function Grade(_ref) {
-  var data = _ref.data;
-  if (!data) return React.createElement(Loading, null);
-  var series = [{
-    data: [data.beforeIntervention, data.duringIntervention, data.afterIntervention]
-  }];
-  var options = {
-    chart: {
-      height: 350,
-      type: "bar",
-      toolbar: {
-        show: false
-      }
-    },
-    colors: colors$5,
-    plotOptions: {
-      bar: {
-        columnWidth: "45%",
-        distributed: true
-      }
-    },
-    dataLabels: {
-      enabled: false
-    },
-    legend: {
-      show: false
-    },
-    xaxis: {
-      categories: categories
-    },
-    yaxis: {
-      max: Math.max.apply(Math, data.bandScores.map(function (item) {
-        return item.value;
-      })),
-      min: Math.min.apply(Math, data.bandScores.map(function (item) {
-        return item.value;
-      })),
-      labels: {
-        formatter: function formatter(val) {
-          return findGradeLabel(val, data.bandScores);
-        }
-      }
-    }
-  };
-  return React.createElement("div", null, React.createElement(ReactApexChart, {
-    options: options,
-    series: series,
-    type: "bar",
-    height: 350
-  }));
-};
-
 var Dashboard = function Dashboard() {
   var _useDashboard = useDashboard(),
       loginCounting = _useDashboard.loginCounting,
       quantity = _useDashboard.quantity,
-      goalProgress = _useDashboard.goalProgress,
       highImpact = _useDashboard.highImpact,
-      perceivedImpact = _useDashboard.perceivedImpact,
-      grade = _useDashboard.grade;
+      perceivedImpact = _useDashboard.perceivedImpact;
 
   var cards = [{
     label: "High-impact learning strategies of current school year",
@@ -17798,7 +17490,7 @@ var Dashboard = function Dashboard() {
       data: perceivedImpact
     })
   }, {
-    label: "Students & teachers login per day",
+    label: "Students & teachers logins per day",
     children: React.createElement(LoginCouting, {
       data: loginCounting
     })
@@ -17807,16 +17499,6 @@ var Dashboard = function Dashboard() {
     children: React.createElement(Quantity, {
       data: quantity
     })
-  }, {
-    label: "Goal progress",
-    children: React.createElement(GoalProgressReport, {
-      data: goalProgress
-    })
-  }, {
-    label: "Grades",
-    children: React.createElement(Grade, {
-      data: grade
-    })
   }];
   return React.createElement("div", null, React.createElement("h4", {
     className: "mb-5"