final fixes before demo
This commit is contained in:
parent
9683a55cd5
commit
45c5bebe8f
@ -17,7 +17,7 @@ import { selectMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
|
|||||||
import { useAppDispatch, useAppSelector } from "../../redux/hooks";
|
import { useAppDispatch, useAppSelector } from "../../redux/hooks";
|
||||||
import {
|
import {
|
||||||
selectMe,
|
selectMe,
|
||||||
selectTeam,
|
selectTeamWithoutManager,
|
||||||
selectUser,
|
selectUser,
|
||||||
selectUsers,
|
selectUsers,
|
||||||
} from "../../redux/slices/usersSlice";
|
} from "../../redux/slices/usersSlice";
|
||||||
@ -54,7 +54,7 @@ const CalendarPage: React.FC = () => {
|
|||||||
const currentUser: UserLite | undefined = useAppSelector((state) =>
|
const currentUser: UserLite | undefined = useAppSelector((state) =>
|
||||||
selectUser(state, currentUserUuid)
|
selectUser(state, currentUserUuid)
|
||||||
);
|
);
|
||||||
const teamUuids: string[] = useAppSelector(selectTeam);
|
const teamUuids: string[] = useAppSelector(selectTeamWithoutManager);
|
||||||
const team: UserLite[] = useAppSelector((state) =>
|
const team: UserLite[] = useAppSelector((state) =>
|
||||||
selectUsers(state, teamUuids)
|
selectUsers(state, teamUuids)
|
||||||
);
|
);
|
||||||
|
|||||||
@ -5,6 +5,7 @@ import { useAppSelector, useAppDispatch } from "../../../../redux/hooks";
|
|||||||
import { open } from "../../../../redux/slices/meetingDetailsOpenSlice";
|
import { open } from "../../../../redux/slices/meetingDetailsOpenSlice";
|
||||||
import { selectUserUpcomingMeetings } from "../../../../redux/slices/meetingsAndUserStatusSlice";
|
import { selectUserUpcomingMeetings } from "../../../../redux/slices/meetingsAndUserStatusSlice";
|
||||||
import { getUpcomingMeetingTime } from "../../Utils";
|
import { getUpcomingMeetingTime } from "../../Utils";
|
||||||
|
import { selectManager } from "../../../../redux/slices/usersSlice";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
contactInfo: UserLite;
|
contactInfo: UserLite;
|
||||||
@ -12,6 +13,7 @@ interface Props {
|
|||||||
|
|
||||||
const LowerBody: React.FC<Props> = (props) => {
|
const LowerBody: React.FC<Props> = (props) => {
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
|
const manager = useAppSelector(selectManager);
|
||||||
|
|
||||||
const meetings = useAppSelector((state) =>
|
const meetings = useAppSelector((state) =>
|
||||||
selectUserUpcomingMeetings(state, props.contactInfo.uuid)
|
selectUserUpcomingMeetings(state, props.contactInfo.uuid)
|
||||||
@ -31,19 +33,25 @@ const LowerBody: React.FC<Props> = (props) => {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Typography
|
<Typography
|
||||||
sx={{ color: "black", mt: 1, borderBottom: 1, borderColor: "#ac000d", pb: 1 }}
|
sx={{
|
||||||
|
color: "black",
|
||||||
|
mt: 1,
|
||||||
|
borderBottom: 1,
|
||||||
|
borderColor: "#ac000d",
|
||||||
|
pb: 1,
|
||||||
|
}}
|
||||||
variant="h4"
|
variant="h4"
|
||||||
textAlign="center"
|
textAlign="center"
|
||||||
>
|
>
|
||||||
Upcoming meetings
|
Meetings today
|
||||||
</Typography>
|
</Typography>
|
||||||
{meetings.length === 0 ? (
|
{meetings.length === 0 || manager === props.contactInfo.uuid ? (
|
||||||
<Typography
|
<Typography
|
||||||
variant="h5"
|
variant="h5"
|
||||||
textAlign="center"
|
textAlign="center"
|
||||||
sx={{ position: "relative", top: "30%" }}
|
sx={{ position: "relative", top: "30%" }}
|
||||||
>
|
>
|
||||||
No upcoming meetings today
|
No meetings today
|
||||||
</Typography>
|
</Typography>
|
||||||
) : (
|
) : (
|
||||||
<List sx={{ maxHeight: "100%", overflow: "auto" }}>
|
<List sx={{ maxHeight: "100%", overflow: "auto" }}>
|
||||||
@ -57,7 +65,7 @@ const LowerBody: React.FC<Props> = (props) => {
|
|||||||
borderTop: 1,
|
borderTop: 1,
|
||||||
borderBottom: i === meetings.length - 1 ? 1 : 0,
|
borderBottom: i === meetings.length - 1 ? 1 : 0,
|
||||||
borderColor: "#af000d",
|
borderColor: "#af000d",
|
||||||
backgroundColor: "#fff5f5"
|
backgroundColor: "#fff5f5",
|
||||||
}}
|
}}
|
||||||
key={i}
|
key={i}
|
||||||
>
|
>
|
||||||
|
|||||||
@ -12,7 +12,7 @@ import {
|
|||||||
import { open as openMeetingDetails } from "../../redux/slices/meetingDetailsOpenSlice";
|
import { open as openMeetingDetails } from "../../redux/slices/meetingDetailsOpenSlice";
|
||||||
import { selectMeeting } from "../../redux/slices/meetingsAndUserStatusSlice";
|
import { selectMeeting } from "../../redux/slices/meetingsAndUserStatusSlice";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { selectMe } from "../../redux/slices/usersSlice";
|
import { selectManager, selectMe } from "../../redux/slices/usersSlice";
|
||||||
import NewMeeting from "../../api-bodies/NewMeeting";
|
import NewMeeting from "../../api-bodies/NewMeeting";
|
||||||
import axios from "../../api/axios";
|
import axios from "../../api/axios";
|
||||||
import { open as openMeetingUrl } from "../../redux/slices/meetingUrlSlice";
|
import { open as openMeetingUrl } from "../../redux/slices/meetingUrlSlice";
|
||||||
@ -23,6 +23,7 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
||||||
|
const managerId = useAppSelector(selectManager);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
|
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
|
||||||
const [snackbarOpen, setSnackbarOpen] = useState(false);
|
const [snackbarOpen, setSnackbarOpen] = useState(false);
|
||||||
@ -108,7 +109,7 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
|||||||
Add to Favorites
|
Add to Favorites
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
)}
|
)}
|
||||||
{status.inMeeting ? (
|
{status.inMeeting && user.uuid !== managerId ? (
|
||||||
<MenuItem
|
<MenuItem
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
handleClose();
|
handleClose();
|
||||||
@ -118,14 +119,16 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
|||||||
View current meeting
|
View current meeting
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
) : null}
|
) : null}
|
||||||
|
{user.uuid === managerId ? null : (
|
||||||
<MenuItem
|
<MenuItem
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
handleClose();
|
handleClose();
|
||||||
navigate(`../contacts/${user.uuid}`);
|
navigate(`../contacts/${user.uuid}`);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
View upcoming meetings
|
View meetings today
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
|
)}
|
||||||
<MenuItem
|
<MenuItem
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
handleClose();
|
handleClose();
|
||||||
|
|||||||
@ -3,6 +3,8 @@ import UserLite from "../../api-bodies/UserLite";
|
|||||||
import UserStatus from "../../api-bodies/UserStatus";
|
import UserStatus from "../../api-bodies/UserStatus";
|
||||||
import SettingsButton from "./SettingsButton";
|
import SettingsButton from "./SettingsButton";
|
||||||
import { MeetingStatus, getStatusColor } from "../../utils";
|
import { MeetingStatus, getStatusColor } from "../../utils";
|
||||||
|
import { useAppSelector } from "../../redux/hooks";
|
||||||
|
import { selectManager } from "../../redux/slices/usersSlice";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
user: UserLite;
|
user: UserLite;
|
||||||
@ -10,23 +12,22 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const SidebarUser: React.FC<Props> = ({ user, status }: Props) => {
|
const SidebarUser: React.FC<Props> = ({ user, status }: Props) => {
|
||||||
|
const managerId = useAppSelector(selectManager);
|
||||||
|
const meetingStatus: MeetingStatus =
|
||||||
|
managerId === user.uuid
|
||||||
|
? MeetingStatus.NOT_AVAILABLE
|
||||||
|
: user && status.inMeeting
|
||||||
|
? MeetingStatus.IN_MEETING
|
||||||
|
: MeetingStatus.NOT_IN_MEETING;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ width: "100%", display: "flex", flexDirection: "row", p: 1 }}>
|
<Box sx={{ width: "100%", display: "flex", flexDirection: "row", p: 1 }}>
|
||||||
|
<Box bgcolor={getStatusColor(meetingStatus)} sx={{ p: 1 }} />
|
||||||
<Box
|
<Box
|
||||||
bgcolor={getStatusColor(
|
sx={{ width: "80%", display: "flex", flexDirection: "column", ml: 1 }}
|
||||||
status.inMeeting
|
>
|
||||||
? MeetingStatus.IN_MEETING
|
|
||||||
: MeetingStatus.NOT_IN_MEETING
|
|
||||||
)}
|
|
||||||
sx={{ p: 1 }}
|
|
||||||
/>
|
|
||||||
<Box sx={{ width: "80%", display: "flex", flexDirection: "column", ml: 1 }}>
|
|
||||||
<Typography variant="h6">{user.name}</Typography>
|
<Typography variant="h6">{user.name}</Typography>
|
||||||
<Typography variant="caption">
|
<Typography variant="caption">{meetingStatus}</Typography>
|
||||||
{status.inMeeting
|
|
||||||
? MeetingStatus.IN_MEETING
|
|
||||||
: MeetingStatus.NOT_IN_MEETING}
|
|
||||||
</Typography>
|
|
||||||
</Box>
|
</Box>
|
||||||
<Box sx={{ width: "20%" }}>
|
<Box sx={{ width: "20%" }}>
|
||||||
<SettingsButton user={user} status={status} />
|
<SettingsButton user={user} status={status} />
|
||||||
|
|||||||
@ -97,5 +97,10 @@ export const selectTeam = (state: RootState) => {
|
|||||||
state.users.team.directReports.forEach((u) => team.push(u));
|
state.users.team.directReports.forEach((u) => team.push(u));
|
||||||
return team;
|
return team;
|
||||||
};
|
};
|
||||||
|
export const selectTeamWithoutManager = (state: RootState) => {
|
||||||
|
const team: string[] = [];
|
||||||
|
state.users.team.sameManager.forEach((u) => team.push(u));
|
||||||
|
state.users.team.directReports.forEach((u) => team.push(u));
|
||||||
|
return team;
|
||||||
|
};
|
||||||
export default usersSlice.reducer;
|
export default usersSlice.reducer;
|
||||||
|
|||||||
Reference in New Issue
Block a user