4. Компонента профиля - qwsnxnjene/courier-transport GitHub Wiki

Profile.js — это React-компонент, отображающий профиль пользователя после успешной авторизации. Он позволяет просматривать основную информацию о пользователе, а также реализует выход из аккаунта.

• Состояния компонента:

  • user: объект с данными пользователя, полученными с сервера.
  • error: строка для отображения ошибок при загрузке профиля.

• Загрузка данных пользователя:

  • При монтировании компонента отправляется GET-запрос на /api/profile с токеном из localStorage.
  • В случае успеха данные пользователя сохраняются в состоянии user.
  • В случае ошибки отображается сообщение.

• Выход из аккаунта:

  • Кнопка "Выйти" очищает токен из localStorage и вызывает onLogout.

• UI:

  • Отображение имени пользователя, логина и другой информации.
  • Кнопка выхода.
  • Обработка ошибок.

<Profile onLogout={() => { /* действия после выхода */ }} />

• GET-запрос на http://localhost:3031/api/profile с заголовком Authorization: Bearer <token>.
• Ожидается объект с данными пользователя.

• Используются CSS-классы: profile-overlay, profile-panel, close-profile, profile-info, logout-button, error-message.
• Профиль реализован как модальное окно.

• React (useState, useEffect)