diff --git a/src/components/calendar/CalendarPage.tsx b/src/components/calendar/CalendarPage.tsx
index f3723d2..e85a627 100644
--- a/src/components/calendar/CalendarPage.tsx
+++ b/src/components/calendar/CalendarPage.tsx
@@ -2,15 +2,15 @@ import { Calendar, momentLocalizer, Views } from "react-big-calendar";
import moment from "moment";
import "react-big-calendar/lib/css/react-big-calendar.css";
-import { Divider, Toolbar } from "@mui/material";
-import { selectUserUpcomingMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
+import { Divider, FormControl, InputLabel, MenuItem, Select, SelectChangeEvent, Toolbar, Typography } from "@mui/material";
+import { selectMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
import { useAppDispatch, useAppSelector } from "../../redux/hooks";
-import { selectMe } from "../../redux/slices/usersSlice";
+import { selectMe, selectTeam, selectUser, selectUsers } from "../../redux/slices/usersSlice";
import { open } from "../../redux/slices/meetingDetailsOpenSlice";
import DetailedMeeting from "../../api-bodies/DetailedMeeting";
+import { useState } from "react";
+import UserLite from "../../api-bodies/UserLite";
-// TODO: per user calendar
-// TODO: full view (all teammates)
// TODO: match the styles and themes
// A superset of DetailedMeeting; contains fields required for the calendar to work
@@ -28,12 +28,25 @@ interface CalendarEvent {
end: Date;
}
-const CalendarPage: React.FC = () => {
+enum CalendarTaskView {
+ ViewAll = "VIEWALL"
+}
+const CalendarPage: React.FC = () => {
const dispatch = useAppDispatch();
- const currentUserUuid = useAppSelector(selectMe); // TODO: per-user
- const meetings = useAppSelector((state) =>
- selectUserUpcomingMeetings(state, currentUserUuid)
+
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ const currentUserUuid: string = useAppSelector(selectMe)!;
+ const currentUser: UserLite = useAppSelector((state) =>
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ selectUser(state, currentUserUuid)!
+ );
+ const teamUuids: string[] = useAppSelector(selectTeam);
+ const team: UserLite[] = useAppSelector((state) =>
+ selectUsers(state, teamUuids)
+ );
+ const meetings: CalendarEvent[] = useAppSelector((state) =>
+ selectMeetings(state)
).map(m =>
({
meetingId: m.meetingId,
@@ -51,6 +64,9 @@ const CalendarPage: React.FC = () => {
})
);
+ const [selectedUserUuid, setSelectedUserUuid] = useState(currentUserUuid);
+
+ // turns calendar event back into DetailedMeeting then opens meeting view
const handleSelectEvent = (event: CalendarEvent) => {
const meeting: DetailedMeeting = {
meetingId: event.meetingId,
@@ -65,12 +81,48 @@ const CalendarPage: React.FC = () => {
dispatch(open(meeting));
};
+ // dropdown selection event
+ const handleUserChange = (event: SelectChangeEvent) => {
+ setSelectedUserUuid(event.target.value);
+ };
+
+ // filter the meetings based on the uuid
+ const getUserMeetings = (uuid: string): CalendarEvent[] => {
+ if (uuid == CalendarTaskView.ViewAll) { // "View all team member meetings" option
+ return meetings;
+ } else {
+ return meetings.filter(meeting => meeting.registrantIds.includes(uuid));
+ }
+
+ };
+
return (
<>
+
+
+
+ User
+
+
+
+
+