{{#d-section pageClass="users"}}
  {{#load-more selector=".directory tbody tr" action=(action "loadMore")}}
    <div class="container">
      <div class='directory'>
        {{plugin-outlet name="users-top" connectorTagName='div' args=(hash model=model)}}
        <div class='clearfix'>
          {{period-chooser period=period}}
          {{text-field value=nameInput placeholderKey="directory.filter_name" class="filter-name no-blur"}}
        </div>

        {{#conditional-loading-spinner condition=model.loading}}
          {{#if model.length}}

            <table>
              <thead>
                <th>{{i18n "directory.total_rows" count=model.totalRows}}</th>
                {{directory-toggle field="likes_received" order=order asc=asc icon="heart"}}
                {{directory-toggle field="likes_given" order=order asc=asc icon="heart"}}
                {{directory-toggle field="topic_count" order=order asc=asc}}
                {{directory-toggle field="post_count" order=order asc=asc}}
                {{directory-toggle field="topics_entered" order=order asc=asc}}
                {{directory-toggle field="posts_read" order=order asc=asc}}
                {{directory-toggle field="days_visited" order=order asc=asc}}
                {{#if showTimeRead}}
                  <th>{{i18n "directory.time_read"}}</th>
                {{/if}}
              </thead>
              <tbody>
                {{#each model as |item|}}
                  {{directory-item item=item showTimeRead=showTimeRead}}
                {{/each}}
              </tbody>
            </table>

            {{conditional-loading-spinner condition=model.loadingMore}}
          {{else}}
            <div class='clearfix'></div>
            <p>{{i18n "directory.no_results"}}</p>
          {{/if}}
        {{/conditional-loading-spinner}}

      </div>
    </div>
  {{/load-more}}
{{/d-section}}