<section class="user-content">
  {{text-field
    value=filterInput
    placeholderKey=filterPlaceholder
    autocomplete="discourse"
    class="group-username-filter no-blur"
  }}

  <div class="group-members-manage">
    {{#if canManageGroup}}
      {{d-button
        icon="plus"
        label="groups.manage.add_members"
        class="group-members-add"
        action=(route-action "showAddMembersModal")
      }}
    {{/if}}
  </div>

  {{#if hasMembers}}
    {{#load-more selector=".group-members .user-info" action=(action "loadMore")}}
      <div class="group-members">
        {{#each model.members as |user|}}
          <div class="group-member">
            {{#user-info user=user skipName=skipName}}
              {{#if user.owner}}<strong class="group-owner-label">{{i18n "groups.owner"}}</strong>{{/if}}

              <div class="group-member-info">
                <label>{{i18n "last_post"}}</label>
                <span class="text">{{bound-date user.last_posted_at}}</span>
              </div>

              <div class="group-member-info">
                <label>{{i18n "last_seen"}}</label>
                <span class="text">{{bound-date user.last_seen_at}}</span>
              </div>

              {{#if canManageGroup}}
                {{group-member-dropdown
                  member=user
                  canAdminGroup=model.can_admin_group
                  onChange=(action "actOnGroup" user)
                }}
              {{/if}}
            {{/user-info}}
          </div>
        {{/each}}
      </div>
    {{/load-more}}

    {{conditional-loading-spinner condition=loading}}
  {{else if model.can_see_members}}
    <br>

    <div>{{i18n "groups.empty.members"}}</div>
  {{else}}
    <br>

    <div>{{i18n "groups.members.forbidden"}}</div>
  {{/if}}
</section>
