71 lines
1.7 KiB
JavaScript
71 lines
1.7 KiB
JavaScript
import React, { Component } from 'react';
|
|
import {graphql} from 'react-apollo';
|
|
import {getUserByAuthIdQuery} from '../queries/queries';
|
|
import {auth} from '../App';
|
|
import LoggedInUserMenu from './LoggedInUserMenu';
|
|
import Button from '@material-ui/core/Button';
|
|
|
|
class LoggedInUser extends Component {
|
|
|
|
displayLoggedInUser(){
|
|
|
|
const user = this.props.data.userByAuthId;
|
|
|
|
console.log('loggedInUser data', this.props.data);
|
|
console.log('loggedInUser', user);
|
|
|
|
if(user){
|
|
|
|
console.log(user.firstName);
|
|
console.log(user.lastName );
|
|
console.log(user.alias);
|
|
|
|
let displayName = "No Display Name";
|
|
|
|
if (
|
|
user.alias !== null &&
|
|
user.alias !== ""
|
|
) { displayName = user.alias;}
|
|
|
|
if (
|
|
user.firstName !== null &&
|
|
user.firstName !== ""
|
|
) { displayName = user.firstName;}
|
|
|
|
if (
|
|
user.firstName !== null &&
|
|
user.firstName !== "" &&
|
|
user.lastName !== null &&
|
|
user.lastName !== ""
|
|
) { displayName = user.firstName + " " + user.lastName;}
|
|
|
|
return(
|
|
<div>
|
|
<p><LoggedInUserMenu menuLabel={ displayName }/></p>
|
|
</div>
|
|
);
|
|
|
|
} else {
|
|
return( <div onClick={() => auth.login()}><Button color="inherit">Login / Sign up</Button></div> );
|
|
}
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
{this.displayLoggedInUser()}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default graphql(getUserByAuthIdQuery, { // What follows is the way to pass a parameter to a query.
|
|
options: (props) => {
|
|
return {
|
|
variables: {
|
|
authId: props.authId
|
|
}
|
|
}
|
|
}
|
|
})(LoggedInUser); // This binds the querty to the component
|