{% extends "base.html" %}
{% load catalogue_tags %}
{% block title %}{% catalogue_wording as words %}{{ words.title }} | {% catalogue_name as name %}{{ site_name|default:name }}{% endblock %}
{% block body_class %} bk-catalogue-page bk-catalogue-list-page{% endblock %}
{% block content %}
<div class="bk-catalogue">
  <header class="bk-catalogue__header">
    {% catalogue_wording as words %}<h1 class="bk-catalogue__title">{{ words.title }}</h1>
    <p class="bk-catalogue__intro">{{ words.title }}, with buying options for your country.
      <a href="{% url 'catalogue:distributor_list' %}">Distributors worldwide&nbsp;&rarr;</a></p>
    <div class="bk-catalogue__tools">
      {% if kinds|length > 1 %}
      <nav class="bk-catalogue-languages" aria-label="Product type">
        {% for value in kinds %}
        <a href="?kind={{ value|urlencode }}" class="bk-catalogue-languages__item{% if value == kind %} is-active{% endif %}"{% if value == kind %} aria-current="true"{% endif %}>{{ value }}</a>
        {% endfor %}
        <a href="?" class="bk-catalogue-languages__item{% if not kind %} is-active{% endif %}"{% if not kind %} aria-current="true"{% endif %}>All</a>
      </nav>
      {% endif %}
      {% if list_filters_template %}{% include list_filters_template %}{% endif %}
      {% include "catalogue/includes/country_picker.html" with country=country next=request.get_full_path %}
    </div>
  </header>

  {% if groups %}
  <div class="bk-catalogue-grid">
    {% for group in groups %}
      {% if group.entries|length > 1 %}
      <section class="bk-catalogue-group">
        <h2 class="bk-catalogue-group__title">{{ group.title }} <span class="bk-catalogue-group__count">{{ group.entries|length }} {{ words.plural }}</span></h2>
        <div class="bk-catalogue-grid bk-catalogue-grid--nested">
          {% for entry in group.entries %}{% include "catalogue/includes/product_card.html" with product=entry.product purchase=entry.purchase %}{% endfor %}
        </div>
      </section>
      {% else %}
        {% with entry=group.entries.0 %}{% include "catalogue/includes/product_card.html" with product=entry.product purchase=entry.purchase %}{% endwith %}
      {% endif %}
    {% endfor %}
  </div>
  {% else %}
  <p class="bk-catalogue__empty">Nothing found. {% if kind %}<a href="?">Show all {{ words.plural }}</a>{% endif %}</p>
  {% endif %}
</div>
{% endblock %}