Classes display correctly, still need to work on lectures:

src/contexts/CoursesProvider.tsx

@@ -1,14 +1,12 @@
 import React, { useState, createContext, useEffect } from 'react';
-import { Course, Group, Basket } from '../types';
+import { Course, Group, Basket, GroupType } from '../types';
 import axios from 'axios';
 
 interface CourseContext {
   courses: Array<Course>;
-  choosenCourses: Array<Course>;
-  choosenGroups: Array<Group>;
   basket: Array<Basket>;
   addToBasket: (courses: Basket) => void;
-  addChoosenGroup: (group: Group, id: number) => void;
+  addGroup: (group: Group, id: number) => void;
 }
 export const coursesContext = createContext<CourseContext | null>(null);
 
@@ -20,47 +18,28 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   //fetch courses with groups
   const [courses, setCourses] = useState<Array<Course>>([]);
   const [basket, setBasket] = useState<Array<Basket>>([]);
-  //with groups
-  const [choosenCourses, setChoosenCourses] = useState<Array<Course>>([]);
-  const [choosenGroups, setChoosenGroups] = useState<Array<Group>>([]);
 
   const addToBasket = (course: Basket) => setBasket([...basket, course]);
 
   useEffect(() => {
+    console.log('BASKET');
     console.log(basket);
   }, [basket]);
 
-  const addChoosenGroup = (choosenGroup: Group, id: number) => {
-    //move to utilities
-    //change type to group type from api
-    function hasChoosenGroupType(type: string) {
-      const res = choosenCourse.groups!.find((group) => group.type === type);
-      console.log(`res is: ${JSON.stringify(res)}`);
-      return !!res;
-    }
-
-    const choosenCourse = choosenCourses.find((cc) => cc.id === id)!;
+  //immutability
 
+  const addGroup = (choosenGroup: Group, id: number) => {
+    const basketCourse = basket.filter((course) => course.id === id)[0];
     const type = choosenGroup.type;
-    console.log(`group type is: ${type}`);
-    if (hasChoosenGroupType(type)) {
-      const group = choosenCourse.groups!.find((group) => group.type === type);
-      console.log(`group is: ${JSON.stringify(group)}`);
-      console.log(choosenCourse.groups);
-      if (group) {
-        group.type = type;
-      }
-      setChoosenGroups([...choosenGroups, choosenGroup]);
-    } else {
-      console.log('pierwsza grupa/wykłąd');
-      //może być złe
-      choosenCourse.groups!.push(choosenGroup);
-      // setChoosenCourses(course => course.id === choosenCourse.id)
-      setChoosenGroups([...choosenGroups, choosenGroup]);
+    if (type === GroupType.CLASS) {
+      setBasket(
+        basket.map((basket) => (basket.id === basketCourse.id ? { ...basket, classes: choosenGroup } : basket)),
+      );
+    } else if (type === GroupType.LECTURE) {
+      setBasket(
+        basket.map((basket) => (basket.id === basketCourse.id ? { ...basket, lecture: choosenGroup } : basket)),
+      );
     }
-    console.log(`choosen courses after changing group: ${JSON.stringify(choosenCourses)}`);
-
-    console.log(choosenCourse);
   };
 
   useEffect(() => {
@@ -79,8 +58,6 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   }, []);
 
   return (
-    <coursesContext.Provider value={{ courses, choosenGroups, choosenCourses, basket, addToBasket, addChoosenGroup }}>
-      {children}
-    </coursesContext.Provider>
+    <coursesContext.Provider value={{ courses, basket, addToBasket, addGroup }}>{children}</coursesContext.Provider>
   );
 };

src/contexts/reducers.ts

@@ -3,7 +3,7 @@
 export enum Types {
   addToBasket = 'ADD_CHOOSEN_COURSE',
   removeChoosenCourse = 'REMOVE_CHOOSEN_COURSE',
-  addChoosenGroup = 'ADD_CHOOSEN_GROUP',
+  addGroup = 'ADD_CHOOSEN_GROUP',
   removeChoosenGroup = 'REMOVE_CHOOSEN_GROUP',
 }
 
@@ -21,7 +21,7 @@ export enum Types {
 
 // export const choosenGroupsReducer = (state, action) => {
 //   switch (action.type) {
-//     case Types.addChoosenGroup:
+//     case Types.addGroup:
 //       return add;
 //   }
 // };