read read notification in front end working

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

@@ -27,30 +27,8 @@ Comments:
     role: admin
   position:
     pageIndex: 1
-    x: "34.157449699143"
-    y: "50.965250965251"
-  date: 2024-11-17T11:51:35+01:00
-  id: m3lh8h5h
-  type: comment
-  isRead: false
-- 
-  page:
-    uri: projects/miss-dior-blooming-bouquet
-    title: Miss Dior Blooming Bouquet
-  file:
-    uuid: file://s0lNtRA0Z7ybTCWG
-  replies: [ ]
-  text: deuxième commentaire
-  author:
-    name: Adrien Payet
-    email: adrien.payet@outlook.com
-    uuid: user://WWjXgPWk
-    role: admin
-  position:
-    pageIndex: 1
-    x: '84.696990994209'
-    y: '56.949806949807'
-  date: 2024-11-17T11:59:37+01:00
-  id: m3lhisy6
-  type: comment
-  isRead: false
+    x: '25.96184356358'
+    y: '22.393822393822'
+  date: 2024-11-17T12:13:39+01:00
+  id: m3li0uhb
+  type: comment

public/site/plugins/comments/src/BaseComment.php

@@ -43,7 +43,6 @@ class BaseComment {
     $this->date = $date;
     $this->id = $id;
     $this->type = $type;
-    $this->isRead = false;
     $this->position = $position;
   }
 
@@ -79,20 +78,6 @@ class BaseComment {
     return $this->type;
   }
 
-  public function isRead() {
-    return $this->isRead;
-  }
-
-  public function read() {
-    $this->isRead = true;
-    return $this->isRead;
-  }
-  
-  public function unread() {
-    $this->isRead = false;
-    return $this->isRead;
-  }
-
   public function pageIndex() {
     $this->position['pageIndex'];
   }
@@ -108,7 +93,6 @@ class BaseComment {
         'date' => $this->date,
         'id' => $this->id,
         'type' => $this->type,
-        'isRead' => $this->isRead
     ];
   }
 }

public/site/plugins/notifications/user-methods/delete.php

@@ -15,7 +15,6 @@ return function($project, $notificationId) {
         }
       }
 
-      // Réindexation et ré-encodage en YAML avant la mise à jour
       $user->update([
         'notifications' => Yaml::encode(array_values($notifications))
       ]);

public/site/plugins/notifications/user-methods/send.php

@@ -14,6 +14,7 @@
  */
 
 return function ($projectUri, $notificationData) {
+  $notificationData['isRead'] = false;
   $recipients = page($projectUri)->managers()->toUsers()->not($this); 
   
   if (!$recipients) return;

src/components/comments/Comment.vue

@@ -2,7 +2,7 @@
   <article
     :id="`comment-${comment.id}`"
     class="comment | flow"
-    :data-status="setStatus(comment)"
+    :data-status="status"
   >
     <header>
       <p>
@@ -53,6 +53,7 @@ import "dayjs/locale/fr";
 import { useUserStore } from "../../stores/user";
 import { useApiStore } from "../../stores/api";
 import { useDialogStore } from "../../stores/dialog";
+import { computed } from "vue";
 
 dayjs.locale("fr");
 
@@ -68,17 +69,13 @@ const api = useApiStore();
 const dialog = useDialogStore();
 
 //  Functions
-function setStatus(comment) {
-  try {
-    if (!user?.notifications?.comments[comment.id].isRead) {
-      return "unread";
-    } else {
-      return undefined;
-    }
-  } catch (error) {
-    return undefined;
-  }
-}
+const status = computed(() => {
+  const correspondingNotification = user.notifications.find(
+    (notification) => notification.id === comment.id
+  );
+  if (!correspondingNotification) return undefined;
+  return correspondingNotification.isRead ? undefined : "unread";
+});
 
 function formatDate(date) {
   const todayNumber = parseInt(dayjs().format("YYMMD"));

src/components/comments/Comments.vue

@@ -12,7 +12,10 @@
             :comment="comment"
             :commentIndex="comments.length - commentIndex"
             :key="comment.id"
-            @click="openedComment = comment"
+            @click="
+              readNotification(comment);
+              openComment(comment);
+            "
             @update:file="changeFile"
             @close:comment="closeComment"
           />
@@ -244,6 +247,22 @@ function handleCommentPositionClick(event) {
   isAddOpen.value = true;
   toggleCommentPositionMode(false);
 }
+
+function readNotification(comment) {
+  const correspondingNotification = user.notifications.find(
+    (notification) => notification.id === comment.id
+  );
+
+  if (correspondingNotification) {
+    correspondingNotification.isRead = true;
+  }
+}
+
+function openComment(comment) {
+  if (comment.replies.length) {
+    openedComment.value = comment;
+  }
+}
 </script>
 
 <style>