:sparkles: sse push updates!

backend/lib/index.js

@@ -2,6 +2,7 @@ const UserPlugin = require('./plugins/user')
 const MembershipPlugin = require('./plugins/membership')
 const SurveyPlugin = require('./plugins/survey')
 const ProfilePlugin = require('./plugins/profile')
+const NotificationPlugin = require('./plugins/notification')
 
 /**
  * A Hapi server instance
@@ -40,5 +41,9 @@ exports.plugin = {
         await server.register(ProfilePlugin, {
             routes: { prefix: '/profile' },
         })
+        
+        await server.register(NotificationPlugin, {
+            routes: { prefix: '/notification' },
+        })
     },
 }

backend/lib/plugins/notification.js

@@ -0,0 +1,75 @@
+const Stream = require('stream')
+const PassThrough = Stream.PassThrough
+const Transform = Stream.Transform
+const NotificationRoute = require('../routes/notification')
+
+const stringifyEvent = function (event) {
+    let str = ''
+    const endl = '\r\n'
+    for (const i in event) {
+        let val = event[i]
+        if (val instanceof Buffer) { val = val.toString() }
+        if (typeof val === 'object') { val = JSON.stringify(val) }
+        str += i + ': ' + val + endl
+    }
+    str += endl
+    return str
+}
+
+class Transformer extends Transform {
+    constructor(options, objectMode) {
+        super({ objectMode })
+        options = options || {}
+        this.counter = 1
+        this.event = options.event || null
+        this.generateId = options.generateId ? options.generateId : () => {
+            return this.counter++
+        }
+    }
+    _transform (chunk, encoding, callback) {
+        const event = {
+            id: this.generateId(chunk),
+            data: chunk
+        }
+        if (this.event) { event.event = this.event }
+        this.push(stringifyEvent(event))
+        callback()
+    }
+    _flush(callback) {
+        this.push(stringifyEvent({ event: 'end', data: '' }))
+        callback()
+    }
+} 
+
+const writeEvent = function (event, stream) {
+    if (event) {
+        stream.write(stringifyEvent(event))
+    } else {
+        // closing time
+        stream.write(stringifyEvent({ event: 'end', data: '' }))
+        stream.end()
+    }
+}
+
+const onEvent = (event, h, streamOptions) => {
+    // We only support ObjectMode streams
+    if (!event._readableState.objectMode) return
+
+    const through = new Transformer(streamOptions, true)
+    const active = new PassThrough()
+    through.pipe(active)
+    event.pipe(through)
+    console.log(event)
+    return h.response(active)
+        .header('content-type', 'text/event-stream')
+        .header('content-encoding', 'identity')
+}
+
+module.exports = {
+    name: 'notification-plugin',
+    version: '1.0.0',
+    register: async (server, options) => {
+        await server.route(NotificationRoute)
+        server.decorate('toolkit', 'event', onEvent)
+    }
+}

backend/lib/routes/membership/join.js

@@ -71,7 +71,7 @@ module.exports = {
                     groupingToWrite,
                     role,
                 )
-                console.log(memberships)
+                // console.log(memberships)
                 return h
                     .response({
                         ok: true,

backend/lib/routes/notification/index.js

@@ -0,0 +1,53 @@
+const Joi = require('joi')
+const apiSchema = require('../../schemas/api')
+const errorSchema = require('../../schemas/errors')
+const Stream = require('stream')
+const PassThrough = require('stream').PassThrough
+
+const pluginConfig = {
+    handlerType: 'notifictaion',
+    docs: {
+        description: 'subscribe',
+        notes: 'Subscribe to notifications based on profile_id',
+    },
+}
+
+const validators = {
+    params: Joi.object({
+        profile_id: Joi.number(),
+    })
+}
+
+module.exports = {
+    method: 'GET',
+    path: '/{profile_id}/subscribe',
+    options: {
+        ...pluginConfig.docs,
+        tags: ['api'],
+        auth: false,
+        cors: true,
+        handler: async (request, h) => {
+            const input = new PassThrough({ objectMode: true })
+            const eventType = 'stonk'
+
+            const msg = { name: 'BDGRS', price: (500 + Math.floor(Math.random() * 100)).toString(), order: null }
+
+            // Write to the input stream
+            setInterval(() => {
+                msg.order = Math.floor(Math.random() * 2) === 1 ? 'BUY' : 'SELL'
+                input.write(msg)
+            }, 5000)
+
+            // h.event() Added at plugin registration
+            // h is the toolkit
+            return h.event(input, h, { event: eventType })
+        },
+
+        /** Validate based on validators object */
+         validate: {
+            ...validators,
+            failAction: 'log'
+        },
+
+    },
+}

backend/lib/routes/profile/queue.js

@@ -52,7 +52,7 @@ module.exports = {
 
             const queue = await matchQueueService.getQueue(profile_id)
             const queueIds = queue.map(entry => entry.target_id)
-            console.log('queueIds', queueIds)
+            // console.log('queueIds', queueIds)
             const res =  {
                 ok:true,
                 handler: pluginConfig.handlerType,
@@ -63,10 +63,10 @@ module.exports = {
             // queueIds spits out the queue profiles in the correct order
             // ~However~ when it goes through getProfilesFor
             // it comes back in literal database order regardless of is_deleted status
-            console.log(
-                'include_profile results',
-                await profileService.getProfilesFor(queueIds),
-            )
+            // console.log(
+            //     'include_profile results',
+            //     await profileService.getProfilesFor(queueIds),
+            // )
             if(include_profile) {
                 res.data = await profileService.getProfilesFor(queueIds)
             }

backend/package-lock.json

@@ -1052,9 +1052,9 @@
       "dev": true
     },
     "ansi-regex": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
-      "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
       "dev": true
     },
     "ansi-styles": {
@@ -1240,25 +1240,25 @@
           "dev": true
         },
         "boxen": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.0.1.tgz",
-          "integrity": "sha512-49VBlw+PrWEF51aCmy7QIteYPIFZxSpvqBdP/2itCPPlJ49kj9zg/XPRFrdkne2W+CfwXUls8exMvu1RysZpKA==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz",
+          "integrity": "sha512-9gYgQKXx+1nP8mP7CzFyaUARhg7D3n1dF/FnErWmu9l6JvGpNUN278h0aSb+QjoiKSWG+iZ3uHrcqk0qrY9RQQ==",
           "dev": true,
           "requires": {
             "ansi-align": "^3.0.0",
             "camelcase": "^6.2.0",
             "chalk": "^4.1.0",
             "cli-boxes": "^2.2.1",
-            "string-width": "^4.2.0",
+            "string-width": "^4.2.2",
             "type-fest": "^0.20.2",
             "widest-line": "^3.1.0",
             "wrap-ansi": "^7.0.0"
           }
         },
         "camelcase": {
-          "version": "6.2.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.2.0.tgz",
-          "integrity": "sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg==",
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
+          "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
           "dev": true
         },
         "chalk": {
@@ -3063,17 +3063,17 @@
       }
     },
     "hapi-swagger": {
-      "version": "14.1.3",
-      "resolved": "https://registry.npmjs.org/hapi-swagger/-/hapi-swagger-14.1.3.tgz",
-      "integrity": "sha512-Lb4LuJ4VCg/D4xeat/c9aMCpifuTKMgVC8taazB+Dn8evRRTyoymccGouk1H9VI35maV7F1dxzyZJ5ur+C2b/A==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/hapi-swagger/-/hapi-swagger-14.2.5.tgz",
+      "integrity": "sha512-rIxwCT9i+R9E9Z5m9BT15rwYI58IOKTKu7NEx9+pHO5aVeJK703qW3PWk72D7x9MSAnhmlJoEyUiFAU+6zQJ9A==",
       "requires": {
         "@hapi/boom": "^9.1.0",
         "@hapi/hoek": "^9.0.2",
-        "handlebars": "^4.5.3",
+        "handlebars": "^4.7.7",
         "http-status": "^1.0.1",
         "json-schema-ref-parser": "^6.1.0",
         "swagger-parser": "4.0.2",
-        "swagger-ui-dist": "^3.47.1"
+        "swagger-ui-dist": "^4.5.0"
       }
     },
     "has": {
@@ -4538,9 +4538,9 @@
       }
     },
     "objection": {
-      "version": "2.2.15",
-      "resolved": "https://registry.npmjs.org/objection/-/objection-2.2.15.tgz",
-      "integrity": "sha512-ZOLJDigE9Z2ppk3C//S2fcWL6ph2jUe6Cwl0CEpslTZegnnOeG6RPIV80nhPAaghWjl/8F2kox/w89VVBN4ccg==",
+      "version": "2.2.18",
+      "resolved": "https://registry.npmjs.org/objection/-/objection-2.2.18.tgz",
+      "integrity": "sha512-la7dWwKzpw+Sh4ROWWrZycq2k2z0IyYv3kb8rTPJPIRKuyV59DlSSctALPs5Feoi8I3RNxo3vnCuVoNcKgxthw==",
       "requires": {
         "ajv": "^6.12.6",
         "db-errors": "^0.2.3"
@@ -5848,9 +5848,9 @@
       "integrity": "sha1-cAcEaNbSl3ylI3suUZyn0Gouo/0="
     },
     "swagger-ui-dist": {
-      "version": "3.49.0",
-      "resolved": "https://registry.npmjs.org/swagger-ui-dist/-/swagger-ui-dist-3.49.0.tgz",
-      "integrity": "sha512-R1+eT16XNP1bBLfacISifZAkFJlpwvWsS2vVurF5pbIFZnmCasD/hj+9r/q7urYdQyb0B6v11mDnuYU7rUpfQg=="
+      "version": "4.5.2",
+      "resolved": "https://registry.npmjs.org/swagger-ui-dist/-/swagger-ui-dist-4.5.2.tgz",
+      "integrity": "sha512-wV4w54eW9z+VKbYJBJfULfqO05otCbM9jwgRIkwRl9CrfTVKelDzyhhEvdUQkGUzro+Ir8TOZPiZgKIdIdolWQ=="
     },
     "table": {
       "version": "6.7.1",
@@ -6002,9 +6002,9 @@
       }
     },
     "trim-off-newlines": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/trim-off-newlines/-/trim-off-newlines-1.0.1.tgz",
-      "integrity": "sha1-n5up2e+odkw4dpi8v+sshI8RrbM=",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/trim-off-newlines/-/trim-off-newlines-1.0.3.tgz",
+      "integrity": "sha512-kh6Tu6GbeSNMGfrrZh6Bb/4ZEHV1QlB4xNDBeog8Y9/QwFlKTRyWvY3Fs9tRDAMZliVUwieMgEdIeL/FtqjkJg==",
       "dev": true
     },
     "type-check": {
@@ -6038,9 +6038,9 @@
       }
     },
     "uglify-js": {
-      "version": "3.13.7",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.13.7.tgz",
-      "integrity": "sha512-1Psi2MmnZJbnEsgJJIlfnd7tFlJfitusmR7zDI8lXlFI0ACD4/Rm/xdrU8bh6zF0i74aiVoBtkRiFulkrmh3AA==",
+      "version": "3.15.1",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.15.1.tgz",
+      "integrity": "sha512-FAGKF12fWdkpvNJZENacOH0e/83eG6JyVQyanIJaBXCN1J11TUQv1T1/z8S+Z0CG0ZPk1nPcreF/c7lrTd0TEQ==",
       "optional": true
     },
     "unc-path-regex": {

backend/package.json

@@ -26,12 +26,12 @@
     "compute-cosine-similarity": "^1.0.0",
     "dotenv": "^10.0.0",
     "exiting": "^6.0.1",
-    "hapi-swagger": "^14.1.3",
+    "hapi-swagger": "^14.2.5",
     "haversine": "^1.1.1",
     "joi": "^17.4.0",
     "knex": "^0.21.19",
     "mysql": "^2.18.1",
-    "objection": "^2.2.15",
+    "objection": "^2.2.18",
     "secure-password": "^4.0.0"
   },
   "devDependencies": {

frontend/src/utils/db.js

@@ -72,4 +72,24 @@ class Connector {
     // async removeAll() { }
 }
 const db = new Connector()
-export { Connector, db }
+
+class Toaster {
+    constructor({ profileId }) {
+        this.url = `${remote}/notification/${profileId}/subscribe`
+        
+    }
+    connect() {
+        this.source = new EventSource(`${remote}/notification/${profileId}/subscribe`)
+        this.source.onmessage = e => {
+            console.log("Data", + e.data)
+        }
+        this.source.onerror = e => {
+            console.error("EventSource failed.", e)
+        }
+        this.source.addEventListener('end', e => {
+            this.close()
+        })
+    }
+}
+
+export { Connector, db, Toaster }

frontend/src/views/home.vue

@@ -12,6 +12,7 @@ import sidebar from '../components/Sidebar.vue'
 import mainNav from '../components/MainNav.vue'
 import profileCardList from '../components/ProfileCardList.vue'
 import { fetchQueueByProfileId } from '../services'
+import { Toaster } from '../utils/db'
 
 import batch_10 from '../../../backend/db/generated/_batch_10.js.ref'
 import batch_20 from '../../../backend/db/generated/_batch_20.js.ref'
@@ -25,6 +26,9 @@ export default {
         user: null,
         mypid: null,
     }),
+    mounted() {
+        this.setupToaster()
+    },
     async created() {
         // this.mypid = auth.currentUser?.mypid || "99999";
         this.mypid = 38
@@ -33,10 +37,22 @@ export default {
 
         // Uncomment below to use API
         const queueList = await fetchQueueByProfileId(this.mypid)
-        console.log('queueList', queueList)
+        // console.log('queueList', queueList)
         this.processQueue(queueList)
     },
     methods: {
+        setupToaster() {
+            const stocks = {}
+            const source = new EventSource(`http://localhost:3001/api/notification/${this.mypid}/subscribe`)
+            source.addEventListener('stonk', function (message) {
+                console.log('updated:', message)
+                const data = JSON.parse(message.data)
+                stocks[data.name] = data
+            })
+            source.addEventListener('end', function (message) {
+                this.close()
+            })
+        },
         processQueue(queueList) {
             const formattedList = []
             queueList.forEach(profile => {