{% extends "deliver_grant_funding/grant_base.html" %}
{% from "govuk_frontend_jinja/components/back-link/macro.html" import govukBackLink %}
{% from "govuk_frontend_jinja/components/notification-banner/macro.html" import govukNotificationBanner %}
{% from "deliver_grant_funding/collections/_render_managed_expression_form.html" import render_managed_expression_form %}

{% set type_constants = component.form.collection.type.constants %}
{% set active_item_identifier = type_constants.active_nav %}

{% set is_editing = expression %}
{% set heading = "Edit condition" if is_editing else "Add a condition" %}
{% set submit_label = "Save condition" if is_editing else "Add condition" %}

{% set back_to_select_question_for_condition = url_for("deliver_grant_funding.add_question_condition_select_question", grant_id=grant.id, component_id=component.id) %}
{% set back_to_edit = url_for("deliver_grant_funding.edit_question", grant_id=grant.id, question_id=component.id) if not component.is_group else url_for("deliver_grant_funding.list_group_questions", grant_id=grant.id, group_id=component.id) %}
{% set back_link = back_to_edit if is_editing else back_to_select_question_for_condition %}

{% set page_title = heading ~ " - " ~ component.name %}

{% block beforeContent %}
  {# todo: pressing back here should remember which question you had selected in case you want to just move one up or down in the list #}
  {#       that would also line up with how the browsers "back" button would work (remembering form options) #}
  {{ govukBackLink({ "text": "Back", "href": back_link }) }}
{% endblock beforeContent %}

{% block content %}
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-two-thirds">
      {% if confirm_deletion_form %}
        {% set banner_html %}
          <p class="govuk-body govuk-!-font-weight-bold">Are you sure you want to delete this condition?</p>
          <form method="post" novalidate>
            {{ confirm_deletion_form.csrf_token }}
            <span class="govuk-button-group">
              {{ confirm_deletion_form.confirm_deletion(params={"text": "Yes, delete this condition", "classes": "govuk-button--warning govuk-!-margin-bottom-0"}) }}
              <a class="govuk-link govuk-link--no-visited-state govuk-!-margin-bottom-0" href="{{ url_for('deliver_grant_funding.edit_question_condition', grant_id=grant.id, expression_id=expression.id) }}">Cancel</a>
            </span>
          </form>
        {% endset %}

        {{ govukNotificationBanner(params={"role": "alert", "titleText": "Warning", "classes": "", "html": banner_html}) }}
      {% endif %}

      <h1 class="govuk-heading-l">{{ heading }}</h1>

      {% include "deliver_grant_funding/collections/_add_question_condition_context.html" %}

      {% if form is not none %}
        {% set label_html %}
          What does the value <span class="govuk-visually-hidden">to {{ interpolate(subject_reference.question.text if subject_reference.question else subject_reference.label) }}</span> need to be?
        {% endset %}
        {{ render_managed_expression_form(form, label_html=label_html, submit_label=submit_label) }}
      {% else %}
        <p class="govuk-body">This question cannot be used a condition.</p>
      {% endif %}

      {% if expression %}
        <div class="govuk-grid-row govuk-!-margin-top-7">
          <div class="govuk-grid-column-two-thirds">
            <h2 class="govuk-heading-m">Manage condition</h2>
            <p class="govuk-body">
              <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('deliver_grant_funding.edit_question_condition', grant_id=grant.id, expression_id=expression.id, delete='') }}">Delete condition</a>
            </p>
          </div>
        </div>
      {% endif %}
    </div>
  </div>
{% endblock content %}