{% extends "full_layout.html" %}
{% import "macros/fields.html" as fields %}

{% block title %}Users{% endblock %}

{% block subnav_header %}
  Import
{% endblock %}

{% block subnav_items %}
{% endblock %}


{% block content %}
    <section>
    <div class="ui segment no-padding transparent">
      <div class="ui grid middle aligned details-header-grid">
        <div class="ui six wide column">
          <div class="details-header-with-extra">
            <h3>
              Import users from Auth0
            </h3>
          </div>
        </div>
        <div class="ui six wide column right aligned">
        </div>
      </div>
    </div>

    <form method="POST" id="import-settings-form">
      {{ form.csrf_token }}

      <div class="ui segment details">
        <div class="ui grid">
          <div class="row">
            {{ fields.form_field(form.product, True, "ui dropdown") }}
          </div>
          <div class="row">
            {{ fields.form_field(form.user_ids, True, tooltip="Use coma as delimiter for ids") }}
          </div>
          <div class="row">
            {{ fields.form_field(form.batch_from) }}
          </div>
          <div class="row">
            {{ fields.form_field(form.batch_to) }}
          </div>
          <div class="row">
            <div class="two wide column" data-element-name="import_all">
              <label class="editable">{{ form.import_all.label }}</label>
            </div>
            <div class="ten wide column" data-element-name="import_all">
              <div class="ui toggle checkbox is-active">
                <input type="checkbox" name="import_all">
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="ui grid">
        <div class="twelve wide column right aligned">
          <button class="ui pink tiny button" type="submit">Execute</button>
        </div>
      </div>
    </form>
  </section>
{% endblock %}