course conflict highlighting and calculations

src/views/components/CourseCatalogMain.tsx

@@ -71,7 +71,7 @@ export default function CourseCatalogMain({ support }: Props) {
                         key={row.course.uniqueId}
                         row={row}
                         isSelected={row.course.uniqueId === selectedCourse?.uniqueId}
-                        isInActiveSchedule={Boolean(activeSchedule?.containsCourse(row.course))}
+                        activeSchedule={activeSchedule}
                         onClick={handleRowButtonClick(row.course)}
                     />
                 );

src/views/components/injected/CoursePopup/GradeDistribution/GradeDistribution.tsx

@@ -14,7 +14,6 @@ import {
     queryAggregateDistribution,
     querySemesterDistribution,
 } from 'src/views/lib/database/queryDistribution';
-import { bMessenger } from 'src/shared/messages';
 import styles from './GradeDistribution.module.scss';
 
 enum DataStatus {
@@ -137,7 +136,6 @@ export default function GradeDistribution({ course }: Props) {
     useEffect(() => {
         queryAggregateDistribution(course)
             .then(([distribution, semesters]) => {
-                console.log('.then -> distribution, semesters:', distribution, semesters);
                 setSemesters(semesters);
                 updateChart(distribution);
                 setStatus(DataStatus.FOUND);

src/views/components/injected/TableRow/TableRow.module.scss

@@ -21,7 +21,8 @@
 
 .isConflict {
     * {
-        color: $speedway_brick !important;
+        color: $speedway_brick;
         text-decoration: line-through !important;
+        font-weight: normal !important;
     }
 }

src/views/components/injected/TableRow/TableRow.tsx

@@ -50,9 +50,21 @@ export default function TableRow({ row, isSelected, activeSchedule, onClick }: P
     }, [activeSchedule, element.classList]);
 
     useEffect(() => {
-        // if (!activeSchedule || !course) return;
-        // TODO: handle conflicts here
-    }, []);
+        if (!activeSchedule || !course) {
+            return;
+        }
+
+        let hasConflicts = activeSchedule.courses.find(c => {
+            let conflicts = course.getConflicts(c);
+            return conflicts.length > 0;
+        });
+
+        element.classList[hasConflicts ? 'add' : 'remove'](styles.isConflict);
+
+        return () => {
+            element.classList.remove(styles.isConflict);
+        };
+    }, [activeSchedule, course]);
 
     if (!container) {
         return null;