{% extends "base.html" %}
{% from "components/icons.html" import circle_alert_icon, circle_check_icon %}
{% from "components.html" import feedback %}
{% from "pages/datasets/import/_mapping_status.html" import mapping_status_text, mapping_missing_fields %}
{% block content %}
<header class='page-header'><div class='page-context'>{% include "pages/datasets/_breadcrumbs.html" %}<h1 class='page-title'>Import records</h1><p class='metadata'>{{ dataset.name }}</p></div></header>{% include 'pages/datasets/concepts/_banner.html' %}
<section class='import-wizard' aria-label='Record import wizard'>
  <nav aria-label='Import progress'><ol class='import-steps'>
    {% for item in steps %}<li class='{{ "is-active" if item.number == step and not success else "is-complete" if item.done else "is-remaining" }}' data-step='{{ item.number }}' data-step-status='{{ "completed" if success else "active" if item.number == step else "completed" if item.done else "remaining" }}'>
      {% if item.reachable and step in (2, 3) %}<button class="import-step-link" type="submit" form="import-step-form" name="go_step" value="{{ item.number }}">{% elif item.reachable %}<a href='{{ url_for("dataset_import_step", key=dataset.key, token=state.token, step=item.number) }}'>{% else %}<span{% if item.number == step %} aria-current='step'{% elif not item.done %} aria-disabled='true'{% endif %}>{% endif %}
      <span class='import-step-number' aria-hidden='true'>{{ "✓" if item.done and (item.number != step or success) else item.number }}</span><span><span class="visually-hidden">{{ item.number }}. </span>{{ item.label }}<small>{{ "Completed automatically" if item.number == 2 and automatic and not success else "Completed" if item.done and (item.number != step or success) else "Current step" if item.number == step else "Not available yet" }}</small></span>
      {% if item.reachable and step in (2, 3) %}</button>{% elif item.reachable %}</a>{% else %}</span>{% endif %}
    </li>{% endfor %}
  </ol></nav>
  <div class='import-content' role='region' aria-labelledby='import-step-title' tabindex='0'>
    {% if step == 3 %}<div class='mapping-heading'>
      <h2 id='import-step-title'>{{ steps[step - 1].label }}</h2>
      <button type='button' class='button button-secondary mapping-format-toggle' data-advanced-formats aria-expanded='false' form='import-step-form' hidden>Show all formats</button>
    </div>{% else %}<h2 id='import-step-title'>{{ steps[step - 1].label }}</h2>{% endif %}
    {{ feedback(error, id='import-error', focus=true) }}
    {% if success %}
      {% if mode == 'mapping_update' %}
      {{ feedback(state.imported_count ~ (' target record updated' if state.imported_count == 1 else ' target records updated'), kind='success') }}
      {% else %}{{ feedback(state.imported_count ~ ' records imported successfully', kind='success') }}{% endif %}
      <p>Your records are ready to view.</p>
    {% elif step == 1 %}{% include "pages/datasets/import/upload.html" %}
    {% elif step == 2 %}{% include "pages/datasets/import/worksheet.html" %}
    {% elif step == 3 %}{% include "pages/datasets/import/mapping.html" %}
    {% elif step == 4 %}{% include "pages/datasets/import/preview.html" %}
    {% endif %}
  </div>
  <footer class='import-actions'>
    <div class='import-actions-back'>{% if not success and step in (2, 3) %}<button class='button button-secondary' type='submit' form='import-step-form' name='go_step' value='{{ back_step }}'>Back</button>{% elif not success and step > 1 %}<a class='button button-secondary' href='{{ url_for("dataset_import_step", key=dataset.key, token=state.token, step=back_step) }}'>Back</a>{% endif %}
      {% if not success and state %}<form {{ non_login_form_attrs() }} method='post' action='{{ url_for("cancel_record_import", key=dataset.key, token=state.token) }}'><input type='hidden' name='csrf_token' value='{{ current_csrf }}'><button class='button button-link import-cancel' type='submit'>Cancel import</button></form>{% elif not success %}<a class='button button-link import-cancel' href='{{ url_for("dataset_records_view", key=dataset.key, concept=true) }}'>Cancel import</a>{% endif %}
    </div>
    <div class='import-actions-forward{% if step == 3 %} import-mapping-forward{% endif %}'>
      {% if success %}<a class='button button-secondary' href='{{ url_for("import_dataset_records", key=dataset.key) }}'>Import another file</a><a class='button button-primary' href='{{ url_for("dataset_records_view", key=dataset.key, concept=true) }}'>View records</a>
      {% else %}
        {% if step == 3 %}
          {% set mapped_keys = assistance.mapping|select|unique|list %}
          {% set missing_fields = fields|selectattr('key', 'in', required_keys)|rejectattr('key', 'in', mapped_keys)|list %}
          {% set missing_labels = missing_fields|map(attribute='name')|list %}
          {% set unselected_columns = assistance.completeness.unmapped_columns %}
          {% set not_in_file = fields|rejectattr('key', 'in', mapped_keys)|list|length if mode == 'new_version' else 0 %}
          {% set mapping_ready = not unselected_columns and not missing_labels %}
          <p class='mapping-status' data-mapping-status data-state='{{ "ready" if mapping_ready else "pending" }}' role='status' aria-live='polite' aria-atomic='true'>
            <span class='mapping-status-icons' aria-hidden='true'><span class='mapping-status-icon-pending'>{{ circle_alert_icon() }}</span><span class='mapping-status-icon-ready'>{{ circle_check_icon() }}</span></span>
            <span class='mapping-status-copy'><span class='mapping-status-line' data-mapping-status-text>{% if unselected_columns %}<button type='button' class='mapping-jump' data-mapping-jump>{{ unselected_columns }} {{ 'column' if unselected_columns == 1 else 'columns' }}</button> still {{ 'needs' if unselected_columns == 1 else 'need' }} a choice{% if missing_labels %} · {% endif %}{% endif %}{% if missing_labels %}{{ mapping_status_text(0, missing_labels, 0, 0) }} {{ mapping_missing_fields(missing_labels) }}{% endif %}{% if mapping_ready %}{{ mapping_status_text(0, [], assistance.completeness.ignored_columns, mapped_keys|length, not_in_file) }}{% endif %}</span></span>
          </p>
          <p class='mapping-reason help-text' data-mapping-reason{% if not missing_fields %} hidden{% endif %}>{{ mapping_reason_text }}</p>
        {% endif %}
        {% if step == 4 %}<form {{ non_login_form_attrs() }} id='import-step-form' data-import-confirm method='post' action='{{ url_for("confirm_record_import", key=dataset.key, token=state.token) }}'><input type='hidden' name='csrf_token' value='{{ current_csrf }}'>{% if mode in ('new_version', 'mapping_update') %}<input type='hidden' name='confirmation' value='{{ state.confirmation }}'>{% if preview.counts.Deleted %}<label class='deletion-acknowledgement'><input type='checkbox' name='acknowledge_deletions' value='yes' required aria-describedby='deletion-acknowledgement'><span id='deletion-acknowledgement'>I understand that {{ preview.counts.Deleted }} records will be marked as deleted.</span></label>{% endif %}{% endif %}{% if mode not in ('new_version', 'mapping_update') or preview.counts.Added or preview.counts.Changed or preview.counts.Deleted %}<button class='button button-primary' type='submit'{% if not preview.valid %} disabled{% endif %}>Import records</button>{% endif %}</form>
        {% else %}<button class='button button-primary' type='submit' form='import-step-form'{% if step == 3 %} data-mapping-continue{% endif %}>{{ 'Continue to preview' if step == 3 else 'Continue' }}</button>{% endif %}
      {% endif %}
    </div>
  </footer>
</section>
{% endblock %}