{% if error_message %}
<div class="border-b border-danger-light bg-danger-light/20 px-5 py-4 text-left">
    <c-ui.text.text>
        {{ error_message }}
    </c-ui.text.text>
</div>
{% endif %}

{% for item in items %}
<c-features.communication.inbox_item :item="item"/>

{% empty %}
<div>
    <button class="w-full border-b border-gray-200 px-5 py-4 text-left hover:bg-gray-50">
        <div class="flex flex-col items-start gap-3">
            <c-ui.text.text>
                <c-i18n.blocktrans>
                    No items found in this folder.
                </c-i18n.blocktrans>
            </c-ui.text.text>
            <c-ui.text.muted>
                Perform a <a 
                    class="text-primary"
                    id="deep-search-btn"
                    >deep search</a>
            </c-ui.text.muted>
        </div>
    </button>
</div>

{% endfor %}