From 009030b5fbf39f2bea92af3d95cf945705b32294 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20Fastr=C3=A9?= <julien.fastre@champs-libres.coop>
Date: Thu, 7 Apr 2022 21:59:02 +0200
Subject: [PATCH] notification list: move action buttons outside of the toggle

---
 .../views/Notification/_list_item.html.twig   | 36 ++++++++++++-------
 1 file changed, 24 insertions(+), 12 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig
index 817f7e6a7..02a02b4d0 100644
--- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig
+++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig
@@ -61,17 +61,28 @@
     <div class="item-row">
         <div class="notification-content">
             {% if c.full_content is defined and c.full_content == true %}
-                {{ c.notification.message|chill_markdown_to_html }}
+                {% 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 %}
-                {{ 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>
+                {% 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">
@@ -79,16 +90,16 @@
                         </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"
+                              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) %}
@@ -122,24 +133,25 @@
             <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.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.header(_context) }}
         {{ _self.content(_context) }}
+        {{ _self.actions(_context) }}
     {% endif %}
 
 </div>