{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading, notification_status_field %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/form.html" import form_wrapper %}

<section class="ajax-block-container" aria-labelledby="pill-selected-item">
  {% if job.scheduled %}

    <p class="govuk-body">
      Sending
      <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.view_template_version', service_id=current_service.id, template_id=job.template.id, version=job.template_version) }}">{{ job.template.name }}</a>
      {{ job.scheduled_for|format_datetime_relative }}
    </p>
    <div class="page-footer">
      {% call form_wrapper() %}
        {{ page_footer(
          button_text="Cancel sending",
          destructive=True
        ) }}
      {% endcall %}
    </div>

  {% else %}

    {% if notifications %}
      <div class="dashboard-table bottom-gutter-3-2">
    {% endif %}

      {% if job.template_type == 'letter' %}
        <div class="keyline-block bottom-gutter-1-2">
      {% endif %}
        {% if job.still_processing %}
          <p class="{% if job.template_type != 'letter' %}bottom-gutter{% endif %} hint">
            Report is {{ "{:.0f}%".format(job.percentage_complete * 0.99) }} complete…
          </p>
        {% elif notifications %}
          <p class="{% if job.template_type != 'letter' %}bottom-gutter{% endif %}">
            <a href="{{ download_link }}" download class="govuk-link govuk-link--no-visited-state heading-small">Download this report</a>
            &emsp;
            <span id="time-left">{{ time_left }}</span>
          </p>
        {% endif %}
      {% if job.template_type == 'letter' %}
        </div>
      {% endif %}

      {% call(item, row_number) list_table(
        notifications,
        caption=uploaded_file_name,
        caption_visible=False,
        empty_message='No messages to show yet…' if job.awaiting_processing_or_recently_processed else 'These messages have been deleted because they were sent more than {} days ago'.format(service_data_retention_days),
        field_headings=[
          'Recipient',
          'Status'
        ],
        field_headings_visible=False
      ) %}
        {% call row_heading() %}
          <a class="govuk-link govuk-link--no-visited-state file-list-filename" href="{{ url_for('.view_notification', service_id=current_service.id, notification_id=item.id, from_job=job.id) }}">{{ item.to }}</a>
          <p class="file-list-hint">
            {{ item.preview_of_content }}
          </p>
        {% endcall %}
        {{ notification_status_field(item) }}
      {% endcall %}

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

    {% if notifications %}
      </div>
    {% endif %}

  {% endif %}
</section>