{% extends '@WebProfiler/Profiler/layout.html.twig' %}

{% block toolbar %}
    {% if collector.sentMessages|length > 0 %}
        {% set icon %}
            {{ include('@Enqueue/Icon/icon.svg') }}
            <span class="sf-toolbar-value">
                {{ collector.sentMessages|length }}</span>
        {% endset %}

        {% set text %}
            <div class="sf-toolbar-info-piece">
                <b>Sent messages</b>
                <span class="sf-toolbar-status">{{ collector.sentMessages|length }}</span>
            </div>
        {% endset %}

        {{ include('@WebProfiler/Profiler/toolbar_item.html.twig', { 'link': true }) }}
    {% endif %}
{% endblock %}

{% block menu %}
    <span class="label {{ not collector.sentMessages ? 'disabled' }}">
        <span class="icon">{{ include('@Enqueue/Icon/icon.svg') }}</span>
        <strong>Message Queue</strong>
    </span>
{% endblock %}

{% block panel %}
    <h2>Sent messages</h2>
    {% if collector.sentMessages|length > 0 %}
    <table>
        <thead>
        <tr>
            <th>#</th>
            <th>Topic</th>
            <th>Command</th>
            <th>Message</th>
            <th>Priority</th>
        </tr>
        </thead>
        <tbody>
        {% for sentMessage in collector.sentMessages %}
            <tr>
                <td>{{ loop.index }}</td>
                <td>{{ sentMessage.topic|default(null) }}</td>
                <td>{{ sentMessage.command|default(null) }}</td>
                <td style="width: 70%">
                    <span class="metadata">
                        <span>
                            {{ collector.ensureString(sentMessage.body)[0:40] }}{% if collector.ensureString(sentMessage.body)[0:40] != collector.ensureString(sentMessage.body) %}...{% endif %}
                        </span>

                        {% if collector.ensureString(sentMessage.body)|length > 40 %}
                            <a class="btn btn-link text-small sf-toggle" data-toggle-selector="#message-body-{{ loop.index }}" data-toggle-alt-content="Hide body">Show body</a>

                            <div id="message-body-{{ loop.index }}" class="context sf-toggle-content sf-toggle-hidden">
                            {{ profiler_dump(sentMessage.body) }}
                        </div>
                        {% endif %}
                    </span>
                <td>
                    <span title="{{ sentMessage.priority }}">{{ collector.prettyPrintPriority(sentMessage.priority) }}</span>
                </td>
            </tr>
        {% endfor %}
        </tbody>

    </table>
    {% else %}
        <div class="empty">
            <p>No messages were sent.</p>
        </div>
    {% endif %}
{% endblock %}
