Note

This documentation describes the UserButton Vue component for native UI views, for Xml templates see user-button.

UserButton

An avatar button displaying the current user's initials. Opens a popover with tenant name, user name, email, logout button, and an optional change-tenant button.

Import

import { UserButton } from '@neos/app'

Props

None. Reads the current user from the authentication context.

Slots

Slot	Description
default	Extra actions rendered inside the user popover (below logout)

Usage Examples

Default user button in sidebar footer

<Sidebar :items="navItems">
  <template #footer>
    <UserButton />
  </template>
</Sidebar>

With extra action

<UserButton>
  <button label="Profile settings" icon="pi pi-user-edit" variant="text" @click="openProfile" />
</UserButton>