frontend/src/contexts/CoursesProvider.tsx

98 lines
3.1 KiB
TypeScript
Raw Normal View History

import React, { useState, createContext, useEffect, ReactNode, useContext } from 'react';
import { Course, Group, Basket, GroupType } from '../types';
2020-08-17 23:56:34 +02:00
import axios from 'axios';
import { CASContext, CASProvider } from './CASProvider';
2020-08-23 16:02:52 +02:00
2020-08-17 23:56:34 +02:00
interface CourseContext {
2020-08-12 20:52:53 +02:00
courses: Array<Course>;
2020-08-23 16:10:10 +02:00
basket: Array<Basket>;
addToBasket: (courses: Course) => void;
addGroup: (group: Group, id: number) => void;
2020-09-28 18:36:38 +02:00
deleteFromBasket: (id: number) => void;
2020-10-01 20:06:38 +02:00
saveBasket: () => void;
2020-08-12 20:52:53 +02:00
}
export const coursesContext = createContext<CourseContext | undefined>(undefined);
2020-08-12 20:52:53 +02:00
interface CoursesProviderProps {
children: ReactNode;
2020-08-12 20:52:53 +02:00
}
export const CoursesProvider = ({ children }: CoursesProviderProps) => {
2020-08-23 16:02:52 +02:00
//fetch courses with groups
2020-08-12 20:52:53 +02:00
const [courses, setCourses] = useState<Array<Course>>([]);
2020-08-23 16:10:10 +02:00
const [basket, setBasket] = useState<Array<Basket>>([]);
2020-08-12 20:52:53 +02:00
const CAS = useContext(CASContext)!;
const token = CAS?.user?.token;
const addToBasket = (course: Course) => {
const courseToBasket = {
name: course.name,
id: course.id,
classes: course.classes[0],
lecture: course.lectures !== undefined ? course.lectures[0] : undefined,
} as Basket;
setBasket([...basket, courseToBasket]);
};
const deleteFromBasket = (id: number) => setBasket(basket.filter((course) => course.id !== id));
2020-09-28 18:36:38 +02:00
const saveBasket = async () => {
try {
let data = [7, 43, 54];
let json = JSON.stringify(data);
let post_data = { json_data: json };
const ech = await axios.post<Array<number>>(
`${process.env.REACT_APP_API_URL}/api/v1/commisions/add?`,
[7, 43, 54],
{
headers: {
Authorization: `Bearer ${token}`,
},
},
);
console.log('api response;', ech);
} catch (e) {
console.log(e);
}
2020-10-01 20:06:38 +02:00
console.log('saving to basket');
};
2020-08-23 16:02:52 +02:00
const addGroup = (choosenGroup: Group, id: number) => {
const basketCourse = basket.filter((course) => course.id === id)[0];
2020-08-23 16:02:52 +02:00
const type = choosenGroup.type;
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)),
);
2020-08-23 16:02:52 +02:00
}
2020-08-12 20:52:53 +02:00
};
2020-08-17 23:56:34 +02:00
useEffect(() => {
const fetchData = async () => {
const { data } = await axios.get<Array<{ id: string; name: string; groups: Array<Group> }>>(
`${process.env.REACT_APP_API_URL}/api/v1/courses/getCoursesWithGroups`,
);
const courses = data.map(({ id, name, groups }) => ({
id: parseInt(id),
name,
lectures: groups.filter(({ type }) => type === GroupType.LECTURE),
classes: groups.filter(({ type }) => type === GroupType.CLASS),
})) as Array<Course>;
2020-08-26 18:42:29 +02:00
courses.sort((a: Course, b: Course) => (a.name > b.name ? 1 : -1));
2020-08-23 16:02:52 +02:00
setCourses(courses);
2020-08-17 23:56:34 +02:00
};
fetchData();
}, []);
2020-08-12 20:52:53 +02:00
return (
2020-10-01 20:06:38 +02:00
<coursesContext.Provider value={{ courses, basket, addToBasket, addGroup, deleteFromBasket, saveBasket }}>
{children}
</coursesContext.Provider>
2020-08-12 20:52:53 +02:00
);
};