{% extends "@ChillMain/layout.html.twig"  %}

{% block title 'notification.My own notifications'|trans %}

{% block js %}
  {{ parent() }}
  {{ encore_entry_script_tags('mod_notification_toggle_read_status') }}
{% endblock %}

{% block css %}
    {{ parent() }}
    {{ encore_entry_link_tags('mod_notification_toggle_read_status') }}
{% endblock %}

{% block content %}
<div class="col-10 notification notification-list">
    <h1>{{ block('title') }}</h1>

    <ul class="nav nav-pills justify-content-center">
        <li class="nav-item">
            <a class="nav-link {% if step == 'inbox' %}active{% endif %}" href="{{ path('chill_main_notification_my') }}">
                {{ 'notification.Notifications received'|trans }}
                {% if unreads['inbox'] > 0 %}
                    <span class="badge rounded-pill bg-danger">
                        {{ unreads['inbox'] }}
                    </span>
                {% endif %}
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link {% if step == 'sent' %}active{% endif %}" href="{{ path('chill_main_notification_sent') }}">
                {{ 'notification.Notifications sent'|trans }}
                {% if unreads['sent'] > 0 %}
                    <span class="badge rounded-pill bg-danger">
                        {{ unreads['sent'] }}
                    </span>
                {% endif %}
            </a>
        </li>
    </ul>

    {% if datas|length == 0 %}
        {% if step == 'inbox' %}
            <p class="chill-no-data-statement">{{ 'notification.Any notification received'|trans }}</p>
        {% else %}
            <p class="chill-no-data-statement">{{ 'notification.Any notification sent'|trans }}</p>
        {% endif %}
    {% else %}
        <div class="flex-table">
            {% for data in datas %}
                {% set notification = data.notification %}
                {% include 'ChillMainBundle:Notification:_list_item.html.twig' %}
            {% endfor %}
        </div>
    {% endif %}
</div>
{% endblock content %}