<DSection @pageClass="about">
  <div class="container">
    <div class="contents clearfix body-page">

      <ul class="nav-pills">
        <li class="nav-item-about"><LinkTo @route="about" class="active">{{i18n
              "about.simple_title"
            }}</LinkTo></li>
        {{#if this.faqOverridden}}
          <li class="nav-item-guidelines"><LinkTo @route="guidelines">{{i18n
                "guidelines"
              }}</LinkTo></li>
          <li class="nav-item-faq"><LinkTo @route="faq">{{i18n
                "faq"
              }}</LinkTo></li>
        {{else}}
          <li class="nav-item-faq"><LinkTo @route="faq">{{i18n
                "faq"
              }}</LinkTo></li>
        {{/if}}
        <li class="nav-item-tos"><LinkTo @route="tos">{{i18n
              "tos"
            }}</LinkTo></li>
        <li class="nav-item-privacy"><LinkTo @route="privacy">{{i18n
              "privacy"
            }}</LinkTo></li>
      </ul>

      <section class="about description">
        <h2>{{i18n "about.title" title=this.model.title}}</h2>
        <p>{{this.model.description}}</p>
      </section>

      <PluginOutlet
        @name="about-after-description"
        @connectorTagName="section"
        @outletArgs={{hash model=this.model}}
      />

      {{#if this.model.admins}}
        <section class="about admins">
          <h3>{{d-icon "users"}} {{i18n "about.our_admins"}}</h3>

          <AboutPageUsers @users={{this.model.admins}} />
          <div class="clearfix"></div>
        </section>
      {{/if}}

      <span>
        <PluginOutlet
          @name="about-after-admins"
          @connectorTagName="section"
          @outletArgs={{hash model=this.model}}
        />
      </span>

      {{#if this.model.moderators}}
        <section class="about moderators">
          <h3>{{d-icon "users"}} {{i18n "about.our_moderators"}}</h3>

          <div class="users">
            <AboutPageUsers @users={{this.model.moderators}} />
          </div>
          <div class="clearfix"></div>
        </section>
      {{/if}}

      <span>
        <PluginOutlet
          @name="about-after-moderators"
          @connectorTagName="section"
          @outletArgs={{hash model=this.model}}
        />
      </span>

      {{#if this.model.category_moderators.length}}
        {{#each this.model.category_moderators as |cm|}}
          <section
            class="about category-moderators moderators-{{cm.category.slug}}"
          >
            <h3>{{category-link cm.category}}{{i18n "about.moderators"}}</h3>
            <div class="users">
              <AboutPageUsers @users={{cm.moderators}} />
            </div>
            <div class="clearfix"></div>
          </section>
        {{/each}}
      {{/if}}
      {{#if this.model.can_see_about_stats}}
        <section class="about stats">
          <h3>{{d-icon "far-chart-bar"}} {{i18n "about.stats"}}</h3>

          <table class="table">
            <tbody>
              <tr>
                <th>&nbsp;</th>
                <th>{{i18n "about.stat.last_day"}}</th>
                <th>{{i18n "about.stat.last_7_days"}}</th>
                <th>{{i18n "about.stat.last_30_days"}}</th>
                <th>{{i18n "about.stat.all_time"}}</th>
              </tr>
              <tr class="about-topic-count">
                <td class="title">{{i18n "about.topic_count"}}</td>
                <td>{{number this.model.stats.topics_last_day}}</td>
                <td>{{number this.model.stats.topics_7_days}}</td>
                <td>{{number this.model.stats.topics_30_days}}</td>
                <td>{{number this.model.stats.topic_count}}</td>
              </tr>
              <tr class="about-post-count">
                <td>{{i18n "about.post_count"}}</td>
                <td>{{number this.model.stats.posts_last_day}}</td>
                <td>{{number this.model.stats.posts_7_days}}</td>
                <td>{{number this.model.stats.posts_30_days}}</td>
                <td>{{number this.model.stats.post_count}}</td>
              </tr>
              <tr class="about-user-count">
                <td>{{i18n "about.user_count"}}</td>
                <td>{{number this.model.stats.users_last_day}}</td>
                <td>{{number this.model.stats.users_7_days}}</td>
                <td>{{number this.model.stats.users_30_days}}</td>
                <td>{{number this.model.stats.user_count}}</td>
              </tr>
              <tr class="about-active-user-count">
                <td>{{i18n "about.active_user_count"}}</td>
                <td>{{number this.model.stats.active_users_last_day}}</td>
                <td>{{number this.model.stats.active_users_7_days}}</td>
                <td>{{number this.model.stats.active_users_30_days}}</td>
                <td>&mdash;</td>
              </tr>
              <tr class="about-like-count">
                <td>{{i18n "about.like_count"}}</td>
                <td>{{number this.model.stats.likes_last_day}}</td>
                <td>{{number this.model.stats.likes_7_days}}</td>
                <td>{{number this.model.stats.likes_30_days}}</td>
                <td>{{number this.model.stats.like_count}}</td>
              </tr>
              {{#each
                this.site.displayed_about_plugin_stat_groups
                as |statGroupName|
              }}
                <tr class={{concat "about-" statGroupName "-count"}}>
                  <td>{{i18n (concat "about." statGroupName "_count")}}</td>
                  <td>{{number
                      (get this.model.stats (concat statGroupName "_last_day"))
                    }}</td>
                  <td>{{number
                      (get this.model.stats (concat statGroupName "_7_days"))
                    }}</td>
                  <td>{{number
                      (get this.model.stats (concat statGroupName "_30_days"))
                    }}</td>
                  <td>{{number
                      (get this.model.stats (concat statGroupName "_count"))
                    }}</td>
                </tr>
              {{/each}}
            </tbody>
          </table>
        </section>
      {{/if}}

      {{#if this.contactInfo}}
        <section class="about contact">
          <h3>{{d-icon "envelope"}} {{i18n "about.contact"}}</h3>
          <p>{{html-safe this.contactInfo}}</p>
        </section>
      {{/if}}

    </div>
  </div>
</DSection>