Add course to basket functionality
This commit is contained in:
parent
a1953064d9
commit
9a0ee68317
@ -3,7 +3,7 @@ import axios from 'axios';
|
|||||||
import { Input } from '@material-ui/core';
|
import { Input } from '@material-ui/core';
|
||||||
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
|
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
|
||||||
import { coursesContext } from '../contexts/CoursesProvider';
|
import { coursesContext } from '../contexts/CoursesProvider';
|
||||||
import { Course } from '../types';
|
import { Course, Basket } from '../types';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import { makeStyles } from '@material-ui/core/styles';
|
import { makeStyles } from '@material-ui/core/styles';
|
||||||
|
|
||||||
@ -50,7 +50,7 @@ export const Dropdown = ({ clearInput, handleClearInput }: DropdownProps) => {
|
|||||||
//courses - choosenCourses
|
//courses - choosenCourses
|
||||||
const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]);
|
const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]);
|
||||||
|
|
||||||
const { courses, choosenCourses, addChoosenCourse } = useContext(coursesContext)!;
|
const { courses, choosenCourses, addToBasket } = useContext(coursesContext)!;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const filterCourses = (input: string) => {
|
const filterCourses = (input: string) => {
|
||||||
@ -83,13 +83,9 @@ export const Dropdown = ({ clearInput, handleClearInput }: DropdownProps) => {
|
|||||||
const name = target.textContent;
|
const name = target.textContent;
|
||||||
|
|
||||||
//porozmawiać z Filipem, żeby odrobinę przerobił endpoint
|
//porozmawiać z Filipem, żeby odrobinę przerobił endpoint
|
||||||
const choosenCourse = {
|
const course: Basket = { name: name, id: parseInt(id), lecture: null, class: null };
|
||||||
name: name,
|
|
||||||
id: parseInt(id),
|
|
||||||
groups: [],
|
|
||||||
};
|
|
||||||
|
|
||||||
addChoosenCourse(choosenCourse);
|
addToBasket(course);
|
||||||
setOpen(false);
|
setOpen(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
import React, { useState, createContext, useEffect } from 'react';
|
import React, { useState, createContext, useEffect } from 'react';
|
||||||
import { Course, Group, CourseBasket } from '../types';
|
import { Course, Group, Basket } from '../types';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
interface CourseContext {
|
interface CourseContext {
|
||||||
courses: Array<Course>;
|
courses: Array<Course>;
|
||||||
choosenCourses: Array<Course>;
|
choosenCourses: Array<Course>;
|
||||||
choosenGroups: Array<Group>;
|
choosenGroups: Array<Group>;
|
||||||
coursesBasket: Array<CourseBasket>;
|
basket: Array<Basket>;
|
||||||
addChoosenCourse: (courses: Course) => void;
|
addToBasket: (courses: Basket) => void;
|
||||||
addChoosenGroup: (group: Group, id: number) => void;
|
addChoosenGroup: (group: Group, id: number) => void;
|
||||||
}
|
}
|
||||||
export const coursesContext = createContext<CourseContext | null>(null);
|
export const coursesContext = createContext<CourseContext | null>(null);
|
||||||
@ -19,14 +19,17 @@ interface CoursesProviderProps {
|
|||||||
export const CoursesProvider = ({ children }: CoursesProviderProps) => {
|
export const CoursesProvider = ({ children }: CoursesProviderProps) => {
|
||||||
//fetch courses with groups
|
//fetch courses with groups
|
||||||
const [courses, setCourses] = useState<Array<Course>>([]);
|
const [courses, setCourses] = useState<Array<Course>>([]);
|
||||||
const [coursesBasket, setCoursesBasket] = useState<Array<CourseBasket>>([]);
|
const [basket, setBasket] = useState<Array<Basket>>([]);
|
||||||
//with groups
|
//with groups
|
||||||
const [choosenCourses, setChoosenCourses] = useState<Array<Course>>([]);
|
const [choosenCourses, setChoosenCourses] = useState<Array<Course>>([]);
|
||||||
const [choosenGroups, setChoosenGroups] = useState<Array<Group>>([]);
|
const [choosenGroups, setChoosenGroups] = useState<Array<Group>>([]);
|
||||||
|
|
||||||
const addChoosenCourse = (choosenCourse: Course) => {
|
const addToBasket = (course: Basket) => setBasket([...basket, course]);
|
||||||
setChoosenCourses([...choosenCourses, choosenCourse]);
|
|
||||||
};
|
useEffect(() => {
|
||||||
|
console.log(basket);
|
||||||
|
}, [basket]);
|
||||||
|
|
||||||
const addChoosenGroup = (choosenGroup: Group, id: number) => {
|
const addChoosenGroup = (choosenGroup: Group, id: number) => {
|
||||||
//move to utilities
|
//move to utilities
|
||||||
//change type to group type from api
|
//change type to group type from api
|
||||||
@ -76,7 +79,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
|
|||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<coursesContext.Provider value={{ courses, choosenGroups, choosenCourses, addChoosenCourse, addChoosenGroup }}>
|
<coursesContext.Provider value={{ courses, choosenGroups, choosenCourses, basket, addToBasket, addChoosenGroup }}>
|
||||||
{children}
|
{children}
|
||||||
</coursesContext.Provider>
|
</coursesContext.Provider>
|
||||||
);
|
);
|
||||||
|
@ -1,14 +1,14 @@
|
|||||||
// import { Group, Course } from '../types';
|
// import { Group, Course } from '../types';
|
||||||
|
|
||||||
export enum Types {
|
export enum Types {
|
||||||
addChoosenCourse = 'ADD_CHOOSEN_COURSE',
|
addToBasket = 'ADD_CHOOSEN_COURSE',
|
||||||
removeChoosenCourse = 'REMOVE_CHOOSEN_COURSE',
|
removeChoosenCourse = 'REMOVE_CHOOSEN_COURSE',
|
||||||
addChoosenGroup = 'ADD_CHOOSEN_GROUP',
|
addChoosenGroup = 'ADD_CHOOSEN_GROUP',
|
||||||
removeChoosenGroup = 'REMOVE_CHOOSEN_GROUP',
|
removeChoosenGroup = 'REMOVE_CHOOSEN_GROUP',
|
||||||
}
|
}
|
||||||
|
|
||||||
// type ChoosenCoursesPayload = {
|
// type ChoosenCoursesPayload = {
|
||||||
// [Types.addChoosenCourse]: {};
|
// [Types.addToBasket]: {};
|
||||||
// };
|
// };
|
||||||
|
|
||||||
// type ChoosenGroupsPayload = {
|
// type ChoosenGroupsPayload = {
|
||||||
|
@ -3,7 +3,7 @@ const CLASS = 'class';
|
|||||||
|
|
||||||
export type GroupType = typeof COURSE | typeof CLASS;
|
export type GroupType = typeof COURSE | typeof CLASS;
|
||||||
|
|
||||||
export interface CourseBasket {
|
export interface Basket {
|
||||||
id: number;
|
id: number;
|
||||||
name: string;
|
name: string;
|
||||||
lecture: Group | null;
|
lecture: Group | null;
|
||||||
|
Loading…
Reference in New Issue
Block a user