From 78bc8426ddda202f2297685d4bccd79c68592798 Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Sat, 6 May 2023 02:22:58 +0200
Subject: [PATCH] fix: fix notification count

---
 front/src/components/notifications/NotificationRow.vue | 8 +++++---
 front/src/views/Notifications.vue                      | 6 +++---
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/front/src/components/notifications/NotificationRow.vue b/front/src/components/notifications/NotificationRow.vue
index 78e601dd8..06e661589 100644
--- a/front/src/components/notifications/NotificationRow.vue
+++ b/front/src/components/notifications/NotificationRow.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { Notification, LibraryFollow } from '~/types'
 
-import { computed, ref, watchEffect } from 'vue'
+import { computed, ref, watchEffect, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 
@@ -30,7 +30,7 @@ const notificationData = computed(() => {
 
   if (activity.type === 'Follow') {
     if (activity.object && activity.object.type === 'music.Library') {
-      const detailUrl = { name: 'content.libraries.detail', params: { id: activity.object.uuid } }
+      const detailUrl = { name: 'library.detail.edit', params: { id: activity.object.uuid } }
 
       if (activity.related_object?.approved === null) {
         return {
@@ -76,7 +76,7 @@ const notificationData = computed(() => {
 })
 
 const read = ref(false)
-watchEffect(async () => {
+watch(read, async () => {
   await axios.patch(`federation/inbox/${item.value.id}/`, { is_read: read.value })
 
   item.value.is_read = read.value
@@ -92,11 +92,13 @@ const handleAction = (handler?: () => void) => {
 const approveLibraryFollow = async (follow: LibraryFollow) => {
   await axios.post(`federation/follows/library/${follow.uuid}/accept/`)
   follow.approved = true
+  item.value.is_read = true
 }
 
 const rejectLibraryFollow = async (follow: LibraryFollow) => {
   await axios.post(`federation/follows/library/${follow.uuid}/reject/`)
   follow.approved = false
+  item.value.is_read = true
 }
 </script>
 
diff --git a/front/src/views/Notifications.vue b/front/src/views/Notifications.vue
index e330dd481..98fc34a2d 100644
--- a/front/src/views/Notifications.vue
+++ b/front/src/views/Notifications.vue
@@ -4,7 +4,7 @@ import type { Notification } from '~/types'
 import moment from 'moment'
 import axios from 'axios'
 
-import { ref, reactive, computed, watch, markRaw } from 'vue'
+import { ref, reactive, computed, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 
@@ -38,7 +38,7 @@ const fetchData = async () => {
   try {
     const response = await axios.get('federation/inbox/', { params: filters })
     notifications.count = response.data.count
-    notifications.results = response.data.results.map(markRaw)
+    notifications.results = response.data.results
   } catch (error) {
     useErrorHandler(error as Error)
   }
@@ -50,7 +50,7 @@ watch(filters, fetchData, { immediate: true })
 
 useWebSocketHandler('inbox.item_added', (event) => {
   notifications.count += 1
-  notifications.results.unshift(markRaw((event.item)))
+  notifications.results.unshift(event.item)
 })
 
 const instanceSupportMessageDelay = ref(60)