diff --git a/src/components/users/NotificationList.vue b/src/components/users/NotificationList.vue
index 67aa1a7..8ee6333 100644
--- a/src/components/users/NotificationList.vue
+++ b/src/components/users/NotificationList.vue
@@ -12,7 +12,8 @@
 
     <v-list v-if="notify.notifications.length <= 0" class="w-[380px]" density="compact">
       <v-list-item>
-        <v-alert class="text-sm" variant="tonal" type="info">You are done! There is no unread notifications for you.</v-alert>
+        <v-alert class="text-sm" variant="tonal" type="info">You are done! There is no unread notifications for you.
+        </v-alert>
       </v-list-item>
     </v-list>
 
@@ -36,8 +37,8 @@
 <script setup lang="ts">
 import { request } from "@/scripts/request"
 import { getAtk } from "@/stores/userinfo"
-import { computed, onMounted, onUnmounted, ref } from "vue";
-import { useNotifications } from "@/stores/notifications";
+import { computed, onMounted, onUnmounted, ref } from "vue"
+import { useNotifications } from "@/stores/notifications"
 import { useUI } from "@/stores/ui"
 
 const notify = useNotifications()
@@ -47,10 +48,15 @@ const submitting = ref(false)
 const loading = computed(() => notify.loading || submitting.value)
 
 async function markAsRead(item: any, idx: number) {
+  if (item.is_realtime) {
+    notify.remove(idx)
+    return
+  }
+
   submitting.value = true
   const res = await request("identity", `/api/notifications/${item.id}/read`, {
     method: "PUT",
-    headers: { Authorization: `Bearer ${getAtk()}` },
+    headers: { Authorization: `Bearer ${await getAtk()}` }
   })
   if (res.status !== 200) {
     showErrorSnackbar(await res.text())