{% extends "withnav_template.html" %}
{% from "components/banner.html" import banner_wrapper %}
{% from "components/radios.html" import radio_select %}
{% from "components/table.html" import list_table, field, text_field, index_field, hidden_field_heading %}
{% from "components/page-header.html" import page_header %}
{% from "components/message-count-label.html" import message_count_label %}
{% from "components/button/macro.njk" import govukButton %}

{% set file_contents_header_id = 'file-preview' %}
{% macro skip_to_file_contents() %}
  <p class="govuk-visually-hidden">
    <a class="govuk-link govuk-link--no-visited-state" href="#{{ file_contents_header_id }}">Skip to file contents</a>
  </p>
{% endmacro %}

{% block service_page_title %}
  {{ "Preview of {}".format(template.name) }}
{% endblock %}

{% block maincolumn_content %}

  {{ page_header(
    'Preview of {}'.format(template.name),
    back_link=back_link
  ) }}

  {% if letter_too_long %}
    {% call banner_wrapper(type='dangerous') %}
        {% include "partials/check/letter-too-long.html" %}
    {% endcall %}
  {% endif %}

  {{ skip_to_file_contents() }}

  {{ template|string }}
  <div class="bottom-gutter-3-2">
    <form method="post" enctype="multipart/form-data" action="{{url_for('main.start_job', service_id=current_service.id, upload_id=upload_id, original_file_name=original_file_name)}}" class='page-footer'>
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
      <input type="hidden" name="help" value="{{ '3' if help else 0 }}" />
      <input type="hidden" name="contact_list_id" value="{{ request.args.get('contact_list_id', '') }}" />
      {% if choose_time_form and template.template_type != 'letter' %}
        {{ radio_select(
          choose_time_form.scheduled_for,
          wrapping_class='bottom-gutter-2-3'
        ) }}
      {% endif %}
      {% if (template.template_type != 'letter' or not request.args.from_test) and not letter_too_long %}
        {% set button_text %}
          Send {{ count_of_recipients|format_thousands }} {{ message_count_label(count_of_recipients, template.template_type, suffix='') }}
        {% endset %}
        {{ govukButton({ "text": button_text }) }}
      {% else %}
        {{ govukButton({
          "element": "a",
          "text": "Download as a PDF",
          "href": url_for('no_cookie.check_messages_preview', service_id=current_service.id, template_id=template.id, upload_id=upload_id, filetype='pdf'),
        }) }}
      {% endif %}
    </form>
  </div>

  {% if not request.args.from_test %}

    <h2 class="heading-medium" id="{{ file_contents_header_id }}">{{ original_file_name }}</h2>

    <div class="fullscreen-content" data-module="fullscreen-table">
      {% call(item, row_number) list_table(
        recipients.displayed_rows,
        caption=original_file_name,
        caption_visible=False,
        field_headings=[
          '<span class="govuk-visually-hidden">Row in file</span><span aria-hidden="true">1</span>'|safe
        ] + recipients.column_headers
      ) %}
        {% call index_field() %}
          <span>
            {% if (item.index + 2) == preview_row %}
              {{ item.index + 2 }}
            {% else %}
              <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.check_messages', service_id=current_service.id, template_id=template.id, upload_id=upload_id, row_index=(item.index + 2), original_file_name=original_file_name) }}">{{ item.index + 2 }}</a>
            {% endif %}
          </span>
        {% endcall %}
        {% for column in recipients.column_headers %}
          {% if item[column].ignore %}
            {{ text_field(item[column].data or '', status='default') }}
          {% else %}
            {{ text_field(item[column].data or '') }}
          {% endif %}
        {% endfor %}
        {% if item[None].data %}
          {% for column in item[None].data %}
            {{ text_field(column, status='default') }}
          {% endfor %}
        {% endif %}
      {% endcall %}
    </div>

  {% endif %}

  {% if count_of_displayed_recipients < count_of_recipients %}
    <p class="table-show-more-link">
      Only showing the first {{ count_of_displayed_recipients }} rows
    </p>
  {% endif %}

{% endblock %}