{% from "govuk/components/input/macro.njk" import govukInput %}
{% from "govuk/components/textarea/macro.njk" import govukTextarea %}
{% from "govuk/components/checkboxes/macro.njk" import govukCheckboxes %}
{% from "govuk/components/button/macro.njk" import govukButton %}
{% from "govuk/components/error-summary/macro.njk" import govukErrorSummary %}
{% from "govuk/components/warning-text/macro.njk" import govukWarningText %}

{% macro dprDownloadFeedbackForm(user, report, csrfToken) %}
  {% set name = user.displayName %}
  {% set staffId = user.staffId %}
  {% set activeCaseLoadId = user.activeCaseLoadId %}
  {% set email = user.email %}
  {% set reportId = report.reportId %}
  {% set variantId = report.variantId %}
  {% set time = report.time %}
  {% set tableId = report.tableId %}
  {% set loadType = report.loadType %}
  {% set reportName = report.reportName %}
  {% set variantName = report.variantName %}
  {% set reportUrl = report.reportUrl %}
  {% set reportSearch = report.reportSearch %}
  {% set csrfToken = csrfToken %}

  <div class="dpr-download-feedback-form-wrapper" data-dpr-module="download-feedback-form">

    <form action="/dpr/submitFeedback/" method="post" id="download-feedback-form" class="download-feedback-form--hidden">

      <p>To enable downloads for this report (<strong>{{ reportName}} - {{ variantName }}</strong>), take a few moments to fill out this request form.</p><p>Once you have submitted the form you the download button will be enabled immediately.</p>

      <h3>Help us improve our service</h3>
      <p>We would like to understand more about your reasons for downloading this report. The more detail you provide, the better we can understand how to improve our service and offer features that meet your needs.</p>
      <div id="download-feedback-form-summary" class="query-error-summary query-error-summary--hidden">
        {{ govukErrorSummary({
          titleText: "There is a problem",
          errorList: []
        }) }}
      </div>
      <input type="hidden" name="_csrf" value="{{ csrfToken }}">
      <input type="hidden" name="reportId" value="{{ reportId }}">
      <input type="hidden" name="reportName" value="{{ reportName }}">
      <input type="hidden" name="variantId" value="{{ variantId }}">
      <input type="hidden" name="loadType" value="{{ loadType }}">
      {% if tableId %}
        <input type="hidden" name="tableId" value="{{ tableId }}">
      {% endif %}
      <input type="hidden" name="variantName" value="{{ variantName }}">
      <input type="hidden" name="time" value="{{ time }}">
      <input type="hidden" name="staffId" value="{{ staffId }}">
      <input type="hidden" name="activeCaseLoadId" value="{{ activeCaseLoadId }}">
      <input type="hidden" name="reportUrl" value="{{ reportUrl }}">
      {% if reportSearch %}
        <input type="hidden" name="reportSearch" value="{{ reportSearch }}">
      {% endif %}

      <h2 class="govuk-fieldset__legend govuk-fieldset__legend--l">About you</h2>
      {# Name Input #}
      {{ govukInput({
        id: 'name',
        name: 'Full name',
        value: name,
        label: {
          text: 'What is your Full name?'
        },
        classes: "govuk-!-width-one-third",
        errorMessage: {
          text: "Enter your Full name"
        },
        attributes: {
          required: true
        }
      }) }}

      {# Email Input #}
      {{ govukInput({
        id: 'email',
        name: 'email',
        value: email,
        label: {
          text: 'What is your Email address?'
        },
        classes: "govuk-!-width-one-third",
        errorMessage: {
          text: "Enter your Email address"
        },
        attributes: {
          required: true
        }
      }) }}

      {# Role Input #}
      {{ govukInput({
        id: 'role',
        name: 'role',
        value: '',
        label: {
          text: 'What is your Job title?'
        },
        classes: "govuk-!-width-one-third",
        errorMessage: {
          text: "Enter your Job title"
        },
        attributes: {
          required: true
        }
      }) }}

      {{ govukCheckboxes({
        name: "reasons",
        fieldset: {
          legend: {
            text: "How will you use the downloaded report?",
            isPageHeading: false,
            classes: "govuk-fieldset__legend--l"
          }
        },
        hint: {
          text: "Select all that apply to you."
        },
        items: [
          {
            value: "apply-specific-filters",
            text: "To apply specific filters."
          },
          {
            value: "join-tables",
            text: "Join different tables."
          },
          {
            value: "combine-info",
            text: "Combine demographic information (e.g. age, ethnicity) with other reports."
          },
          {
            value: "produce-visualisations",
            text: "Produce visualisations such as graphs or pie charts."
          },
          {
            value: "other",
            text: "Other"
          }
        ]
      }) }}

      {{ govukTextarea({
        name: "moreDetail",
        id: "more-detail",
        rows: "8",
        classes: "govuk-!-width-three-quarters",
        label: {
          text: "Can you provide more detail",
          classes: "govuk-label--l",
          isPageHeading: true
        },
        hint: {
          text: "In your own words describe how you will use this data once it's downloaded."
        },
        errorMessage: {
          text: "provide information on how you will use this data"
        },
        attributes: {
          required: true
        }
      }) }}

      {{ govukButton({
        text: "Submit request",
        classes: "govuk-button--primary govuk-!-margin-bottom-0",
        attributes: {
          id: 'download-feedback-form-submit',
          'data-submit-feedback': 'true'
        }
      }) }}
    
    </form>
  </div>
{% endmacro %}