currentUser now cannot be null
This commit is contained in:
parent
c654985e45
commit
364c920f77
@ -2,10 +2,24 @@ import { Calendar, momentLocalizer, Views } from "react-big-calendar";
|
|||||||
import moment from "moment";
|
import moment from "moment";
|
||||||
|
|
||||||
import "react-big-calendar/lib/css/react-big-calendar.css";
|
import "react-big-calendar/lib/css/react-big-calendar.css";
|
||||||
import { Divider, FormControl, InputLabel, MenuItem, Select, SelectChangeEvent, Toolbar, Typography } from "@mui/material";
|
import {
|
||||||
|
Divider,
|
||||||
|
FormControl,
|
||||||
|
InputLabel,
|
||||||
|
MenuItem,
|
||||||
|
Select,
|
||||||
|
SelectChangeEvent,
|
||||||
|
Toolbar,
|
||||||
|
Typography,
|
||||||
|
} from "@mui/material";
|
||||||
import { selectMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
|
import { selectMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
|
||||||
import { useAppDispatch, useAppSelector } from "../../redux/hooks";
|
import { useAppDispatch, useAppSelector } from "../../redux/hooks";
|
||||||
import { selectMe, selectTeam, selectUser, selectUsers } from "../../redux/slices/usersSlice";
|
import {
|
||||||
|
selectMe,
|
||||||
|
selectTeam,
|
||||||
|
selectUser,
|
||||||
|
selectUsers,
|
||||||
|
} from "../../redux/slices/usersSlice";
|
||||||
import { open } from "../../redux/slices/meetingDetailsOpenSlice";
|
import { open } from "../../redux/slices/meetingDetailsOpenSlice";
|
||||||
import DetailedMeeting from "../../api-bodies/DetailedMeeting";
|
import DetailedMeeting from "../../api-bodies/DetailedMeeting";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
@ -29,17 +43,15 @@ interface CalendarEvent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
enum CalendarTaskView {
|
enum CalendarTaskView {
|
||||||
ViewAll = "VIEWALL"
|
ViewAll = "VIEWALL",
|
||||||
}
|
}
|
||||||
|
|
||||||
const CalendarPage: React.FC = () => {
|
const CalendarPage: React.FC = () => {
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
const currentUserUuid: string = useAppSelector(selectMe);
|
||||||
const currentUserUuid: string = useAppSelector(selectMe)!;
|
const currentUser: UserLite | undefined = useAppSelector((state) =>
|
||||||
const currentUser: UserLite = useAppSelector((state) =>
|
selectUser(state, currentUserUuid)
|
||||||
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
||||||
selectUser(state, currentUserUuid)!
|
|
||||||
);
|
);
|
||||||
const teamUuids: string[] = useAppSelector(selectTeam);
|
const teamUuids: string[] = useAppSelector(selectTeam);
|
||||||
const team: UserLite[] = useAppSelector((state) =>
|
const team: UserLite[] = useAppSelector((state) =>
|
||||||
@ -47,8 +59,7 @@ const CalendarPage: React.FC = () => {
|
|||||||
);
|
);
|
||||||
const meetings: CalendarEvent[] = useAppSelector((state) =>
|
const meetings: CalendarEvent[] = useAppSelector((state) =>
|
||||||
selectMeetings(state)
|
selectMeetings(state)
|
||||||
).map(m =>
|
).map((m) => ({
|
||||||
({
|
|
||||||
meetingId: m.meetingId,
|
meetingId: m.meetingId,
|
||||||
liveParticipantIds: m.liveParticipantIds,
|
liveParticipantIds: m.liveParticipantIds,
|
||||||
registrantIds: m.registrantIds,
|
registrantIds: m.registrantIds,
|
||||||
@ -60,9 +71,8 @@ const CalendarPage: React.FC = () => {
|
|||||||
// fields needed by calendar
|
// fields needed by calendar
|
||||||
title: m.topic,
|
title: m.topic,
|
||||||
start: new Date(Date.parse(m.start)), // Turns the ISO String into a date object
|
start: new Date(Date.parse(m.start)), // Turns the ISO String into a date object
|
||||||
end: new Date(Date.parse(m.start) + m.duration*60000) // result of Date.parse() is milliseconds, and m.duration is given in minutes
|
end: new Date(Date.parse(m.start) + m.duration * 60000), // result of Date.parse() is milliseconds, and m.duration is given in minutes
|
||||||
})
|
}));
|
||||||
);
|
|
||||||
|
|
||||||
const [selectedUserUuid, setSelectedUserUuid] = useState(currentUserUuid);
|
const [selectedUserUuid, setSelectedUserUuid] = useState(currentUserUuid);
|
||||||
|
|
||||||
@ -88,12 +98,12 @@ const CalendarPage: React.FC = () => {
|
|||||||
|
|
||||||
// filter the meetings based on the uuid
|
// filter the meetings based on the uuid
|
||||||
const getUserMeetings = (uuid: string): CalendarEvent[] => {
|
const getUserMeetings = (uuid: string): CalendarEvent[] => {
|
||||||
if (uuid == CalendarTaskView.ViewAll) { // "View all team member meetings" option
|
if (uuid == CalendarTaskView.ViewAll) {
|
||||||
|
// "View all team member meetings" option
|
||||||
return meetings;
|
return meetings;
|
||||||
} else {
|
} else {
|
||||||
return meetings.filter(meeting => meeting.registrantIds.includes(uuid));
|
return meetings.filter((meeting) => meeting.registrantIds.includes(uuid));
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -111,10 +121,18 @@ const CalendarPage: React.FC = () => {
|
|||||||
label="User"
|
label="User"
|
||||||
onChange={handleUserChange}
|
onChange={handleUserChange}
|
||||||
>
|
>
|
||||||
<MenuItem value={CalendarTaskView.ViewAll}>View all team member meetings</MenuItem>
|
<MenuItem value={CalendarTaskView.ViewAll}>
|
||||||
<MenuItem value={currentUserUuid}>{currentUser.name + " (Me)"}</MenuItem>
|
View all team member meetings
|
||||||
{team.map(user => (
|
</MenuItem>
|
||||||
<MenuItem key={user.uuid} value={user.uuid}>{user.name}</MenuItem>
|
{currentUser ? (
|
||||||
|
<MenuItem value={currentUserUuid}>
|
||||||
|
{currentUser.name + " (Me)"}
|
||||||
|
</MenuItem>
|
||||||
|
) : null}
|
||||||
|
{team.map((user) => (
|
||||||
|
<MenuItem key={user.uuid} value={user.uuid}>
|
||||||
|
{user.name}
|
||||||
|
</MenuItem>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
@ -132,7 +150,6 @@ const CalendarPage: React.FC = () => {
|
|||||||
style={{ height: "83%" }}
|
style={{ height: "83%" }}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -4,8 +4,8 @@ import { userLites, team } from "../../api-bodies/MockData";
|
|||||||
import UserLite from "../../api-bodies/UserLite";
|
import UserLite from "../../api-bodies/UserLite";
|
||||||
|
|
||||||
interface TeamState {
|
interface TeamState {
|
||||||
user: string | null;
|
user: string;
|
||||||
manager: string | null;
|
manager: string;
|
||||||
sameManager: string[];
|
sameManager: string[];
|
||||||
directReports: string[];
|
directReports: string[];
|
||||||
}
|
}
|
||||||
@ -17,7 +17,7 @@ interface UsersState {
|
|||||||
|
|
||||||
const initialState: UsersState = {
|
const initialState: UsersState = {
|
||||||
users: {},
|
users: {},
|
||||||
team: { user: null, manager: null, sameManager: [], directReports: [] },
|
team: { user: "", manager: "", sameManager: [], directReports: [] },
|
||||||
};
|
};
|
||||||
|
|
||||||
export const usersSlice = createSlice({
|
export const usersSlice = createSlice({
|
||||||
@ -61,7 +61,7 @@ export const selectUsers = (state: RootState, uuids: string[]): UserLite[] => {
|
|||||||
};
|
};
|
||||||
export const selectTeam = (state: RootState) => {
|
export const selectTeam = (state: RootState) => {
|
||||||
const team: string[] = [];
|
const team: string[] = [];
|
||||||
if (state.users.team.manager !== null) team.push(state.users.team.manager);
|
if (state.users.team.manager) team.push(state.users.team.manager);
|
||||||
state.users.team.sameManager.forEach((u) => team.push(u));
|
state.users.team.sameManager.forEach((u) => team.push(u));
|
||||||
state.users.team.directReports.forEach((u) => team.push(u));
|
state.users.team.directReports.forEach((u) => team.push(u));
|
||||||
return team;
|
return team;
|
||||||
|
|||||||
@ -17,7 +17,8 @@ const getStatusColor = (ms: MeetingStatus): string => {
|
|||||||
const formatTimeFromDate = (date: Date): string => {
|
const formatTimeFromDate = (date: Date): string => {
|
||||||
let hour = date.getHours();
|
let hour = date.getHours();
|
||||||
let ampm = "";
|
let ampm = "";
|
||||||
let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : "" + date.getMinutes();
|
const minutes =
|
||||||
|
date.getMinutes() < 10 ? "0" + date.getMinutes() : "" + date.getMinutes();
|
||||||
if (hour < 12) {
|
if (hour < 12) {
|
||||||
ampm = "am";
|
ampm = "am";
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
Reference in New Issue
Block a user