{% extends 'settings/friends/master.twig' %}

{% set friends = user.friends(-1)|batch(12) %}

{% set paginationPages = friends %}
{% set paginationUrl %}{{ route('settings.friends.requests') }}{% endset %}

{% set mode = 'Requests' %}

{% block description %}
    <p>Handle friend requests.</p>
{% endblock %}

{% block settingsContent %}
    {% if friends|length %}
        <div style="text-align: center">
            {% for friend in friends[get.page|default(1) - 1] %}
                <div class="friend-box" id="friend-{{ friend.id }}">
                    <a class="friend-box__container" href="{{ route('user.profile', friend.id) }}">
                        <div class="friend-box__avatar avatar avatar--border" style="background-image: url('{{ route('user.avatar', friend.id) }}')"></div>
                        <div class="friend-box__name" style="color: {{ friend.colour }};">{{ friend.username }}</div>
                    </a>
                    <div class="friend-box__actions">
                        <a class="friend-box__action friend-box__action--green fa fa-check" title="Add friend" href="javascript:void(0);" onclick="Sakura.Friend.Add({{ friend.id }});"></a>
                        <a class="friend-box__action friend-box__action--red fa fa-remove" title="Remove friend" href="javascript:void(0);" onclick="Sakura.Friend.Remove({{ friend.id }});"></a>
                    </div>
                </div>
            {% endfor %}
            <div class="clear"></div>
        </div>
        {% if friends|length > 1 %}
            <div>
                {% include 'elements/pagination.twig' %}
            </div>
        {% endif %}
    {% else %}
        <h1 style="margin: 2em auto; text-align: center;">You don't have any pending requests!</h1>
    {% endif %}
{% endblock %}