From 8a4bfe621f036566f9d88c6f28239128844fed64 Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Sat, 10 Feb 2024 20:21:57 -0800
Subject: [PATCH] fix: remove hovered course on unmount (#901)

---
 .../RightPane/CoursePane/CourseRenderPane.tsx | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx
index 2fb68eec9..d19ccb031 100644
--- a/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx
+++ b/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx
@@ -19,12 +19,16 @@ import Grades from '$lib/grades';
 import analyticsEnum from '$lib/analytics';
 import { openSnackbar } from '$actions/AppStoreActions';
 import WebSOC from '$lib/websoc';
+import { useHoveredStore } from '$stores/HoveredStore';
 
 function getColors() {
-    const courseColors = AppStore.schedule.getCurrentCourses().reduce((accumulator, { section }) => {
-        accumulator[section.sectionCode] = section.color;
-        return accumulator;
-    }, {} as { [key: string]: string });
+    const courseColors = AppStore.schedule.getCurrentCourses().reduce(
+        (accumulator, { section }) => {
+            accumulator[section.sectionCode] = section.color;
+            return accumulator;
+        },
+        {} as { [key: string]: string }
+    );
 
     return courseColors;
 }
@@ -174,6 +178,8 @@ export default function CourseRenderPane(props: { id?: number }) {
     const [error, setError] = useState(false);
     const [scheduleNames, setScheduleNames] = useState(AppStore.getScheduleNames());
 
+    const setHoveredCourseEvents = useHoveredStore((store) => store.setHoveredCourseEvents);
+
     const loadCourses = useCallback(async () => {
         setLoading(true);
 
@@ -253,6 +259,17 @@ export default function CourseRenderPane(props: { id?: number }) {
         };
     }, [loadCourses, props.id]);
 
+    /**
+     * Removes hovered course when component unmounts
+     * Handles edge cases where the Section Table is removed, rather than the mouse
+     * ex: Swapping to the Added tab, clicking the LocationCell link
+     */
+    useEffect(() => {
+        return () => {
+            setHoveredCourseEvents(undefined);
+        };
+    }, [setHoveredCourseEvents]);
+
     return (
         <>
             {loading ? (