From 9b16a9df44fa54b96e24b910539712870895f3e7 Mon Sep 17 00:00:00 2001
From: Levin <github@17d.me>
Date: Thu, 14 Nov 2024 20:01:27 +0100
Subject: [PATCH] Prevent badge going below 0

---
 resources/vue/components/NotificationBell.vue | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/resources/vue/components/NotificationBell.vue b/resources/vue/components/NotificationBell.vue
index ecd74a79c..185c435d2 100644
--- a/resources/vue/components/NotificationBell.vue
+++ b/resources/vue/components/NotificationBell.vue
@@ -7,7 +7,7 @@ export default {
     setup() {
         const state = useNotificationsStore();
 
-        return { state };
+        return {state};
     },
     props: {
         link: {
@@ -47,18 +47,23 @@ export default {
     components: {
         ModalComponent,
         NotificationList
+    },
+    computed: {
+        count() {
+            return this.state.count < 0 ? 0 : this.state.count;
+        }
     }
 }
 </script>
 
 <template>
     <button @click="showModal" class="btn btn-link btn-transparent text-white notifications-board-toggle"
-       :class="{'nav-link': link, 'navbar-toggler': !link}" type="button"
-       aria-expanded="false"
-       :aria-label="$t('notifications.show')">
-        <span class="notifications-bell fa-bell" :class="{'fas': !!state.count,  'far': !state.count}"></span>
-        <span class="notifications-pill badge rounded-pill badge-notification" v-show="state.count">
-              {{ state.count }}
+            :class="{'nav-link': link, 'navbar-toggler': !link}" type="button"
+            aria-expanded="false"
+            :aria-label="$t('notifications.show')">
+        <span class="notifications-bell fa-bell" :class="{'fas': !!count,  'far': !count}"></span>
+        <span class="notifications-pill badge rounded-pill badge-notification" v-show="count">
+              {{ count }}
         </span>
     </button>
     <ModalComponent