{% extends "withnav_template.html" %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/textbox.html" import textbox %}
{% from "components/form.html" import form_wrapper %}
{% from "components/components/back-link/macro.njk" import usaBackLink %}

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

{% block backLink %}
  {{ usaBackLink(back_link) }}
{% endblock %}


{% block skipLink %}
  {% set skipLink = usaSkipLink({
    "href": '#main-content',
    "text": 'Skip to main content'
  }) %}
  {% if errors %}
    <div>{{ skipLink }}</div>
  {% else %}
    {{ skipLink }}
  {% endif %}
{% endblock %}

{% block maincolumn_content %}

  {{ page_header(page_title) }}

  {{ template|string }}

  {% call form_wrapper(
    class='js-stick-at-top-when-scrolling send-one-off-form' if template.template_type != 'sms' else 'send-one-off-form',
    module="autofocus",
    data_kwargs={'force-focus': True},
    data_force_focus=True
  ) %}
    <div class="grid-row">
      {% set is_phone_number = form.placeholder_value.label.text == "phone number" %}
      {% set label_text = " phone number" if current_placeholder == "phone number" else current_placeholder %}
      {% set extra_class = "extra-tracking" if is_phone_number else "" %}

      <div class="grid-col-12 {{ extra_class }}">
        {{ textbox(
          form.placeholder_value,
          label=label_text,
          hint=hint_text,
          extra_form_group_classes=extra_class,
          param_extensions={"id": "phone-number", "classes": ""}
        ) }}
      </div>
      {% if skip_link or link_to_upload %}
        <div class="grid-col-12 margin-top-1">
          {% if link_to_upload %}
            <a class="usa-link margin-right-2" href="{{ url_for('.send_messages', service_id=current_service.id, template_id=template.id) }}">Upload a list of {{ 999|recipient_count_label(template.template_type) }}</a>
          {% endif %}
          {% if skip_link %}
            <a href="{{ skip_link[1] }}" class="usa-link">{{ skip_link[0] }}</a>
          {% endif %}
        </div>
      {% endif %}
    </div>
    {% if link_to_upload %}
      <p>

      </p>
    {% endif %}
    {{ page_footer('Continue') }}
  {% endcall %}



{% endblock %}