read content notification on click

public/site/config/routes/validate-brief.php

@@ -9,7 +9,6 @@ return [
 
     $page = page($data->briefUri);
     $project = $page->parent();
-    $dialogUri = $data->dialogUri ? $data->dialogUri : null;
     
     try {
       $newPage = $page->update([
@@ -22,8 +21,6 @@ return [
       $notification = [
         'location' => [
           'page' => $page,
-          'project' => $project,
-          'dialogUri' => (string) $dialogUri,
         ],
         'date' => $dateTime->format('Y-m-d\TH:i:sP'),
         'text' => "Nouveau brief", 
@@ -32,7 +29,7 @@ return [
         'type' => 'content'
       ];
 
-      kirby()->user()->sendNotification($project, $notification);
+      $project->createNotification($notification);
 
       return [
         "success" => "'" . $project->title()->value() . "' brief validated."

src/components/comments/Comment.vue

@@ -147,7 +147,10 @@ function handleClick() {
 async function read() {
   if (getStatus.value !== "unread") return;
   try {
-    const newNotification = await api.readNotification(comment, page.value.uri);
+    const newNotification = await api.readNotification(
+      comment.id,
+      page.value.uri
+    );
     userStore.readNotification(comment.id, route.params.id);
   } catch (error) {
     console.log("Erreur lors de la lecture de la notification : ", error);

src/components/notifications/Content.vue

@@ -2,10 +2,7 @@
   <article
     class="notification | bg-white rounded-lg | p-16 | flow"
     data-type="content"
-    @click="
+    @click="readNotification()"
-      read(notification);
-      router.push(notification.location.page.uri);
-    "
     title="Aller au contenu"
   >
     <header>
@@ -16,7 +13,7 @@
           >Contenu</strong
         >
         <span class="notification__client | text-grey-700">{{
-          notification.location.project.title
+          notification.project.title
         }}</span>
         <time
           datetime=""
@@ -37,8 +34,17 @@
 <script setup>
 import { useRouter } from "vue-router";
 import { useNotificationsStore } from "../../stores/notifications";
+import { useUserStore } from "../../stores/user";
+import { useApiStore } from "../../stores/api";
 
 const router = useRouter();
 const { notification } = defineProps({ notification: Object });
-const { formatDate, read } = useNotificationsStore();
+const { formatDate } = useNotificationsStore();
+const userStore = useUserStore();
+const api = useApiStore();
+
+function readNotification() {
+  api.readNotification(notification.id, notification.project.uri);
+  userStore.readNotification(notification.id, notification.project.slug);
+}
 </script>

src/components/notifications/Reply.vue

@@ -17,7 +17,7 @@
           }}</strong
         >
         <span class="notification__client | text-grey-700">{{
-          notification.location.project.title
+          notification.project.title
         }}</span>
         <time
           datetime=""

src/stores/api.js

@@ -149,12 +149,12 @@ export const useApiStore = defineStore("api", () => {
    * @param {string} projectId UUID or URI
    * @returns status with message if error
    */
-  async function readNotification(comment, projectId) {
+  async function readNotification(notificationId, projectId) {
     const headers = {
       method: "POST",
       body: JSON.stringify({
         projectId,
-        notificationId: comment.id,
+        notificationId,
       }),
     };
     try {

src/views/Brief.vue

@@ -13,7 +13,10 @@
         class="btn | ml-auto"
         @click="validate"
         v-if="page.content.isvalidated != 'true'"
-        :disabled="page.files.length === 0"
+        :disabled="page.moodboard.length === 0"
+        :title="
+          page.moodboard.length === 0 ? 'Ajoutez au moins une image' : undefined
+        "
       >
         Valider et envoyer le brief
       </button>

src/views/Notifications.vue

@@ -129,7 +129,7 @@ function getHref(notification) {
 
   const isDocumentBrief =
     notification.location.page.template === "client-brief" &&
-    notification.location?.file.type === "document";
+    notification.location?.file?.type === "document";
 
   if (isDocumentBrief) {
     return notification.project.uri + "?dialog=client-brief&comments=true";