improved initial notifications fetching

src/components/notifications/notifications.js

@@ -47,6 +47,11 @@ const Notifications = {
   components: {
     Notification
   },
+  created () {
+    const { dispatch } = this.$store
+
+    dispatch('fetchAndUpdateNotifications')
+  },
   watch: {
     unseenCount (count) {
       if (count > 0) {

src/modules/api.js

@@ -31,18 +31,32 @@ const api = {
   },
   actions: {
     startMastoSocket (store) {
-      store.state.mastoSocket = store.state.backendInteractor
+      const { state, dispatch } = store
+      state.mastoSocket = state.backendInteractor
         .startUserSocket({
           store,
           onMessage: (message) => {
             if (!message) return
             if (message.event === 'notification') {
-              store.dispatch('addNewNotifications', { notifications: [message.notification], older: false })
+              dispatch('addNewNotifications', {
+                notifications: [message.notification],
+                older: false
+              })
             } else if (message.event === 'update') {
-              store.dispatch('addNewStatuses', { statuses: [message.status], userId: false, showImmediately: false, timeline: 'friends' })
+              dispatch('addNewStatuses', {
+                statuses: [message.status],
+                userId: false,
+                showImmediately: false,
+                timeline: 'friends'
+              })
             }
           }
         })
+      state.mastoSocket.addEventListener('error', error => {
+        console.error('Error with MastoAPI websocket:', error)
+        dispatch('startFetchingTimeline', { timeline: 'friends' })
+        dispatch('startFetchingNotifications')
+      })
     },
     startFetchingTimeline (store, { timeline = 'friends', tag = false, userId = false }) {
       // Don't start fetching if we already are.
@@ -58,6 +72,9 @@ const api = {
       const fetcher = store.state.backendInteractor.startFetchingNotifications({ store })
       store.commit('addFetcher', { fetcherName: 'notifications', fetcher })
     },
+    fetchAndUpdateNotifications (store) {
+      store.state.backendInteractor.fetchAndUpdateNotifications({ store })
+    },
     startFetchingFollowRequest (store) {
       // Don't start fetching if we already are.
       if (store.state.fetchers['followRequest']) return

src/modules/users.js

@@ -470,7 +470,7 @@ const users = {
               }
 
               store.dispatch('startMastoSocket').catch((error) => {
-                console.error(error)
+                console.error('Failed initializing MastoAPI Streaming socket', error)
                 // Start getting fresh posts.
                 store.dispatch('startFetchingTimeline', { timeline: 'friends' })
 

src/services/backend_interactor_service/backend_interactor_service.js

@@ -12,18 +12,23 @@ const backendInteractorService = credentials => ({
     return notificationsFetcher.startFetching({ store, credentials })
   },
 
+  fetchAndUpdateNotifications ({ store }) {
+    return notificationsFetcher.fetchAndUpdate({ store, credentials })
+  },
+
   startFetchingFollowRequest ({ store }) {
     return followRequestFetcher.startFetching({ store, credentials })
   },
 
   startUserSocket ({ store, onMessage }) {
-    const serv = store.rootState.instance.server.replace('https', 'wss')
+    const serv = store.rootState.instance.server.replace('http', 'ws')
-    // const serb = 'ws://localhost:8080/'
     const url = serv + getMastodonSocketURI({ credentials, stream: 'user' })
     const socket = new WebSocket(url)
     console.log(socket)
     if (socket) {
       socket.addEventListener('message', (wsEvent) => onMessage(handleMastoWS(wsEvent)))
+      socket.addEventListener('error', (error) => console.error('WebSocket Error:', error))
+      return socket
     } else {
       throw new Error('failed to connect to socket')
     }