{% extends 'base.html.twig' %}

{% block title %}Contacts{% endblock %}


{% block importmap %}
    {{ importmap(['app', 'module']) }}
{% endblock %}


{% block body %}
    <h1 class="module-title">Contacts</h1>

    <div id="" class="module-list">
        <div class="module-list-actions">
            <div class="module-list-actions-left">
            </div>
            <div class="module-list-actions-right">
                <a class="module-list-btn" href="{{ path('app_contact_new') }}">{{ ux_icon('lucide:square-plus') }}</a>
            </div>
        </div>

        {% include '_index_search.html.twig' with {searchForm : searchForm} %}

        <div class="module-list-items">
            <div class="module-list-body">
                {% for item in items %}
                    {% set title = item.lastname ~ " " ~ item.firstname %}
                    {% set title = '<a href="' ~ path("app_contact_edit", {id:item.id}) ~ '">' ~ title ~ '</a>' %}


                    {% include '_index_module_item.html.twig' with {
                        'one' : title,
                        'two' : (item.contactHighlightLabel ? item.contactHighlightLabel : ''),
                        'three' : (isNotNull(item.enterprise) ? item.enterprise ~ ' - ' : '') ~ item.address ~ ' ' ~ item.postalCode ~ ' ' ~ item.city ,
                        'four' : '',
                        'optionalStyles' : 'box-sizing: border-box; ' ~ (item.contactHighlightColor ? 'border: 2px solid ' ~ item.contactHighlightColor ~ '; border-right: 25px solid' ~ item.contactHighlightColor)
                    } %}
                {% endfor %}
            </div>
        </div>
    </div>

{% endblock %}