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

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

@@ -5120,7 +5120,7 @@ h2._1OAmb {
 
 ._2qL5J {
   display: flex;
-  padding-bottom: 10px;
+  padding-bottom: 26px;
   padding-right: 20px;
   justify-content: space-between; }
 
@@ -5133,7 +5133,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 +6136,6 @@ h2._1OAmb {
 ._2Q5K5 {
   display: flex;
   justify-content: flex-end;
-  width: 100%;
   padding: 0 15px; }
 
 @font-face {
@@ -6286,15 +6285,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;

package/dist/index.js

@@ -19372,7 +19372,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 +19380,9 @@ var optionColumnChartAndPercents = function optionColumnChartAndPercents(months,
           fontWeight: 400,
           cssClass: "apexcharts-yaxis-label"
         }
+      },
+      axisTicks: {
+        show: months.length > 0 ? true : false
       }
     },
     yaxis: {
@@ -19462,14 +19465,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 +20112,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 +20125,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 +20406,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 +28930,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 +28939,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",
@@ -29015,39 +29000,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 +29101,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 +29150,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 +29199,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 +29224,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 +29395,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 +29419,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 +29459,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 +29477,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 +29492,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 +29919,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 +29927,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",
@@ -59670,7 +59657,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,