frontend/containers/EventBar/UserIcon.tsx (view raw)
1import Avatar from '@material-ui/core/Avatar';
2import Icon from '@material-ui/core/Icon';
3import {makeStyles} from '@material-ui/core/styles';
4import useProfile from '../../hooks/useProfile';
5
6const UserIcon = () => {
7 const {profile} = useProfile();
8 const classes = useStyles();
9
10 if (profile)
11 return (
12 <Avatar className={classes.avatar}>
13 {`${profile.username[0]}`.toUpperCase()}
14 </Avatar>
15 );
16 else return <Icon>more_vert</Icon>;
17};
18
19const useStyles = makeStyles(theme => ({
20 avatar: {
21 width: theme.spacing(3),
22 height: theme.spacing(3),
23 fontSize: 16,
24 },
25}));
26
27export default UserIcon;