From 0ae374a0fbbd499fad41f2cecfcc48b8f507ea20 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maciek=20G=C5=82owacki?= <glowackimaciej97@gmail.com>
Date: Fri, 18 Sep 2020 23:00:11 +0200
Subject: [PATCH] Simplified import starting with React. Added name property to
 group object passed to table. changed group interface shape. ;

;

l
;
d
---
 src/components/Dropdown.tsx        |  2 +-
 src/components/SchedulerEvents.tsx | 17 ++++++++++++-----
 src/components/SchedulerRow.tsx    | 10 +++++-----
 src/contexts/CoursesProvider.tsx   |  4 ++--
 src/types/index.ts                 |  4 ++--
 5 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx
index 4defa11..e421c36 100644
--- a/src/components/Dropdown.tsx
+++ b/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.trim(), id: parseInt(id), lecture: null, classes: null };
+      const course: Basket = { name: name.trim(), id: parseInt(id) };
 
       addToBasket(course);
       setOpen(false);
diff --git a/src/components/SchedulerEvents.tsx b/src/components/SchedulerEvents.tsx
index 3c69856..0e9e813 100644
--- a/src/components/SchedulerEvents.tsx
+++ b/src/components/SchedulerEvents.tsx
@@ -1,4 +1,4 @@
-import React, { useContext, useEffect, useState } from 'react';
+import React, { useContext, useEffect, useState, MouseEvent } from 'react';
 import { SchedulerRow } from './SchedulerRow';
 import { coursesContext } from '../contexts/CoursesProvider';
 import { Group, Basket } from '../types';
@@ -7,7 +7,7 @@ interface SchedulerEventsProps {
   cellTop: number;
   cellWidth: number;
   cellHeight: number;
-  onClick: (e: React.MouseEvent) => void
+  onClick: (e: MouseEvent) => void;
 }
 
 export const SchedulerEvents = ({ cellTop, cellWidth, cellHeight, onClick }: SchedulerEventsProps) => {
@@ -29,17 +29,24 @@ export const SchedulerEvents = ({ cellTop, cellWidth, cellHeight, onClick }: Sch
 
   useEffect(() => {
     function mapGroupTimeToEventRow(basket: Array<Basket>) {
-      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 classes = basket.map(({ classes, name }) => ({ ...classes, name })).filter((cl) => cl !== null) as Array<
+        Group & { name: string }
+      >;
+      const lectures = basket.map(({ lecture, name }) => ({ ...lecture, name })).filter((lec) => lec !== null) as Array<
+        Group & { name: string }
+      >;
       const merged = [...classes, ...lectures];
 
+      console.log('merged');
+      console.log(merged);
       if (merged.length >= 1) {
-        const groupsMapped = merged.map(({ id, day, lecturer, room, time }) => ({
+        const groupsMapped = merged.map(({ id, day, lecturer, room, time, name }) => ({
           id,
           day,
           lecturer,
           room,
           eventRow: groupTimeToEventRowMapping[time],
+          name,
         }));
         setChoosenGroupsMappedToEvents(groupsMapped);
       }
diff --git a/src/components/SchedulerRow.tsx b/src/components/SchedulerRow.tsx
index a2545e4..259ca63 100644
--- a/src/components/SchedulerRow.tsx
+++ b/src/components/SchedulerRow.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { MouseEvent } from 'react';
 import { Group } from '../types';
 import styled from 'styled-components';
 
@@ -21,17 +21,17 @@ const ClassDiv = styled.div<SchedulerEventProps>`
   height: ${({ cellHeight }) => (cellHeight * 2 * 3) / 4}px;
   z-index: 2;
   border-radius: 10px;
-  padding-left:5px;
+  padding-left: 5px;
   background-color: rgb(100, 181, 246);
 `;
 
 interface SchedulerRowProps {
-  groups: Array<Group>;
+  groups: Array<Group & { name: string }>;
   indexRow: number;
   cellTop: number;
   cellWidth: number;
   cellHeight: number;
-  onClick: (e: React.MouseEvent) => void;
+  onClick: (e: MouseEvent) => void;
 }
 
 export const SchedulerRow = ({ groups, indexRow, cellTop, cellWidth, cellHeight, onClick }: SchedulerRowProps) => {
@@ -58,7 +58,7 @@ export const SchedulerRow = ({ groups, indexRow, cellTop, cellWidth, cellHeight,
                   id={`eventRow${indexRow}eventCol${eventIndex}`}
                   key={index}
                 >
-                  {groups[index]?.lecturer}
+                  {groups[index].name}
                 </ClassDiv>
               ),
           )}
diff --git a/src/contexts/CoursesProvider.tsx b/src/contexts/CoursesProvider.tsx
index 722b80b..0c64967 100644
--- a/src/contexts/CoursesProvider.tsx
+++ b/src/contexts/CoursesProvider.tsx
@@ -1,4 +1,4 @@
-import React, { useState, createContext, useEffect } from 'react';
+import React, { useState, createContext, useEffect, ReactNode } from 'react';
 import { Course, Group, Basket, GroupType } from '../types';
 import axios from 'axios';
 
@@ -11,7 +11,7 @@ interface CourseContext {
 export const coursesContext = createContext<CourseContext | null>(null);
 
 interface CoursesProviderProps {
-  children: React.ReactNode;
+  children: ReactNode;
 }
 
 export const CoursesProvider = ({ children }: CoursesProviderProps) => {
diff --git a/src/types/index.ts b/src/types/index.ts
index cdec17f..09c6f40 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -6,8 +6,8 @@ export enum GroupType {
 export interface Basket {
   id: number;
   name: string;
-  lecture: Group | null;
-  classes: Group | null;
+  lecture?: Group;
+  classes?: Group;
 }
 
 export interface Group {