mario-teacher-student-client 2.1.127-admin → 2.1.129-admin

package/dist/containers/ActionPoint/components/Dialogs/hooks/useDialogRequest.d.ts

@@ -22,11 +22,11 @@ declare const useDialogRequest: (_props: PropsType, ref: any) => {
     handleChangeNotiCount: (e: React.ChangeEvent<{
         value: unknown;
     }>) => void;
-    handleCreate: (cb?: Function | undefined) => Promise<void>;
+    handleCreate: (cb?: Function | undefined, cbGetEventCalendar?: Function | undefined) => Promise<void>;
     handleClickClose: () => void;
     handleCheckbox: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    submitUpdate: (cb?: Function | undefined) => Promise<void>;
-    handleDeleteItem: (cb?: Function | undefined) => Promise<void>;
+    submitUpdate: (cb?: Function | undefined, cbGetEventCalendar?: Function | undefined) => Promise<void>;
+    handleDeleteItem: (cb?: Function | undefined, cbGetEventCalendar?: Function | undefined) => Promise<void>;
     handleCloseNoti: () => void;
     setNotiSetting: React.Dispatch<React.SetStateAction<string>>;
     notiSetting: string;

package/dist/containers/MyStudent/components/NewOverview/TopLearningStrategies/hooks/useLearningStrategies.d.ts

@@ -1,12 +1,12 @@
-declare const useLearningStrategies: (studentId: any) => {
+declare const useLearningStrategies: (studentId: any, filterDateChart: any) => {
     filtersLearningStrategiesData: {
         searchString: string;
         currentPage: number;
         pageSize: number;
         sortBy: string;
         sortOrder: string;
-        startDate: null;
-        endDate: null;
+        startDate: any;
+        endDate: any;
     };
     changeFiltersLearningStrategiesData: (updatedFilters: any) => void;
     learningStrategiesData: any;

package/dist/containers/MyStudent/hooks/useOverview.d.ts

@@ -26,8 +26,8 @@ declare const useOverview: (studentId: number) => {
         pageSize: number;
         sortBy: string;
         sortOrder: string;
-        startDate: null;
-        endDate: null;
+        startDate: any;
+        endDate: any;
     };
     changeFiltersLearningStrategiesData: (updatedFilters: any) => void;
     handleActiveColumnOneToOne: (index: any) => void;

package/dist/containers/PLP/hooks/usePlpPage.d.ts

@@ -25,8 +25,8 @@ declare const usePlpPage: () => {
         pageSize: number;
         sortBy: string;
         sortOrder: string;
-        startDate: null;
-        endDate: null;
+        startDate: any;
+        endDate: any;
     };
     changeFiltersLearningStrategiesData: (updatedFilters: any) => void;
     handleActiveColumnOneToOne: (index: any) => void;

package/dist/index.css

@@ -3119,7 +3119,7 @@ h2._1OAmb {
     margin-top: 10px; }
     ._gOdCz ._smLhQ ._1MX_1 {
       overflow: auto;
-      max-height: 20vh; }
+      height: 20vh; }
       ._gOdCz ._smLhQ ._1MX_1 ._3tmRq {
         display: flex;
         align-items: center;
@@ -4775,8 +4775,7 @@ h2._1OAmb {
   min-height: 180px;
   height: 100%;
   max-height: 100vh;
-  overflow: scroll;
-  overflow-x: hidden; }
+  overflow: auto; }
   ._S0bRu ._2z0d_ {
     font-size: 16px;
     font-style: normal;
@@ -5120,7 +5119,7 @@ h2._1OAmb {
 
 ._2qL5J {
   display: flex;
-  padding-bottom: 10px;
+  padding-bottom: 26px;
   padding-right: 20px;
   justify-content: space-between; }
 
@@ -5133,7 +5132,7 @@ h2._1OAmb {
     margin-right: 20px; }
     ._3d2hF ._zL0pN ._1kI5l ._30FUT, ._3d2hF ._zL0pN ._3keyG ._30FUT {
       margin-bottom: 0 !important;
-      font-size: 18px;
+      font-size: 15px;
       margin-right: 10px;
       color: #242424; }
 
@@ -6136,7 +6135,6 @@ h2._1OAmb {
 ._2Q5K5 {
   display: flex;
   justify-content: flex-end;
-  width: 100%;
   padding: 0 15px; }
 
 @font-face {
@@ -6286,15 +6284,16 @@ h2._1OAmb {
       padding-right: 20px;
       width: 336px; } }
 
-._3Saaw thead {
-  border-top: 1px solid #e8e8e8; }
-
-._3Saaw td,
-._3Saaw th {
-  border-right: 1px solid #e8e8e8; }
-  ._3Saaw td:last-child,
-  ._3Saaw th:last-child {
-    border-right: none; }
+._3Saaw {
+  width: 700px !important; }
+  ._3Saaw thead {
+    border-top: 1px solid #e8e8e8; }
+  ._3Saaw td,
+  ._3Saaw th {
+    border-right: 1px solid #e8e8e8; }
+    ._3Saaw td:last-child,
+    ._3Saaw th:last-child {
+      border-right: none; }
 
 ._i-ZXZ {
   font-size: 14px !important;
@@ -13911,7 +13910,9 @@ h2._1KpSK {
   ._1VfS9 ._3s-7D {
     display: flex;
     width: 100%;
-    justify-content: flex-end; }
+    justify-content: flex-start;
+    margin-bottom: 20px;
+    margin-left: 10px; }
 
 ._1MqAT ._2cDXH {
   display: flex;
@@ -13922,7 +13923,7 @@ h2._1KpSK {
     margin-right: 20px; }
     ._1MqAT ._2cDXH ._3C3be ._1fkiB, ._1MqAT ._2cDXH ._JeKAW ._1fkiB {
       margin-bottom: 0 !important;
-      font-size: 18px;
+      font-size: 15px;
       margin-right: 10px;
       color: #242424; }
 

package/dist/index.js

@@ -2473,6 +2473,14 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
 
   var handleClickClose = function handleClickClose() {
     setOpen(false);
+    setFormData({
+      title: "",
+      "class": "",
+      deadline: null,
+      notiCount: 0,
+      notiDuration: "week",
+      isDone: false
+    });
   };
 
   var openModal = function openModal() {
@@ -2551,10 +2559,11 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
     });
   };
 
-  var handleDeleteItem = function handleDeleteItem(cb) {
+  var handleDeleteItem = function handleDeleteItem(cb, cbGetEventCalendar) {
     try {
       return Promise.resolve(deleteActionPoint(dispatch, actionId)).then(function () {
         cb === null || cb === void 0 ? void 0 : cb();
+        cbGetEventCalendar === null || cbGetEventCalendar === void 0 ? void 0 : cbGetEventCalendar();
         reloadRef === null || reloadRef === void 0 ? void 0 : reloadRef.current.reload();
         setOpen(false);
       });
@@ -2570,7 +2579,7 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
     });
   };
 
-  var submitUpdate = function submitUpdate(cb) {
+  var submitUpdate = function submitUpdate(cb, cbGetEventCalendar) {
     try {
       var _formData$title;
 
@@ -2584,6 +2593,7 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
 
       return Promise.resolve(updateActionPoint(dispatch, actionId, formData)).then(function () {
         cb === null || cb === void 0 ? void 0 : cb();
+        cbGetEventCalendar === null || cbGetEventCalendar === void 0 ? void 0 : cbGetEventCalendar();
         reloadRef === null || reloadRef === void 0 ? void 0 : reloadRef.current.reload();
         setOpen(false);
       });
@@ -2592,7 +2602,7 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
     }
   };
 
-  var handleCreate = function handleCreate(cb) {
+  var handleCreate = function handleCreate(cb, cbGetEventCalendar) {
     try {
       var _formData$title2;
 
@@ -2606,6 +2616,7 @@ var useDialogRequest = function useDialogRequest(_props, ref) {
 
       return Promise.resolve(createActionPoint(dispatch, formData)).then(function () {
         cb === null || cb === void 0 ? void 0 : cb();
+        cbGetEventCalendar === null || cbGetEventCalendar === void 0 ? void 0 : cbGetEventCalendar();
         reloadRef === null || reloadRef === void 0 ? void 0 : reloadRef.current.reload();
         setOpen(false);
         setFormData({
@@ -2940,9 +2951,7 @@ var DialogRequestActionPoint = function DialogRequestActionPoint(_props, ref) {
     color: "secondary",
     onClick: function () {
       try {
-        return Promise.resolve(handleDeleteItem(_props.onReloading)).then(function () {
-          handleGetNewActionPoint === null || handleGetNewActionPoint === void 0 ? void 0 : handleGetNewActionPoint();
-        });
+        return Promise.resolve(handleDeleteItem(_props.onReloading, handleGetNewActionPoint)).then(function () {});
       } catch (e) {
         return Promise.reject(e);
       }
@@ -2954,9 +2963,7 @@ var DialogRequestActionPoint = function DialogRequestActionPoint(_props, ref) {
       try {
         setTitleValidate(true);
         setDeadlineValidate(true);
-        return Promise.resolve(submitUpdate(_props.onReloading)).then(function () {
-          handleGetNewActionPoint === null || handleGetNewActionPoint === void 0 ? void 0 : handleGetNewActionPoint();
-        });
+        return Promise.resolve(submitUpdate(_props.onReloading, handleGetNewActionPoint)).then(function () {});
       } catch (e) {
         return Promise.reject(e);
       }
@@ -2980,9 +2987,7 @@ var DialogRequestActionPoint = function DialogRequestActionPoint(_props, ref) {
       try {
         setTitleValidate(true);
         setDeadlineValidate(true);
-        return Promise.resolve(handleCreate(_props.onReloading)).then(function () {
-          handleGetNewActionPoint === null || handleGetNewActionPoint === void 0 ? void 0 : handleGetNewActionPoint();
-        });
+        return Promise.resolve(handleCreate(_props.onReloading, handleGetNewActionPoint)).then(function () {});
       } catch (e) {
         return Promise.reject(e);
       }
@@ -3358,8 +3363,7 @@ var Dashboard = function Dashboard() {
       listData = _useActionPointsDB.listData,
       openDialog = _useActionPointsDB.openDialog,
       clickOpenModal = _useActionPointsDB.clickOpenModal,
-      onReloading = _useActionPointsDB.onReloading,
-      getData = _useActionPointsDB.getData;
+      onReloading = _useActionPointsDB.onReloading;
 
   var roles = reactRedux.useSelector(function (state) {
     var _state$common, _state$common$user;
@@ -3388,7 +3392,6 @@ var Dashboard = function Dashboard() {
 
   var handleGetNewActionPoint = function handleGetNewActionPoint() {
     getDataEvent();
-    getData();
   };
 
   var handleChangeDate = function handleChangeDate(date) {
@@ -18239,12 +18242,12 @@ var MyNote = function MyNote(props) {
       className: "" + myStudent["box-header-item"]
     }, React__default.createElement(core.Typography, {
       className: "" + myStudent["item-title"]
-    }, convertQuestText(note.text, 1))), ((_note$text = note.text) === null || _note$text === void 0 ? void 0 : _note$text.includes("[/]")) && React__default.createElement(core.Typography, {
+    }, convertQuestText(note.text || note.title, 1))), ((_note$text = note.text) === null || _note$text === void 0 ? void 0 : _note$text.includes("[/]")) && React__default.createElement(core.Typography, {
       className: "" + myStudent["item-description"],
       style: {
         marginBottom: 5
       }
-    }, convertQuestText(note.text, 2)), React__default.createElement(core.Grid, {
+    }, convertQuestText(note.text || note.title, 2)), React__default.createElement(core.Grid, {
       className: "" + myStudent["box-status"]
     }, React__default.createElement("div", {
       className: "" + myStudent["content-right"]
@@ -18412,11 +18415,7 @@ var OverviewLeft = function OverviewLeft(props) {
 
   return React__default.createElement("div", {
     className: "\n                " + styles$4["partner-profiles-diallog"] + " \n                " + styles$7["overview-partner-profiles"] + " \n                " + styles$4[classFontSize] + "\n            "
-  }, screenWidth$1 > 600 ? React__default.createElement(core.Box, {
-    sx: {
-      height: "100%"
-    }
-  }, React__default.createElement(core.Box, {
+  }, screenWidth$1 > 600 ? React__default.createElement(core.Box, null, React__default.createElement(core.Box, {
     className: "" + styles$7["overview-left"],
     style: {
       overflow: "hidden"
@@ -19372,7 +19371,7 @@ var optionColumnChartAndPercents = function optionColumnChartAndPercents(months,
     xaxis: {
       categories: months,
       labels: {
-        show: true,
+        show: months.length > 0 ? true : false,
         style: {
           colors: ["#808080"],
           fontSize: "16px",
@@ -19380,6 +19379,9 @@ var optionColumnChartAndPercents = function optionColumnChartAndPercents(months,
           fontWeight: 400,
           cssClass: "apexcharts-yaxis-label"
         }
+      },
+      axisTicks: {
+        show: months.length > 0 ? true : false
       }
     },
     yaxis: {
@@ -19462,14 +19464,14 @@ var convertToSeriesColumnChartAndPercentConference = function convertToSeriesCol
 };
 var convertToAvg = function convertToAvg(dataCharts, data, months) {
   var result = dataCharts.map(function (dataName) {
-    return Number((data.map(function (i) {
+    return Number(data.map(function (i) {
       var questionItem = i.resultQuestion.find(function (question) {
         return question.questionText.includes(dataName);
       });
       return !!questionItem ? questionItem.avgOfStudentChoice : 0;
     }).reduce(function (acc, curr) {
       return acc + curr;
-    }, 0) / (months === null || months === void 0 ? void 0 : months.length)).toFixed(2));
+    }, 0) / (months === null || months === void 0 ? void 0 : months.length));
   });
   return result;
 };
@@ -20109,7 +20111,7 @@ var useTopLearningStrategies = function useTopLearningStrategies(studentId, filt
   };
 };
 
-var useLearningStrategies = function useLearningStrategies(studentId) {
+var useLearningStrategies = function useLearningStrategies(studentId, filterDateChart) {
   var dispatch = reactRedux.useDispatch();
 
   var _useState = React.useState(),
@@ -20122,8 +20124,8 @@ var useLearningStrategies = function useLearningStrategies(studentId) {
     pageSize: 10,
     sortBy: "Strategies",
     sortOrder: "ASC",
-    startDate: null,
-    endDate: null
+    startDate: filterDateChart === null || filterDateChart === void 0 ? void 0 : filterDateChart.startDate,
+    endDate: filterDateChart === null || filterDateChart === void 0 ? void 0 : filterDateChart.endDate
   }),
       filtersLearningStrategiesData = _useState2[0],
       setFilters = _useState2[1];
@@ -20403,7 +20405,7 @@ var useOverview = function useOverview(studentId) {
       labelName = _useTopLearningStrate.labelName,
       usageCountList = _useTopLearningStrate.usageCountList;
 
-  var _useLearningStrategie = useLearningStrategies(studentId),
+  var _useLearningStrategie = useLearningStrategies(studentId, filterDateChart),
       learningStrategiesData = _useLearningStrategie.learningStrategiesData,
       filtersLearningStrategiesData = _useLearningStrategie.filtersLearningStrategiesData,
       changeFiltersLearningStrategiesData = _useLearningStrategie.changeFiltersLearningStrategiesData,
@@ -28927,8 +28929,6 @@ var useStyles$b = styles$N.makeStyles(function () {
   };
 });
 var LearningStrategyDialog = function LearningStrategyDialog(props) {
-  var _filters$endDate, _filters$startDate, _filters$startDate2;
-
   var handleClose = props.handleClose,
       open = props.open,
       getLearningStrategiesData = props.getLearningStrategiesData,
@@ -28938,22 +28938,6 @@ var LearningStrategyDialog = function LearningStrategyDialog(props) {
   var inputSearch = React.useRef(null);
   var classes = useStyles$b();
 
-  var handleChangeStartDate = function handleChangeStartDate(date) {
-    if (!date) return;
-    changeFilters({
-      startDate: date.valueOf(),
-      currentPage: 1
-    });
-  };
-
-  var handleChangeEndDate = function handleChangeEndDate(date) {
-    if (!date) return;
-    changeFilters({
-      endDate: date.valueOf(),
-      currentPage: 1
-    });
-  };
-
   var handleSort = function handleSort(e) {
     changeFilters({
       sortOrder: (filters === null || filters === void 0 ? void 0 : filters.sortOrder) === "DESC" ? "ASC" : "DESC",
@@ -28989,8 +28973,8 @@ var LearningStrategyDialog = function LearningStrategyDialog(props) {
   };
 
   React.useEffect(function () {
-    getLearningStrategiesData === null || getLearningStrategiesData === void 0 ? void 0 : getLearningStrategiesData();
-  }, [filters]);
+    open && (getLearningStrategiesData === null || getLearningStrategiesData === void 0 ? void 0 : getLearningStrategiesData());
+  }, [filters, open]);
   return React__default.createElement(core.Dialog, {
     onClose: function onClose() {
       return handleClose();
@@ -29015,39 +28999,6 @@ var LearningStrategyDialog = function LearningStrategyDialog(props) {
     item: true,
     className: "" + styles$a["gr-action"]
   }, React__default.createElement(core.Grid, {
-    className: "" + styles$a["gr-date-time"]
-  }, React__default.createElement(pickers.MuiPickersUtilsProvider, {
-    utils: MomentUtils
-  }, React__default.createElement(pickers.KeyboardDatePicker, {
-    inputVariant: "outlined",
-    format: "Do MMM YYYY",
-    id: "date-picker-inline",
-    label: "From",
-    className: "" + styles$a["date-time"],
-    value: filters === null || filters === void 0 ? void 0 : filters.startDate,
-    onChange: function onChange(e) {
-      return handleChangeStartDate(e);
-    },
-    KeyboardButtonProps: {
-      "aria-label": "change date"
-    },
-    maxDate: (_filters$endDate = filters === null || filters === void 0 ? void 0 : filters.endDate) != null ? _filters$endDate : undefined,
-    minDate: (_filters$startDate = filters === null || filters === void 0 ? void 0 : filters.startDate) != null ? _filters$startDate : undefined
-  }), React__default.createElement(pickers.KeyboardDatePicker, {
-    minDate: (_filters$startDate2 = filters === null || filters === void 0 ? void 0 : filters.startDate) != null ? _filters$startDate2 : undefined,
-    inputVariant: "outlined",
-    format: "Do MMM YYYY",
-    id: "time-picker",
-    label: "To",
-    className: "" + styles$a["date-time"],
-    value: filters === null || filters === void 0 ? void 0 : filters.endDate,
-    onChange: function onChange(e) {
-      return handleChangeEndDate(e);
-    },
-    KeyboardButtonProps: {
-      "aria-label": "change date"
-    }
-  }))), React__default.createElement(core.Grid, {
     className: "" + styles$a["search-input"]
   }, React__default.createElement(core.Grid, {
     className: "" + styles$a["search-input-icon"]
@@ -29149,6 +29100,14 @@ var TopLearningStrategy = function TopLearningStrategy(_ref) {
       open = _useState[0],
       setOpen = _useState[1];
 
+  var _useState2 = React.useState(false),
+      expanded = _useState2[0],
+      setExpanded = _useState2[1];
+
+  var handleChange = function handleChange() {
+    setExpanded(!expanded);
+  };
+
   var handleToggleDialog = function handleToggleDialog() {
     setOpen(!open);
   };
@@ -29190,8 +29149,12 @@ var TopLearningStrategy = function TopLearningStrategy(_ref) {
     changeFilters: changeFiltersLearningStrategiesData,
     getLearningStrategiesData: getLearningStrategiesData,
     isPlp: isPlp
-  }), React__default.createElement(core.Accordion, null, React__default.createElement(core.AccordionSummary, {
-    expandIcon: React__default.createElement(ExpandMoreIcon, null),
+  }), React__default.createElement(core.Accordion, {
+    expanded: expanded
+  }, React__default.createElement(core.AccordionSummary, {
+    expandIcon: React__default.createElement(ExpandMoreIcon, {
+      onClick: handleChange
+    }),
     "aria-controls": "panel1a-content",
     id: "panel1a-header"
   }, React__default.createElement("div", {
@@ -29235,6 +29198,15 @@ var TopLearningStrategy = function TopLearningStrategy(_ref) {
 var BubbleChartCustom = function BubbleChartCustom(_ref) {
   var data = _ref.data,
       isPlp = _ref.isPlp;
+
+  var _React$useState = React__default.useState(true),
+      expanded = _React$useState[0],
+      setExpanded = _React$useState[1];
+
+  var handleChange = function handleChange() {
+    setExpanded(!expanded);
+  };
+
   var history = reactRouterDom.useHistory();
 
   var redirectStudentOverview = function redirectStudentOverview(studentId) {
@@ -29251,9 +29223,11 @@ var BubbleChartCustom = function BubbleChartCustom(_ref) {
   return React__default.createElement("div", {
     className: "" + styles$9["size-100"]
   }, React__default.createElement(core.Accordion, {
-    defaultExpanded: true
+    expanded: expanded
   }, React__default.createElement(core.AccordionSummary, {
-    expandIcon: React__default.createElement(ExpandMoreIcon, null),
+    expandIcon: React__default.createElement(ExpandMoreIcon, {
+      onClick: handleChange
+    }),
     "aria-controls": "panel1a-content",
     id: "panel1a-header"
   }, React__default.createElement("div", {
@@ -29420,7 +29394,7 @@ var ChoiceChartType = function ChoiceChartType(_ref) {
       typeChart = _ref$typeChart === void 0 ? [TYPECHART.BAR] : _ref$typeChart,
       options = _ref.options;
   return React__default.createElement("div", {
-    className: "d-flex align-items-center d-inline-block pr-4"
+    className: "d-flex align-items-center d-inline-block"
   }, React__default.createElement("div", {
     className: "d-flex align-items-center px-2 " + styles$9["checkbox-chart"]
   }, React__default.createElement("div", {
@@ -29444,7 +29418,7 @@ var ChoiceChartType = function ChoiceChartType(_ref) {
       cursor: "pointer"
     }
   }, "Ridge charts"))), React__default.createElement("div", {
-    className: "d-inline-block px-2  " + styles$9["checkbox-chart"]
+    className: "d-inline-block " + styles$9["checkbox-chart"]
   }, React__default.createElement("div", {
     className: "pr-4 d-flex align-items-center",
     onClick: function onClick() {
@@ -29484,6 +29458,15 @@ var ColumnChartAndPercent = function ColumnChartAndPercent(_ref) {
       isHiddenLabel = _ref.isHiddenLabel,
       _ref$isClassReflectio = _ref.isClassReflectionChart,
       isClassReflectionChart = _ref$isClassReflectio === void 0 ? false : _ref$isClassReflectio;
+
+  var _React$useState = React__default.useState(false),
+      expanded = _React$useState[0],
+      setExpanded = _React$useState[1];
+
+  var handleChange = function handleChange() {
+    setExpanded(!expanded);
+  };
+
   if (!data) return React__default.createElement("div", {
     className: "flex justify-content-center align-items-center",
     style: {
@@ -29493,8 +29476,12 @@ var ColumnChartAndPercent = function ColumnChartAndPercent(_ref) {
   return React__default.createElement("div", {
     key: name,
     className: " " + styles$9["size-100"]
-  }, React__default.createElement(core.Accordion, null, React__default.createElement(core.AccordionSummary, {
-    expandIcon: React__default.createElement(ExpandMoreIcon, null),
+  }, React__default.createElement(core.Accordion, {
+    expanded: expanded
+  }, React__default.createElement(core.AccordionSummary, {
+    expandIcon: React__default.createElement(ExpandMoreIcon, {
+      onClick: handleChange
+    }),
     "aria-controls": "panel1a-content",
     id: "panel1a-header",
     style: {
@@ -29504,15 +29491,13 @@ var ColumnChartAndPercent = function ColumnChartAndPercent(_ref) {
     className: "" + styles$9["block-header-chart"]
   }, React__default.createElement("p", {
     className: "" + styles$9["title-chart"]
-  }, name))), React__default.createElement(core.AccordionDetails, null, React__default.createElement("div", {
-    className: "" + styles$9["column-chart-percent"]
-  }, React__default.createElement("div", {
-    className: "" + styles$9["filter-date"]
-  }, React__default.createElement(ChoiceChartType, {
+  }, name), expanded && React__default.createElement(ChoiceChartType, {
     onChangeChart: onChangeChart,
     options: optionType,
     typeChart: typeChart
-  })), !isHiddenLabel && React__default.createElement("div", {
+  }))), React__default.createElement(core.AccordionDetails, null, React__default.createElement("div", {
+    className: "" + styles$9["column-chart-percent"]
+  }, !isHiddenLabel && React__default.createElement("div", {
     className: "" + styles$9["listItem"]
   }, data.map(function (month, index) {
     return React__default.createElement("div", {
@@ -29933,7 +29918,7 @@ var Overview = function Overview(props) {
     KeyboardButtonProps: {
       "aria-label": "change date"
     },
-    minDate: filterDateChart.startDate,
+    minDate: moment(filterDateChart.endDate).subtract(4, 'months').valueOf(),
     maxDate: filterDateChart.endDate
   })), React__default.createElement("div", {
     className: styles$7["date-time-end"] + " date-picker-overview"
@@ -29941,6 +29926,7 @@ var Overview = function Overview(props) {
     className: "" + styles$7["text"]
   }, "To"), React__default.createElement(pickers.KeyboardDatePicker, {
     minDate: filterDateChart.startDate || null,
+    maxDate: moment(filterDateChart.startDate).add(4, 'months').valueOf(),
     inputVariant: "outlined",
     format: "Do MMM YYYY",
     id: "time-picker",
@@ -49390,6 +49376,10 @@ var Note = function Note() {
       setSelectStudent = _useNote.setSelectStudent,
       isTeacher = _useNote.isTeacher;
 
+  console.log({
+    allNoteList: allNoteList
+  });
+
   var _useFontStyles = useFontStyles(),
       defaultFont = _useFontStyles.defaultFont;
 
@@ -59670,7 +59660,7 @@ var usePlpPage = function usePlpPage() {
       labelName = _useTopLearningStrate.labelName,
       usageCountList = _useTopLearningStrate.usageCountList;
 
-  var _useLearningStrategie = useLearningStrategies(student === null || student === void 0 ? void 0 : student.studentId),
+  var _useLearningStrategie = useLearningStrategies(student === null || student === void 0 ? void 0 : student.studentId, filterDate),
       learningStrategiesData = _useLearningStrategie.learningStrategiesData,
       filtersLearningStrategiesData = _useLearningStrategie.filtersLearningStrategiesData,
       changeFiltersLearningStrategiesData = _useLearningStrategie.changeFiltersLearningStrategiesData,
@@ -59821,7 +59811,7 @@ var PlpPage = function PlpPage() {
   }, React__default.createElement("div", {
     className: "" + styles$G["date-time-box"]
   }, React__default.createElement("div", {
-    className: "" + styles$G["date-time-start"]
+    className: styles$G["date-time-start"] + " date-picker-overview"
   }, React__default.createElement("p", {
     className: "" + styles$G["text"]
   }, "From"), React__default.createElement(pickers.KeyboardDatePicker, {
@@ -59837,7 +59827,7 @@ var PlpPage = function PlpPage() {
       "aria-label": "change date"
     }
   })), React__default.createElement("div", {
-    className: "" + styles$G["date-time-end"]
+    className: styles$G["date-time-end"] + " date-picker-overview"
   }, React__default.createElement("p", {
     className: "" + styles$G["text"]
   }, "To"), React__default.createElement(pickers.KeyboardDatePicker, {
@@ -59855,7 +59845,7 @@ var PlpPage = function PlpPage() {
     }
   }))))), React__default.createElement(core.FormControl, {
     variant: "outlined",
-    className: "custom-select-grade"
+    className: "custom-select-grade-plp"
   }, React__default.createElement(core.InputLabel, {
     htmlFor: "outlined-age-native-simple"
   }, "Grade"), React__default.createElement(core.Select, {