{% from "components/message-count-label.html" import message_count_label %}
{% from "components/textbox.html" import textbox %}

{% extends "withnav_template.html" %}

{% block service_page_title %}
  Templates
{% endblock %}

{% block maincolumn_content %}

  {% if not templates %}

    <h1 class="heading-large">Templates</h1>

    {% if current_user.has_permissions(permissions=['manage_templates'], any_=True) %}
       <p class="bottom-gutter">
         You need a template before you can send
         {% if current_service.can_send_letters %}
           emails, text messages or letters
         {%- else -%}
           emails or text messages
         {%- endif %}.
       </p>
      <a href="{{ url_for('.add_template_by_type', service_id=current_service.id) }}" class="button">Add a new template</a>
    {% else %}
      <p>
        You need to ask your service manager to add templates before you can send
        {% if current_service.can_send_letters %}
          emails, text messages or letters
        {%- else -%}
          emails or text messages
        {%- endif %}.
      </p>
    {% endif %}

  {% else %}

    <div class="grid-row bottom-gutter-1-2">
      <div class="column-two-thirds">
        <h1 class="heading-large">Templates</h1>
      </div>
      {% if current_user.has_permissions(permissions=['manage_templates'], admin_override=True) %}
        <div class="column-one-third">
          <a href="{{ url_for('.add_template_by_type', service_id=current_service.id) }}" class="button align-with-heading">Add new template</a>
        </div>
      {% endif %}
    </div>

    {% if templates|length > 7 %}
      <div data-module="autofocus">
        <div class="live-search" data-module="live-search" data-targets="#template-list .column-whole">
          {{ textbox(
            search_form.search,
            width='1-1'
          ) }}
        </div>
      </div>
    {% endif %}

    <nav class="grid-row" id=template-list>
      {% for template in templates %}
        <div class="column-whole">
          <h2 class="message-name">
            <a href="{{ url_for('.view_template', service_id=current_service.id, template_id=template.id) }}">{{ template.name }}</a>
          </h2>
          <p class="hint bottom-gutter-1-3">
            {{ message_count_label(1, template.template_type, suffix='')|capitalize }} template
          </p>
        </div>
      {% endfor %}
    </nav>
  {% endif %}

{% endblock %}
