More refactoring
This commit is contained in:
parent
74ad2e835c
commit
281a1742bc
@ -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}
|
||||||
|
@ -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>
|
||||||
))}
|
))}
|
||||||
|
@ -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
|
||||||
|
Loading…
Reference in New Issue
Block a user