How to fetch user's data after authentication in SPA?

I'm new to React and building a SPA with a Express.js backend for some practice. I'm used to session based authentication and can't decide what's good and what's not good when it comes to authentication and security of SPA.

Upon authentication with valid user information, I issue a JWT token to client using Authorization header. Simply put, my question is about what to put in JWT's body and what to send in authentication request's response body and how to fetch user's data to show on header or store in Redux.

For now, I only provide userId, username, email values in JWT's body. These informations are not relatively sensitive in my opinion.

1. Is it a good practice to decode the user's token on front-end after authentication to store these values in Redux store?
2. Maybe I can only send userId in JWT's body to minimize the data available in JWT. If I do so, I will need to user's other data like username, email, avatar etc. in other ways. For that I have 2 possible ideas:
   2.1) Should I send user's data in authentication response's body? Is it a good practice?
   2.2) Or after the authentication when I redirect user to homepage I can check if Redux store has user fields (is it null) and make another request to REST API with userId to retrieve user's data.

Which of these a better approach?

When decoding a JWT on the front-end, it's important to remember that the JWT payload is base64-encoded and can be easily decoded by anyone who has access to it. Therefore, it's crucial to avoid storing sensitive information in the JWT payload, as it can potentially be exposed.Consider minimizing the data available in the JWT payload (e.g., only including the user ID), you can make an additional API request to retrieve the user's data after authentication.