Puede enviar al usuario como accesorio al encabezado. Ese es el método preferido. Haga que el usuario inicie sesión y guarde el estado de su aplicación con redux del useState que ahora está disponible en React.

A su segunda pregunta, los JWT conservan los datos de la sesión. Volver a renderizar la página no hará que desaparezca. Las aplicaciones bien diseñadas tienen JWT con un tiempo de vencimiento (generalmente 20 minutos o menos).

Trabajé en una aplicación de votación que hacía exactamente lo que estaba buscando y no requería ninguna gestión de estado global. Siéntete libre de elegirlo. Es un proyecto de código abierto. Creo que usamos Auth0 o la biblioteca Oauth de Google para realizar la autenticación.

Aquí está el código para el encabezado React (barra de navegación): https://github.com/poll-pal/poll-pal/blob/master/src/Components/Header/Header.js

Aquí está el código para el servidor Express que lo respaldó: https://github.com/poll-pal/poll-pal/blob/master/server/routes/auth.js

Al principio, si desea mantener a su usuario conectado, debe almacenar el JWT en algún lugar. Aquí por 'algún lugar' quiero decir, para que pueda acceder a él en la próxima recarga.

En mi proyecto máximo, almaceno mi JWT en almacenamiento local. funciona algo como esto

• Cuando el usuario inicia sesión, almaceno el JWT en el almacenamiento local también en mi reductor.
• Luego, en mi 'Estado inicial', siempre tomo el almacenamiento local, de modo que si tenemos algo en el almacenamiento local, significa que el usuario está conectado

 initial_state = { userName: localstorage.getItem('user_name') }

Así es como puede mantener a su usuario conectado y, en el momento de cerrar la sesión, borrar el almacenamiento local y el reductor.