import React, { useContext, useEffect, useState, MouseEvent } from 'react'; import { SchedulerRow } from './SchedulerRow'; import { coursesContext } from '../contexts/CoursesProvider'; import { Group, Basket } from '../types'; interface SchedulerEventsProps { cellTop: number; cellWidth: number; cellHeight: number; } export const SchedulerEvents = ({ cellTop, cellWidth, cellHeight }: SchedulerEventsProps) => { const { basket } = useContext(coursesContext)!; const [choosenGroupsMappedToEvents, setChoosenGroupsMappedToEvents] = useState([]); interface GroupTimeToEventRowMapping { [time: string]: number; } const groupTimeToEventRowMapping: GroupTimeToEventRowMapping = { '8.15': 0, '10.00': 1, '11.45': 2, '13.45': 3, '15.30': 4, '17.15': 5, }; useEffect(() => { function mapGroupTimeToEventRow(basket: Array) { const classes = basket.map(({ classes, name }) => ({ ...classes, name })) as Array; const lectures = basket.map(({ lecture, name }) => ({ ...lecture, name })) as Array; const merged = [...classes, ...lectures]; //deleted if statement, maybe it is needed const groupsMapped = merged.map(({ id, day, lecturer, room, time, name,type }) => ({ id, day, lecturer, room, eventRow: groupTimeToEventRowMapping[time], name, type, })); setChoosenGroupsMappedToEvents(groupsMapped); } mapGroupTimeToEventRow(basket); }, [basket]); return (
{[...Array(6)].map((_, index) => ( group.eventRow === index)} indexRow={index} cellTop={ index === 0 ? cellTop + (cellHeight + cellHeight * 2 * index + cellHeight / 4) : index === 1 ? cellTop + (cellHeight + cellHeight * 2 * index) : index === 2 ? cellTop + (cellHeight + cellHeight * 2 * index - cellHeight / 4) : index === 3 ? cellTop + (cellHeight + cellHeight * 2 * index - cellHeight / 4) : index === 4 ? cellTop + (cellHeight + cellHeight * 2 * index - cellHeight / 2) : index === 5 ? cellTop + (cellHeight + cellHeight * 2 * index - (cellHeight * 3) / 4) : 0 } cellWidth={cellWidth} cellHeight={cellHeight} /> ))}
); };