{% extends '/stdgrid.html.twig' %}

{% block title %}{% endblock %}

{% block body %}
    <nav class='section-settings'>
        <h2>Settings</h2>
        <ul>
            <li>
                <details class="section-title-settings">
                <summary>
                    <h3>Profile {{ icon('arrow-down', 'icon icon-details-open') | raw }}</h3>
                    <em>Personal Information, Avatar and Profile</em>
                </summary>

                <section>
                    <nav class='section-settings-nav'>
                        <ul>
                            <li>
                            <details class="section-title-settings">
                                <summary>
                                    <h3>Personal Info{{ icon('arrow-down', 'icon icon-details-open') | raw }}</h3>
                                    <em>Nickname, Homepage, Bio, Self Tags and more.</em>
                                </summary>

                                {% block form_profile %}{% include '/settings/profile.html.twig' %}{% endblock %}
                            </details>
                            </li>

                            <hr>

                        {% set profile_tabs = handle_event('PopulateProfileSettingsTabs', app.request) %}
                        {% for tab in profile_tabs %}
                            <li>
                                <details class="section-title-settings">
                                <summary>
                                    <h3>{{ tab['title'] }}{{ icon('arrow-down', 'icon icon-details-open') | raw }}</h3>
                                    <em>{{ tab['desc'] }}</em>
                                </summary>

                                {% include tab['controller']['_template'] with tab['controller'] only %}

                                {# <a href="{{ path(tab['route']) }}"
                                class='hover-effect {{ active(tab['route']) }}'>{{ tab['title'] }}</a> #}

                                </details>
                            </li>

                            <hr>
                        {% endfor %}
                        </ul>
                    </nav>
                </section>
                </details>
            </li>

            <hr>

            <li>
                <details class="section-title-settings">
                    <summary>
                        <h3>Account{{ icon('arrow-down', 'icon icon-details-open') | raw }}</h3>
                        <em>Email, Password and Language</em>
                    </summary>

                    <section>
                        {% block form_account %}
                            {% include '/settings/account.html.twig' %}
                        {% endblock %}
                    </section>
                </details>
            </li>

            <hr>

            <li>
                <details class="section-title-settings">
                    <summary>
                        <h3>Notifications{{ icon('arrow-down', 'icon icon-details-open') | raw }}</h3>
                        <em>Enable/disable notifications (Email, XMPP, Replies...)</em>
                    </summary>

                    <section>
                        {% block form_notify %}
                            {% include '/settings/notifications.html.twig' %}
                        {% endblock %}
                    </section>
                </details>
            </li>
        </ul>
    </nav>
{% endblock body %}

{% block javascripts %}{% endblock %}