More refactoring

This commit is contained in:
Maciek Głowacki 2020-08-18 00:21:21 +02:00
parent 74ad2e835c
commit 281a1742bc
3 changed files with 36 additions and 29 deletions

View File

@ -11,7 +11,7 @@ interface SchedulerEventsProps {
export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) => { export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) => {
const { choosenGroups } = useContext(coursesContext)!; const { choosenGroups } = useContext(coursesContext)!;
const [groupsMappedToEvents, setGroupsMappedToEvents] = useState<any>([]); const [choosenGroupsMappedToEvents, setChoosenGroupsMappedToEvents] = useState<any>([]);
interface GroupTimeToEventRowMapping { interface GroupTimeToEventRowMapping {
[time: string]: number; [time: string]: number;
@ -29,22 +29,7 @@ export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) =>
}; };
useEffect(() => { useEffect(() => {
function mapGroupTimeToEventRow(groups: Array<Group>) { function mapGroupTimeToEventRow(choosenGroups: Array<Group>) {
const groupsMappedToEventsTemp = [];
for (const group of groups) {
const groupTime = group.time;
const eventRow: number = groupTimeToEventRowMapping[groupTime];
const groupMappedToEvent: any = {
id: group.id,
day: group.day,
eventRow: eventRow,
lecturer: group.lecturer,
room: group.room,
};
setGroupsMappedToEvents((groupsMappedToEvents: any) => [...groupsMappedToEvents, groupMappedToEvent]);
}
}
function alternative(choosenGroups: Array<Group>) {
const groupsMapped = choosenGroups.map(({ id, day, lecturer, room, time }) => ({ const groupsMapped = choosenGroups.map(({ id, day, lecturer, room, time }) => ({
id, id,
day, day,
@ -52,9 +37,9 @@ export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) =>
room, room,
eventRow: groupTimeToEventRowMapping[time], eventRow: groupTimeToEventRowMapping[time],
})); }));
setGroupsMappedToEvents(groupsMapped); setChoosenGroupsMappedToEvents(groupsMapped);
} }
alternative(choosenGroups); mapGroupTimeToEventRow(choosenGroups);
}, [choosenGroups]); }, [choosenGroups]);
return ( return (
@ -62,7 +47,7 @@ export const SchedulerEvents = ({ cellTop, cellWidth }: SchedulerEventsProps) =>
{[...Array(6)].map((_, index) => ( {[...Array(6)].map((_, index) => (
<SchedulerRow <SchedulerRow
key={index} key={index}
groups={groupsMappedToEvents.filter((group: any) => { groups={choosenGroupsMappedToEvents.filter((group: any) => {
return group.eventRow === index; return group.eventRow === index;
})} })}
indexRow={index} indexRow={index}

View File

@ -26,21 +26,20 @@ interface SchedulerRowProps {
} }
export const SchedulerRow = ({ groups, indexRow, cellTop, cellWidth }: SchedulerRowProps) => { export const SchedulerRow = ({ groups, indexRow, cellTop, cellWidth }: SchedulerRowProps) => {
// console.log(`You passed me these of a groupzzz`);
// console.log(groups)
return ( return (
<> <>
{[...Array(5)].map((value, eventIndex) => ( {[...Array(5)].map((_, eventIndex) => (
<SchedulerEvent <SchedulerEvent
eventIndex={eventIndex} eventIndex={eventIndex}
cellTop={cellTop} cellTop={cellTop}
cellWidth={cellWidth} cellWidth={cellWidth}
key={`eventRow${indexRow}eventCol${eventIndex}`} key={eventIndex}
id={`eventRow${indexRow}eventCol${eventIndex}`} id={`eventRow${indexRow}eventCol${eventIndex}`}
> >
{groups.map((group, index) => {groups.map((group, index) =>
group.day === eventIndex ? <div key={index}>{groups[index]?.lecturer}</div> : null, group.day === eventIndex && <div key={index}>{groups[index]?.lecturer}</div>,
)} )}
</SchedulerEvent> </SchedulerEvent>
))} ))}

View File

@ -1,6 +1,29 @@
// import { Group, Course } from '../types';
export enum Types { export enum Types {
addChoosenCourse = 'ADD_COURSE', addChoosenCourse = 'ADD_CHOOSEN_COURSE',
removecourse = 'REMOVE_COURSE', removeChoosenCourse = 'REMOVE_CHOOSEN_COURSE',
addChoosenGroup = 'ADD_GROUP', addChoosenGroup = 'ADD_CHOOSEN_GROUP',
removeGroup = 'REMOVE_GROUP', removeChoosenGroup = 'REMOVE_CHOOSEN_GROUP',
} }
// type ChoosenCoursesPayload = {
// [Types.addChoosenCourse]: {};
// };
// type ChoosenGroupsPayload = {
// [Types.Create]: {
// id: number;
// name: string;
// price: number;
// };
// };
// export const choosenGroupsReducer = (state, action) => {
// switch (action.type) {
// case Types.addChoosenGroup:
// return add;
// }
// };
//https://dev.to/elisealcala/react-context-with-usereducer-and-typescript-4obm