{% extends 'core/base.html' %}
{% block title %}{{ title }} | Killian{% endblock %}
{% block scripts %}<script src="/static/js/user-form.js"></script>{% endblock %}
{% block content %}
<div class="page-head page-head-width-760">
    <div>
        <div class="breadcrumb"><a href="{% url 'user_list' %}">Users</a><span>/</span><span>{{ title }}</span></div>
        <h1>{{ title }}</h1>
        <p>Assign one Killian role, organization access, and optionally email a secure account-setup invitation.</p>
    </div>
</div>

<form method="post" class="form-card user-form-card">
    {% csrf_token %}
    {% if form.non_field_errors %}
        <div class="msg error">{{ form.non_field_errors }}</div>
    {% endif %}

    {% for field in form %}
        {% if field.name == 'organizations' %}
            <div class="form-field organization-assignment">
                <div class="organization-assignment-head">
                    <label>{{ field.label }}</label>
                    <div class="organization-assignment-actions" aria-label="Organization selection actions">
                        <button type="button" class="button secondary small-button" id="org-select-all">Select all</button>
                        <button type="button" class="button secondary small-button" id="org-clear-all">Clear all</button>
                    </div>
                </div>
                <div class="organization-checkbox-list">
                    {{ field }}
                </div>
                {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
                {% for error in field.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
            </div>
        {% else %}
            <div class="form-field">
                <label for="{{ field.id_for_label }}">{{ field.label }}</label>
                {{ field }}
                {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
                {% for error in field.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
            </div>
        {% endif %}
    {% endfor %}

    <div class="form-actions">
        <button type="submit">Save user</button>
        <a class="button secondary" href="{% url 'user_list' %}">Cancel</a>
    </div>
</form>


{% endblock %}