{% 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="{{ isActualUser ? 'col-md-9' : 'col-md-12' }}">
            <p>
                To enable two-factor authentication, you'll need an app that supports TOTP such as
                <a href="https://authy.com/download/">Authy</a>,
                <a href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2">Google Authenticator</a>,
                or
                <a href="https://keepassxc.org/">KeePassXC</a>.
            </p>

            <p><small>(This is not an exhaustive list of compatible apps. Packagist does not endorse or recommend one application over another.)</small></p>

            <p class="pull-right two-factor-key">
                <img src="{{ qr_code_data_uri(provisioningUri) }}" height="200" />
                <br>
                <small>TOTP Key: <code>{{ secret }}</code></small>
            </p>

            <h3>Enabling Two-Factor Authentication</h3>

            <p>To enable two-factor authentication on your Packagist account:</p>

            <ol>
                <li>Open your authenticator app.</li>
                <li>Add an account within the app and scan the QR code shown here.</li>
                <li>Enter the code generated by your authenticator app below.</li>
            </ol>

            {{ form_start(form, {'attr': { 'class': 'col-md-6' } }) }}
                {{ form_errors(form) }}

                <div class="form-group clearfix">
                    {{ form_label(form.code, 'Code shown in authenticator:') }}
                    <div class="input-group">
                        {{ form_errors(form.code) }}
                        {{ form_widget(form.code) }}
                        <span class="input-group-addon"><span class="icon-key"></span></span>
                    </div>
                </div>

                <input type="submit" class="btn btn-block btn-inverse btn-lg" value="Enable Two-Factor Authentication" />
            {{ form_end(form) }}
        </section>
        </section>
    </section>
{% endblock %}
