create opened comment structure

src/components/comments/Comments.vue

@@ -2,6 +2,7 @@
   <aside id="comments-container" aria-labelledby="comments-label">
     <h2 id="comments-label" class="sr-only">Commentaires</h2>
     <div class="comments | flow">
+      <template v-if="!openedComment">
         <article
           v-for="(comment, commentIndex) in Object.values(comments).reverse()"
           :key="commentIndex"
@@ -23,6 +24,15 @@
             {{ comment.text }}
           </p>
         </article>
+      </template>
+      <template v-else>
+        <article>
+          {{ openedComment.title }}
+        </article>
+        <div class="replies">
+          <article v-for="reply in openedComment.replies"></article>
+        </div>
+      </template>
     </div>
     <button
       id="create-comment"
@@ -74,10 +84,13 @@ const { currentPageIndex, file, comments } = defineProps({
   file: Object,
   comments: Object,
 });
+
 const { user } = useUserStore();
 const { page } = usePageStore();
 const api = useApiStore();
 
+const openedComment = ref(null);
+
 const newCommentText = ref("");
 const isAddOpen = ref(false);
 const emits = defineEmits(["update:file"]);