click na grupe niezwija karty przedmiotu

This commit is contained in:
wrzesinski-hubert 2020-08-31 18:10:36 +02:00
parent 1e9e336ee9
commit d75530887e
2 changed files with 7 additions and 19 deletions

View File

@ -1,4 +1,4 @@
import React, { useContext, MouseEvent } from 'react';
import React, { useState, useContext, MouseEvent } from 'react';
import Collapse from '@material-ui/core/Collapse';
import ExpandIcon from '../assets/expand.png';
import { Course, Group } from '../types/index';
@ -68,13 +68,12 @@ const useStyles = makeStyles({
});
interface CourseCardProps {
onCardClick: (event: MouseEvent) => void;
course: Course;
id: string;
isSelected: boolean;
}
export const CourseCard = ({ onCardClick, course, id, isSelected }: CourseCardProps) => {
export const CourseCard = ({course }: CourseCardProps) => {
const [isSelected, setSelected] = useState(false);
const classes = useStyles();
const { addGroup } = useContext(coursesContext)!;
@ -82,8 +81,8 @@ export const CourseCard = ({ onCardClick, course, id, isSelected }: CourseCardPr
const onGroupClick = (group: Group, id: number) => addGroup(group, id);
return (
<CourseStyled onClick={onCardClick} id={id}>
<CourseNameStyled>{course.name}</CourseNameStyled>
<CourseStyled>
<CourseNameStyled onClick={() => setSelected(!isSelected)}>{course.name}</CourseNameStyled>
<Collapse className={classes.expanded} in={isSelected} timeout="auto" unmountOnExit>
{course.groups.map((group, index) => (
<ClassGroupStyled key={index} onClick={() => onGroupClick(group, course.id)}>
@ -93,7 +92,7 @@ export const CourseCard = ({ onCardClick, course, id, isSelected }: CourseCardPr
</ClassGroupStyled>
))}
</Collapse>
<div onClick={onCardClick} id={id}>
<div onClick={() => setSelected(!isSelected)}>
<ClassExandIconStyled isSelected={isSelected} alt="expand" src={ExpandIcon} />
</div>
</CourseStyled>

View File

@ -31,8 +31,6 @@ const RightbarTextStyled = styled.div`
`;
export const Rightbar = () => {
const [selectedCardId, setSelectedCardId] = useState<string | null>(null);
const { courses, basket } = useContext(coursesContext)!;
const getBasketGroups = () => {
@ -42,12 +40,6 @@ export const Rightbar = () => {
const filteredCourses = getBasketGroups();
//działa clunky
const onCardClick = (event: MouseEvent) => {
const target = event.currentTarget;
selectedCardId === target.id ? setSelectedCardId(null) : setSelectedCardId(target.id);
};
//need to insert student name from db and course maybe based on current time or from db too
return (
<RightbarStyled>
@ -59,9 +51,6 @@ export const Rightbar = () => {
<CourseCard
course={course}
key={index}
id={index.toString()}
onCardClick={onCardClick}
isSelected={selectedCardId === index.toString()}
/>
))}
</RightbarStyled>