const messages = {
  dashboard: <span>Dashboard</span>,
  account: 'Settings',
  help: <strong>help</strong>,
  logout: <strong>Logout</strong>,
};
const customItems = [
  {
    label: 'Additional item',
    action: () => alert('Hallo'),
  },
];

<Page variant="withBorder">
  <Pattern>
    <UserMenu name="Uri" messages={messages} customItems={customItems} />
  </Pattern>
</Page>

With different variant and dimension:

const messages = {
  dashboard: <span>Dashboard</span>,
  account: 'Settings',
  help: <strong>help</strong>,
  logout: <strong>Logout</strong>,
};

<Page variant="withBorder">
  <UserMenu name="Uri" messages={messages} variant="linkBlue" dimension="compact" />
</Page>

Only logout and help messages are required, the others can be omitted. This leads to them being not rendered in the menu.

const messages = {
  help: <strong>help</strong>,
  logout: <strong>Logout</strong>,
};

<Page variant="withBorder">
  <Pattern>
    <UserMenu name="Uri" messages={messages} />
  </Pattern>
</Page>