From ba550268c5dd2d32b727570a5e6074aa83e5ce22 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nicolas=20L=C5=93uillet?= <nicolas.loeuillet@prestashop.com>
Date: Thu, 12 Jun 2025 19:58:45 +0200
Subject: [PATCH] Improve display of articles with annotations

---
 assets/scss/_entries.scss                  |  6 ++++++
 templates/Entry/Card/_content.html.twig    | 22 +++++++++++++---------
 templates/Entry/_card_full_image.html.twig |  2 +-
 templates/Entry/_card_list.html.twig       |  2 +-
 templates/Entry/_card_preview.html.twig    |  2 +-
 5 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/assets/scss/_entries.scss b/assets/scss/_entries.scss
index b9cd34a01..f75533cf3 100644
--- a/assets/scss/_entries.scss
+++ b/assets/scss/_entries.scss
@@ -183,6 +183,12 @@
   display: none;
 }
 
+blockquote.annotations {
+  margin-top: 5px;
+  padding-left: 1rem;
+  border-left: 5px solid #00acc1;
+}
+
 footer {
   &.page-footer {
     margin-top: 10px;
diff --git a/templates/Entry/Card/_content.html.twig b/templates/Entry/Card/_content.html.twig
index a34f9507e..04246bbdc 100644
--- a/templates/Entry/Card/_content.html.twig
+++ b/templates/Entry/Card/_content.html.twig
@@ -10,13 +10,17 @@
         {{ entry.title|striptags|default('entry.default_title'|trans)|raw }}
     {% endif %}
 
-    <div class="{{ subClass|default('original grey-text') }}">
-        <a href="{{ entry.url|e }}" target="_blank" title="{{ entry.domainName|removeWww }}" class="tool grey-text">{{ entry.domainName|removeWww }}</a>
-        {% if withMetadata is defined %}
-            {% include "Entry/_tags.html.twig" with {'tags': entry.tags|slice(0, 3), 'entryId': entry.id, 'listClass': ' hide-on-med-and-down'} only %}
-            <div class="reading-time grey-text">
-                <div class="card-reading-time">{% include "Entry/_reading_time.html.twig" with {'entry': entry} only %}</div>
-            </div>
-        {% endif %}
-    </div>
+    {% if currentRoute == 'annotated' %}
+        <blockquote class="annotations">{{ entry.annotations[0].text|u.truncate(80, '...') }}</blockquote>
+    {% else %}
+        <div class="{{ subClass|default('original grey-text') }}">
+            <a href="{{ entry.url|e }}" target="_blank" title="{{ entry.domainName|removeWww }}" class="tool grey-text">{{ entry.domainName|removeWww }}</a>
+            {% if withMetadata is defined %}
+                {% include "Entry/_tags.html.twig" with {'tags': entry.tags|slice(0, 3), 'entryId': entry.id, 'listClass': ' hide-on-med-and-down'} only %}
+                <div class="reading-time grey-text">
+                    <div class="card-reading-time">{% include "Entry/_reading_time.html.twig" with {'entry': entry} only %}</div>
+                </div>
+            {% endif %}
+        </div>
+    {% endif %}
 </div>
diff --git a/templates/Entry/_card_full_image.html.twig b/templates/Entry/_card_full_image.html.twig
index c09beee6e..561ca4103 100644
--- a/templates/Entry/_card_full_image.html.twig
+++ b/templates/Entry/_card_full_image.html.twig
@@ -16,7 +16,7 @@
                 {% endif %}
             {% endif %}
         </div>
-        {% include "Entry/Card/_content.html.twig" with {'entry': entry} only %}
+        {% include "Entry/Card/_content.html.twig" with {'entry': entry, 'currentRoute': currentRoute} only %}
     </div>
 
     {% include "Entry/_card_actions.html.twig" with {'entry': entry} only %}
diff --git a/templates/Entry/_card_list.html.twig b/templates/Entry/_card_list.html.twig
index 2710455f1..fb6428cd5 100644
--- a/templates/Entry/_card_list.html.twig
+++ b/templates/Entry/_card_list.html.twig
@@ -12,7 +12,7 @@
         {% endif %}
     </div>
     {% endif %}
-    {% include "Entry/Card/_content.html.twig" with {'entry': entry, 'withMetadata': true, 'subClass': 'metadata'} only %}
+    {% include "Entry/Card/_content.html.twig" with {'entry': entry, 'withMetadata': true, 'subClass': 'metadata', 'currentRoute': currentRoute} only %}
 
     {% set current_path = app.request.requesturi %}
 
diff --git a/templates/Entry/_card_preview.html.twig b/templates/Entry/_card_preview.html.twig
index 0a1cf4f2e..28dccf05a 100644
--- a/templates/Entry/_card_preview.html.twig
+++ b/templates/Entry/_card_preview.html.twig
@@ -18,7 +18,7 @@
                 {% endif %}
             {% endif %}
         </div>
-        {% include "Entry/Card/_content.html.twig" with {'entry': entry, 'withPreview': true} only %}
+        {% include "Entry/Card/_content.html.twig" with {'entry': entry, 'withPreview': true, 'currentRoute': currentRoute} only %}
     </div>
 
     <div class="card-reveal">