{{#view "settings/users/users-list-view" tagName="section" class="content settings-users" }}
    <header class="settings-view-header user-list-header">
        {{#link-to "settings" class="btn btn-default btn-back"}}Back{{/link-to}}
        <h2 class="page-title">Users</h2>
        <section class="page-actions">
            <button class="btn btn-green" {{action "openModal" "invite-new-user"}} >New&nbsp;User</button>
        </section>
    </header>

    {{#if invitedUsers}}

        <section class="user-list invited-users">

            <h4 class="user-list-title">Invited users</h4>

            {{#each invitedUsers itemController="settings/users/user"}}
                <div class="user-list-item">
                    <span class="user-list-item-icon icon-mail">ic</span>

                    <div class="user-list-item-body">
                        <span class="name">{{email}}</span><br>
                            {{#if pending}}
                                <span class="red">Invitation not sent - please try again</span>
                            {{else}}
                                <span class="description">Invitation sent: {{created_at}}</span>
                            {{/if}}
                    </div>
                    <aside class="user-list-item-aside">
                        <a class="user-list-action" href="#" {{action "revoke"}}>Revoke</a>
                        <a class="user-list-action" href="#" {{action "resend"}}>Resend</a>
                    </aside>
                </div>
            {{/each}}

        </section>

    {{/if}}

    <section class="user-list active-users">

        <h4 class="user-list-title">Active users</h4>

        {{#each activeUsers itemController="settings/users/user"}}
            {{#link-to 'settings.users.user' this class="user-list-item" }}
                <span class="user-list-item-figure" {{bind-attr style=image}}>
                    <span class="hidden">Photo of {{unbound name}}</span>
                </span>

                <div class="user-list-item-body">
                    <span class="name">
                        {{name}}
                    </span>
                    <br>
                    <span class="description">Last seen: {{unbound last_login}}</span>
                </div>
                <aside class="user-list-item-aside">
                    {{#unless isAuthor}}
                        {{#each roles}}
                            <span class="role-label {{unbound lowerCaseName}}">{{name}}</span>
                        {{/each}}
                    {{/unless}}
                </aside>
            {{/link-to}}
        {{/each}}

    </section>
{{/view}}