{% extends "config/base.html" %}
{% import "site_shell/_macros.html" as ui %}

{% block title %}Change password - Pychestrate{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Change password</h1>
    <p>Change the password you sign in with. Your other sessions will be signed out.</p>
</div>

{{ ui.error_summary(errors, error_labels) }}
{% if problems %}
<div class="alert alert-error" role="alert">{{ problems | join(" ") }}</div>
{% endif %}

<div class="card narrow">
    <form method="post">
        <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
        <input type="text" name="username" value="{{ login_name }}" autocomplete="username" hidden>
        <div class="form-group">
            <label for="current_password">Current password *</label>
            <input type="password" id="current_password" name="current_password" class="form-control" required
                   autocomplete="current-password"{{ ui.invalid_attrs(errors, "current_password") }}>
            {{ ui.field_error(errors, "current_password") }}
        </div>
        <div class="form-group">
            <label for="password">New password *</label>
            <input type="password" id="password" name="password" class="form-control" required
                   minlength="{{ password_min_length }}" maxlength="{{ password_max_length }}"
                   pattern="{{ password_pattern }}" title="{{ password_title }}"
                   autocomplete="new-password"{{ ui.invalid_attrs(errors, "password", "password-rules") }}>
            {{ ui.field_error(errors, "password") }}
            {% with password_input_id="password" %}
                {% include "config/_password_rules.html" %}
            {% endwith %}
        </div>
        <div class="form-group">
            <label for="password_confirm">Confirm new password *</label>
            <input type="password" id="password_confirm" name="password_confirm" class="form-control" required
                   minlength="{{ password_min_length }}" maxlength="{{ password_max_length }}" autocomplete="new-password"{{ ui.invalid_attrs(errors, "password_confirm") }}>
            {{ ui.field_error(errors, "password_confirm") }}
        </div>
        <div class="actions-row">
            <button type="submit" class="btn btn-primary">{{ ui.icon("save") }} Change password</button>
            <a href="{{ url_for('config.account_preferences') }}" class="btn btn-secondary">Back to preferences</a>
        </div>
    </form>
</div>
{% endblock %}