{% extends "withnav_template.html" %}
{% from "components/ajax-block.html" import ajax_block %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/form.html" import form_wrapper %}
{% from "components/components/button/macro.njk" import usaButton %}

{% set page_title = (
  (99|message_count_label(message_type, suffix='')) | capitalize
  if current_user.has_permissions('view_activity')
  else 'Sent messages'
) %}

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

{% block maincolumn_content %}

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


  <p class="notification-status {{ field_status }}">
    Messages will remain in pending state until carrier status is received, typically 5 minutes.
  </p>

  {% call form_wrapper(
    action=url_for('.view_notifications', service_id=current_service.id, message_type=message_type),
    class="usa-search margin-bottom-2"
  ) %}
      <div class="grid-col-4 {% if message_type == 'sms' %}extra-tracking{% endif %}">
        {{ search_form.to(param_extensions={
        "label": {
        "text": things_you_can_search_by|formatted_list(
        conjunction='or',
        before_each='',
        after_each='',
        prefix='Search by',
        prefix_plural='Search by'
        )
        }
        }) }}
      </div>
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <button class="usa-button" type="submit">
      <span class="usa-search__submit-text">Search </span><img src="/assets/img/usa-icons-bg/search--white.svg"
        class="usa-search__submit-icon" alt="Search" />
    </button>
  {% endcall %}





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

  {% if current_user.has_permissions('view_activity') %}
    <p class="font-body-sm">
      <a href="{{ download_link_seven_day }}" download="download" class="usa-link">Download all data last 7 days (<abbr title="Comma separated values">CSV</abbr>)</a>
      &emsp;
      Data available for {{ partials.service_data_retention_days }} days
    </p>
    <p class="font-body-sm">
      <a href="{{ download_link_five_day }}" download="download" class="usa-link">Download all data last 5 days (<abbr title="Comma separated values">CSV</abbr>)</a>
      &emsp;
    </p>
    <p class="font-body-sm">
      <a href="{{ download_link_three_day }}" download="download" class="usa-link">Download all data last 3 days (<abbr title="Comma separated values">CSV</abbr>)</a>
      &emsp;
    </p>
    <p class="font-body-sm">
      <a href="{{ download_link_today }}" download="download" class="usa-link">Download all data today (<abbr title="Comma separated values">CSV</abbr>)</a>
      &emsp;
    </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 %}