{% extends "PackagistWebBundle:user:packages.html.twig" %}

{% import "PackagistWebBundle::macros.html.twig" as macros %}

{% block content %}
    {% set isActualUser = app.user and app.user.username is same as(user.username) %}

    <h2 class="title">
        {{ user.username }}
        {%- if not isActualUser %}
            <small>
                member since: {{ user.createdAt|date('M d, Y') }}
                {%- if is_granted('ROLE_ADMIN') %}
                    <a href="mailto:{{ user.email }}">{{ user.email }}</a>
                {%- endif %}
            </small>
        {%- endif %}
    </h2>

    <section class="row">
        {% if isActualUser %}
            <section class="col-md-3">
                {{ knp_menu_render('profile_menu', {currentClass: 'active', allow_safe_labels: true}) }}
            </section>
        {% endif %}

        <section class="col-md-6">
            <h3>Save your backup code</h3>

            <div class="well well-lg">
                <p>A backup code will let you access your account if your phone is lost, stolen, or you otherwise can't generate codes via your authenticator app.  We ask that you save this unique, one-time use backup code in a safe place:</p>

                <kbd class="two-factor-backup-code">{{ backup_code }}</kbd>

                <p class="text-danger"><strong>Without access to your authenticator app or backup code, you will permanently lose access to your account.</strong></p>

                <p>To use the backup code, simply enter it during two-factor authentication where you'd normally enter a generated code.</p>

                <p>
                    Please take a moment to put this code in a safe place.
                    <strong>This code will not be shown again!</strong>
                </p>
            </div>

            <p>
                <a href="{{path('user_2fa_configure', {name: user.username})}}" class="btn btn-success btn-lg">
                    <span class="icon-check"></span>
                    I have saved the backup code
                </a>
            </p>
        </section>
    </section>
{% endblock %}
