Add course to basket functionality

src/components/Dropdown.tsx

@@ -3,7 +3,7 @@ import axios from 'axios';
 import { Input } from '@material-ui/core';
 import ClickAwayListener from '@material-ui/core/ClickAwayListener';
 import { coursesContext } from '../contexts/CoursesProvider';
-import { Course } from '../types';
+import { Course, Basket } from '../types';
 import styled from 'styled-components';
 import { makeStyles } from '@material-ui/core/styles';
 
@@ -50,7 +50,7 @@ export const Dropdown = ({ clearInput, handleClearInput }: DropdownProps) => {
   //courses - choosenCourses
   const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]);
 
-  const { courses, choosenCourses, addChoosenCourse } = useContext(coursesContext)!;
+  const { courses, choosenCourses, addToBasket } = useContext(coursesContext)!;
 
   useEffect(() => {
     const filterCourses = (input: string) => {
@@ -83,13 +83,9 @@ export const Dropdown = ({ clearInput, handleClearInput }: DropdownProps) => {
       const name = target.textContent;
 
       //porozmawiać z Filipem, żeby odrobinę przerobił endpoint
-      const choosenCourse = {
-        name: name,
-        id: parseInt(id),
-        groups: [],
-      };
+      const course: Basket = { name: name, id: parseInt(id), lecture: null, class: null };
 
-      addChoosenCourse(choosenCourse);
+      addToBasket(course);
       setOpen(false);
     }
   };

src/contexts/CoursesProvider.tsx

@@ -1,13 +1,13 @@
 import React, { useState, createContext, useEffect } from 'react';
-import { Course, Group, CourseBasket } from '../types';
+import { Course, Group, Basket } from '../types';
 import axios from 'axios';
 
 interface CourseContext {
   courses: Array<Course>;
   choosenCourses: Array<Course>;
   choosenGroups: Array<Group>;
-  coursesBasket: Array<CourseBasket>;
-  addChoosenCourse: (courses: Course) => void;
+  basket: Array<Basket>;
+  addToBasket: (courses: Basket) => void;
   addChoosenGroup: (group: Group, id: number) => void;
 }
 export const coursesContext = createContext<CourseContext | null>(null);
@@ -19,14 +19,17 @@ interface CoursesProviderProps {
 export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   //fetch courses with groups
   const [courses, setCourses] = useState<Array<Course>>([]);
-  const [coursesBasket, setCoursesBasket] = useState<Array<CourseBasket>>([]);
+  const [basket, setBasket] = useState<Array<Basket>>([]);
   //with groups
   const [choosenCourses, setChoosenCourses] = useState<Array<Course>>([]);
   const [choosenGroups, setChoosenGroups] = useState<Array<Group>>([]);
 
-  const addChoosenCourse = (choosenCourse: Course) => {
-    setChoosenCourses([...choosenCourses, choosenCourse]);
-  };
+  const addToBasket = (course: Basket) => setBasket([...basket, course]);
+
+  useEffect(() => {
+    console.log(basket);
+  }, [basket]);
+
   const addChoosenGroup = (choosenGroup: Group, id: number) => {
     //move to utilities
     //change type to group type from api
@@ -76,7 +79,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   }, []);
 
   return (
-    <coursesContext.Provider value={{ courses, choosenGroups, choosenCourses, addChoosenCourse, addChoosenGroup }}>
+    <coursesContext.Provider value={{ courses, choosenGroups, choosenCourses, basket, addToBasket, addChoosenGroup }}>
       {children}
     </coursesContext.Provider>
   );

src/contexts/reducers.ts

@@ -1,14 +1,14 @@
 // import { Group, Course } from '../types';
 
 export enum Types {
-  addChoosenCourse = 'ADD_CHOOSEN_COURSE',
+  addToBasket = 'ADD_CHOOSEN_COURSE',
   removeChoosenCourse = 'REMOVE_CHOOSEN_COURSE',
   addChoosenGroup = 'ADD_CHOOSEN_GROUP',
   removeChoosenGroup = 'REMOVE_CHOOSEN_GROUP',
 }
 
 // type ChoosenCoursesPayload = {
-//   [Types.addChoosenCourse]: {};
+//   [Types.addToBasket]: {};
 // };
 
 // type ChoosenGroupsPayload = {

src/types/index.ts

@@ -3,7 +3,7 @@ const CLASS = 'class';
 
 export type GroupType = typeof COURSE | typeof CLASS;
 
-export interface CourseBasket {
+export interface Basket {
   id: number;
   name: string;
   lecture: Group | null;