Displays the authenticated user's profile with avatar, name, email, verification status, and an optional logout button.
Renders nothing when no user is authenticated. The avatar shows the user's initials with a deterministic color.
Key Features:
<UserProfile onLogout={() => navigate('/login')} colors={{ logoutButton: '#d32f2f' }}/> Copy
<UserProfile onLogout={() => navigate('/login')} colors={{ logoutButton: '#d32f2f' }}/>
Displays the authenticated user's profile with avatar, name, email, verification status, and an optional logout button.
Renders nothing when no user is authenticated. The avatar shows the user's initials with a deterministic color.