:recycle: moved chatter and toaster to login | gracefully handle toast when switching profile

backend/lib/routes/notification/index.js

                 name: 'BDGRS',
                 price: (500 + Math.floor(Math.random() * 100)).toString(),
                 order: null,
+                type: 'info',
             }
 
             // Write to the input stream

frontend/src/App.vue

 import 'wave-ui/dist/wave-ui.css'
 import SideBar from './components/SideBar.vue'
 
-import { Chatter, currentProfile, StonkAlert } from './services'
+import { currentProfile } from './services'
 import { surveyFactory } from './utils'
 
 const DEV_MODE = import.meta.env.VITE_DEV == 'true'
         if (DEV_MODE) {
             this.setPid(DEV_PID)
         }
-
-        if (currentProfile.isLoggedIn) {
-            console.warn(`setting up Chatter and Toaster for ${this.getPid}...`)
-            this.setupChatter()
-            this.setupToaster()
-        }
-        console.log('---')
     },
     methods: {
         /**
          * Sync up this components state with
          * the currentProfile handler
          */
-        setPid(profileId) {
-            currentProfile.login(profileId)
-        },
+        async setPid(profileId) {
+            if (currentProfile.isLoggedIn) {
+                currentProfile.logout()
+            }
+            await currentProfile.login(profileId)
 
-        /**
-         * For push notifications and chat
-         */
-        setupToaster() {
-            const t = new StonkAlert(this.getPid)
-        },
-        setupChatter() {
-            const c = new Chatter()
-            const testAccountUUID = import.meta.env.VITE_TEST_ACCOUNT_UUID
-            c.setup(testAccountUUID)
+            if (currentProfile.isLoggedIn) {
+                console.warn(
+                    `setting up Chatter and Toaster for ${this.getPid}...`,
+                )
+                currentProfile.setupChatter()
+                currentProfile.setupToaster(this.$waveui.notify)
+            }
+            console.log('---')
         },
     },
 }

frontend/src/services/login.service.js

 import { ref } from 'vue'
-import { fetchResponsesByProfileId } from '../services'
+import { fetchResponsesByProfileId, Chatter, StonkAlert } from '../services'
 import { surveyFactory } from '../utils'
 
 /**
 class Login {
     constructor() {
         this._loading = false
-        
+
         // Make reactive with vue observer
         this.id = ref(null)
 
         this.responses = []
         this.tags = []
+
+        this.toaster = null
+        this.chatter = null
     }
     get isLoading() {
         return this._loading
     }
     /**
      * Combine questions retrieved from the database and
-     * questions defined in out lang file and 
+     * questions defined in out lang file and
      * copare to responses stored
      * @returns {boolean}
      */
     get isComplete() {
-        return this.responses.length == surveyFactory.questionsFromDb.length && surveyFactory.questionsFromDb.length > 0
+        return (
+            this.responses.length == surveyFactory.questionsFromDb.length &&
+            surveyFactory.questionsFromDb.length > 0
+        )
     }
     /**
      * Check that some responses are set
      */
     get hasResponses() {
         return this.responses.length && this.responses.length > 0
-    } 
+    }
 
     /**
      * Login a profile by id number
      * @param {number} profileId
      * @returns {number} stored reactive id
      */
-     async login(profileId) {
+    async login(profileId) {
         console.warn('logging in:', profileId)
         this.id.value = parseInt(profileId)
         return this.id.value
     }
-    logout() { this.id.value = null }
-    
+    logout() {
+        this.id.value = null
+        if (this.toaster) {
+            this.toaster.stop()
+        }
+        if (this.chatter) {
+            this.toaster.stop()
+        }
+    }
+
     async getTags() {
         try {
             const tags = []
             console.error(err)
         }
     }
-    setTags(tags) { this.tags = tags }
+    setTags(tags) {
+        this.tags = tags
+    }
 
     async getResponses() {
         try {
             console.error(err)
         }
     }
-    setResponses(responses) { this.responses = responses }
+    setResponses(responses) {
+        this.responses = responses
+    }
+    /**
+     * For push notifications and chat
+     */
+    setupToaster(waveCb) {
+        this.toaster = new StonkAlert(this.id.value, waveCb)
+    }
+    setupChatter() {
+        this.chatter = new Chatter()
+        const testAccountUUID = import.meta.env.VITE_TEST_ACCOUNT_UUID
+        this.chatter.setup(testAccountUUID)
+    }
 }
 
 const currentProfile = new Login()

frontend/src/services/notification.service.js

     listenFor(event, callback) {
         this.source.addEventListener(event, callback)
     }
+    stop() {
+        this.source.close()
+    }
 }
 
 /**
  * Example extension that listens for 'stonk' events
  */
 class StonkAlert extends Toaster {
-    constructor(profileId) {
+    constructor(profileId, waveCb) {
         super(profileId)
-
+        this.event = 'stonk'
         this.stonks = {}
-        this.listenFor(`${profileId}.stonk`, message => {
+        this.listenFor(`${profileId}.${this.event}`, message => {
             const parsed = JSON.parse(message.data)
             this.stonks[parsed.name] = parsed
-            console.log('updated:', this.stonks)
+            waveCb(this._formatToast(parsed), parsed.type)
         })
     }
+    _formatToast(parsed) {
+        return `${parsed.name}: ${parsed.profile_id} ${parsed.order} at ${parsed.price}`
+    }
 }
 
-export { Toaster, StonkAlert }
+export { Toaster, StonkAlert }