{{#if this.loading}}
  <div class="spinner-container">
    <div class="spinner"></div>
  </div>
{{else if this.items.length}}
  <ul aria-labelledby={{@ariaLabelledby}}>
    {{#each this.items as |item|}}
      <UserMenu::MenuItem @item={{item}} @closeUserMenu={{@closeUserMenu}} />
    {{/each}}
  </ul>
  <div class="panel-body-bottom">
    {{#if this.showAllHref}}
      <a
        class="btn btn-default btn-icon no-text show-all"
        href={{this.showAllHref}}
        title={{this.showAllTitle}}
      >
        {{d-icon "chevron-down" aria-label=this.showAllTitle}}
      </a>
    {{/if}}
    {{#if this.showDismiss}}
      <button
        type="button"
        class="btn btn-default notifications-dismiss btn-icon-text"
        title={{this.dismissTitle}}
        {{on "click" this.dismissButtonClick}}
      >
        {{d-icon "check"}}
        {{i18n "user.dismiss"}}
      </button>
    {{/if}}
  </div>
{{else}}
  {{component this.emptyStateComponent}}
{{/if}}