{% extends shell('app') %}

{% block title %}{{ _('My account') }}{% endblock %}

{% block breadcrumb %}
<nav aria-label="breadcrumb">
    <ol class="breadcrumb">
        {% if panel_url %}<li class="breadcrumb-item"><a href="{{ panel_url }}">{{ _('Admin') }}</a></li>{% endif %}
        <li class="breadcrumb-item active">{{ _('My account') }}</li>
    </ol>
</nav>
{% endblock %}

{% block content %}

<h1 class="h2 mb-4"><b>{{ _('My account') }}</b></h1>

{% with messages = get_flashed_messages(with_categories=true) %}
    {% for category, message in messages %}
        <div class="alert alert-{{ category }} alert-dismissible fade show" role="alert">
            {{ message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    {% endfor %}
{% endwith %}

<form method="post" novalidate>
    {{ form.hidden_tag() }}

    <div class="row">
        <div class="col-md-6 mb-3">
            {{ form.email.label(class="form-label fw-semibold") }}
            {{ form.email(class="form-control", autocomplete="username") }}
            {% for error in form.email.errors %}<div class="text-danger small">{{ error }}</div>{% endfor %}
            <div class="form-text">{% if confirms_addresses %}{{ _('The address you sign in with. A new one needs your current password, and applies when you follow the link we mail to it.') }}{% else %}{{ _('The address you sign in with. A new one needs your current password.') }}{% endif %}</div>
            {% if user.pending_email %}
            <div class="alert alert-info mt-2 mb-0" role="status" data-pending-email>
                {{ _('Waiting for %(email)s to be confirmed. Follow the link we mailed to it.', email=user.pending_email) }}
            </div>
            {% endif %}
        </div>
    </div>

    <h2 class="h5 mt-4 mb-3">{{ _('Change your password') }}</h2>

    <div class="row">
        <div class="col-md-4 mb-3">
            {{ form.current_password.label(class="form-label fw-semibold") }}
            {{ form.current_password(class="form-control", autocomplete="current-password") }}
            <div class="form-text">{{ form.current_password.description }}</div>
            {% for error in form.current_password.errors %}<div class="text-danger small">{{ error }}</div>{% endfor %}
        </div>
        <div class="col-md-4 mb-3">
            {{ form.new_password.label(class="form-label fw-semibold") }}
            {{ form.new_password(class="form-control", autocomplete="new-password") }}
            <div class="form-text">{{ form.new_password.description }}</div>
            {% for error in form.new_password.errors %}<div class="text-danger small">{{ error }}</div>{% endfor %}
        </div>
        <div class="col-md-4 mb-3">
            {{ form.confirm_password.label(class="form-label fw-semibold") }}
            {{ form.confirm_password(class="form-control", autocomplete="new-password") }}
            {% for error in form.confirm_password.errors %}<div class="text-danger small">{{ error }}</div>{% endfor %}
        </div>
    </div>

    <div class="mt-3">
        {{ form.submit(class="btn btn-primary") }}
    </div>
</form>

<h2 class="h5 mt-5 mb-3">{{ _('Sessions') }}</h2>
<form method="post" action="{{ url_for('auth.sign_out_everywhere') }}">
    {{ confirm_form.hidden_tag() }}
    <p class="text-muted">{{ _('Signed in on a computer you no longer use, or lost a device? This closes every session of your account except this one, and forgets every "Remember me".') }}</p>
    <button type="submit" class="btn btn-outline-danger">{{ _('Sign out everywhere else') }}</button>
</form>

{% endblock %}