123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- // import { Avatar, Button, AppBar } from "@mui/material"
- import { connect } from "react-redux"
- import { actionAuthLogout } from "../actions"
- import { useState } from "react";
- import Box from '@mui/material/Box';
- import Avatar from '@mui/material/Avatar';
- import Menu from '@mui/material/Menu';
- import MenuItem from '@mui/material/MenuItem';
- import ListItemIcon from '@mui/material/ListItemIcon';
- import Divider from '@mui/material/Divider';
- import IconButton from '@mui/material/IconButton';
- import Typography from '@mui/material/Typography';
- import Tooltip from '@mui/material/Tooltip';
- import PersonAdd from '@mui/icons-material/PersonAdd';
- import Settings from '@mui/icons-material/Settings';
- import Logout from '@mui/icons-material/Logout';
- import { ListItem } from "@mui/material";
- import { Link } from "react-router-dom";
- export default function AccountMenu() {
- }
- const Profile = ({ user, onLogout }) => {
- const [anchorEl, setAnchorEl] = useState(null);
- const open = Boolean(anchorEl);
- const handleClick = (event) => {
- setAnchorEl(event.currentTarget);
- }
- const handleClose = () => {
- setAnchorEl(null);
- }
- return (
- // <>
- // {user && <div>
- // {user.avatar ?
- // <Avatar src={user.avatar.url} alt={user.login} />
- // :
- // <Avatar>{(user.nick && user.nick[0]) || user.login[0]}</Avatar>}
- // <span>{user.nick || user.login}</span>
- // <a href="/profile">Редактировать профиль</a>
- // <Button onClick={() => onLogout()}>Выйти</Button>
- // </div>}
- // </>
- <>
- <Box sx={{ display: 'flex', alignItems: 'center', textAlign: 'center' }}>
- {user && <Tooltip title="Account settings">
- <IconButton onClick={handleClick} size="small" sx={{ ml: 2 }}>
- {user.avatar ?
- <Avatar src={user.avatar.url} alt={user.login} />
- :
- <Avatar>{(user.nick && user.nick[0]) || user.login[0]}</Avatar>}
- </IconButton>
- </Tooltip>}
- </Box>
- <Menu
- anchorEl={anchorEl}
- open={open}
- onClose={handleClose}
- onClick={handleClose}
- PaperProps={{
- elevation: 0,
- sx: {
- overflow: 'visible',
- filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
- mt: 1.5,
- '& .MuiAvatar-root': {
- width: 32,
- height: 32,
- ml: -0.5,
- mr: 1,
- },
- '&:before': {
- content: '""',
- display: 'block',
- position: 'absolute',
- top: 0,
- right: 14,
- width: 10,
- height: 10,
- bgcolor: 'background.paper',
- transform: 'translateY(-50%) rotate(45deg)',
- zIndex: 0,
- },
- },
- }}
- transformOrigin={{ horizontal: 'right', vertical: 'top' }}
- anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
- >
- <MenuItem component={Link} to={`/profile`}>
- Profile </MenuItem>
- <Divider />
- <MenuItem onClick={onLogout}>
- <ListItemIcon>
- <Logout fontSize="small" />
- </ListItemIcon>
- Logout
- </MenuItem>
- </Menu>
- </>
- )
- }
- export const ConnectProfile = connect(state => ({ user: state.promise.userInfo?.payload?.data?.UserFindOne }),
- {
- onLogout: actionAuthLogout
- })(Profile)
|