diff --git a/src/components/view/Course.jsx b/src/components/view/Course.jsx
index 5e4f46a..fe2a7bf 100644
--- a/src/components/view/Course.jsx
+++ b/src/components/view/Course.jsx
@@ -7,9 +7,9 @@ import { normalizeCourseName, WEEK_DAYS } from '../../utils.jsx'
 export const Course = ({ events, selection, setSelection, hideOtherCourses }) => {
     const selectionSet = new Set(selection)
 
-    const visibleEvents = !hideOtherCourses ? events : events.filter(e => selectionSet.has(e.name))
+    const visibleEvents = !hideOtherCourses ? events : events.filter(e => selectionSet.has(e.id))
 
-    const eventsByCourse = _.groupBy(_.sortBy(visibleEvents, 'name'), 'name')
+    const eventsByCourse = _.groupBy(_.sortBy(visibleEvents, 'id'), 'id')
 
     const [currentlyHovered, setCurrentlyHovered] = useState(null)
     const element = useRef()
@@ -38,20 +38,20 @@ export const Course = ({ events, selection, setSelection, hideOtherCourses }) =>
     return (
         <div class="course-view" ref={element}>
             <div class="wrap-container">
-                {Object.entries(eventsByCourse).map(([name, courseEvents]) => (
+                {Object.entries(eventsByCourse).map(([id, courseEvents]) => (
                     <div
                         class={
                             'course' +
-                            (currentlyHovered === name ? ' highlight' : '') +
-                            (selectionSet.has(name) ? ' selected' : '')
+                            (currentlyHovered === id ? ' highlight' : '') +
+                            (selectionSet.has(id) ? ' selected' : '')
                         }
-                        data-course-id={name}
+                        data-course-id={id}
                         onClick={() => {
-                            if (!selectionSet.has(name)) setSelection([...selection, name])
-                            else setSelection(selection.filter(n => n !== name))
+                            if (!selectionSet.has(id)) setSelection([...selection, id])
+                            else setSelection(selection.filter(selId => selId !== id))
                         }}
                     >
-                        <div class="title">{normalizeCourseName(name)}</div>
+                        <div class="title">{normalizeCourseName(courseEvents[0].name)}</div>
                         <div class="docenti">{courseEvents[0].docenti.join(', ')}</div>
                         <div class="events">
                             {courseEvents.map(course => (
diff --git a/src/components/view/WorkWeek.jsx b/src/components/view/WorkWeek.jsx
index 2636d52..07b8228 100644
--- a/src/components/view/WorkWeek.jsx
+++ b/src/components/view/WorkWeek.jsx
@@ -9,16 +9,8 @@ import { layoutIntervals } from '../../interval-layout.js'
 export const WorkWeek = ({ events, selection, setSelection, hideOtherCourses }) => {
     const selectionSet = new Set(selection)
 
-    // const base = {
-    //     1: [],
-    //     2: [],
-    //     3: [],
-    //     4: [],
-    //     5: [],
-    // }
-
     const eventsByWeekday = _.groupBy(
-        !hideOtherCourses ? events : events.filter(e => selectionSet.has(e.name)),
+        !hideOtherCourses ? events : events.filter(e => selectionSet.has(e.id)),
         event => event.start.getDay()
     )
 
@@ -110,29 +102,27 @@ export const WorkWeek = ({ events, selection, setSelection, hideOtherCourses })
                                     <div
                                         class={
                                             'event' +
-                                            (currentlyHovered === event.data.name
+                                            (currentlyHovered === event.data.id
                                                 ? ' highlight'
                                                 : '') +
-                                            (selectionSet.has(event.data.name) ? ' selected' : '')
+                                            (selectionSet.has(event.data.id) ? ' selected' : '')
                                         }
-                                        data-event-id={event.data.name}
+                                        data-event-id={event.data.id}
                                         style={{
                                             '--start': event.start / 60 - 7,
                                             '--stack': stackIndex + 1,
                                             '--size': (event.end - event.start) / 60,
                                             '--hue':
-                                                (Math.abs(hashString('seed3' + event.data.name)) %
+                                                (Math.abs(hashString('seed3' + event.data.id)) %
                                                     360) +
                                                 'deg',
                                         }}
                                         onClick={() => {
-                                            if (!selectionSet.has(event.data.name))
-                                                setSelection([...selection, event.data.name])
+                                            if (!selectionSet.has(event.data.id))
+                                                setSelection([...selection, event.data.id])
                                             else
                                                 setSelection(
-                                                    selection.filter(
-                                                        name => event.data.name !== name
-                                                    )
+                                                    selection.filter(id => event.data.id !== id)
                                                 )
                                         }}
                                     >
diff --git a/src/components/view/WorkWeekTranspose.jsx b/src/components/view/WorkWeekTranspose.jsx
index d9bd753..25f17f6 100644
--- a/src/components/view/WorkWeekTranspose.jsx
+++ b/src/components/view/WorkWeekTranspose.jsx
@@ -80,7 +80,7 @@ export const WorkWeekTranspose = ({ events }) => {
                                                     '--size': (event.end - event.start) / 60,
                                                     '--hue':
                                                         (Math.abs(
-                                                            hashString('seed3' + event.data.name)
+                                                            hashString('seed3' + event.data.id)
                                                         ) %
                                                             360) +
                                                         'deg',
diff --git a/src/main.jsx b/src/main.jsx
index ac50c88..f4e0399 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -84,6 +84,7 @@ const App = ({}) => {
     const [showMobileMenu, setShowMobileMenu] = useState(false)
 
     useEffect(async () => {
+        console.log('source changed')
         const eventi = await loadEventi(CALENDAR_IDS[source])
 
         window.dataBuffer[source] = eventi
@@ -91,23 +92,21 @@ const App = ({}) => {
         setEventi(eventi)
     }, [source])
 
-    useEffect(() => {
-        setSelectedCourses(selectedCourses => {
-            const nextCoursesGroup = new Set(eventi.map(e => e.nome))
-
-            // Here the filter is on "selection" because most of the times |selection| <= |nextCoursesGroup|
-            const intersectionSize = selectedCourses.filter(nome =>
-                nextCoursesGroup.has(nome)
-            ).length
+    const groupIds = new Set(eventi.map(e => e.nome))
+    const toolOverlayVisible =
+        selectedCourses.length > 0 && selectedCourses.filter(id => groupIds.has(id)).length > 0
 
-            return intersectionSize === 0 ? [] : selectedCourses
-        })
-    }, [eventi, selectedCourses])
+    useEffect(() => {
+        console.log('course length changed')
+        const groupIds = new Set(eventi.map(e => e.nome))
 
-    // TODO: Should wrap in "useEffect"?
-    if (selectedCourses.length === 0) {
-        setHideOtherCourses(false)
-    }
+        if (
+            selectedCourses.length === 0 ||
+            selectedCourses.filter(id => groupIds.has(id)).length === 0
+        ) {
+            setHideOtherCourses(false)
+        }
+    }, [eventi, selectedCourses.length])
 
     const [theme, setTheme] = useState(
         localStorage.getItem('theme') ??
@@ -138,6 +137,7 @@ const App = ({}) => {
                 hideOtherCourses={hideOtherCourses}
                 start={new Date(2022, 10, 3)}
                 events={eventi.map(({ nome, dataInizio, dataFine, docenti, aule }) => ({
+                    id: nome,
                     name: _.split(nome, '-', 1)[0].trim(),
                     start: new Date(dataInizio),
                     end: new Date(dataFine),
@@ -150,7 +150,7 @@ const App = ({}) => {
                     ),
                 }))}
             />
-            {selectedCourses.length > 0 && (
+            {toolOverlayVisible && (
                 <ToolOverlay
                     visibility={hideOtherCourses}
                     toggleVisibility={() => setHideOtherCourses(s => !s)}