{{#if this.activeFilters.length}}
  <section
    class="filters-list"
    {{did-insert (perform this.load) this.activeFilters}}
    {{did-update (perform this.load) this.activeFilters}}
  >
    {{#if this.filterTags}}
      <header class="filters-header">
        {{t "general.activeFilters"}}:
      </header>
      <div class="filter-tags">
        {{#each (sort-by "name" this.filterTags) as |tag|}}
          <button
            class="filter-tag {{tag.class}}"
            type="button"
            {{on "click" (fn tag.remove tag.id)}}
          >
            {{tag.name}}
            <FaIcon @icon="xmark" />
          </button>
        {{/each}}
        <button
          id="calendar-clear-filters"
          class="filters-clear-filters"
          type="button"
          {{on "click" @clearFilters}}
        >
          {{t "general.clearFilters"}}
        </button>
      </div>
    {{/if}}
  </section>
{{/if}}
