Merge pull request #59 from CPSC319-Winter-term-2/mbalsdon-add-favs-notif
popup when someone adds favourite from sidebar
This commit is contained in:
commit
8c51821f6e
@ -1,5 +1,5 @@
|
||||
import { Settings } from "@mui/icons-material";
|
||||
import { IconButton, Menu, MenuItem } from "@mui/material";
|
||||
import { Alert, IconButton, Menu, MenuItem, Snackbar } from "@mui/material";
|
||||
import { useState } from "react";
|
||||
import UserLite from "../../api-bodies/UserLite";
|
||||
import UserStatus from "../../api-bodies/UserStatus";
|
||||
@ -22,6 +22,7 @@ interface Props {
|
||||
const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
||||
const navigate = useNavigate();
|
||||
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
|
||||
const [snackbarOpen, setSnackbarOpen] = useState(false);
|
||||
const me = useAppSelector(selectMe);
|
||||
const favoritesUuids = useAppSelector(selectFavorites);
|
||||
const meeting = useAppSelector((state) =>
|
||||
@ -35,6 +36,12 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
||||
const handleClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
const handleSnackbarClose = (event?: React.SyntheticEvent | Event, reason?: string) => {
|
||||
if (reason === "clickaway") {
|
||||
return;
|
||||
}
|
||||
setSnackbarOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
@ -66,12 +73,14 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
||||
) : (
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setSnackbarOpen(true);
|
||||
handleClose();
|
||||
dispatch(addFavorite({ userId: me, toBeAdded: user.uuid }));
|
||||
}}
|
||||
>
|
||||
Add to Favorites
|
||||
</MenuItem>
|
||||
|
||||
)}
|
||||
{status.inMeeting ? (
|
||||
<MenuItem
|
||||
@ -93,6 +102,13 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleClose}>Create meeting</MenuItem>
|
||||
</Menu>
|
||||
<Snackbar
|
||||
anchorOrigin={{ vertical: "bottom", horizontal: "right" }}
|
||||
open={snackbarOpen} autoHideDuration={3000} onClose={handleSnackbarClose}>
|
||||
<Alert onClose={handleSnackbarClose} severity="success" sx={{ width: "100%" }}>
|
||||
User successfully added to favourites list!
|
||||
</Alert>
|
||||
</Snackbar>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user