{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading, spark_bar_field %}

<div class="ajax-block-container">
  {% if template_statistics|length > 1 %}
    <div class='template-statistics-table'>
      {% call(item, row_number) list_table(
        template_statistics,
        caption="Messages sent by template",
        caption_visible=True,
        empty_message='',
        field_headings=[
          'Template',
          'Messages sent'
        ],
        field_headings_visible=False
      ) %}

        {% call row_heading() %}
          <a class="usa-link template-statistics-table-template-name" href="{{ url_for('.view_template', service_id=current_service.id, template_id=item.template_id) }}">{{ item.template_name }}</a>
          <span class="template-statistics-table-hint">
            {{ 1|message_count_label(item.template_type, suffix='template')|capitalize }}
          </span>
        {% endcall %}

        {{ spark_bar_field(item.count, most_used_template_count, id=item.template_id) }}
      {% endcall %}
      <a
        href="{{ url_for('.template_usage', service_id=current_service.id) }}"
        class="usa-link show-more-no-border"
      ><span>See templates used by month</span></a>
    </div>
  {% endif %}
</div>