final fixes before demo

This commit is contained in:
Taehee Choi 2022-04-04 00:10:19 -07:00
parent 9683a55cd5
commit 45c5bebe8f
5 changed files with 48 additions and 31 deletions

View File

@ -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)
); );

View File

@ -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}
> >

View File

@ -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();

View File

@ -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} />

View File

@ -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;