{% macro title(c) %}
    <div class="item-row title">
        <h2 class="notification-title">
            <a
                href="{{ chill_path_add_return_path('chill_main_notification_show', {
                    id: c.notification.id
                }) }}"
            >
                {{ c.notification.title }}
            </a>
        </h2>
    </div>
{% endmacro %}

{% macro insert_onthefly(type, entity, parent = null) %}
    {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
        action: 'show', displayBadge: true,
        targetEntity: { name: type, id: entity.id },
        buttonText: entity|chill_entity_render_string,
        isDead: entity.deathdate is defined and entity.deathdate is not null,
        parent: parent
    } %}
{% endmacro %}

{% macro relatedEntity(c) %}
    {% if c.data is defined %}
        {% set notification = c.data.notification %}
        {% set handler = c.data.handler %}
        <div class="item-row">
            <h4 class="notification-subtitle">
                <span>{{ handler.getTitle(notification)|trans }}</span>
            </h4>
        </div>
        {% set associateds = handler.getAssociatedPersons(notification) %}
        {% if associateds|length > 0 %}
            <div class="item-row">
                <ul class="notification-related-entities">
                    {% for ap in associateds %}
                        <li>
                            {% if ap.person is defined %}
                                {{ _self.insert_onthefly('person', ap.person) }}
                            {% else %}
                                {{ _self.insert_onthefly('person', ap) }}
                            {% endif %}
                        </li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    {% endif %}
{% endmacro %}
{% macro header(c) %}
    <div class="item-row notification-header mt-2">
        <div class="item-col">
            <ul class="small_in_title">
                {% if c.step is not defined or c.step == 'inbox' %}
                    <li class="notification-from">
                        <span class="item-key">
                            <abbr title="{{ 'notification.received_from' | trans }}">
                                {{ "notification.from" | trans }} :
                            </abbr>
                        </span>
                        {% if not c.notification.isSystem %}
                            <span class="badge-user">
                                {{ c.notification.sender | chill_entity_render_string({'at_date': c.notification.date}) }}
                            </span>
                        {% else %}
                            <span class="badge-user system">{{ "notification.is_system" | trans }}</span>
                        {% endif %}
                    </li>
                {% endif %}
                {% if c.notification.addressees|length > 0 or c.notification.addresseeUserGroups|length > 0 %}
                    <li class="notification-to">
                        {% if c.notification_cc is defined %}
                            {% if c.notification_cc %}
                                <span class="item-key">
                                    <abbr title="{{ 'notification.sent_cc' | trans }}">
                                        {{ "notification.cc" | trans }} :
                                    </abbr>
                                </span>
                            {% else %}
                                <span class="item-key">
                                    <abbr title="{{ 'notification.sent_to' | trans }}">
                                        {{ "notification.to" | trans }} :
                                    </abbr>
                                </span>
                            {% endif %}
                        {% else %}
                            <span class="item-key">
                                <abbr title="{{ 'notification.sent_to' | trans }}">
                                    {{ "notification.to" | trans }} :
                                </abbr>
                            </span>
                        {% endif %}
                        {% for a in c.notification.addressees %}
                            <span class="badge-user">
                                {{ a | chill_entity_render_string({'at_date': c.notification.date}) }}
                            </span>
                        {% endfor %}
                        {% for a in c.notification.addressesEmails %}
                            <span
                                class="badge-user"
                                title="{{ 'notification.Email with access link'|trans|e('html_attr') }}"
                            >
                                {{ a }}
                            </span>
                        {% endfor %}
                        {% for ug in c.notification.addresseeUserGroups %}
                            {{ ug|chill_entity_render_box }}
                        {% endfor %}
                    </li>
                {% endif %}
            </ul>
        </div>
        <div class="item-col">
            {{ c.notification.date|format_datetime('long', 'short') }}
        </div>
    </div>
{% endmacro %}
{% macro content(c) %}
    <div class="item-row separator">
        {% if c.data is defined %}
            <div class="mx-3 flex-grow-1">
                {% include c.data.template with c.data.template_data %}
            </div>
        {% endif %}
    </div>
    <div class="item-row">
        <div class="notification-content">
            {% if c.full_content is defined and c.full_content == true %}
                {% if c.notification.message is not empty %}
                    {{ c.notification.message | chill_markdown_to_html }}
                {% else %}
                    <p class="chill-no-data-statement">{{ "Any comment" | trans }}</p>
                {% endif %}
            {% else %}
                {% if c.notification.message is not empty %}
                    {{ c.notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }}
                    <p class="read-more">
                        <a
                            href="{{ chill_path_add_return_path('chill_main_notification_show', {
                                id: c.notification.id
                            }) }}"
                        >{{ "Read more" | trans }}</a>
                    </p>
                {% else %}
                    <p class="chill-no-data-statement">{{ "Any comment" | trans }}</p>
                {% endif %}
            {% endif %}
        </div>
    </div>
{% endmacro %}
{% macro actions(c) %}
    {% if c.action_button is not defined or c.action_button != false %}
        <div class="item-row separator">
            <div class="item-col item-meta">
                {% if c.notification.comments|length > 0 %}
                    <div class="comment-counter">
            <span class="counter">
                {{ 'notification.counter comments'|trans({'nb': c.notification.comments|length }) }}
            </span>
                    </div>
                {% endif %}
            </div>
            <div class="item-col">
                <ul class="record_actions">
                    <li>
                        {# Vue component #}
                        <span
                            class="notification_toggle_read_status"
                            data-notification-id="{{ c.notification.id }}"
                            data-notification-current-is-read="{{ c.notification.isReadBy(app.user) }}"
                            data-container="notification-status"
                        ></span>
                    </li>
                    {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', c.notification) %}
                        <li>
                            <a
                                href="{{ chill_path_add_return_path(
                                    'chill_main_notification_edit',
                                    { id: c.notification.id }
                                ) }}"
                                class="btn btn-edit"
                                title="{{ 'Edit' | trans }}"
                            ></a>
                        </li>
                    {% endif %}
                    {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE',
                        c.notification) %}
                        <li>
                            <a
                                href="{{ chill_path_add_return_path(
                                    'chill_main_notification_show',
                                    { id: c.notification.id }
                                ) }}"
                                class="btn {% if not c.notification.isSystem %}btn-show change-icon{% else %}btn-misc{% endif %}"
                                title="{{ 'notification.see_comments_thread' | trans }}"
                            >
                                {% if not c.notification.isSystem() %}
                                    <i class="fa fa-comment"></i>
                                {% else %}
                                    {{ "Read more" | trans }}
                                {% endif %}
                            </a>
                        </li>
                    {% endif %}
                </ul>
            </div>
        </div>
    {% endif %}
{% endmacro %}

<div
    class="item-bloc notification-status {% if notification.isReadBy(app.user) %}read{% else %}unread{% endif %}"
    data-notification-id="{{ notification.id|escape('html_attr') }}"
>
    {% if fold_item is defined and fold_item != false %}
        <div class="accordion-header" id="flush-heading-{{ notification.id }}">
            <button
                type="button"
                class="accordion-button collapsed"
                data-bs-toggle="collapse"
                data-bs-target="#flush-collapse-{{ notification.id }}"
                aria-expanded="false"
                aria-controls="flush-collapse-{{ notification.id }}"
            >
                {{ _self.title(_context) }}
            </button>
            {{ _self.relatedEntity(_context) }}
            {{ _self.header(_context) }}
        </div>
        <div
            id="flush-collapse-{{ notification.id }}"
            class="accordion-collapse collapse"
            aria-labelledby="flush-heading-{{ notification.id }}"
            data-bs-parent="#notification-fold"
        >
            {{ _self.content(_context) }}
        </div>
        {{ _self.actions(_context) }}
    {% else %}
        {{ _self.title(_context) }}
        {{ _self.relatedEntity(_context) }}
        {{ _self.header(_context) }}
        {{ _self.content(_context) }}
        {{ _self.actions(_context) }}
    {% endif %}
</div>
