{% import '@SyliusUi/Macro/headers.html.twig' as headers %}

{% extends '@SyliusShop/Account/layout.html.twig' %}

{% block breadcrumb %}
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="{{ path('sylius_shop_homepage') }}" class="section">{{ 'sylius.ui.home'|trans }}</a>
            </li>
            <li class="breadcrumb-item active">{{ 'sylius.ui.my_account'|trans }}</li>
        </ol>
    </nav>
{% endblock %}

{% block subcontent %}
    {{ headers.shop('sylius.ui.my_account'|trans, null, 'sylius.ui.manage_your_personal_information_and_preferences'|trans) }}

    <hr>

    {{ sylius_template_event('sylius.shop.account.dashboard.after_content_header', {'customer': customer}) }}

    <div class="account-dashboard" id="customer-information" {{ sylius_test_html_attribute('customer-information') }}>
        <div class="card">
            <div class="card-body">
                <p class="card-text">
                    {{ customer.fullName }}<br>
                    <strong>{{ customer.email }}</strong>
                </p>

                {% if customer.user.verified %}
                    <span class="badge badge-success"><i class="fa fa-check"></i>&nbsp;{{ 'sylius.ui.verified'|trans }}</span>
                {% else %}
                    <span class="badge badge-danger"><i class="fa fa-times"></i>&nbsp;{{ 'sylius.ui.not_verified'|trans }}</span>
                {% endif %}
            </div>
        </div>
    </div>

    {{ sylius_template_event('sylius.shop.account.dashboard.after_information', {'customer': customer}) }}

    <nav class="account-navigation btn-group">
        <a href="{{ path('sylius_shop_account_profile_update') }}" class="btn btn-link"><i class="fa fa-pencil-alt"></i>&nbsp;{{ 'sylius.ui.edit'|trans }}</a>
        <a href="{{ path('sylius_shop_account_change_password') }}" class="btn btn-link"><i class="fa fa-lock"></i>&nbsp;{{ 'sylius.ui.change_password'|trans }}</a>
        {% if not customer.user.verified %}
            <form id="verification-form" {{ sylius_test_html_attribute('verification-form') }} action="{{ path('sylius_shop_user_request_verification_token') }}" method="post">
                <button type="submit" class="btn btn-outline-secondary" {{ sylius_test_html_attribute('verification-button') }}>
                    <i class="fa fa-check"></i>&nbsp;{{ 'sylius.ui.verify'|trans }}
                </button>
            </form>
        {% endif %}
    </nav>
{% endblock %}
