{% extends '/admin/authenticated/layout/base.html.twig' %}

{% import '/admin/components/helpers_macro.html.twig' as helpers %}


{% block title %}
    Update password
{% endblock %}

{% block content %}

    {{ helpers.notifications_success() }}
    {{ helpers.notifications_error() }}
    {{ helpers.notifications_warning() }}


    <div class="card card-outline card-primary">
        {{ form_start(form, { 'attr': { 'id': 'user_update_password_form'} }) }}
        <div class="card-header card-header-compressed">
            <strong class="font-20">Update password:</strong>
            {{ user.email }}
            <div class="card-tools">
                <a href="{{ path('bo_user_edit', {id: user.id}) }}" class="btn btn-sm btn-light">
                    <i class="fas fa-chevron-left"></i>
                    Edit User page
                </a>
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-lg-4 offset-lg-3">
                    <div class="form-group">
                        <label>User: </label>
                        <span class="text-muted">{{ user.email }}</span>
                    </div>
                    <div class="form-group">
                        {{ form_label(form.password) }}
                        <div class="input-group">
                            {{ form_widget(form.password.first) }}
                            <div class="input-group-append btnTogglePassword" role="button"
                                 data-password-field="#update_password_form_password_first"
                                 data-icon="#eyeIconFirst">
                                <div class="input-group-text">
                                    <span id="eyeIconFirst" class="far fa-eye-slash"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            {{ form_widget(form.password.second) }}
                            <div class="input-group-append btnTogglePassword" role="button"
                                 data-password-field="#update_password_form_password_second"
                                 data-icon="#eyeIconSecond">
                                <div class="input-group-text">
                                    <span id="eyeIconSecond" class="far fa-eye-slash"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-4">
                    {{ helpers.passwordFormatHelper() }}
                </div>
            </div>
            <div class="card-footer p-2 text-center">
                <div class="col-lg-4 offset-lg-3">
                    <button type="submit" class="btn btn-info btn-admin">Save</button>
                    <a href="{{ path('bo_user_edit', {id: user.id}) }}" class="btn btn-secondary btn-admin">Cancel</a>
                </div>
            </div>
            {{ form_end(form) }}
            {{ helpers.form_processing() }}
        </div>
    </div>


{% endblock %}

{% block js %}
    {{ parent() }}
    <script src="{{ asset('/app/admin/js/authenticated/security/user/UpdateUserPasswordFormValidator.js') }}"></script>
    <script src="{{ asset('/app/admin/js/authenticated/security/user/UpdateUserPasswordForm.js') }}"></script>
    <script src="{{ asset('/app/admin/js/authenticated/layout/Common/TogglePassword.js') }}"></script>
    <script>
        (new UpdateUserPasswordForm()).init();
        (new TogglePassword()).init();
    </script>
{% endblock %}