feat(web): notification bell with polling and dropdown

web/src/composables/useNotifications.ts

@@ -0,0 +1,31 @@
+import { onMounted, onUnmounted, ref } from 'vue'
+import { notificationsApi } from '@/api/notifications'
+import { useNotificationsStore } from '@/stores/notifications'
+
+const POLL_INTERVAL_MS = 30_000
+
+export function useUnreadPoller() {
+  const store = useNotificationsStore()
+  let timer: ReturnType<typeof setInterval> | null = null
+  const error = ref<string | null>(null)
+
+  async function refresh() {
+    try {
+      const { count } = await notificationsApi.unreadCount()
+      store.setUnreadCount(count)
+    } catch (e) {
+      error.value = String(e)
+    }
+  }
+
+  onMounted(() => {
+    refresh()
+    timer = setInterval(refresh, POLL_INTERVAL_MS)
+  })
+
+  onUnmounted(() => {
+    if (timer) clearInterval(timer)
+  })
+
+  return { refresh, error }
+}