{% extends "main_card.html.twig" %}

{% block title %}{% trans %}user.settings.label{% endtrans %}{% endblock %}

{% block card_title %}<i class="fas fa-info-circle fa-fw" aria-hidden="true"></i>
    {% trans %}user.settings.label{% endtrans %}{% endblock %}

{% block card_content %}
    {{ form_start(settings_form) }}

    <ul class="nav nav-tabs" id="myTab" role="tablist">
        <li class="nav-item">
            <a class="nav-link active" id="data-tab" data-bs-toggle="tab" href="#data" role="tab"
               aria-controls="home" aria-selected="true">{% trans %}user_settings.data.label{% endtrans %}</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="profile-tab" data-bs-toggle="tab" href="#configuration" role="tab"
               aria-controls="profile" aria-selected="false">{% trans %}user_settings.configuration.label{% endtrans %}</a>
        </li>
    </ul>
    <div class="tab-content mt-3 mb-3" id="myTabContent">
        <div class="tab-pane fade show active" id="data" role="tabpanel" aria-labelledby="home-tab">
            {{ form_row(settings_form.name) }}
            {{ form_row(settings_form.first_name) }}
            {{ form_row(settings_form.last_name) }}
            {{ form_row(settings_form.department) }}
            {{ form_row(settings_form.email) }}
            {{ form_row(settings_form.showEmailOnProfile) }}
            {{ form_row(settings_form.avatar_file) }}
            <div class="mb-3 row {% if user.masterPictureAttachment is null %}d-none{% endif %}">
                <div class="{{ offset_label }} {{ col_input }}">
                    {% if user.masterPictureAttachment %}
                        <img src="{{ attachment_thumbnail(user.masterPictureAttachment, 'thumbnail_md') }}" alt="avatar" class="rounded" style="height: 75px;">
                    {% endif %}
                    {{ form_widget(settings_form.remove_avatar) }}
                </div>
            </div>
            {{ form_row(settings_form.aboutMe) }}
        </div>
        <div class="tab-pane fade" id="configuration" role="tabpanel" aria-labelledby="profile-tab">
            {{ form_row(settings_form.language) }}
            {{ form_row(settings_form.timezone) }}
            {{ form_row(settings_form.theme) }}
            {{ form_row(settings_form.currency) }}
        </div>
    </div>

    {{ form_row(settings_form.save) }}
    {{ form_row(settings_form.reset) }}

    {{ form_end(settings_form) }}
{% endblock %}

{% block content %}
    {{ parent() }}

    {% if user.samlUser %}
        <div class="alert alert-warning mt-3" role="alert">
            <h4 class="alert-heading">{% trans %}user.saml_user{% endtrans %}</h4>
            <p>
                {% trans %}user.saml_user.pw_change_hint{% endtrans %}
            </p>
        </div>
    {% endif %}

    {% include "users/_2fa_settings.html.twig" %}

    <div class="card mt-4">
        <div class="card-header">
            <i class="fa fa-key fa-fw" aria-hidden="true"></i>
            {% trans %}user.settings.change_pw{% endtrans %}
        </div>
        <div class="card-body">
            {{ form_start(pw_form) }}
            {{ form_widget(pw_form) }}
            {{ form_end(pw_form) }}
        </div>
    </div>

    {% if is_granted("@api.access_api") %}
        {% include "users/_api_tokens.html.twig" %}
    {% endif %}
{% endblock %}
