From 0f0bc1c52afb0dc3551636185928e592124f95a7 Mon Sep 17 00:00:00 2001 From: Antonio De Lucreziis Date: Mon, 12 Sep 2022 12:03:56 +0200 Subject: [PATCH] Fiexed a bug --- src/components/view/Course.jsx | 18 ++++++------- src/components/view/WorkWeek.jsx | 26 ++++++------------ src/components/view/WorkWeekTranspose.jsx | 2 +- src/main.jsx | 32 +++++++++++------------ 4 files changed, 34 insertions(+), 44 deletions(-) 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 (
- {Object.entries(eventsByCourse).map(([name, courseEvents]) => ( + {Object.entries(eventsByCourse).map(([id, courseEvents]) => (
{ - 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)) }} > -
{normalizeCourseName(name)}
+
{normalizeCourseName(courseEvents[0].name)}
{courseEvents[0].docenti.join(', ')}
{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 })
{ - 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 && ( setHideOtherCourses(s => !s)}