diff --git a/src/App.tsx b/src/App.tsx index 00bc599..11a0525 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -45,7 +45,6 @@ function App() { lectures={lectures} onGroupMouseOver={(id, name) => { }} - onGroupClick={(id, name) => {}} /> diff --git a/src/businesslogic/LecturesProvider.tsx b/src/businesslogic/LecturesProvider.tsx index 09777f2..623f446 100644 --- a/src/businesslogic/LecturesProvider.tsx +++ b/src/businesslogic/LecturesProvider.tsx @@ -1,26 +1,34 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { lectures } from "./mockData/lectures"; import { Lecture } from "./types/lecture"; - +import { Group } from "./types/group"; interface ILectureContext { lectures: Array; updateLectures: (lectures: Lecture) => void; } export const LecturesContext = React.createContext({ lectures: Array(), - updateLectures: (lectures: Lecture) => {}, + choosenGroups: Array(), + updateLectures: (lecture: Lecture) => {}, + updateGroups: (group : Group) => {} }); export const LecturesProvider: React.FC = (props) => { const [lectures, setLectures] = useState>([]); - + const [choosenGroups, setChoosenGroups] = useState>([]); const updateLectures = (lecture: Lecture) => { setLectures([...lectures, lecture]); }; + const updateGroups = (group : Group) => { + setChoosenGroups([...choosenGroups, group]); + }; + + + useEffect(()=>{console.log(`Groups have changed: ${JSON.stringify(choosenGroups)}`)},[choosenGroups]); return ( {props.children} diff --git a/src/components/RightBar/LectureCard/index.tsx b/src/components/RightBar/LectureCard/index.tsx index d18335f..071cd41 100644 --- a/src/components/RightBar/LectureCard/index.tsx +++ b/src/components/RightBar/LectureCard/index.tsx @@ -1,12 +1,13 @@ -import React from "react"; +import React, {useContext} from "react"; import "./index.scss"; import Collapse from "@material-ui/core/Collapse"; import ExpandIcon from "./expand.png"; import { Lecture } from "../../../businesslogic/types/lecture"; +import { Group } from "../../../businesslogic/types/group"; +import { LecturesContext } from "../../../businesslogic/LecturesProvider"; interface LectureCardProps { onGroupMouseOver: (id: string, name: string) => void; - onGroupClick: (id: string, name: string) => void; onCardClick: (e: React.MouseEvent) => void; lecture: Lecture; id: string; @@ -15,12 +16,21 @@ interface LectureCardProps { export default function LectureCard({ onGroupMouseOver, - onGroupClick, onCardClick, lecture, id, isSelected, }: LectureCardProps) { + + const {updateGroups} = useContext(LecturesContext); + + + function onGroupClick(group : Group){ + console.log(`group is: ${JSON.stringify(group)}`) + updateGroups(group); + } + + return (
{lecture.name}
@@ -35,7 +45,7 @@ export default function LectureCard({ className="class__group" key={index} onMouseOver={() => onGroupMouseOver(group.id, lecture.name)} - onClick={() => onGroupClick(group.id, lecture.name)} + onClick={() => onGroupClick(group)} >

{group.time} {group.room}

{group.lecturer} diff --git a/src/components/RightBar/index.tsx b/src/components/RightBar/index.tsx index 07e627d..c3d1bc5 100644 --- a/src/components/RightBar/index.tsx +++ b/src/components/RightBar/index.tsx @@ -6,14 +6,12 @@ import { LecturesContext } from "../../businesslogic/LecturesProvider"; interface RightBarProps { onGroupMouseOver: (id: string, name: string) => void; - onGroupClick: (id: string, name: string) => void; lectures: Array; } export default function RightBar({ lectures, onGroupMouseOver, - onGroupClick, }: RightBarProps) { const [selectedCardId, setSelectedCardId] = useState(null); @@ -28,9 +26,6 @@ export default function RightBar({ return (

- {/* - {(context) =>

{JSON.stringify((context as BuisnessProvided).states.user?.ticket)}

} - */}
Hubert Wrzesiński

Semestr zimowy 2020/2021 @@ -41,7 +36,6 @@ export default function RightBar({ key={index} id={index.toString()} onGroupMouseOver={onGroupMouseOver} - onGroupClick={onGroupClick} onCardClick={onCardClick} isSelected={selectedCardId === index.toString()} /> diff --git a/src/components/Scheduler/SchedulerEvent/index.tsx b/src/components/Scheduler/SchedulerEvent/index.tsx index 57b03ab..5189865 100644 --- a/src/components/Scheduler/SchedulerEvent/index.tsx +++ b/src/components/Scheduler/SchedulerEvent/index.tsx @@ -13,17 +13,16 @@ export const SchedulerEvent = ({ events, colIndex }: SchedulerEventProps) => { return ( <> - {events.map((event, index) => ( + {events.map((_, index) => (
{ const [currentEventsIds, setCurrentEventsIds] = useState>([]); + + const { choosenGroups } = useContext(LecturesContext); + useEffect(() => { const displayEvents = () => { currentEventsIds.map((eventId: string) => { const event = document.getElementById(eventId); - event!.style.display = "block"; + if (event) { + event.style.display = "block"; + } }); }; displayEvents(); @@ -52,7 +58,7 @@ export const Scheduler = () => { return ( <> -
+
{days.map((day, index) => (
@@ -61,15 +67,18 @@ export const Scheduler = () => { ))}
- + {terms.map((_, colIndex) => ( - + ))}
- -
); diff --git a/src/components/TopBar/Results/index.tsx b/src/components/TopBar/Results/index.tsx index 06960ed..0d2a524 100644 --- a/src/components/TopBar/Results/index.tsx +++ b/src/components/TopBar/Results/index.tsx @@ -35,7 +35,7 @@ export const Results: React.FC = () => { useEffect(() => { const fetchData = async () => { - const results = await axios.get(`http://localhost:1287/getCourses?name=`); + const results = await axios.get(`http://localhost:1285/getCourses?name=`); const lecturesData = results.data.map( (result: { id: number; name: string }) => ({ id: result.id, @@ -49,18 +49,19 @@ export const Results: React.FC = () => { }, []); useEffect(() => { + const names = lecturesContext.lectures.map((lecture) => lecture.name); const filterLectures = (value: string) => { - const filteredLectures = lecturesData.filter((lecture) => - lecture.name.toLowerCase().includes(value.toLowerCase()) + let filteredLectures = lecturesData.filter((lecture) => + lecture.name.toLowerCase().includes(value.toLowerCase()) && !names.includes(lecture.name) ); setFilteredLecturesData(filteredLectures); }; filterLectures(input); - }, [input]); + }, [input, open]); const getLecturesById = async (id: string) => { const { data } = await axios.get( - `http://localhost:1287/getClassesByCourseId?id=${id}` + `http://localhost:1285/getClassesByCourseId?id=${id}` ); return data; }; @@ -81,6 +82,7 @@ export const Results: React.FC = () => { const target = e.currentTarget as HTMLElement; const id = target.id; const result = await getLecturesById(id); + let groups: Array = []; let lecture = { groups: groups } as Lecture; lecture.id = result[0].course.id;