{% extends "deliver_grant_funding/grant_base.html" %}
{% from "govuk_frontend_jinja/components/back-link/macro.html" import govukBackLink %}
{% from "govuk_frontend_jinja/components/summary-list/macro.html" import govukSummaryList %}
{% from "govuk_frontend_jinja/components/notification-banner/macro.html" import govukNotificationBanner %}
{% from "deliver_grant_funding/macros/render_calculated_form_fields.html" import render_calculated_validation_custom_expression_field, render_calculated_validation_custom_message_field with context %}

{% set type_constants = group.form.collection.type.constants %}
{% set active_item_identifier = type_constants.active_nav %}
{% if expression %}
  {% set heading = "Edit a group validation" %}
  {% set submit_label = "Save group validation" %}
{% else %}
  {% set heading = "Create a group validation" %}
  {% set submit_label = "Add group validation" %}
{% endif %}
{% set back_link_href = url_for("deliver_grant_funding.list_group_questions", grant_id=grant.id, group_id=group.id) %}

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

{% block beforeContent %}
  {{ govukBackLink({ "text": "Back", "href": back_link_href }) }}
{% 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 group validation?</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 validation", "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_group_validation', grant_id=grant.id, group_id=group.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>

      {{
        govukSummaryList({
          "rows": [
            {"key": {"text": "Section"}, "value": {"text": group.form.title} },
            {"key": {"text": "Question group"}, "value": {"text": group.name} },
          ],
          "classes": "app-!-border-top-line"
        })
      }}
      <form method="post" novalidate>
        {{ form.csrf_token }}
        {% set customExpressionHint %}
          <p class="govuk-body">Use number question references, calculation symbols and numbers to describe what the answer needs to be. You must include at least one question from this group.</p>

          <p class="govuk-body govuk-!-margin-bottom-0">For example, if the actual spend and forecast spend from this question group should equal the grant allocation, the calculation would be:</p>

          <div class="govuk-inset-text govuk-!-margin-top-0">
            <span class="app-context-aware-editor--valid-reference">((actual spend))</span> + <span class="app-context-aware-editor--valid-reference">((forecast spend))</span> ==
            <span class="app-context-aware-editor--valid-reference">((grant allocation))</span>
          </div>
        {% endset %}
        {% set customMessageHint %}
          <p class="govuk-body">For example, "The actual spend plus forecast spend must be the same as the grant allocation"</p>
        {% endset %}
        {{ render_calculated_validation_custom_expression_field(form,customExpressionHint) }}
        {{ render_calculated_validation_custom_message_field(form,customMessageHint) }}
        {{ form.submit(params={"text": submit_label, "classes": "govuk-!-margin-top-6"}) }}
      </form>
    </div>
  </div>
  {% if expression %}
    <div class="govuk-grid-row govuk-!-margin-top-7">
      <div class="govuk-grid-column-two-thirds">
        <h2 class="govuk-heading-m">Manage validation</h2>
        <p class="govuk-body">
          <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('deliver_grant_funding.edit_group_validation', grant_id=grant.id, group_id=group.id, expression_id=expression.id, delete='') }}">Delete validation</a>
        </p>
      </div>
    </div>
  {% endif %}
{% endblock content %}