From ac48b4166a56f3bcfd83e5b086203273c47aa82d Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Wed, 30 Oct 2024 16:32:13 +0100
Subject: [PATCH] delete comment / reply working

---
 ...-bureaux-artistiquement-consideree.pdf.txt | 46 ++---------------
 .../site/plugins/comments/routes/delete.php   | 48 +++++++++++++++---
 src/components/comments/Comment.vue           | 50 +++++++++++++++----
 src/components/comments/Comments.vue          | 22 +++++++-
 src/stores/api.js                             | 24 +++++++++
 5 files changed, 131 insertions(+), 59 deletions(-)

diff --git a/public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/38969543_extrait-de-louis-sullivan-form-follow-function.-de-la-tour-de-bureaux-artistiquement-consideree.pdf.txt b/public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/38969543_extrait-de-louis-sullivan-form-follow-function.-de-la-tour-de-bureaux-artistiquement-consideree.pdf.txt
index fe45d56..83d0a8e 100644
--- a/public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/38969543_extrait-de-louis-sullivan-form-follow-function.-de-la-tour-de-bureaux-artistiquement-consideree.pdf.txt
+++ b/public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/38969543_extrait-de-louis-sullivan-form-follow-function.-de-la-tour-de-bureaux-artistiquement-consideree.pdf.txt
@@ -19,53 +19,15 @@ Comments:
   file:
     uuid: file://s0lNtRA0Z7ybTCWG
     pageIndex: 1
-  replies:
-    - 
-      page:
-        uri: projects/miss-dior-blooming-bouquet
-        title: Miss Dior Blooming Bouquet
-      file:
-        uuid: file://s0lNtRA0Z7ybTCWG
-        pageIndex: 1
-      replies: [ ]
-      text: Test de réponse
-      author:
-        name: Adrien Payet
-        email: adrien.payet@outlook.com
-        uuid: user://WWjXgPWk
-        role: admin
-      date: 2024-10-30T12:26:44+01:00
-      id: m2vskcko
-      type: comment
-      isRead: false
-      parentId: m2vsk6jn
-    - 
-      page:
-        uri: projects/miss-dior-blooming-bouquet
-        title: Miss Dior Blooming Bouquet
-      file:
-        uuid: file://s0lNtRA0Z7ybTCWG
-        pageIndex: 1
-      replies: [ ]
-      text: deuxième réponse
-      author:
-        name: Adrien Payet
-        email: adrien.payet@outlook.com
-        uuid: user://WWjXgPWk
-        role: admin
-      date: 2024-10-30T12:27:42+01:00
-      id: m2vslkxg
-      type: comment
-      isRead: false
-      parentId: m2vsk6jn
-  text: Un premier commentaire
+  replies: [ ]
+  text: Un certain commentaire
   author:
     name: Adrien Payet
     email: adrien.payet@outlook.com
     uuid: user://WWjXgPWk
     role: admin
-  date: 2024-10-30T12:26:37+01:00
-  id: m2vsk6jn
+  date: 2024-10-30T16:26:22+01:00
+  id: m2w14iph
   type: comment
   isRead: false
   position:
diff --git a/public/site/plugins/comments/routes/delete.php b/public/site/plugins/comments/routes/delete.php
index 9c5bced..cc3ac57 100644
--- a/public/site/plugins/comments/routes/delete.php
+++ b/public/site/plugins/comments/routes/delete.php
@@ -7,14 +7,50 @@ return [
       $json = file_get_contents('php://input');
       $data = json_decode($json);
 
-      $page = page($data->pageUri);
-      $file = $page->file($data->fileName);
-      $user = kirby()->user($data->userUuid);
-
+      $page = page($data->page->uri);
+      $file = $page->file($data->file->uuid);
+      $isReply = $data->parentId ?? false;
 
       $comments = $file->comments()->isEmpty() == true ? [] : Yaml::decode($file->comments()->value());
 
-      unset($comments[$data->id] );
+      foreach ($comments as $key => &$comment) {
+        if ($isReply) {
+          if ($comment['id'] === $data->parentId) {
+            foreach ($comment['replies'] as $replyKey => $reply) {
+              if ($reply['id'] === $data->id) {
+                unset($comment['replies'][$replyKey]);
+                $comment['replies'] = array_values($comment['replies']);
+              }
+            }
+          }
+        } else {
+          if ($comment['id'] === $data->id) {
+            unset($comments[$key]);
+          }
+        }
+      }
+
+      $comments = array_values($comments); // Réindexe les commentaires
+
+      foreach (kirby()->users() as $user) {
+        try {
+          $notifications = $user->notifications()->isNotEmpty() 
+              ? Yaml::decode($user->notifications()->value())
+              : [];          
+              
+          foreach ($notifications as $key => $notification) {
+            if ($notification['id'] === $data->id) {
+              unset($notifications[$key]);
+            }
+          }
+    
+          $user->update([
+            'notifications' => $notifications
+          ]);
+        } catch (\Throwable $th) {
+          throw new Exception("Error updating notifications: " . $th->getMessage() . ' line ' . $th->getLine(), 1);
+        }
+      }
       
       $newFile = $file->update([
         'comments' => $comments
@@ -22,4 +58,4 @@ return [
 
       return getFileData($newFile);
   }
-];
\ No newline at end of file
+];
diff --git a/src/components/comments/Comment.vue b/src/components/comments/Comment.vue
index 9c249fa..370af66 100644
--- a/src/components/comments/Comment.vue
+++ b/src/components/comments/Comment.vue
@@ -8,20 +8,36 @@
           •
         </template>
         <span class="comment__page">Page {{ comment.file.pageIndex }}</span>
-        <time class="comment__date" :datetime="dayjs(comment.date).format('YYYY-MM-DD')">{{
-          formatDate(comment.date)
-        }}</time>
+        <time
+          class="comment__date"
+          :datetime="dayjs(comment.date).format('YYYY-MM-DD')"
+          >{{ formatDate(comment.date) }}</time
+        >
       </p>
     </header>
     <p class="comment__body">
       {{ comment.text }}
     </p>
-    <footer v-if="comment.replies?.length > 0" class="comment__replies">
-      <p>{{ comment.replies.length }} réponse{{ comment.replies.length > 1 ? 's' : '' }}</p>
-      <!-- TODO: n'afficher que s'il s'agit du commentaire de l'utilisateur actuellement connecté -->
-      <div class="comment__ctas | mt-8">
-        <button class="btn btn--transparent btn--icon btn--sm" data-icon="edit"><span class="sr-only">Éditer</span></button>
-        <button class="btn btn--transparent btn--icon btn--sm" data-icon="delete"><span class="sr-only">Supprimer</span></button>
+    <footer class="comment__replies">
+      <p v-if="comment.replies?.length > 0">
+        {{ comment.replies.length }} réponse{{
+          comment.replies.length > 1 ? "s" : ""
+        }}
+      </p>
+      <div
+        v-if="comment.author.uuid === user.uuid"
+        class="comment__ctas | mt-8"
+      >
+        <button class="btn btn--transparent btn--icon btn--sm" data-icon="edit">
+          <span class="sr-only">Éditer</span>
+        </button>
+        <button
+          class="btn btn--transparent btn--icon btn--sm"
+          data-icon="delete"
+          @click="deleteComment($event, comment)"
+        >
+          <span class="sr-only">Supprimer</span>
+        </button>
       </div>
     </footer>
   </article>
@@ -30,6 +46,8 @@
 <script setup>
 import dayjs from "dayjs";
 import "dayjs/locale/fr";
+import { useUserStore } from "../../stores/user";
+import { useApiStore } from "../../stores/api";
 
 dayjs.locale("fr");
 
@@ -38,6 +56,11 @@ const { comment, commentIndex } = defineProps({
   commentIndex: Number,
 });
 
+const emits = defineEmits(["update:file", "close:comment"]);
+
+const { user } = useUserStore();
+const api = useApiStore();
+
 //  Functions
 function setStatus(comment) {
   try {
@@ -80,6 +103,15 @@ async function readNotification(notificationId) {
 
   user.notifications = newNotifications;
 }
+
+async function deleteComment(event, comment) {
+  event.stopPropagation();
+  const newFile = await api.deleteComment(comment);
+  emits("update:file", newFile);
+  if (comment.parentId) {
+    emits("close:comment");
+  }
+}
 </script>
 
 <style scoped>
diff --git a/src/components/comments/Comments.vue b/src/components/comments/Comments.vue
index 8a8e555..3328986 100644
--- a/src/components/comments/Comments.vue
+++ b/src/components/comments/Comments.vue
@@ -10,6 +10,8 @@
             :commentIndex="comments.length - commentIndex"
             :key="comment.id"
             @click="openedComment = comment"
+            @update:file="changeFile"
+            @close:comment="closeComment"
           />
         </template>
         <template v-else>
@@ -23,13 +25,20 @@
           >
             <span>Retour à la liste</span>
           </button>
-          <Comment :comment="openedComment" data-opened="true" />
+          <Comment
+            :comment="openedComment"
+            data-opened="true"
+            @update:file="changeFile"
+            @close:comment="closeComment"
+          />
           <div v-if="sortedReplies.length > 0" class="replies | flow">
             <Comment
               v-for="(reply, commentIndex) in sortedReplies"
               :comment="reply"
               :commentIndex="sortedReplies.length - commentIndex"
               :key="reply.id"
+              @update:file="changeFile"
+              @close:comment="closeComment"
             />
           </div>
         </template>
@@ -154,6 +163,15 @@ async function addComment(newComment) {
   isAddOpen.value = false;
   emits("update:file", newFile);
 }
+
+function changeFile(newFile) {
+  console.log(newFile);
+  emits("update:file", newFile);
+}
+
+function closeComment() {
+  openedComment.value = null;
+}
 </script>
 
 <style>
@@ -208,4 +226,4 @@ async function addComment(newComment) {
 #comments-container form footer > * {
   flex-grow: 1;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/stores/api.js b/src/stores/api.js
index 87661da..9cae23b 100644
--- a/src/stores/api.js
+++ b/src/stores/api.js
@@ -144,6 +144,29 @@ export const useApiStore = defineStore("api", () => {
     }
   }
 
+  async function deleteComment(comment) {
+    const headers = {
+      method: "POST",
+      body: JSON.stringify(comment),
+    };
+
+    try {
+      const response = await fetch("/delete-comment.json", headers);
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
+      const newFile = await response.json();
+      return newFile;
+    } catch (error) {
+      console.error(
+        "Une erreur s'est produite lors de la suppression du commentaire :",
+        comment,
+        error
+      );
+      throw error;
+    }
+  }
+
   async function replyComment(comment) {
     const headers = {
       method: "POST",
@@ -198,6 +221,7 @@ export const useApiStore = defineStore("api", () => {
     fetchData,
     fetchRoute,
     addComment,
+    deleteComment,
     replyComment,
     readNotification,
   };