notification show page: use macro to display thread comments

src/Bundle/ChillMainBundle/Resources/views/Notification/show.html.twig

@@ -12,10 +12,25 @@
     {{ encore_entry_link_tags('mod_notification_toggle_read_status') }}
 {% endblock %}
 
+{% import '@ChillPerson/AccompanyingCourse/Comment/macro_showItem.html.twig' as m %}
+
+{% macro recordAction(comment) %}
+    {% if is_granted('CHILL_MAIN_NOTIFICATION_COMMENT_EDIT', comment) %}
+    <li>
+        <a href="{{ chill_path_forward_return_path('chill_main_notification_show', {
+            '_fragment': 'comment-' ~ comment.id,
+            'edit': comment.id,
+            'id': comment.notification.id
+        }) }}" class="btn btn-edit" title="{{ 'Edit'|trans }}"
+        ></a>
+    </li>
+    {% endif %}
+{% endmacro %}
+
 {% block content %}
 <div class="col-10 notification notification-show">
 
-    <h1 class="visually-hidden">{{ notification.title }}</h1>
+    <h1>{{ 'notification.Notification'|trans }}</h1>
 
     <div class="flex-table">
         {% include 'ChillMainBundle:Notification:_list_item.html.twig' with {
@@ -27,72 +42,63 @@
         } %}
     </div>
 
-    {#
+    <div class="notification-comment-list my-5">
-    {{ dump() }}
+        <h2 class="chill-blue">{{ 'notification.comments_list'|trans }}</h2>
-    <div>
-        {% include handler.getTemplate(notification) with handler.getTemplateData(notification) %}
-    </div>
-    <div>
-        à remplacer par un commentEmbeddable
-        {{ notification.message|chill_markdown_to_html }}
-    </div>
-    #}
 
-    <div class="comments thread m-5">
         {% if notification.comments|length > 0 %}
+            <div class="flex-table">
                 {% for comment in notification.comments %}
+
                     {% if editedCommentForm is null or editedCommentId != comment.id %}
-                    <div>
+                        {{ m.show_comment(comment, {
-                        <a id="comment-{{ comment.id }}"></a>
+                            'recordAction': _self.recordAction(comment)
-                        <blockquote class="chill-user-quote">
+                        }) }}
-                            {{ comment.content|chill_markdown_to_html }}
-                        </blockquote>
-
-                        {% if is_granted('CHILL_MAIN_NOTIFICATION_COMMENT_EDIT', comment) %}
-                            <ul class="record_actions">
-                                <li>
-                                    <a href="{{ chill_path_forward_return_path('chill_main_notification_show', { '_fragment': 'comment-'~comment.id, 'edit': comment.id, 'id': notification.id }) }}" class="btn btn-edit"></a>
-                                </li>
-                            </ul>
-                        {% endif %}
-                    </div>
                     {% else %}
-                    <div>
+                        <div class="item-bloc">
+                            <div class="item-row row">
                                 <a id="comment-{{ comment.id }}"></a>
+
                                 {{ form_start(editedCommentForm) }}
-                        {{ form_widget(editedCommentForm) }}
+                                {{ form_errors(editedCommentForm) }}
-
+                                {{ form_widget(editedCommentForm.content) }}
                                 <input type="hidden" name="form" value="edit" />
-
                                 <ul class="record_actions">
                                     <li class="cancel">
-                                <a href="{{ chill_path_forward_return_path('chill_main_notification_show', { '_fragment': 'comment-'~comment.id, 'id': notification.id }) }}" class="btn btn-cancel"></a>
+                                        <a href="{{ chill_path_forward_return_path('chill_main_notification_show', {
+                                            '_fragment': 'comment-' ~ comment.id,
+                                            'id': notification.id }) }}" class="btn btn-cancel">
+                                            {{ 'cancel'|trans }}
+                                        </a>
                                     </li>
                                     <li>
-                                <button type="submit" class="btn btn-save"></button>
+                                        <button class="btn btn-save" type="submit">{{ 'Save'|trans }}</button>
                                     </li>
                                 </ul>
                                 {{ form_end(editedCommentForm) }}
+
+                            </div>
                         </div>
                     {% endif %}
+
                 {% endfor %}
+            </div>
         {% endif %}
 
-        {% if appendCommentForm is not null %}
+        <div class="new-comment my-5">
-            <div>
+            <h2 class="chill-blue">{{ 'Write a new comment'|trans }}</h2>
+
             {{ form_start(appendCommentForm) }}
-                {{ form_widget(appendCommentForm) }}
+            {{ form_errors(appendCommentForm) }}
-
+            {{ form_widget(appendCommentForm.content) }}
             <input type="hidden" name="form" value="append" />
-
             <ul class="record_actions">
                 <li>
-                        <button type="submit" class="btn btn-save">{{ 'notification.append_comment'|trans }}</button>
+                    <button class="btn btn-create" type="submit">{{ 'notification.append_comment'|trans }}</button>
                 </li>
             </ul>
             {{ form_end(appendCommentForm) }}
+
         </div>
-        {% endif %}
     </div>
 
     <ul class="record_actions sticky-form-buttons">

src/Bundle/ChillMainBundle/translations/messages.fr.yml

@@ -353,6 +353,7 @@ Created for: Créé pour
 Created by: Créé par
 
 notification:
+    Notification: Notification
     My own notifications: Mes notifications
     Notify: Envoyer une notification
     Notification created: Notification envoyée
@@ -363,6 +364,7 @@ notification:
     comment_appended: Commentaire ajouté
     append_comment: Ajouter un commentaire
     comment_updated: Commentaire mis à jour
+    comments_list: Fil de commentaires
     is_unread: Non-lue
     is_system: notification automatique
     list: Notifications

src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/Comment/macro_showItem.html.twig

@@ -22,3 +22,6 @@
         </div>
     </div>
 {% endmacro %}
+{#
+    TODO if shared, move this file in Main, out of AccompanyingCourse
+#}