you can add lectures now:

:

src/components/CourseCard.tsx

@@ -79,8 +79,6 @@ export const CourseCard = ({ onCardClick, course, id, isSelected }: CourseCardPr
 
   const { addGroup } = useContext(coursesContext)!;
 
-  console.log(`course`);
-  console.log(course);
   const onGroupClick = (group: Group, id: number) => addGroup(group, id);
 
   return (

src/components/Dropdown.tsx

@@ -83,7 +83,7 @@ export const Dropdown = ({ clearInput, handleClearInput }: DropdownProps) => {
       const name = target.textContent;
 
       //porozmawiać z Filipem, żeby odrobinę przerobił endpoint
-      const course: Basket = { name: name, id: parseInt(id), lecture: null, classes: null };
+      const course: Basket = { name: name.trim(), id: parseInt(id), lecture: null, classes: null };
 
       addToBasket(course);
       setOpen(false);

src/components/Rightbar.tsx

@@ -36,8 +36,8 @@ export const Rightbar = () => {
   const { courses, basket } = useContext(coursesContext)!;
 
   const getBasketGroups = () => {
-    const ids = basket.map(({ id }) => id);
-    return courses.filter(({ id }) => ids.includes(id));
+    const names = basket.map(({ name }) => name);
+    return courses.filter(({ name }) => names.includes(name));
   };
 
   const filteredCourses = getBasketGroups();

src/components/SchedulerEvents.tsx

@@ -2,6 +2,7 @@ import React, { useContext, useEffect, useState } from 'react';
 import { SchedulerRow } from './SchedulerRow';
 import { coursesContext } from '../contexts/CoursesProvider';
 import { Group, Basket } from '../types';
+import classes from '*.module.css';
 
 interface SchedulerEventsProps {
   cellTop: number;
@@ -27,23 +28,20 @@ export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) =>
 
   useEffect(() => {
     function mapGroupTimeToEventRow(basket: Array<Basket>) {
-      const basketGroups = basket.map(({ classes, lecture }) => ({
-        ...classes,
-        ...lecture,
-      })) as Array<Group>;
+      const classes = basket.map(({ classes }) => classes).filter((cl) => cl !== null) as Array<Group>;
+      const lectures = basket.map(({ lecture }) => lecture).filter((lec) => lec !== null) as Array<Group>;
+      const merged = [...classes, ...lectures];
 
-      console.log('passed basket');
-      console.log(basket);
-      console.log(`basketgroups`);
-      console.log(basketGroups);
-      const groupsMapped = basketGroups.map(({ id, day, lecturer, room, time }) => ({
-        id,
-        day,
-        lecturer,
-        room,
-        eventRow: groupTimeToEventRowMapping[time],
-      }));
-      setChoosenGroupsMappedToEvents(groupsMapped);
+      if (merged.length >= 1) {
+        const groupsMapped = merged.map(({ id, day, lecturer, room, time }) => ({
+          id,
+          day,
+          lecturer,
+          room,
+          eventRow: groupTimeToEventRowMapping[time],
+        }));
+        setChoosenGroupsMappedToEvents(groupsMapped);
+      }
     }
     mapGroupTimeToEventRow(basket);
   }, [basket]);

src/contexts/CoursesProvider.tsx

@@ -44,14 +44,8 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
 
   useEffect(() => {
     const fetchData = async () => {
-      const { data: courses } = await axios.get(`${process.env.REACT_APP_API_URL}/getCourses`);
-
-      for (const course of courses) {
-        const { data: groups } = await axios.get(`${process.env.REACT_APP_API_URL}/getCourseGroups?id=${course.id}`);
-        //porozmawiać z Filipem, żeby odrobinę przerobił endpoint
-        course.groups = groups;
-      }
-
+      const { data: courses } = await axios.get(`${process.env.REACT_APP_API_URL}/getCoursesWithGroups`);
+      courses.sort((a: Course, b: Course) => (a.name > b.name ? 1 : -1));
       setCourses(courses);
     };
     fetchData();