<div class='ad_leader' id='dfp-directory-banner'></div>

<div id='directory-list'>
  {{persistent-banners}}
  <div class='streams-grid items-grid'>

    <div class='directory_header'>
      <h2 class='title'>
        {{i18n 'Following'}}
      </h2>
      {{#common/tab-container class="js-nav"}}
        {{#common/tab-item}}
          {{#link-to 'directory.following.index'}}{{t 'general.common.overview'}}{{/link-to}}
        {{/common/tab-item}}
        {{#common/tab-item}}
          {{#link-to 'directory.following.channels'}}{{i18n 'Channels'}}{{/link-to}}
        {{/common/tab-item}}
        {{#common/tab-item}}
          {{#link-to 'directory.following.hosts'}}{{i18n 'Hosts'}}{{/link-to}}
        {{/common/tab-item}}
        {{#common/tab-item}}
          {{#link-to 'directory.following.games'}}{{i18n 'Games'}}{{/link-to}}
        {{/common/tab-item}}
        {{#common/tab-item}}
          {{#link-to 'directory.following.videos'}}{{t 'general.Twitch.videos'}}{{/link-to}}
        {{/common/tab-item}}
      {{/common/tab-container}}
    </div>

    {{#if session.isAuthenticated}}
      {{#if application.disableFollowingDirectory}}
        <p class='empty-grid'>
          {{i18n 'Twitch is under heavy load. The following directory will return soon.'}}
        </p>
      {{else}}
        {{outlet}}
      {{/if}}
    {{else}}
      {{i18n 'You must be logged in to see channels you follow.'}}
      {{interactivity-beacon beaconId='following-directory-logged-out'}}
    {{/if}}
  </div>
  {{ads-rectangle}}
</div>
