Merge branch 'match-noti' of fyindr/siimee into dev

backend/db/data-generator/mock.js

         {
             response_key_id: 2,
             response_key_category: 'openness',
-            response_key_prompt: 'are you open with your emotions with everyone',
+            response_key_prompt:
+                'are you open with your emotions with everyone',
             response_key_description: 'first round draft scoring question',
         },
         {
             response_key_id: 3,
             response_key_category: 'bravery',
-            response_key_prompt: 'do you speak-up when you feel something is wrong',
+            response_key_prompt:
+                'do you speak-up when you feel something is wrong',
             response_key_description: 'first round draft scoring question',
         },
         {
         {
             response_key_id: 5,
             response_key_category: 'honesty',
-            response_key_prompt: 'when telling a story do you exaggerate for dramatic effect',
+            response_key_prompt:
+                'when telling a story do you exaggerate for dramatic effect',
             response_key_description: 'first round draft scoring question',
         },
         {
             response_key_id: 6,
             response_key_category: 'respect',
-            response_key_prompt: 'do you treat difficult people as well as you treat your close friends',
+            response_key_prompt:
+                'do you treat difficult people as well as you treat your close friends',
             response_key_description: 'first round draft scoring question',
         },
         {
             response_key_id: 9,
             response_key_category: 'profile',
             response_key_prompt: 'language',
-            response_key_description: 'programming and spoken language preference',
+            response_key_description:
+                'programming and spoken language preference',
         },
         {
             response_key_id: 10,
             response_key_category: 'profile',
             response_key_prompt: 'duration',
-            response_key_description: 'duration preference for hours able to dedicate to work',
+            response_key_description:
+                'duration preference for hours able to dedicate to work',
         },
         {
             response_key_id: 11,
             response_key_category: 'profile',
             response_key_prompt: 'presence',
-            response_key_description: 'location preference for where work happens',
+            response_key_description:
+                'location preference for where work happens',
         },
         {
             response_key_id: 12,
             response_key_id: 16,
             response_key_category: 'profile',
             response_key_prompt: 'distance',
-            response_key_description: 'preference for commuting distance cutoff',
+            response_key_description:
+                'preference for commuting distance cutoff',
         },
     ],
     responses: [],
-    memberships: [
-       
-    ],
-    groupings: [
-       
-    ],
+    memberships: [],
+    groupings: [],
     messages: [],
     match_queues: [
-        
+        { match_queue_id: 1, profile_id: 45, target_id: 62, is_deleted: false },
+        { match_queue_id: 2, profile_id: 62, target_id: 45, is_deleted: false },
+        { match_queue_id: 3, profile_id: 62, target_id: 46, is_deleted: false },
+        { match_queue_id: 4, profile_id: 46, target_id: 62, is_deleted: false },
+        { match_queue_id: 5, profile_id: 45, target_id: 46, is_deleted: false },
+        { match_queue_id: 6, profile_id: 46, target_id: 45, is_deleted: false },
+        { match_queue_id: 7, profile_id: 46, target_id: 44, is_deleted: false },
+        { match_queue_id: 8, profile_id: 46, target_id: 43, is_deleted: false },
+        { match_queue_id: 9, profile_id: 46, target_id: 42, is_deleted: false },
+        {
+            match_queue_id: 10,
+            profile_id: 46,
+            target_id: 41,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 11,
+            profile_id: 46,
+            target_id: 40,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 12,
+            profile_id: 40,
+            target_id: 46,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 13,
+            profile_id: 41,
+            target_id: 46,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 14,
+            profile_id: 42,
+            target_id: 46,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 15,
+            profile_id: 43,
+            target_id: 46,
+            is_deleted: false,
+        },
+        {
+            match_queue_id: 16,
+            profile_id: 44,
+            target_id: 46,
+            is_deleted: false,
+        },
     ],
 }

backend/lib/plugins/notification.js

+const _allStreams = {}
+
 const NotificationRoute = require('../routes/notification')
-const { onEvent } = require('../services/notification')
+
+/** Heavily lifted from: https://github.com/mtharrison/susie/blob/master/lib/index.js */
+
+const Stream = require('stream')
+const PassThrough = Stream.PassThrough
+const Transform = Stream.Transform
+
+const ENDER = { event: 'end', data: '' }
+
+/**
+ * Stringify a stream
+ * ?: I don't really get what this is doing
+ * @param {Stream} event
+ * @returns {string}
+ */
+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
+}
+
+/**
+ * Transform extension
+ * ?: I don't really get what this is doing
+ * @param {object} options
+ * @param {object} objectMode
+ */
+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
+            : () => 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(ENDER))
+        callback()
+    }
+}
+
+/**
+ * Callback to decorate server toolkit (h)
+ * !: Currently we only support ObjectMode streams
+ * ?: I don't really get what this is doing
+ * @param {Stream} event stream input
+ * @param {Toolkit} h hapi common response toolkit
+ * @param {object} streamOptions
+ */
+const _event = (event, h, streamOptions) => {
+    let active
+    if (event instanceof Stream.Readable) {
+        if (event._readableState.objectMode) {
+            active = new PassThrough()
+            const through = new Transformer(streamOptions, true)
+            through.pipe(active)
+            event.pipe(through)
+        }
+        return h
+            .response(active)
+            .header('content-type', 'text/event-stream')
+            .header('content-encoding', 'identity')
+    }
+}
+
+/**
+ * Takes an open HTTP stream and writes
+ * a msg to it, then fires notification plugin's
+ * _event callback
+ * @param {object} msg you want to send
+ * @param {string} name <profileId>.<eventType>
+ * @param {boolean} shouldInitialize
+ * @param {Toolkit} h hapi common response toolkit
+ */
+const onNotify = (name, msg, h, shouldInitialize = false) => {
+    if (shouldInitialize) {
+        _allStreams[name] = new PassThrough({ objectMode: true })
+    }
+    if (!_allStreams[name]) return
+    _allStreams[name].write(msg)
+
+    return _event(_allStreams[name], h, { event: name })
+}
 
 module.exports = {
     name: 'notification-plugin',
     version: '1.0.0',
-    register: async (server, options) => {
+    register: async server => {
         await server.route(NotificationRoute)
-        server.decorate('toolkit', 'event', onEvent)
+        server.method('notify', onNotify)
     },
 }

backend/lib/routes/membership/active.js

                 profileId,
                 membershipType,
             )
-
+            console.log('groupings :>> ', groupings)
             /**
              * Heavily process the result by storing just a profile_id
              * and attach complete profiles

backend/lib/routes/membership/join.js

     response: Joi.object({
         memberships: Joi.array().items(),
         hasMatch: Joi.boolean(),
+        groupings: Joi.array().items(),
     }).label('grouping_membership_list'),
     error: errorSchema.single,
 }
          */
         handler: async function (request, h) {
             try {
+                console.log('---')
                 const { membershipService } = request.server.services()
 
                 /** Grab payload info */
                 // !: You should only be associated with a single company too
 
                 /** User membership service method to create membership */
-                const memberships = await membershipService.joinGrouping(
-                    profileId,
-                    res.target_id,
-                    groupingToWrite,
-                    role,
+                const { memberships, groupings } =
+                    await membershipService.joinGrouping(
+                        profileId,
+                        res.target_id,
+                        groupingToWrite,
+                        role,
+                    )
+                const hasMatch = memberships.every(
+                    membership => membership && membership.is_active == true,
                 )
-                // console.log(memberships)
 
+                if (hasMatch) {
+                    request.server.methods.notify(
+                        `${profileId}.stonk`,
+                        {
+                            name: `${res.target_id} Match Fffound`,
+                            type: 'info',
+                        },
+                        h,
+                    )
+                    request.server.methods.notify(
+                        `${res.target_id}.stonk`,
+                        {
+                            name: `${profileId} Match Fffound`,
+                            type: 'info',
+                        },
+                        h,
+                    )
+                }
                 return h
                     .response({
                         ok: true,
                         handler: pluginConfig.handlerType,
                         data: {
                             memberships,
-                            hasMatch: memberships.every(
-                                membership => membership.is_active == true,
-                            ),
+                            hasMatch,
+                            groupings,
                         },
                     })
                     .code(200)

backend/lib/routes/notification/index.js

 const errorSchema = require('../../schemas/errors')
 const params = require('../../schemas/params')
 
-const Stream = require('stream')
-const PassThrough = require('stream').PassThrough
-
 const pluginConfig = {
     handlerType: 'notifictaion',
     docs: {
         cors: true,
         handler: async (request, h) => {
             const { profile_id } = request.params
-            const input = new PassThrough({ objectMode: true })
-            const eventType = 'stonk'
-
-            const msg = {
-                profile_id,
-                name: 'BDGRS',
-                price: (500 + Math.floor(Math.random() * 100)).toString(),
-                order: null,
-                type: 'info',
-            }
-
-            // 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
-            const streamOptions = { event: `${profile_id}.${eventType}` }
-            return h.event(input, h, streamOptions)
+            /**
+             * Write the initial stream
+             * !: this must remain open for notifications to work
+             */
+            return request.server.methods.notify(
+                `${profile_id}.stonk`,
+                {
+                    profile_id,
+                    name: 'BDGRS',
+                    price: (500 + Math.floor(Math.random() * 100)).toString(),
+                    order: Math.floor(Math.random() * 2) === 1 ? 'BUY' : 'SELL',
+                    type: 'info',
+                },
+                h,
+                true,
+            )
         },
 
         /** Validate based on validators object */

backend/lib/routes/profile/patch-queue.js

 
 const responseSchemas = {
     response: Joi.array().items(
-        Joi.alternatives().try(Joi.number(), profileSchema.single),
+        Joi.alternatives().try(
+            Joi.number().optional(),
+            profileSchema.single.optional(),
+        ),
     ),
     error: errorSchema.single,
 }
                 reinsert,
             )
             const queueIds = updatedQueue.map(entry => entry.target_id)
+
             const res = {
                 ok: true,
                 handler: pluginConfig.handlerType,
-                data: queueIds,
-            }
-            if (include_profile) {
-                res.data = await profileService.getProfilesFor(queueIds)
+                data:
+                    include_profile == true
+                        ? await profileService.getProfilesFor(queueIds)
+                        : queueIds,
             }
+
             try {
                 return h.response(res).code(200)
             } catch (err) {

backend/lib/schemas/responses.js

     response_key_id: Joi.number(),
     response_id: Joi.number(),
     profile_id: Joi.number(),
-    val: Joi.string(),
+    val: Joi.string().allow(null, ''),
 }).label('response_single')
 
 const singleResponseKey = Joi.object({
     single: singleResponse,
     list: Joi.array().items(singleResponse).label('response_list'),
     key: singleResponseKey,
-    keys: Joi.array().items(singleResponseKey).label('question_list')
+    keys: Joi.array().items(singleResponseKey).label('question_list'),
 }

backend/lib/services/matchqueue.js

      */
     async markAsDeleted(profileId, targetId, reinsert) {
         const { MatchQueue } = this.server.models()
+        /** Always set row to deleted */
         await MatchQueue.query()
+            .where('profile_id', profileId)
+            .andWhere('target_id', targetId)
             .patch({
                 is_deleted: true,
             })
-            .where('profile_id', profileId)
-            .andWhere('target_id', targetId)
             .first()
 
         if (reinsert) {

backend/lib/services/membership.js

      * @param {number} profileId
      * @returns {Array} List of all grouping_ids for user
      */
-    async _getGroupingIdsForProfileId(profileId, type, active) {
+    async _getGroupingIdsForProfileId(profileId) {
         const { Membership } = this.server.models()
 
         /** Grab every Membership associated with this id */
-        let allMemberships = []
-
-        if (type && active == 'any') {
-            allMemberships = await Membership.query()
-                .where({ profile_id: profileId })
-                .where({ membership_type: type })
-        } else if (type) {
-            allMemberships = await Membership.query()
-                .where({ profile_id: profileId })
-                .where({ membership_type: type })
-                .where({ is_active: true })
-        } else if (active == 'any') {
-            allMemberships = await Membership.query().where({
-                profile_id: profileId,
-            })
-        } else {
-            allMemberships = await Membership.query()
-                .where({ profile_id: profileId })
-                .where({ is_active: true })
-        }
-
-        /** Copy a list of the just the Groupings */
+        const allMemberships = await Membership.query().where({
+            profile_id: profileId,
+        })
+        /** Copy a list of the just the Grouping ids */
         const groupingIdsToGrab = allMemberships.map(
             membership => membership.grouping_id,
         )
         /** Uncomment to dedupe the list just in case */
         return [...new Set(groupingIdsToGrab)]
     }
-
+    async _getGroupings(groupingIds, txn) {
+        const { Grouping } = this.server.models()
+        return await Grouping.query(txn).whereIn('grouping_id', groupingIds)
+    }
     /**
      * Internal method to create a new grouping
      * @param {object} groupingToTry from payload data
      */
     async findGroupingsByProfileId(profileId, type) {
         const { Grouping } = this.server.models()
-
         const dedupedGroupings = await this._getGroupingIdsForProfileId(
             profileId,
             type,
-            'any',
         )
-
+        console.log('dedupedGroupings :>> ', dedupedGroupings)
         /** Grab just the Groupings this id has a Membership for */
         return await Grouping.query()
             .whereIn('grouping_id', dedupedGroupings)
     }
 
     async _groupingIdsInCommon(profileId, targetId) {
-        const dedupedUserGroupingIds = await this._getGroupingIdsForProfileId(
-            profileId,
-        )
-        const dedupedTargetGroupingIds = await this._getGroupingIdsForProfileId(
-            targetId,
-        )
-
-        /** Return true if both people have a group in common */
-        return dedupedUserGroupingIds.filter(groupingId =>
-            dedupedTargetGroupingIds.includes(groupingId),
-        )
+        const uids = await this._getGroupingIdsForProfileId(profileId)
+        const tids = await this._getGroupingIdsForProfileId(targetId)
+        const common = []
+        for (let i in uids) {
+            if (tids.indexOf(uids[i]) !== -1) common.push(uids[i])
+        }
+        return common.sort((x, y) => x - y)
     }
+
     async _patchMembership(memberships, profileId, patch) {
         const { Membership } = this.server.models()
 
         for (let membershipInfo of memberships) {
             await Membership.query()
                 .where('membership_id', membershipInfo.membership_id)
-                .where('user_id', profileId)
+                .where('profile_id', profileId)
                 .patch(patch)
         }
     }
 
         if (matchingGroupingIds.length) {
             /** Grab all memberships associated with groupingIds */
-            const memberships = await Membership.query().whereIn(
+            let memberships = await Membership.query().whereIn(
                 'grouping_id',
                 matchingGroupingIds,
             )
             })
 
             /** Make a new query to get updated information */
-            return await Membership.query().whereIn(
+            memberships = await Membership.query().whereIn(
                 'grouping_id',
                 matchingGroupingIds,
             )
+            const groupings = await this._getGroupings(matchingGroupingIds, txn)
+            return { memberships, groupings }
         } else {
             /**
              * If both have NO grouping in common, create a membership
                 is_active: false,
             })
 
-            return [userMembership, targetMembership]
+            return {
+                memberships: [userMembership, targetMembership],
+                groupings: [],
+            }
         }
     }
 

backend/lib/services/notification.js

-/** Heavily lifted from: https://github.com/mtharrison/susie/blob/master/lib/index.js */
-
-const Stream = require('stream')
-const PassThrough = Stream.PassThrough
-const Transform = Stream.Transform
-
-const ENDER = { event: 'end', data: '' }
-
-/**
- * Stringify a stream
- * ?: I don't really get what this is doing
- * @param {Stream} event
- * @returns {string}
- */
-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
-}
-
-/**
- * Transform extension
- * ?: I don't really get what this is doing
- * @param {object} options
- * @param {object} objectMode
- */
-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(ENDER))
-        callback()
-    }
-}
-
-/**
- * Take an event stream and write content to another stream
- * ?: Save this for future extension
- * @param {Stream} event stream input
- * @param {Stream} stream to write to
- */
-const writeEvent = function (event, stream) {
-    if (event) {
-        stream.write(stringifyEvent(event))
-    } else {
-        // closing time
-        stream.write(stringifyEvent(ENDER))
-        stream.end()
-    }
-}
-
-/**
- * Callback to decorate server toolkit (h)
- * !: Currently we only support ObjectMode streams
- * ?: I don't really get what this is doing
- * @param {Stream} event stream input
- * @param {Toolkit} h hapi common response toolkit
- * @param {object} streamOptions
- */
-const onEvent = (event, h, streamOptions) => {
-    // const state = h.request.plugins.notifications = h.request.plugins.notifications || {}
-    let active
-    if (event instanceof Stream.Readable) {
-        if (event._readableState.objectMode) {
-            const through = new Transformer(streamOptions, true)
-            active = new PassThrough()
-            through.pipe(active)
-            event.pipe(through)
-        }
-        // else {
-        //     stream = new Transformer(streamOptions, false)
-        //     event.pipe(stream)
-        // }
-        console.log('streamOptions :', streamOptions)
-        return h
-            .response(active)
-            .header('content-type', 'text/event-stream')
-            .header('content-encoding', 'identity')
-    }
-    // Uncomment to do stream state stuff
-    // handle a first object arg
-    // if (!state.stream) {
-    //     active = new PassThrough()
-    //     state.stream = active
-    //     state.mode = 'object'
-    //     const response = h.response(active)
-    //         .header('content-type', 'text/event-stream')
-    //         .header('content-encoding', 'identity')
-    //     writeEvent(event, active)
-    //     return response
-    // }
-    // already have an object stream flowing, just write next event
-    // active = state.stream
-    // internals.writeEvent(event, active)
-}
-
-module.exports = { onEvent }

frontend/package.json

         "@prettier/plugin-pug": "^1.19.2",
         "@vitejs/plugin-vue": "^2.2.4",
         "@vue/compiler-sfc": "^3.2.31",
+        "ava": "^4.3.3",
         "cross-env": "^7.0.3",
         "eslint": "^8.11.0",
         "eslint-config-prettier": "^8.5.0",

frontend/src/App.vue

 <template lang="pug">
 w-app
-    div.nav(style="display: flex; justify-content: space-between;")
+    div.nav(v-if="isLoggedIn" style="display: flex; justify-content: space-between;")
         header
             h2 home - profile: {{ getPid }}
         w-drawer(v-model="openDrawer")
-            h2 content
+            SideBar(
+                :pid="getPid"
+                @updatePid="setPid"
+                @hide="showSidebar = false"
+            )
         w-button(@click="openDrawer = true" outline="")
             | Active Chats
-    SideBar(
-        v-if="showSidebar"
-        :pid="getPid"
-        @updatePid="setPid"
-        @hide="showSidebar = false"
-    )
     RouterView(
+        v-if="isLoggedIn"
         :pid="getPid"
         @updatePid="setPid"
         @show-sidebar="showSidebar = !showSidebar"
         openDrawer: false,
     }),
     computed: {
-        getPid: () => (currentProfile.id.value ? currentProfile.id.value : 999),
+        getPid: () => {
+            return currentProfile.id.value ? currentProfile.id.value : null
+        },
+        isLoggedIn: () => {
+            return currentProfile.isLoggedIn
+        },
     },
     async created() {
         /** Get questions so we can compare against profile responses */
             if (currentProfile.isLoggedIn) {
                 currentProfile.logout()
             }
-            await currentProfile.login(profileId)
-
-            if (currentProfile.isLoggedIn) {
-                console.warn(
-                    `setting up Chatter and Toaster for ${this.getPid}...`,
-                )
-                currentProfile.setupChatter()
-                currentProfile.setupToaster(this.$waveui.notify)
-            }
+            await currentProfile.login(profileId, this.$waveui.notify)
             console.log('---')
             //  step 3: subscribe to the this.subscriptions array
             // view current subscriptions on the currentProfile.chatter.subscriptions

frontend/src/components/ProfileCardList.vue

                     h4 {{ profile.name }}
                     nav.swipe_icons
                         //- Accept
-                        button(@click="chat(profile.pid)") chat
-                        button(@click="accept") Accept
+                        button(@click="accept(profile.pid)") Accept
                         button(@click="view(profile.pid)") view
                         //- Pass
-                        button(@click="pass") Pass
+                        button(@click="pass(profile.pid)") Pass
     
     .match-layout(
         v-else
                     h4 {{ profile.name }}
                     nav.swipe_icons
                         button(@click="view(profile.pid)") view
-                        button(@click="chat(profile.pid)") chat
 </template>
 
 <script setup>
 import { useRouter } from 'vue-router'
 import {
     updateQueueByProfileId,
-    fetchMembershipsByProfileId,
     postMembershipByProfileId,
     currentProfile,
 } from '../services'
 
 // AHP Button behavior
 
-const accept = async () => {
+const accept = async targetId => {
+    if (targetId == props.pid) return
     // need to pass these arguments (profileId, targetId, status)
     // the url structure is
     // const charmander = await db.get(`/profile/{profile_id}/queue/{target_id}/delete?include_profile=true&reinsert=false`)
     // http://localhost:3001/api/profile/38/queue/9/delete?include_profile=true&reinsert=true
     const profileId = props.pid
-    const targetId = props.profiles[0].pid
-    updateQueueByProfileId(profileId, targetId, false)
-    // TODO: next step is grouping/membership
-    const checkMembership = await fetchMembershipsByProfileId(profileId)
-    if (!checkMembership.length) {
-        postMembershipByProfileId({ profileId, targetId })
+    await updateQueueByProfileId(profileId, targetId, false)
+    const { membershipMatch, groupingName } = await postMembershipByProfileId({
+        profileId,
+        targetId,
+    })
+
+    // Reuse old grouping name if theres a match
+    let channel = groupingName
+    console.log('membershipMatch :>> ', membershipMatch)
+    if (membershipMatch?.hasMatch) {
+        const [time, intiator, target] = groupingName.split('_')
+        channel = membershipMatch.groupings[0].grouping_name
+        console.log('channel :>> ', channel)
     }
+    await subscribeToChannel(channel)
     emit('reload')
 }
+
 const view = pid => {
     router.push({ path: `/matches/${pid}` })
 }
-const chat = async pid => {
+
+const subscribeToChannel = async channelName => {
     // create a chatter reference from the current profile
     const chatter = currentProfile.chatter
     // console.log('mock sender:', pid)
-    
-    /**  publish a new message to the chatter with the channel and the message & title is optional
+
+    /**
+     * publish a new message to the chatter with the channel and the message & title is optional
      */
-    const res = await chatter.publish(chatter.subscriptions[1], {
+    // You MUST send chatter channels as an array in an object
+    chatter.subscribe({ channels: [channelName] })
+    const res = await chatter.publish(channelName, {
         title: 'New Message',
-        description: 'This is the checking to see if we are subscribed to a channel!',
+        description: `This is the checking to see if we are subscribed to the ${channelName} channel!`,
     })
     // PubNub response will be a timecode of when the message was published
     console.log('res:', res)
-
     //router.push({ path: `/chat/${pid}` })
 }
-const pass = () => {
-    const targetId = props.profiles[0].pid
+
+const pass = targetId => {
+    if (targetId == props.pid) return
     updateQueueByProfileId(props.pid, targetId, true)
     emit('reload')
 }

frontend/src/components/SideBar.vue

 <template lang="pug">
 aside.sidebar
     .temp-control-box
-        input(v-model="switchToPID")
+        input(v-model="switchToPID" @keyup.enter="$emit('updatePid', switchToPID)")
         button(@click="$emit('updatePid', switchToPID)") switch profile
     
     Messages(:matches="matches" :pid="pid")

frontend/src/services/chat.service.js

 import PubNub from 'pubnub'
 
-// custom services 
-import {fetchMembershipsByProfileId} from '../services/grouping.service'
+// custom services
+import { fetchMembershipsByProfileId } from '../services/grouping.service'
 
 /**
  * Provider method holder
     title: 'testing',
     description: 'hello world!',
 })
-const MAIN_CHANNEL = 'Channel-Barcelona'
+const MAIN_CHANNEL = 'Channel-Siimee'
 
 /** Singleton that holds all our chat information */
 class Chatter {
      * @return {Chatter} our chatter instance object
      */
     constructor() {
-        // Map of each active chat
-        // * this is where we will store all of our groupings on from the backend on user login...
-        this.groupings = {}
-
         // Our pubnub instance
         this.provider = null
 
 
         // Setup the main channel
         //  subscriptions array will be built dynamically from the "this.groupings" object
-        this.subscriptions = [MAIN_CHANNEL, 'Channel-LosAngeles']
+        this.subscriptions = [MAIN_CHANNEL]
         this.listeners = {
             status: async e => {
-                await this.publish(this.subscriptions[2], testMessage)
+                // await this.publish(this.subscriptions[0], testMessage)
                 if (e.category !== 'PNConnectedCategory') return
             },
             message: this._onMessage,
     async setup(uuid) {
         this.uuid = `${uuid}`
         this.provider = await setupPubnub(this.uuid)
-            
+
         //  step 1: build the this.groupings object from the backend
-        // ? .then() to wait for the groupings to be fetched before subscribing to channels
-        this.getGroupingsByProfileId(this.uuid).then(() => {
-            this._listenFor({ listeners: this.listeners })
-            this._subscribe(this.subscriptions)
-        })
-        
-        console.log('this.subscriptions', this.subscriptions)
-       
+        // ? .await for the groupings to be fetched before subscribing to channels
+        await this._setupAllChannels(this.uuid)
+        this._listenFor({ listeners: this.listeners })
+        this.subscribe({ channels: this.subscriptions })
     }
     /**
      * Send a message to a channel
      */
     async publish(channel, message) {
         console.log('publishing message to channel:', channel)
-        return await providerMethods['publish']({ channel, message })
+        return providerMethods.publish({ channel, message })
     }
     /**
      * Subscribe to a channels
      * Facade so we can hide provider specific methods
      * @param {array} channels
      */
-    _subscribe(channels) {
-        providerMethods['subscribe']({ channels })
+    subscribe({ channels }) {
+        providerMethods.subscribe({ channels })
     }
     /**
      * Listen to events and set callbacks
      * Facade so we can hide provider specific methods
      */
     _listenFor({ listeners }) {
-        providerMethods['listen'](listeners)
+        providerMethods.listen(listeners)
     }
-    
     //  step 2: build the this.subscriptions array from the this.groupings object
     // fetch all groupings for this profile and then store them in the chatter groupings object for reference
-    async getGroupingsByProfileId(profileId) {
-        console.log('fetching groupings for profileId:', profileId)
+    async _setupAllChannels(profileId) {
         const groupings = await fetchMembershipsByProfileId(profileId)
-        this.groupings = groupings
-        this.createChannelNamesByGroupings(this.groupings)
+        console.log(`fetched groupings for profileId: ${profileId}`, groupings)
+        groupings.forEach(grouping => {
+            this.subscriptions.push(grouping.grouping_name)
+        })
     }
-    // building a list of channel names from the groupings object.grouping_name
-    createChannelNamesByGroupings(groupings) {
-        groupings.forEach(item => {
-            this.subscriptions.push(item.grouping_name)
-        });
-        
-        
+    stop() {
+        console.warn('chatter stop no implemented')
     }
 }
 

frontend/src/services/grouping.service.js

     targetId,
     groupingType = 'match',
 }) => {
-    const utcDateInSeconds = Date.now()/1000
+    const utcDateInSeconds = Date.now() / 1000
     const membership = {
         target_id: targetId,
         grouping_type: groupingType,
         grouping_name: `${utcDateInSeconds}_${profileId}_${targetId}`,
     }
-    console.warn(`${groupingType} created between ${profileId} and ${targetId}`)
-    const createdMembershipRecord = await db.post(
+    const membershipMatch = await db.post(
         `/membership/${profileId}/join`,
         membership,
     )
-    return createdMembershipRecord
+    return { membershipMatch, groupingName: membership.grouping_name }
 }
 export { fetchMembershipsByProfileId, postMembershipByProfileId }

frontend/src/services/login.service.js

      * @param {number} profileId
      * @returns {number} stored reactive id
      */
-    async login(profileId) {
+    async login(profileId, cb) {
         console.warn('logging in:', profileId)
         this.id.value = parseInt(profileId)
+
+        this.setupChatter()
+        this.setupToaster(cb)
+
         return this.id.value
     }
     logout() {
+        console.warn('logging out:', this.id.value)
         this.id.value = null
         if (this.toaster) {
             this.toaster.stop()
         }
         if (this.chatter) {
-            this.toaster.stop()
+            this.chatter.stop()
         }
     }
 

frontend/src/services/queue.service.js

  */
 const fetchQueueByProfileId = async profileId => {
     let queue
-    
+
     try {
-        queue = await db.get(
-            `/profile/${profileId}/queue?include_profile=true`,
-        )
-        if(!queue?.length) {
+        queue = await db.get(`/profile/${profileId}/queue?include_profile=true`)
+        if (!queue?.length) {
             throw 'Could not retrieve match queue. Please take the survey and rescore.'
         }
     } catch (err) {
         console.error(err)
     }
 
-    return queue ? queue.map(profileData => {
-        return new Profile({ email: 'fixme@gmail.com', ...profileData })
-    }) : []
+    return queue
+        ? queue.map(profileData => {
+              return new Profile({ email: 'fixme@gmail.com', ...profileData })
+          })
+        : []
 }
 
 /**
 const updateQueueByProfileId = async (profileId, targetId, reinsert) => {
     const updateQueue = await db.patch(
         `/profile/${profileId}/queue/${targetId}/delete?include_profile=true&reinsert=${reinsert}`,
-        [ targetId ],
     )
-    return updateQueue ? updateQueue.map(profileData => {
-        return new Profile({ email: 'fixme@gmail.com', ...profileData })
-    }) : []
+    return updateQueue
+        ? updateQueue.map(profileData => {
+              return new Profile({ email: 'fixme@gmail.com', ...profileData })
+          })
+        : []
 }
 
 export { fetchQueueByProfileId, updateQueueByProfileId }