{% extends '@ChillPerson/Household/layout.html.twig' %}

{% block title 'household_composition.Compositions'|trans %}

{% block block_post_menu %}
    <div class="post-menu"></div>
{% endblock %}

{% block content %}
<div class="household_composition">
    <h1>{{ block('title') }}</h1>

    {% if compositions|length == 0 %}
        <p class="chill-no-data-statement">{{ 'household_composition.No composition yet'|trans }}</p>
    {% else %}
        <div class="flex-table">
            {% for c in compositions %}
                {# {% if c.id != editId %} #}
                    <div class="item-bloc">
                        <div class="item-row">
                            <div class="item-col">
                                <h3>{{ c.householdCompositionType.label|localize_translatable_string }}</h3>
                                <p>{{ 'household_composition.numberOfChildren'|trans }}: {{ c.numberOfChildren }}</p>
                            </div>
                            <div class="item-col" style="justify-content: flex-end">{{ 'household_composition.Since'|trans({'startDate': c.startDate}) }}</div>
                        </div>
                        <div class="item-row">
                            <div class="item-col">
                                {% if c.endDate is null %}
                                    <span class="chill-no-data-statement">{{ 'household_composition.Still active'|trans }}</span>
                                {% else %}
                                    {{ 'household_composition.Until'|trans({'endDate': c.endDate })}}
                                {% endif %}
                            </div>
                        </div>
                        {% if c.comment.comment is not empty %}
                            <div class="item-row separator">
                                {{ c.comment|chill_entity_render_box }}
                            </div>
                        {% endif %}
                        {% if is_granted('CHILL_PERSON_HOUSEHOLD_EDIT', c.household) %}
                            <div class="item-row">
                                <ul class="record_actions">
                                    <li>
                                        <a href="{{ path('chill_person_household_composition_new', {'id': c.household.id, 'edit': c.id}) }}" class="btn btn-edit"></a>
                                    </li>
                                    <li>
                                        <a href="{{ chill_path_add_return_path('chill_person_household_composition_delete', {'composition_id': c.id,
                                                        'household_id': c.household.id}) }}"
                                            class="btn btn-delete"
                                            title="{{ 'Delete'|trans }}"></a>
                                    </li>
                                </ul>
                            </div>
                        {% endif %}
                    </div>
            {% endfor %}
        </div>
    {% endif %}

    {% if is_granted('CHILL_PERSON_HOUSEHOLD_EDIT', household) %}
        <ul class="record_actions sticky-form-buttons">
            <li>
                <a href="{{ chill_path_add_return_path('chill_person_household_composition_new', {'id': household.id,}) }}"
                        class="btn btn-new"
                        title="{{ 'Create'|trans }}">{{ 'Create'|trans }}</a>
            </li>
        </ul>
    {% endif %}
</div>
{% endblock %}