{% extends "withnav_template.html" %}
{% from "components/ajax-block.html" import ajax_block %}
{% from "components/message-count-label.html" import message_count_label, recipient_count_label %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/textbox.html" import textbox %}
{% from "components/form.html" import form_wrapper %}

{% set title_status = (
  'Failed '
  if status == 'failed' and message_type == 'letter'
  else ''
) %}
{% set page_title = (
  (title_status + message_count_label(99, message_type, suffix='')) | capitalize
  if current_user.has_permissions('view_activity')
  else 'Sent messages'
) %}

{% block service_page_title %}
  {{ page_title }}
{% endblock %}

{% block maincolumn_content %}

  <h1 class="heading-large">
    {{ page_title }}
  </h1>
  {% if not message_type == "letter" %}

    {{ ajax_block(
      partials,
      url_for('.get_notifications_as_json', service_id=current_service.id, message_type=message_type, status=status),
      'counts'
    ) }}

    {% call form_wrapper(
      action=url_for('.view_notifications', service_id=current_service.id, message_type=message_type),
      class="grid-row"
    ) %}
      <div class="column-three-quarters {% if message_type == 'sms' %}extra-tracking{% endif %}">
        {{ textbox(
          search_form.to,
          width='1-1',
        ) }}
      </div>
      <div class="column-one-quarter align-button-with-textbox">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <button type="submit" class="button">Search</button>
      </div>
    {% endcall %}

    {% call form_wrapper(id="search-form") %}
      <input type="hidden" name="to" value="{{ search_form.to.data }}">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    {% endcall %}
  {% else %}
    {% call form_wrapper(id="search-form") %}
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
    {% endcall %}
  {% endif %}

  {% if current_user.has_permissions('view_activity') %}
    <p class="bottom-gutter">
      <a href="{{ download_link }}" download="download" class="heading-small">Download this report</a>
      &emsp;
      Data available for {{ partials.service_data_retention_days }} days
    </p>
  {% endif %}

  {{ ajax_block(
    partials,
    url_for('.get_notifications_as_json', service_id=current_service.id, message_type=message_type, status=status, page=page),
    'notifications',
    form='search-form'
  ) }}

{% endblock %}