{% from "components/pill.html" import pill %}

<div class="ajax-block-container">
  {% if notifications_deleted %}
    <div class="grid-row ">
      {% for label, query_param, url, count in counts %}
        {% if query_param == 'pending' %}
          <div class="grid-col-3">
            {% if link %}
              <a class="usa-link display-flex" href="{{ link }}">
            {% endif %}
              <span class="big-number-smaller">
                <span class="big-number-number">
                  {% if count is number %}
                    {% if currency %}
                      {{ "{}{:,.2f}".format(currency, count) }}
                    {% else %}
                      {{ "{:,}".format(count) }}
                    {% endif %}
                  {% else %}
                    {{ count }}
                  {% endif %}
                </span>
                {% if label %}
                  <span class="big-number-label">{{ query_param }}</span>
                {% endif %}
              </span>
            {% if link %}
              </a>
            {% endif %}
          </div>
        {% else %}
          <div class="grid-col-3">
            {% if link %}
              <a class="usa-link display-flex" href="{{ link }}">
            {% endif %}
                <span class="big-number-smaller">
                  <span class="big-number-number">
                    {% if count is number %}
                      {% if currency %}
                        {{ "{}{:,.2f}".format(currency, count) }}
                      {% else %}
                        {{ "{:,}".format(count) }}
                      {% endif %}
                    {% else %}
                      {{ count }}
                    {% endif %}
                  </span>
                  {% if label %}
                    <span class="big-number-label">{{ label }}</span>
                  {% endif %}
                </span>
            {% if link %}
              </a>
            {% endif %}
        {% endif %}
      {% endfor %}
    </div>
  {% else %}
    <div class="tabs">
      {{ pill(counts, request.args.get('status', '')) }}
    </div>
  {% endif %}
</div>