From 48d429d5ae6314fc4fe03f0fcd596d0ca53e221f Mon Sep 17 00:00:00 2001 From: Eko Widianto Date: Thu, 8 Dec 2022 17:49:36 +0800 Subject: [PATCH] fix(statistics): fix console error - fix proptypes shape error - change injectIntl to useIntl - remove obsolete underLinesOnHover props for --- .../course/StudentPerformanceTable.jsx | 11 ++-------- .../pages/StatisticsIndex/course/index.jsx | 6 +++--- .../pages/StatisticsIndex/index.jsx | 20 +++++++------------ .../pages/StatisticsIndex/staff/index.jsx | 7 ++++--- .../pages/StatisticsIndex/students/index.jsx | 9 ++++----- .../course/statistics/propTypes/course.js | 5 ++--- .../course/statistics/propTypes/staff.js | 5 ++--- .../course/statistics/propTypes/students.js | 5 ++--- 8 files changed, 26 insertions(+), 42 deletions(-) diff --git a/client/app/bundles/course/statistics/pages/StatisticsIndex/course/StudentPerformanceTable.jsx b/client/app/bundles/course/statistics/pages/StatisticsIndex/course/StudentPerformanceTable.jsx index 85adbfd8a65..539f628702a 100644 --- a/client/app/bundles/course/statistics/pages/StatisticsIndex/course/StudentPerformanceTable.jsx +++ b/client/app/bundles/course/statistics/pages/StatisticsIndex/course/StudentPerformanceTable.jsx @@ -251,12 +251,7 @@ const StudentPerformanceTable = ({ customBodyRenderLite: (dataIndex) => { const student = displayedStudents[dataIndex]; return ( - + {student.name} ); @@ -314,7 +309,7 @@ const StudentPerformanceTable = ({ <> {groupManagers.map((m, index) => ( - + {m.name} {index < groupManagers.length - 1 && ', '} @@ -360,7 +355,6 @@ const StudentPerformanceTable = ({ key={student.id} href={student.experiencePointsLink} opensInNewTab - underlinesOnHover > {student.experiencePoints} @@ -437,7 +431,6 @@ const StudentPerformanceTable = ({ key={student.id} href={student.videoSubmissionLink} opensInNewTab - underlinesOnHover > {student.videoSubmissionCount} diff --git a/client/app/bundles/course/statistics/pages/StatisticsIndex/course/index.jsx b/client/app/bundles/course/statistics/pages/StatisticsIndex/course/index.jsx index bf546e63467..f09661b9060 100644 --- a/client/app/bundles/course/statistics/pages/StatisticsIndex/course/index.jsx +++ b/client/app/bundles/course/statistics/pages/StatisticsIndex/course/index.jsx @@ -1,4 +1,4 @@ -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, useIntl } from 'react-intl'; import ErrorCard from 'lib/components/core/ErrorCard'; import LoadingIndicator from 'lib/components/core/LoadingIndicator'; @@ -39,8 +39,8 @@ const CourseStatistics = ({ showVideo, courseVideoCount, hasGroupManagers, - intl, }) => { + const intl = useIntl(); if (isFetchingProgression && isFetchingPerformance) { return ; } @@ -100,4 +100,4 @@ const CourseStatistics = ({ CourseStatistics.propTypes = courseIndexShape; -export default injectIntl(CourseStatistics); +export default CourseStatistics; diff --git a/client/app/bundles/course/statistics/pages/StatisticsIndex/index.jsx b/client/app/bundles/course/statistics/pages/StatisticsIndex/index.jsx index 514123f01b1..27a2804db4b 100644 --- a/client/app/bundles/course/statistics/pages/StatisticsIndex/index.jsx +++ b/client/app/bundles/course/statistics/pages/StatisticsIndex/index.jsx @@ -1,10 +1,9 @@ import { useEffect, useState } from 'react'; -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, useIntl } from 'react-intl'; import { connect } from 'react-redux'; import Box from '@mui/material/Box'; import Tab from '@mui/material/Tab'; import Tabs from '@mui/material/Tabs'; -import Typography from '@mui/material/Typography'; import PropTypes from 'prop-types'; import NotificationBar from 'lib/components/core/NotificationBar'; @@ -70,11 +69,7 @@ const TabPanel = (props) => { role="tabpanel" {...other} > - {value === index && ( - - {children} - - )} + {value === index && {children}} ); }; @@ -95,9 +90,9 @@ const StatisticsIndex = ({ courseStatistics, studentsStatistics, staffStatistics, - intl, }) => { const [value, setValue] = useState(0); + const intl = useIntl(); useEffect(() => { dispatch( @@ -172,14 +167,13 @@ const StatisticsIndex = ({ StatisticsIndex.propTypes = { dispatch: PropTypes.func.isRequired, - courseStatistics: courseIndexShape.isRequired, - studentsStatistics: studentsIndexShape.isRequired, - staffStatistics: staffIndexShape.isRequired, - intl: PropTypes.object.isRequired, + courseStatistics: PropTypes.shape(courseIndexShape), + studentsStatistics: PropTypes.shape(studentsIndexShape), + staffStatistics: PropTypes.shape(staffIndexShape), }; export default connect((state) => ({ courseStatistics: state.courseStatistics, studentsStatistics: state.studentsStatistics, staffStatistics: state.staffStatistics, -}))(injectIntl(StatisticsIndex)); +}))(StatisticsIndex); diff --git a/client/app/bundles/course/statistics/pages/StatisticsIndex/staff/index.jsx b/client/app/bundles/course/statistics/pages/StatisticsIndex/staff/index.jsx index 01002c294fd..9407122c79c 100644 --- a/client/app/bundles/course/statistics/pages/StatisticsIndex/staff/index.jsx +++ b/client/app/bundles/course/statistics/pages/StatisticsIndex/staff/index.jsx @@ -1,5 +1,5 @@ import { useMemo } from 'react'; -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, useIntl } from 'react-intl'; import ErrorCard from 'lib/components/core/ErrorCard'; import DataTable from 'lib/components/core/layouts/DataTable'; @@ -54,7 +54,8 @@ const translations = defineMessages({ }, }); -const StaffStatistics = ({ staff, isFetching, isError, intl }) => { +const StaffStatistics = ({ staff, isFetching, isError }) => { + const intl = useIntl(); const columns = useMemo( () => [ { @@ -124,4 +125,4 @@ const StaffStatistics = ({ staff, isFetching, isError, intl }) => { StaffStatistics.propTypes = staffIndexShape; -export default injectIntl(StaffStatistics); +export default StaffStatistics; diff --git a/client/app/bundles/course/statistics/pages/StatisticsIndex/students/index.jsx b/client/app/bundles/course/statistics/pages/StatisticsIndex/students/index.jsx index 86a614a48ec..fe0c53726e1 100644 --- a/client/app/bundles/course/statistics/pages/StatisticsIndex/students/index.jsx +++ b/client/app/bundles/course/statistics/pages/StatisticsIndex/students/index.jsx @@ -1,4 +1,4 @@ -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, useIntl } from 'react-intl'; import Box from '@mui/material/Box'; import LinearProgress from '@mui/material/LinearProgress'; import Typography from '@mui/material/Typography'; @@ -94,8 +94,9 @@ const StudentsStatistics = ({ students, isFetching, isError, - intl, }) => { + const intl = useIntl(); + if (isFetching) { return ; } @@ -154,7 +155,6 @@ const StudentsStatistics = ({ key={student.id} href={student.experiencePointsLink} opensInNewTab - underlinesOnHover > {student.experiencePoints} @@ -178,7 +178,6 @@ const StudentsStatistics = ({ key={student.id} href={student.videoSubmissionLink} opensInNewTab - underlinesOnHover > {student.videoSubmissionCount} @@ -216,4 +215,4 @@ const StudentsStatistics = ({ StudentsStatistics.propTypes = studentsIndexShape; -export default injectIntl(StudentsStatistics); +export default StudentsStatistics; diff --git a/client/app/bundles/course/statistics/propTypes/course.js b/client/app/bundles/course/statistics/propTypes/course.js index 5ddbea549eb..8c533c948a6 100644 --- a/client/app/bundles/course/statistics/propTypes/course.js +++ b/client/app/bundles/course/statistics/propTypes/course.js @@ -37,7 +37,7 @@ export const studentShape = PropTypes.shape({ videoPercentWatched: PropTypes.number, }); -export const courseIndexShape = PropTypes.shape({ +export const courseIndexShape = { assessments: PropTypes.arrayOf(assessmentShape), submissions: PropTypes.arrayOf(submissionShape), students: PropTypes.arrayOf(studentShape), @@ -53,5 +53,4 @@ export const courseIndexShape = PropTypes.shape({ isErrorPerformance: PropTypes.bool.isRequired, notification: notificationShape, // Centralised across course, students and staff - intl: PropTypes.object.isRequired, -}); +}; diff --git a/client/app/bundles/course/statistics/propTypes/staff.js b/client/app/bundles/course/statistics/propTypes/staff.js index 79884419df1..715314c56f0 100644 --- a/client/app/bundles/course/statistics/propTypes/staff.js +++ b/client/app/bundles/course/statistics/propTypes/staff.js @@ -8,9 +8,8 @@ export const staffShape = PropTypes.shape({ stddev: PropTypes.string.isRequired, }); -export const staffIndexShape = PropTypes.shape({ +export const staffIndexShape = { staff: PropTypes.arrayOf(staffShape).isRequired, isFetching: PropTypes.bool.isRequired, isError: PropTypes.bool.isRequired, - intl: PropTypes.object.isRequired, -}); +}; diff --git a/client/app/bundles/course/statistics/propTypes/students.js b/client/app/bundles/course/statistics/propTypes/students.js index d526bc397b3..57fe3982017 100644 --- a/client/app/bundles/course/statistics/propTypes/students.js +++ b/client/app/bundles/course/statistics/propTypes/students.js @@ -13,7 +13,7 @@ export const studentShape = PropTypes.shape({ videoPercentWatched: PropTypes.number, }); -export const studentsIndexShape = PropTypes.shape({ +export const studentsIndexShape = { isCourseGamified: PropTypes.bool.isRequired, showVideo: PropTypes.bool.isRequired, courseVideoCount: PropTypes.number.isRequired, @@ -21,5 +21,4 @@ export const studentsIndexShape = PropTypes.shape({ students: PropTypes.arrayOf(studentShape).isRequired, isFetching: PropTypes.bool.isRequired, isError: PropTypes.bool.isRequired, - intl: PropTypes.object.isRequired, -}); +};