frontend/src/components/RightBar/index.tsx

47 lines
1.5 KiB
TypeScript
Raw Normal View History

2020-06-30 22:09:13 +02:00
import React, { useState, useContext } from "react";
2020-06-07 15:57:51 +02:00
import "./index.scss";
2020-07-24 17:00:06 +02:00
import { Lecture } from "../../businesslogic/mockData/lectures";
2020-06-17 19:53:30 +02:00
import LectureCard from "./LectureCard";
2020-06-30 22:09:13 +02:00
import { LecturesContext } from "../../businesslogic/LecturesProvider";
2020-06-09 20:07:54 +02:00
2020-06-14 14:24:49 +02:00
interface RightBarProps {
2020-06-17 19:53:30 +02:00
onGroupMouseOver: (id: string, name: string) => void;
onGroupClick: (id: string, name: string) => void;
lectures: Array<Lecture>;
2020-06-14 14:24:49 +02:00
}
2020-06-07 15:57:51 +02:00
2020-06-17 19:53:30 +02:00
export default function RightBar({ lectures, onGroupMouseOver, onGroupClick }: RightBarProps) {
const [selectedCardId, setSelectedCardId] = useState<string | null>(null);
2020-06-07 15:57:51 +02:00
2020-06-30 22:09:13 +02:00
const lecturesContext = useContext(LecturesContext);
2020-06-17 19:53:30 +02:00
const onCardClick = (e: React.MouseEvent) => {
2020-06-18 17:38:36 +02:00
const target = e.currentTarget as HTMLElement;
2020-06-17 19:53:30 +02:00
selectedCardId === target.id ? setSelectedCardId(null) : setSelectedCardId(target.id);
};
return (
<div className="right-bar">
2020-07-01 00:59:19 +02:00
{/* <BusinessLogicContext.Consumer>
2020-06-29 16:56:17 +02:00
{(context) => <p>{JSON.stringify((context as BuisnessProvided).states.user?.ticket)}</p>}
2020-07-01 00:59:19 +02:00
</BusinessLogicContext.Consumer> */}
2020-06-17 19:53:30 +02:00
<div className="right-bar__text">
Hubert Wrzesiński<br></br>
Semestr zimowy 2020/2021
2020-06-17 15:19:51 +02:00
</div>
2020-06-30 22:09:13 +02:00
{lecturesContext.lectures.map((lecture, index) => (
2020-06-17 19:53:30 +02:00
<LectureCard
lecture={lecture}
key={index}
id={index.toString()}
onGroupMouseOver={onGroupMouseOver}
onGroupClick={onGroupClick}
onCardClick={onCardClick}
isSelected={selectedCardId === index.toString()}
/>
))}
</div>
);
2020-06-07 15:57:51 +02:00
}