{% extends "admin/base_site.html" %}
{% load i18n static %}
{% load admin_urls pinmok_admin_tags pinmok_tags %}

{% block title %}{% if form.errors %}{% translate "Error:" %} {% endif %}{{ block.super }}{% endblock %}
{% block extrastyle %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static 'admin/css/unusable_password_field.css' %}">
{% endblock %}
{% block bodyclass %}{{ block.super }} {{ opts.app_label }}-{{ opts.model_name }} change-form{% endblock %}

{% if not is_popup %}
    {% block breadcrumbs %}
        <li class="breadcrumb-item">
            <a href="{% url opts|admin_urlname:'change' original.pk|admin_urlquote %}">{{ original|truncatewords:"18" }}</a>
        </li>
        <li class="breadcrumb-item active">
            {% if form.user.has_usable_password %}{% translate 'Change password' %}{% else %}{% translate 'Set password' %}{% endif %}
        </li>
    {% endblock %}
{% endif %}

{% block page_header %}
    <div class="row g-2 align-items-center">
        <div class="col">
            <!-- Page pre-title -->
            <div class="page-pretitle">{{ opts.model_name }}</div>
            <h2 class="page-title">{{ title }}</h2>
        </div>
    </div>
{% endblock %}

{% block content %}
    <div id="content-main">
        <form{% if form_url %} action="{{ form_url }}"{% endif %} method="post" id="{{ opts.model_name }}_form">
            {% csrf_token %}{% block form_top %}{% endblock %}
            <input type="text" name="username" value="{{ original.get_username }}" class="hidden">
            <div class="card">
                {% if is_popup %}<input type="hidden" name="{{ is_popup_var }}" value="1">{% endif %}
                <div class="card-header">
                    <div>
                        <h3 class="card-title">
                            {% blocktranslate trimmed with username=original %}
                                Enter a new password for the user <strong>{{ username }}</strong>.
                            {% endblocktranslate %}
                        </h3>
                        <div class="card-subtitle">
                            {% blocktranslate trimmed %}
                                This action will <strong>enable</strong> password-based authentication for this user.
                            {% endblocktranslate %}
                        </div>
                        {% if not form.user.has_usable_password %}
                        {% endif %}
                    </div>
                </div>

                <div class="module aligned card-body">
                    {% if form.errors %}
                        <div class="alert alert-danger">
                            <div class="alert-icon">{% icon 'tabler-alert-circle' 'icon alert-icon' %}</div>
                            {% blocktranslate trimmed count counter=form.errors.items|length %}
                                Please correct the error below.{% plural %}Please correct the errors below.
                            {% endblocktranslate %}
                        </div>
                    {% endif %}
                    <div class="form-row">
                        {% alert form.usable_password.errors %}
                        <fieldset class="form-fieldset">
                            {{ form.usable_password.legend_tag|add_class:'form-label' }} {{ form.usable_password }}
                            {% if form.usable_password.help_text %}
                                <small class="form-hint"{% if form.usable_password.id_for_label %}
                                       id="{{ form.usable_password.id_for_label }}_helptext"{% endif %}>
                                    {{ form.usable_password.help_text|safe }}
                                </small>
                            {% endif %}
                        </fieldset>
                    </div>

                    <div class="form-row field-password1">
                        {{ form.password1.label_tag|add_class:'form-label' }}

                        {% if form.password1.errors %}
                            {{ form.password1|add_class:'is-invalid' }}
                            <div class="invalid-feedback">{{ form.password1.errors }}</div>
                        {% else %}
                            {{ form.password1 }}
                        {% endif %}

                        {% if form.password1.help_text %}
                            <small class="form-hint"{% if form.password1.id_for_label %}
                                   id="{{ form.password1.id_for_label }}_helptext"{% endif %}>
                                {{ form.password1.help_text|safe }}
                            </small>
                        {% endif %}
                    </div>

                    <div class="form-row field-password2">
                        {{ form.password2.label_tag|add_class:'form-label' }}

                        {% if form.password2.errors %}
                            {{ form.password2|add_class:'is-invalid' }}
                            <div class="invalid-feedback">{{ form.password2.errors }}</div>
                        {% else %}
                            {{ form.password2 }}
                        {% endif %}

                        {% if form.password2.help_text %}
                            <small class="form-hint"{% if form.password2.id_for_label %}
                                   id="{{ form.password2.id_for_label }}_helptext"{% endif %}>
                                {{ form.password2.help_text|safe }}
                            </small>
                        {% endif %}
                    </div>

                </div>

                <div class="submit-row card-footer">
                    {% if form.user.has_usable_password %}
                        <input type="submit" name="set-password" value="{% translate 'Change password' %}"
                               class="set-password btn btn-primary">
                        <input type="submit" name="unset-password" value="{% translate 'Disable password-based authentication' %}"
                               class="unset-password btn btn-warning">
                    {% else %}
                        <input type="submit" name="set-password" value="{% translate 'Enable password-based authentication' %}"
                               class="set-password btn btn-primary">
                    {% endif %}
                </div>

            </div>
        </form>
    </div>
{% endblock %}