fix: solve lint issues

Author: bra-i-am

src/learningpath/CourseCard.jsx

@@ -1,8 +1,7 @@
 import React, { useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
-import { Link } from 'react-router-dom';
 import {
-  Card, Button, Col, ProgressBar, Chip, PageBanner, Icon,
+  Card, Button, Icon,
 } from '@openedx/paragon';
 import {
   AccessTime,
@@ -20,7 +19,12 @@ import { buildCourseHomeUrl } from './utils';
 import { useScreenSize } from '../hooks/useScreenSize';
 
 export const CourseCard = ({
-  course, relatedLearningPaths, onClick, onClickViewButton, isEnrolledInLearningPath, showFilters = false, orientationOverride, isEnrolledInCourse = false,
+  course,
+  onClick,
+  onClickViewButton,
+  isEnrolledInLearningPath,
+  showFilters = false,
+  orientationOverride,
 }) => {
   const { formatMessage } = useIntl();
   const {
@@ -51,8 +55,6 @@ export const CourseCard = ({
     prefetchCourseDetail();
   };
 
-  const linkTo = buildCourseHomeUrl(course.id);
-
   let buttonText = formatMessage(messages.startCourse);
 
   switch (status?.toLowerCase()) {
@@ -175,10 +177,6 @@ CourseCard.propTypes = {
     percent: PropTypes.number.isRequired,
     checkingEnrollment: PropTypes.bool,
   }).isRequired,
-  relatedLearningPaths: PropTypes.arrayOf(PropTypes.shape({
-    name: PropTypes.string.isRequired,
-    key: PropTypes.string.isRequired,
-  })),
   onClick: PropTypes.func,
   onClickViewButton: PropTypes.func,
   isEnrolledInLearningPath: PropTypes.bool,

src/learningpath/CourseDetails.jsx

@@ -56,6 +56,16 @@ const CourseDetailContent = ({
 
   const { isSmall } = useScreenSize();
   const navigate = useNavigate();
+  const paceText = selfPaced
+    ? formatMessage(messages.selfPaced)
+    : formatMessage(messages.instructorPaced);
+  const aboutHtml = replaceStaticAssetReferences(
+    description || shortDescription || formatMessage(messages.noDescription),
+    course.id,
+  );
+  const scheduleText = selfPaced
+    ? formatMessage(messages.progressAtYourOwnSpeed)
+    : formatMessage(messages.followCourseSchedule);
   const handleClose = onClose || (() => navigate(-1));
   const { courseKey: urlCourseKey } = useParams();
   const activeCourseKey = course.id || urlCourseKey;
@@ -148,10 +158,8 @@ const CourseDetailContent = ({
           <div className="d-flex align-items-center">
             <Icon src={Person} className="mr-4 mb-3.5" />
             <div>
-              <p className="mb-0 font-weight-bold">{selfPaced ? formatMessage(messages.selfPaced) : formatMessage(messages.instructorPaced)}</p>
-              <p className="mb-0 text-muted">
-                {selfPaced ? formatMessage(messages.progressAtYourOwnSpeed) : formatMessage(messages.followCourseSchedule)}
-              </p>
+              <p className="mb-0 font-weight-bold">{paceText}</p>
+              <p className="mb-0 text-muted">{scheduleText}</p>
             </div>
           </div>
         </Row>
@@ -172,10 +180,7 @@ const CourseDetailContent = ({
       <div className="py-3">
         <section id="about">
           {/* eslint-disable-next-line react/no-danger */}
-          <div dangerouslySetInnerHTML={{
-            __html: replaceStaticAssetReferences(description || shortDescription || formatMessage(messages.noDescription), course.id),
-          }}
-          />
+          <div dangerouslySetInnerHTML={{ __html: aboutHtml }} />
         </section>
       </div>
     </>
@@ -205,6 +210,7 @@ const CourseDetailPage = ({
   courseKey: propCourseKey,
   learningPathTitle,
 }) => {
+  const { formatMessage } = useIntl();
   const { courseKey: urlCourseKey } = useParams();
   const courseKey = propCourseKey || urlCourseKey;
 

src/learningpath/DataSharingAuthorizationModal.jsx

@@ -1,18 +1,18 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import {
-  ModalDialog, Button, Alert, Stack,
+  ModalDialog, Button, Stack,
 } from '@openedx/paragon';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import messages from './message';
 
-export default function DataSharingAuthorizationModal({
+const DataSharingAuthorizationModal = ({
   isOpen,
   onClose,
   onAllow,
   partnerName = 'Corporate Partner Name',
   additionalMessage,
-}) {
+}) => {
   const { formatMessage } = useIntl();
   return (
     <ModalDialog
@@ -54,7 +54,7 @@ export default function DataSharingAuthorizationModal({
       </ModalDialog.Body>
 
       <ModalDialog.Footer>
-        <Button className='mr-2' variant="tertiary" onClick={onClose}>
+        <Button className="mr-2" variant="tertiary" onClick={onClose}>
           {formatMessage(messages.dataSharingDoNotShare)}
         </Button>
         <Button variant="primary" onClick={onAllow}>
@@ -63,7 +63,9 @@ export default function DataSharingAuthorizationModal({
       </ModalDialog.Footer>
     </ModalDialog>
   );
-}
+};
+
+export default DataSharingAuthorizationModal;
 
 DataSharingAuthorizationModal.propTypes = {
   isOpen: PropTypes.bool.isRequired,

src/learningpath/FilterPanel.jsx

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import {
   Button, ButtonGroup, Form, Icon, IconButton,
 } from '@openedx/paragon';
-import { FilterList, Close } from '@openedx/paragon/icons';
+import { Close } from '@openedx/paragon/icons';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import messages from './message';
 

src/learningpath/LearningPathDetails.jsx

@@ -1,7 +1,7 @@
 import React, { useMemo, useState, useEffect } from 'react';
 import { useParams, Link, useSearchParams } from 'react-router-dom';
 import {
-  Row, Spinner, Nav, Icon, ModalLayer, Button, Chip, Card, Collapsible, Col,
+  Row, Spinner, Icon, ModalLayer, Button, Chip, Card, Collapsible, Col,
   Stack,
 } from '@openedx/paragon';
 import {
@@ -65,6 +65,8 @@ const LearningPathDetailPage = () => {
 
   const [isModalOpen, setIsModalOpen] = useState(false);
 
+  const enrollMutation = useEnrollLearningPath();
+
   const handleDoNotShare = () => {
     setIsModalOpen(false);
   };
@@ -94,8 +96,6 @@ const LearningPathDetailPage = () => {
     error: coursesError,
   } = useCoursesByIds(courseIds);
 
-  const enrollMutation = useEnrollLearningPath();
-
   const accessUntilDate = useMemo(() => {
     if (!coursesForPath) {
       return null;
@@ -184,11 +184,8 @@ const LearningPathDetailPage = () => {
     const {
       name,
       image,
-      subtitle,
       duration,
       timeCommitment,
-      requiredSkills,
-      description,
       enrollmentDate,
     } = detail;
 

src/learningpath/data/queries.js

@@ -47,9 +47,6 @@ export const useLearningPaths = () => {
         queryFn: api.fetchAllCourseCompletions,
       });
 
-      const completions = queryClient.getQueryData(QUERY_KEYS.COURSE_COMPLETIONS) || {};
-      const completionsMap = createCompletionsMap(completions);
-
       const learningPathList = await api.fetchLearningPaths();
 
       return learningPathList.map(lp => {
@@ -78,8 +75,8 @@ export const useLearningPaths = () => {
           percent = Math.round(progress * 100);
         }
 
-        let minDate = null;
-        let maxDate = null;
+        const minDate = null;
+        const maxDate = null;
 
         return {
           ...lp,

src/learningpath/progress/CourseWithProgress.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import ProgressIndicator from './ProgressIndicator';
 import { CourseCardWithEnrollment } from '../CourseCard';
 import { Course } from './types';
 

src/learningpath/progress/CoursesWithProgressList.tsx

@@ -15,10 +15,8 @@ const CoursesWithProgressList: React.FC<CoursesWithProgressListProps> = ({
   learningPathId,
   isEnrolledInLearningPath = false,
   onCourseClick,
-}) => {
-
-  return (
-    <Container fluid className="py-4 learning-path-courses-grid w-100 px-0">
+}) => (
+  <Container fluid className="py-4 learning-path-courses-grid w-100 px-0">
     <Row className="g-12">
       {courses.map((course) => (
         <Col key={course.id} xs={12} sm={6} md={6} lg={6} xl={4}>
@@ -32,7 +30,6 @@ const CoursesWithProgressList: React.FC<CoursesWithProgressListProps> = ({
       ))}
     </Row>
   </Container>
-  );
-};
+);
 
 export default CoursesWithProgressList;

src/learningpath/utils.js

@@ -16,11 +16,11 @@ export const buildCourseHomeUrl = (courseId) => {
 
 export const buildMarketingSiteCourseUrl = (courseId) => {
   const marketingSiteBase = getConfig().MARKETING_SITE_BASE_URL;
-  return `${marketingSiteBase}/${courseId}`
+  return `${marketingSiteBase}/${courseId}`;
 };
 
 export const buildCourseAboutUrl = (courseId) => {
   const lmsBaseUrl = getConfig().LMS_BASE_URL;
   const trimmedBase = lmsBaseUrl.replace(/\/$/, '');
   return `${trimmedBase}/courses/${courseId}/about`;
-}
+};