refact: reconnect unread notifications stream

crlssn · Dec 2, 2024 · 769ed14 · 769ed14
1 parent 49b3205
commit 769ed14
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 3 deletions.
diff --git a/web/src/router/router.ts b/web/src/router/router.ts
@@ -18,6 +18,7 @@ import ListExercises from '@/ui/exercises/ListExercises.vue'
 import WorkoutRoutine from '@/ui/workouts/WorkoutRoutine.vue'
 import CreateExercise from '@/ui/exercises/CreateExercise.vue'
 import UpdateExercise from '@/ui/exercises/UpdateExercise.vue'
+import { useNotificationStore } from '@/stores/notifications.ts'
 import { createRouter, createWebHistory, type Router } from 'vue-router'
 import ListNotifications from '@/ui/notifications/ListNotifications.vue'
 
@@ -173,6 +174,10 @@ async function logout() {
   await AuthClient.logout(create(LogoutRequestSchema, {}))
   const authStore = useAuthStore()
   authStore.logout()
+
+  const notificationStore = useNotificationStore()
+  notificationStore.unreadCount = 0
+
   return {
     path: '/login',
   }

diff --git a/web/src/stores/notifications.ts b/web/src/stores/notifications.ts
@@ -9,9 +9,20 @@ export const useNotificationStore = defineStore('notifications', () => {
 
   const streamUnreadNotifications = async () => {
     const req = create(UnreadNotificationsRequestSchema, {})
-    const stream = NotificationClient.unreadNotifications(req)
-    for await (const message of stream) {
-      unreadCount.value = Number(message.count)
+    while (true) {
+      try {
+        const stream = NotificationClient.unreadNotifications(req)
+        for await (const message of stream) {
+          unreadCount.value = Number(message.count)
+        }
+
+        break
+      } catch (error) {
+        console.error('Stream disconnected, retrying...', error)
+      }
+
+      // Wait before retrying.
+      await new Promise((resolve) => setTimeout(resolve, 5000))
     }
   }
 

diff --git a/web/src/ui/auth/UserLogin.vue b/web/src/ui/auth/UserLogin.vue
@@ -9,11 +9,14 @@ import { RouterLink, useRoute } from 'vue-router'
 import { ConnectError } from '@connectrpc/connect'
 import AppButton from '@/ui/components/AppButton.vue'
 import { LoginRequestSchema } from '@/proto/api/v1/auth_pb.ts'
+import { useNotificationStore } from '@/stores/notifications.ts'
 
 const email = ref('')
 const password = ref('')
 const resError = ref('')
+
 const authStore = useAuthStore()
+const notificationStore = useNotificationStore()
 
 const login = async () => {
   const request = create(LoginRequestSchema, {
@@ -25,6 +28,7 @@ const login = async () => {
     const response = await AuthClient.login(request)
     authStore.setAccessToken(response.accessToken)
     authStore.setAccessTokenRefreshInterval(ScheduleTokenRefresh())
+    notificationStore.streamUnreadNotifications()
     await router.push('/home')
   } catch (error) {
     if (error instanceof ConnectError) {