SCENARIO: Linking an existing document (see #383).

frontend/scenarios/link_document.feature

@@ -6,13 +6,13 @@ Scénario: pour commenter un document
 
   Soit un document existant affiché comme document principal
   Et une session active avec mon compte
-  Quand je réutilise "Glossaire" comme glose
-  Alors "Glossaire" est la glose ouverte
-  Et la glose contient :
+  Quand j'utilise un document existant comme commentaire
+  Alors la liste de mes documents s'affichent
+  Et la liste contient pour chaque document son titre, son auteur, sa dernière date de modification et son lien isPartOf
     """
-    "Il était une fois"
-    "Once upon a time" (eng)
-    "Bolo to raz" (svk)
+    "Comments on the video - Côme Peyrelongue, 24/03/2026 09:32 - My First Video Document"
+    "My Second Video Document - Côme Peyrelongue, 10/03/2026 20:15"
+    "Comments on the video - Côme Peyrelongue, 23/03/2026 10:44 - My Second Video Document"
     """
 
 Scénario: pour le comparer avec un autre

frontend/src/components/ExistingDocument.jsx

@@ -1,9 +1,13 @@
 import Card from 'react-bootstrap/Card';
 import { useNavigate } from 'react-router';
+import {format } from 'date-fns';
 
 function ExistingDocument({ document, relatedTo, verb, setLastUpdate, backend }) {
   const navigate = useNavigate();
   const title = document.dc_title || 'Untitled document';
+  const isPartOf = document.dc_isPartOf || '';
+  const creator = document.dc_creator || '';
+  const issued = format(new Date(document.dc_issued), 'dd/MM/yyyy HH:mm') || '';
   const sourceChunksToBeLinked = (verb !== 'includes' && relatedTo.length)
     ? [{ verb, object: relatedTo[0] }]
     : relatedTo.map(object =>({ verb, object }));
@@ -33,11 +37,10 @@ function ExistingDocument({ document, relatedTo, verb, setLastUpdate, backend })
       })
       .catch(console.error);
   };
-
   return (
     <Card onClick={handleClick} className="existingDocument documentList">
       <Card.Body>
-        <span>{title}</span>
+        <span><strong>{title}</strong> - <i>{isPartOf} - {creator} - {issued}</i></span>
       </Card.Body>
     </Card>
   );

frontend/tests/event.js

@@ -147,3 +147,7 @@ Quand("j'essaie d'ajouter une image à une glose", () => {
   });
 });
 
+Quand("j'utilise un document existant comme commentaire", () => {
+  cy.get('.select-document').click();
+  cy.get('#select-dropdown').select('refersTo');
+});

frontend/tests/outcome.js

@@ -202,3 +202,15 @@ Alors("la colonne {int} contient {string}", (column, text) => {
   cy.contains(`.lectern .main .col .col:nth-child(${column})`, text);
 });
 
+Alors("la liste de mes documents s'affichent", () => {
+  cy.get('input[placeholder="Search documents"]').should('be.visible');
+  cy.get('.document-list-container .existingDocument').should('have.length.greaterThan', 0);
+});
+
+Alors("la liste contient pour chaque document son titre, son auteur, sa dernière date de modification et son lien isPartOf", (_documentsText) => {
+  cy.get('.document-list-container .existingDocument')
+    .should('have.length.greaterThan', 0)
+    .each(($card) => {
+      cy.wrap($card).find('span').invoke('text').should('match', /\S+/);
+    });
+});