CurrentIdentity.tsx

 1import Avatar from '@material-ui/core/Avatar';
 2import { makeStyles } from '@material-ui/core/styles';
 3import React from 'react';
 4
 5import { useCurrentIdentityQuery } from './CurrentIdentity.generated';
 6
 7const useStyles = makeStyles(theme => ({
 8  displayName: {
 9    marginLeft: theme.spacing(2),
10  },
11}));
12
13const CurrentIdentity = () => {
14  const classes = useStyles();
15  const { loading, error, data } = useCurrentIdentityQuery();
16
17  if (error || loading || !data?.defaultRepository?.userIdentity) return null;
18
19  const user = data.defaultRepository.userIdentity;
20  return (
21    <>
22      <Avatar src={user.avatarUrl ? user.avatarUrl : undefined}>
23        {user.displayName.charAt(0).toUpperCase()}
24      </Avatar>
25      <div className={classes.displayName}>{user.displayName}</div>
26    </>
27  );
28};
29
30export default CurrentIdentity;