-
-
-
{intl.formatMessage(messages.courseCompletion)}
-
- {intl.formatMessage(messages.completionBody)}
-
-
-
-
-
+const CourseCompletion = ({ intl }) => (
+
+
+
+
{intl.formatMessage(messages.courseCompletion)}
+
+ {intl.formatMessage(messages.completionBody)}
+
-
- );
-}
+
+
+
+
+);
CourseCompletion.propTypes = {
intl: intlShape.isRequired,
diff --git a/src/course-home/progress-tab/course-completion/IncompleteDonutSegment.jsx b/src/course-home/progress-tab/course-completion/IncompleteDonutSegment.jsx
index e1bcc3d7f1..9f2d16eb87 100644
--- a/src/course-home/progress-tab/course-completion/IncompleteDonutSegment.jsx
+++ b/src/course-home/progress-tab/course-completion/IncompleteDonutSegment.jsx
@@ -6,13 +6,13 @@ import { OverlayTrigger, Popover } from '@edx/paragon';
import messages from './messages';
-function IncompleteDonutSegment({ incompletePercentage, intl }) {
+const IncompleteDonutSegment = ({ incompletePercentage, intl }) => {
+ const [showIncompletePopover, setShowIncompletePopover] = useState(false);
+
if (!incompletePercentage) {
return null;
}
- const [showIncompletePopover, setShowIncompletePopover] = useState(false);
-
const incompleteSegmentOffset = (3.6 * incompletePercentage) / 16;
const incompleteTooltipDegree = incompletePercentage < 100 ? incompleteSegmentOffset : 0;
@@ -49,7 +49,7 @@ function IncompleteDonutSegment({ incompletePercentage, intl }) {
);
-}
+};
IncompleteDonutSegment.propTypes = {
incompletePercentage: PropTypes.number.isRequired,
diff --git a/src/course-home/progress-tab/course-completion/LockedDonutSegment.jsx b/src/course-home/progress-tab/course-completion/LockedDonutSegment.jsx
index 0ad8b02d04..9ab5b4de71 100644
--- a/src/course-home/progress-tab/course-completion/LockedDonutSegment.jsx
+++ b/src/course-home/progress-tab/course-completion/LockedDonutSegment.jsx
@@ -6,7 +6,7 @@ import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
import messages from './messages';
-function LockedDonutSegment({ intl, lockedPercentage }) {
+const LockedDonutSegment = ({ intl, lockedPercentage }) => {
const [showLockedPopover, setShowLockedPopover] = useState(false);
if (!lockedPercentage) {
@@ -62,7 +62,7 @@ function LockedDonutSegment({ intl, lockedPercentage }) {
);
-}
+};
LockedDonutSegment.propTypes = {
intl: intlShape.isRequired,
diff --git a/src/course-home/progress-tab/credit-information/CreditInformation.jsx b/src/course-home/progress-tab/credit-information/CreditInformation.jsx
index 8683fb2c6f..24198be975 100644
--- a/src/course-home/progress-tab/credit-information/CreditInformation.jsx
+++ b/src/course-home/progress-tab/credit-information/CreditInformation.jsx
@@ -10,7 +10,7 @@ import { DashboardLink } from '../../../shared/links';
import messages from './messages';
-function CreditInformation({ intl }) {
+const CreditInformation = ({ intl }) => {
const {
courseId,
} = useSelector(state => state.courseHome);
@@ -106,7 +106,7 @@ function CreditInformation({ intl }) {
{requirements}
);
-}
+};
CreditInformation.propTypes = {
intl: intlShape.isRequired,
diff --git a/src/course-home/progress-tab/grades/course-grade/CourseGrade.jsx b/src/course-home/progress-tab/grades/course-grade/CourseGrade.jsx
index 2d2677e3a8..6aabdc08e6 100644
--- a/src/course-home/progress-tab/grades/course-grade/CourseGrade.jsx
+++ b/src/course-home/progress-tab/grades/course-grade/CourseGrade.jsx
@@ -11,7 +11,7 @@ import CreditInformation from '../../credit-information/CreditInformation';
import messages from '../messages';
-function CourseGrade({ intl }) {
+const CourseGrade = ({ intl }) => {
const {
courseId,
} = useSelector(state => state.courseHome);
@@ -52,7 +52,7 @@ function CourseGrade({ intl }) {
-
-
- {tabs.map(({ url, title, slug }) => (
-
- {title}
-
- ))}
-
-
+}) => (
+
+
+
+ {tabs.map(({ url, title, slug }) => (
+
+ {title}
+
+ ))}
+
- );
-}
+
+);
CourseTabsNavigation.propTypes = {
activeTabSlug: PropTypes.string,
diff --git a/src/courseware/CoursewareContainer.test.jsx b/src/courseware/CoursewareContainer.test.jsx
index 83e59262e6..7b02f611e3 100644
--- a/src/courseware/CoursewareContainer.test.jsx
+++ b/src/courseware/CoursewareContainer.test.jsx
@@ -24,15 +24,13 @@ import { buildOutlineFromBlocks } from './data/__factories__/learningSequencesOu
// to have been passed into the component. Separate tests can handle unit rendering, but this
// proves that the component is rendered and receives the correct props. We probably COULD render
// Unit.jsx and its iframe in this test, but it's already complex enough.
-function MockUnit({ courseId, id }) { // eslint-disable-line react/prop-types
- return (
-
Unit Contents {courseId} {id}
- );
-}
jest.mock(
'./course/sequence/Unit',
- () => MockUnit,
+ // eslint-disable-next-line react/prop-types
+ () => function ({ courseId, id }) {
+ return
Unit Contents {courseId} {id}
;
+ },
);
jest.mock('@edx/frontend-platform/analytics');
diff --git a/src/courseware/CoursewareRedirectLandingPage.jsx b/src/courseware/CoursewareRedirectLandingPage.jsx
index 5be31f90f3..0597a7b22b 100644
--- a/src/courseware/CoursewareRedirectLandingPage.jsx
+++ b/src/courseware/CoursewareRedirectLandingPage.jsx
@@ -7,7 +7,7 @@ import { PageRoute } from '@edx/frontend-platform/react';
import queryString from 'query-string';
import PageLoading from '../generic/PageLoading';
-export default () => {
+const CoursewareRedirectLandingPage = () => {
const { path } = useRouteMatch();
return (
@@ -50,3 +50,5 @@ export default () => {
);
};
+
+export default CoursewareRedirectLandingPage;
diff --git a/src/courseware/course/Course.jsx b/src/courseware/course/Course.jsx
index 480bf8a5cb..4bc56f1430 100644
--- a/src/courseware/course/Course.jsx
+++ b/src/courseware/course/Course.jsx
@@ -18,7 +18,7 @@ import SidebarTriggers from './sidebar/SidebarTriggers';
import { useModel } from '../../generic/model-store';
import { getSessionStorage, setSessionStorage } from '../../data/sessionStorage';
-function Course({
+const Course = ({
courseId,
sequenceId,
unitId,
@@ -26,7 +26,7 @@ function Course({
previousSequenceHandler,
unitNavigationHandler,
windowWidth,
-}) {
+}) => {
const course = useModel('coursewareMeta', courseId);
const {
celebrations,
@@ -109,7 +109,7 @@ function Course({
);
-}
+};
Course.propTypes = {
courseId: PropTypes.string,
@@ -127,7 +127,7 @@ Course.defaultProps = {
unitId: null,
};
-function CourseWrapper(props) {
+const CourseWrapper = (props) => {
// useWindowSize initially returns an undefined width intentionally at first.
// See https://www.joshwcomeau.com/react/the-perils-of-rehydration/ for why.
// But
has some tricky window-size-dependent, session-storage-setting logic and React would yell at us if
@@ -139,6 +139,6 @@ function CourseWrapper(props) {
}
return ;
-}
+};
export default CourseWrapper;
diff --git a/src/courseware/course/CourseBreadcrumbs.jsx b/src/courseware/course/CourseBreadcrumbs.jsx
index a90aff5f8c..0a1e73493d 100644
--- a/src/courseware/course/CourseBreadcrumbs.jsx
+++ b/src/courseware/course/CourseBreadcrumbs.jsx
@@ -10,9 +10,9 @@ import { Link } from 'react-router-dom';
import { useModel, useModels } from '../../generic/model-store';
import JumpNavMenuItem from './JumpNavMenuItem';
-function CourseBreadcrumb({
+const CourseBreadcrumb = ({
content, withSeparator, courseId, sequenceId, unitId, isStaff,
-}) {
+}) => {
const defaultContent = content.filter(destination => destination.default)[0] || { id: courseId, label: '', sequences: [] };
return (
<>
@@ -55,7 +55,7 @@ function CourseBreadcrumb({
);
-}
+};
CourseBreadcrumb.propTypes = {
content: PropTypes.arrayOf(
PropTypes.shape({
@@ -79,13 +79,13 @@ CourseBreadcrumb.defaultProps = {
isStaff: null,
};
-export default function CourseBreadcrumbs({
+const CourseBreadcrumbs = ({
courseId,
sectionId,
sequenceId,
unitId,
isStaff,
-}) {
+}) => {
const course = useModel('coursewareMeta', courseId);
const courseStatus = useSelector(state => state.courseware.courseStatus);
const sequenceStatus = useSelector(state => state.courseware.sequenceStatus);
@@ -151,7 +151,7 @@ export default function CourseBreadcrumbs({
);
-}
+};
CourseBreadcrumbs.propTypes = {
courseId: PropTypes.string.isRequired,
@@ -167,3 +167,5 @@ CourseBreadcrumbs.defaultProps = {
unitId: null,
isStaff: null,
};
+
+export default CourseBreadcrumbs;
diff --git a/src/courseware/course/JumpNavMenuItem.jsx b/src/courseware/course/JumpNavMenuItem.jsx
index 37077f29c8..4bfe74b3c4 100644
--- a/src/courseware/course/JumpNavMenuItem.jsx
+++ b/src/courseware/course/JumpNavMenuItem.jsx
@@ -8,14 +8,14 @@ import {
sendTrackEvent,
} from '@edx/frontend-platform/analytics';
-export default function JumpNavMenuItem({
+const JumpNavMenuItem = ({
title,
courseId,
currentSequence,
currentUnit,
sequences,
isDefault,
-}) {
+}) => {
function logEvent(targetUrl) {
const eventName = 'edx.ui.lms.jump_nav.selected';
const payload = {
@@ -48,7 +48,7 @@ export default function JumpNavMenuItem({
{title}
);
-}
+};
const sequenceShape = PropTypes.shape({
id: PropTypes.string.isRequired,
@@ -62,3 +62,5 @@ JumpNavMenuItem.propTypes = {
currentSequence: PropTypes.string.isRequired,
currentUnit: PropTypes.string.isRequired,
};
+
+export default JumpNavMenuItem;
diff --git a/src/courseware/course/bookmark/BookmarkButton.jsx b/src/courseware/course/bookmark/BookmarkButton.jsx
index 29e9d9ba8c..0f105a9160 100644
--- a/src/courseware/course/bookmark/BookmarkButton.jsx
+++ b/src/courseware/course/bookmark/BookmarkButton.jsx
@@ -23,9 +23,9 @@ const hasBookmarkLabel = (
/>
);
-export default function BookmarkButton({
+const BookmarkButton = ({
isBookmarked, isProcessing, unitId,
-}) {
+}) => {
const bookmarkState = isBookmarked ? 'bookmarked' : 'default';
const state = isProcessing ? `${bookmarkState}Processing` : bookmarkState;
@@ -36,6 +36,7 @@ export default function BookmarkButton({
} else {
dispatch(addBookmark(unitId));
}
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [isBookmarked, unitId]);
return (
@@ -59,7 +60,7 @@ export default function BookmarkButton({
}}
/>
);
-}
+};
BookmarkButton.propTypes = {
unitId: PropTypes.string.isRequired,
@@ -70,3 +71,5 @@ BookmarkButton.propTypes = {
BookmarkButton.defaultProps = {
isBookmarked: false,
};
+
+export default BookmarkButton;
diff --git a/src/courseware/course/bookmark/BookmarkFilledIcon.jsx b/src/courseware/course/bookmark/BookmarkFilledIcon.jsx
index cb2a6614ee..af6efe730b 100644
--- a/src/courseware/course/bookmark/BookmarkFilledIcon.jsx
+++ b/src/courseware/course/bookmark/BookmarkFilledIcon.jsx
@@ -2,6 +2,6 @@ import React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faBookmark } from '@fortawesome/free-solid-svg-icons';
-export default function BookmarkFilledIcon(props) {
- return ;
-}
+const BookmarkFilledIcon = (props) => ;
+
+export default BookmarkFilledIcon;
diff --git a/src/courseware/course/bookmark/BookmarkOutlineIcon.jsx b/src/courseware/course/bookmark/BookmarkOutlineIcon.jsx
index eed786a69f..2153625754 100644
--- a/src/courseware/course/bookmark/BookmarkOutlineIcon.jsx
+++ b/src/courseware/course/bookmark/BookmarkOutlineIcon.jsx
@@ -2,6 +2,6 @@ import React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faBookmark } from '@fortawesome/free-regular-svg-icons';
-export default function BookmarkOutlineIcon(props) {
- return ;
-}
+const BookmarkOutlineIcon = (props) => ;
+
+export default BookmarkOutlineIcon;
diff --git a/src/courseware/course/celebration/CelebrationModal.jsx b/src/courseware/course/celebration/CelebrationModal.jsx
index 768bc1fe38..6b0f2e7e5d 100644
--- a/src/courseware/course/celebration/CelebrationModal.jsx
+++ b/src/courseware/course/celebration/CelebrationModal.jsx
@@ -16,9 +16,9 @@ import SocialIcons from '../../social-share/SocialIcons';
import { recordFirstSectionCelebration } from './utils';
import { useModel } from '../../../generic/model-store';
-function CelebrationModal({
+const CelebrationModal = ({
courseId, intl, isOpen, onClose, ...rest
-}) {
+}) => {
const { org } = useModel('courseHomeMeta', courseId);
const wideScreen = useWindowSize().width >= breakpoints.small.minWidth;
@@ -26,6 +26,7 @@ function CelebrationModal({
if (isOpen) {
recordFirstSectionCelebration(org, courseId);
}
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [isOpen]);
return (
@@ -59,7 +60,7 @@ function CelebrationModal({
);
-}
+};
CelebrationModal.propTypes = {
courseId: PropTypes.string.isRequired,
diff --git a/src/courseware/course/celebration/WeeklyGoalCelebrationModal.jsx b/src/courseware/course/celebration/WeeklyGoalCelebrationModal.jsx
index 4d04f16149..19dafc964d 100644
--- a/src/courseware/course/celebration/WeeklyGoalCelebrationModal.jsx
+++ b/src/courseware/course/celebration/WeeklyGoalCelebrationModal.jsx
@@ -11,15 +11,16 @@ import messages from './messages';
import { recordWeeklyGoalCelebration } from './utils';
import { useModel } from '../../../generic/model-store';
-function WeeklyGoalCelebrationModal({
+const WeeklyGoalCelebrationModal = ({
courseId, daysPerWeek, intl, isOpen, onClose, ...rest
-}) {
+}) => {
const { org } = useModel('courseHomeMeta', courseId);
useEffect(() => {
if (isOpen) {
recordWeeklyGoalCelebration(org, courseId);
}
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [isOpen]);
return (
@@ -71,7 +72,7 @@ function WeeklyGoalCelebrationModal({
);
-}
+};
WeeklyGoalCelebrationModal.propTypes = {
courseId: PropTypes.string.isRequired,
diff --git a/src/courseware/course/content-tools/ContentTools.jsx b/src/courseware/course/content-tools/ContentTools.jsx
index 095dc2ed6e..871bf62971 100644
--- a/src/courseware/course/content-tools/ContentTools.jsx
+++ b/src/courseware/course/content-tools/ContentTools.jsx
@@ -4,22 +4,20 @@ import PropTypes from 'prop-types';
import Calculator from './calculator';
import NotesVisibility from './notes-visibility';
-export default function ContentTools({
+const ContentTools = ({
course,
-}) {
- return (
-
-
- {course.showCalculator && (
-
- )}
- {course.notes.enabled && (
-
- )}
-
+}) => (
+
+
+ {course.showCalculator && (
+
+ )}
+ {course.notes.enabled && (
+
+ )}
- );
-}
+
+);
ContentTools.propTypes = {
course: PropTypes.shape({
@@ -29,3 +27,5 @@ ContentTools.propTypes = {
showCalculator: PropTypes.bool,
}).isRequired,
};
+
+export default ContentTools;
diff --git a/src/courseware/course/content-tools/ContentTools.test.jsx b/src/courseware/course/content-tools/ContentTools.test.jsx
index 08cadff99f..152acac862 100644
--- a/src/courseware/course/content-tools/ContentTools.test.jsx
+++ b/src/courseware/course/content-tools/ContentTools.test.jsx
@@ -2,8 +2,12 @@ import React from 'react';
import { initializeTestStore, render, screen } from '../../../setupTest';
import ContentTools from './ContentTools';
-jest.mock('./calculator/Calculator', () => () =>
);
-jest.mock('./notes-visibility/NotesVisibility', () => () =>
);
+jest.mock('./calculator/Calculator', () => function () {
+ return
;
+});
+jest.mock('./notes-visibility/NotesVisibility', () => function () {
+ return
;
+});
describe('Content Tools', () => {
const mockData = {
diff --git a/src/courseware/course/course-exit/CatalogSuggestion.jsx b/src/courseware/course/course-exit/CatalogSuggestion.jsx
index ededa14676..f0287d97bb 100644
--- a/src/courseware/course/course-exit/CatalogSuggestion.jsx
+++ b/src/courseware/course/course-exit/CatalogSuggestion.jsx
@@ -16,7 +16,7 @@ import { useModel } from '../../../generic/model-store';
import messages from './messages';
import { logClick } from './utils';
-function CatalogSuggestion({ intl, variant }) {
+const CatalogSuggestion = ({ intl, variant }) => {
const { courseId } = useSelector(state => state.courseware);
const { org } = useModel('courseHomeMeta', courseId);
const { administrator } = getAuthenticatedUser();
@@ -45,7 +45,7 @@ function CatalogSuggestion({ intl, variant }) {