hummingbird-me/kitsu-web

<div class="card is-sticky">
  <div class="favorite-categories">
    <h5 class="text-uppercase">{{t "explore.widget.favorite-categories"}}</h5>
    <ul class="list-unstyled categories-list">
      {{#if getUserFavoritesTask.isRunning}}
        {{#skeleton-container class="category-skeleton"}}
          {{#each (repeat 6) as |_|}}
            {{skeleton-loader class="category-skeleton-horizontal"}}
          {{/each}}
          {{skeleton-loader class="category-skeleton-vertical"}}
        {{/skeleton-container}}
      {{else}}
        {{#each getUserFavoritesTask.value as |favorite|}}
          <li>
            <a href={{href-to "explore.category" favorite.category.slug}}>{{t (category-to-i18n favorite.category.slug)}}</a>
          </li>
        {{else}}
          {{t "explore.widget.no-favorites"}}
        {{/each}}
      {{/if}}
    </ul>
  </div>

  <div class="categories">
    <h5 class="text-uppercase">{{t "explore.widget.categories"}}</h5>
    {{#if getCategoriesTask.isRunning}}
      {{#skeleton-container class="category-skeleton large"}}
        {{#each (repeat 18) as |_|}}
          {{skeleton-loader class="category-skeleton-horizontal"}}
        {{/each}}
        {{skeleton-loader class="category-skeleton-vertical"}}
      {{/skeleton-container}}
    {{else}}
      {{explore/category-sidebar/category-list categories=categories}}
    {{/if}}
  </div>
</div>