How do I find out the attributes of a 'user' in my Amplify-React project?

Question

So some of the default code that is provided when you create an Amplify-React app looks like this:

<Heading level={1}>Hello {user.username}</Heading>

I have tried searching all over my project's files to find out what attributes 'user' has. Clearly it has a 'username' attribute, but what I'd like to change is the heading so that it says "Hello {user.firstname}". Firstname doesn't work so I was wondering where in my project I can find the attributes that a user has so that I can change the heading to their first name.

Answer 1

Using Auth.currentUserInfo() should return you an object like this:

{
  "attributes": {
    "email": "MY EMAIL ADDRESS",
    "email_verified": true,
    "sub": "INTERNAL USERID: XXXX-XXXX-XXXX-XXXX-XXXX"
  },
  "id": "us-east-1:XXXX",
  "username": "MY USERNAME"
}

Reference

As this function is asynchronous, be sure to await it when setting it to a variable.