Merge branch 'dev' into questionnaire-endpoint

backend/package-lock.json

             "dev": true
         },
         "caniuse-lite": {
-            "version": "1.0.30001312",
-            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz",
-            "integrity": "sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==",
+            "version": "1.0.30001418",
+            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001418.tgz",
+            "integrity": "sha512-oIs7+JL3K9JRQ3jPZjlH6qyYDp+nBTCais7hjh0s+fuBwufc7uZ7hPYMXrDOJhV360KGMTcczMRObk0/iMqZRg==",
             "dev": true
         },
         "chalk": {

frontend/package.json

 {
     "name": "vite-project",
     "version": "0.0.0",
+    "type": "module",
     "scripts": {
         "nodev": "cross-env VITE_DEV=false vite",
         "dev": "cross-env VITE_DEV=true vite",
         "serve": "vite preview",
         "lint": "eslint --ext .js,.vue --fix src",
         "format": "prettier .  --write",
-        "test": "echo 'no tests at this time...'"
+        "test": "ava"
     },
     "dependencies": {
         "joi": "^17.6.0",
         "wave-ui": "^2.40.2"
     },
     "devDependencies": {
+        "@mdi/font": "^7.0.96",
         "@prettier/plugin-pug": "^1.19.2",
         "@vitejs/plugin-vue": "^2.2.4",
         "@vue/compiler-sfc": "^3.2.31",

frontend/src/components/MainNav.vue

 <template lang="pug">
-nav#main-header
-    router-link(:to="`/matches`") matches
-    router-link(to='/') home
-    router-link(:to="`/survey`") survey
+w-toolbar.mt6.py1.no-grow(bottom)
+    router-link.w-flex.column(:to='`/chats`')
+        w-button.pa5.bdrsr.bd1.sh1(bg-color='primary' disabled)
+            w-icon.mr1(xl) mdi mdi-forum
+            p.text-upper active chats
+    router-link.w-flex.column(:to='`/matches`')
+        w-button.pa5.bdrsr.bd1.sh1(bg-color='primary')
+            w-icon.mr1(xl) mdi mdi-tooltip-account
+            p.text-upper pending matches
+    router-link.w-flex.column(:to='`/`')
+        w-button.pa5.bdrsr.bd1.sh1(bg-color='primary')
+            w-icon.mr1(xl) mdi mdi-home
+            p.text-upper home queue
+    router-link.w-flex.column(:to='`/survey`')
+        w-button.pa5.bdrsr.bd1.sh1(bg-color='primary')
+            w-icon.mr1(xl) mdi mdi-account-check
+            p.text-upper survey
+    router-link.w-flex.column(:to='`/settings`')
+        w-button.pa5.bdrsr.bd1.sh1(bg-color='primary' disabled)
+            w-icon.mr1(xl) mdi mdi-cog
+            p.text-upper settings
 </template>
 
 <script>
+import '@mdi/font/css/materialdesignicons.min.css'
+
 export default {
     name: 'MainNav',
 }

frontend/src/entities/card/index.js

-export * from './card'
+export * from './card.js'

frontend/src/entities/grouping/grouping.js

 /** @module entities/grouping */
 
-import { _baseRecord } from '..'
-import { groupingSchema } from './grouping.schema'
+import { _baseRecord } from '../index.js'
+import { groupingSchema } from './grouping.schema.js'
 
 /** Class representing a grouping */
 class Grouping extends _baseRecord {

frontend/src/entities/grouping/index.js

-export * from './grouping'
-export * from './grouping.schema'
+export * from './grouping.js'
+export * from './grouping.schema.js'

frontend/src/entities/index.js

-export * from './_modules'
+export * from './_modules.js'
 
 /** Your different entities */
-export * from './response'
-export * from './profile'
-export * from './survey'
-export * from './grouping'
-export * from './card'
+export * from './response/index.js'
+export * from './profile/index.js'
+export * from './survey/index.js'
+export * from './grouping/index.js'
+export * from './card/index.js'

frontend/src/entities/profile/index.js

-export * from './profile'
-export * from './profile.schema'
+export * from './profile.js'
+export * from './profile.schema.js'

frontend/src/entities/profile/profile.js

 /** @module entities/profile */
-import { _baseRecord } from '..'
-import { profileSchema } from './profile.schema'
+import { _baseRecord } from '../index.js'
+import { profileSchema } from './profile.schema.js'
 
 /** Class representing a profile */
 class Profile extends _baseRecord {
     constructor({ email, ...profileData }) {
         super()
 
-        this.type = this.constructor.name.toLowerCase() 
+        this.type = this.constructor.name.toLowerCase()
 
         /**  Fields */
         this.email = email // ! required

frontend/src/entities/profile/profile.schema.js

 /** @module entities/profileSchema */
 import Joi from 'joi'
-import { allModules, responseSchema } from '..'
+import { allModules, responseSchema } from '../index.js'
 
 /**
  * profile schema object

frontend/src/entities/profile/profile.spec.js

-// Write your profile test here
+import test from 'ava'
+import { Profile } from './profile.js'
+
+test('instantiate a Profile', async t => {
+    const profToTest = { email: 'fake@email.com', user_name: 'bob' }
+    const p = new Profile(profToTest)
+    t.is(p.user_name, profToTest.user_name)
+})

frontend/src/entities/response/index.js

-export * from './response.schema'
+export * from './response.schema.js'

frontend/src/entities/survey/index.js

-export * from './survey'
-export * from './survey.schema'
+export * from './survey.js'
+export * from './survey.schema.js'

frontend/src/entities/survey/survey.js

 /** @module survey/survey */
-import { _baseRecord } from '..'
-import { surveySchema } from './survey.schema'
+import { _baseRecord } from '../index.js'
+import { surveySchema } from './survey.schema.js'
 
 class Survey extends _baseRecord {
     constructor(questionSteps, roles) {
         this.type = this.constructor.name.toLowerCase()
 
         /**  Fields */
-        this.steps = [
-            ...questionSteps
-        ] // ! required
+        this.steps = [...questionSteps] // ! required
         this.roleTree = roles
 
         return this
     }
     setRoleResponses(position) {
-        const roleStep = this.steps.filter(step => step.response_key_prompt == 'role')[0]
+        const roleStep = this.steps.filter(
+            step => step.response_key_prompt == 'role',
+        )[0]
         roleStep.responses = this.roleTree[position]
     }
     isValid() {
         /** validate(this) always returns something so force it to a bool */
         return !validate.error ? true : false
     }
-
 }
 
 export { Survey }

frontend/src/entities/survey/survey.schema.js

 import Joi from 'joi'
-import { allModules } from '..'
+import { allModules } from '../index.js'
 
 /**
  * membership schema object
         type: Joi.string(),
 
         /** Survey fields */
-        steps: Joi.array().items(
-            Joi.object({
-                id: Joi.number(),
-                type: Joi.string(),
-                question: Joi.string(),
-                // TODO: specify responses to be array or null later
-                responses: Joi.any(),
-            })
-        ).required(),
+        steps: Joi.array()
+            .items(
+                Joi.object({
+                    id: Joi.number(),
+                    type: Joi.string(),
+                    question: Joi.string(),
+                    // TODO: specify responses to be array or null later
+                    responses: Joi.any(),
+                }),
+            )
+            .required(),
     }),
     /** fields required before saving */
     required: ['steps'],

frontend/src/services/chat.service.js

     listen: () => console.error('no provider listen method set'),
 }
 /**
- * 
- * 
+ *
+ *
  * Breaking out as much pubnub specific flavor
  */
 const setupPubnub = async uuid => {
-    const publishKey = 'pub-c-73f35484-396f-47ff-b4b6-45bed079fd3b'
-    const subscribeKey = 'sub-c-6cb7f5d0-94e2-11ec-b249-a68c05a281ab'
+    const publishKey = import.meta.env.VITE_PUBNUB_PUBLISH_KEY
+    const subscribeKey = import.meta.env.VITE_PUBNUB_SUBSCRIBE_KEY
     if (!uuid) return console.error('no pubnub uuid set')
 
     const pubnubClient = await new PubNub({
      */
     async publish(channel, message) {
         // console.log('publishing message to channel:', channel)
-        return providerMethods.publish({ 
+        return providerMethods.publish({
             channel,
-            message: new ChatMessage(message)
+            message: new ChatMessage(message),
         })
     }
     /**
         this.subscriptions = [MAIN_CHANNEL]
         console.warn('chatter stop no implemented')
     }
-
 }
 
 export { Chatter }

frontend/src/views/ChatView.vue

     p(v-else-if="profile.isLoggedIn && !target") No match found between profile {{ $route.params.tid }} and {{profile.id}}... 
     p(v-else) Loading...
 
-    MainNav(@show-sidebar="$emit('show-sidebar')")
+    MainNav
 </template>
 
 <script>

frontend/src/views/HomeView.vue

 <template lang="pug">
-main.view--home(style="display:flex; flex-direction:column; gap: 40px; margin-top: 1em;")
-    h2 Match Queue
-    article(v-if="cards.length && !loading")
-        ProfileCardList(:profiles="cards" :pid="pid" @reload="getCards")
+main.view--home(
+    style='display: flex; flex-direction: column; gap: 40px; margin-top: 1em'
+)
+    header
+        h2 Match Queue
 
-    p(v-else) Loading...
+    article(v-if='cards.length && !loading')
+        ProfileCardList(:pid='pid' :profiles='cards' @reload='getCards')
 
-    h2 Matches
-    article(v-if="matches.length && !loading")
-        ProfileCardList(:profiles="matches" :pid="pid" @reload="getCards")
-    
-    p(v-else-if="matches.length===0") No matches.
+    p(v-else-if='cards.length === 0') No profiles in match_queue.
     p(v-else) Loading...
+
+    MainNav
 </template>
 
 <script>
-    import 'wave-ui/dist/wave-ui.css'
+import 'wave-ui/dist/wave-ui.css'
 import ProfileCardList from '../components/ProfileCardList.vue'
 
 import { Card } from '../entities'
-import { fetchQueueByProfileId, fetchMembershipsByProfileId, currentProfile } from '../services'
+import {
+    fetchQueueByProfileId,
+    fetchMembershipsByProfileId,
+    currentProfile,
+} from '../services'
 import { mixins } from '../utils'
 
 /** Callback used to format incoming into card */
         // this can be placed in utils/notification.js
         notify(payload) {
             this.$waveui.notify({
-            message: payload.timetoken,
-            timeout: 6000,
-            bgColor: 'white',
-            color: 'success',
-            dismiss: false,
-            shadow: true,
-            round: true,
-            sm: true,
-            icon: 'wi-star'
-        })
+                message: payload.timetoken,
+                timeout: 6000,
+                bgColor: 'white',
+                color: 'success',
+                dismiss: false,
+                shadow: true,
+                round: true,
+                sm: true,
+                icon: 'wi-star',
+            })
         },
         //  a way to send a message to a user for development purposes and testing
-        async chat()  {
-           const chatter = currentProfile.chatter
-           const res = await chatter.publish(chatter.subscriptions[0],{
-            title: 'New Message',
-            description: 'This is a new message',
-           })
-           this.notify(res)
-        }
+        async chat() {
+            const chatter = currentProfile.chatter
+            const res = await chatter.publish(chatter.subscriptions[0], {
+                title: 'New Message',
+                description: 'This is a new message',
+            })
+            this.notify(res)
+        },
     },
 }
 </script>

frontend/src/views/MatchesView.vue

 <template lang="pug">
 main.view--matches.f-col.start.w-full
     header
-        h2 Match Page
+        h2 Matches
 
-    article(v-if="!loading")
-        ProfileCardList(:profiles="cards" :pid="pid" :is-grid="true")
-    
+    article(v-if='matches.length && !loading')
+        ProfileCardList(:pid='pid' :profiles='matches' @reload='getCards')
+
+    p(v-else-if='matches.length === 0') No matches.
     p(v-else) Loading...
-    
-    MainNav(@show-sidebar="$emit('show-sidebar')")
+
+    MainNav
 </template>
 
 <script>

frontend/src/views/ProfileView.vue

 main.view--profile.f-col.start.w-full
     header 
         h2 Profile Page
- 
-    article(v-if="!loading")
+
+    article(v-if='!loading')
         h3 name: {{ profile.user_name }}
-            span(v-if="profile.profile_prefs?.pronouns")  ({{ profile.profile_prefs?.pronouns.val }})
-        p(v-if="profile.user_email") {{ profile.user_email }}
-        
+            span(v-if='profile.profile_prefs?.pronouns')  ({{ profile.profile_prefs?.pronouns.val }})
+        p(v-if='profile.user_email') {{ profile.user_email }}
+
         p I am looking for a 
             span {{ profile.profile_prefs?.presence?.val }} 
             span {{ profile.profile_prefs?.role?.val }} 
             span no further than {{ profile.profile_prefs?.distance?.val }} miles away 
             span from {{ profile.profile_prefs?.zipcode?.val }}
 
-        p I am {{ profile.profile_prefs?.urgency?.val.split("_").join(" ") }}.
-        
-        img(v-if="profile.reveal.map(t => t.description).includes('image')" :src="profile.profile_media[0]" alt="profile-avatar" style="max-height: 200px; width: auto;")
+        p I am {{ profile.profile_prefs?.urgency?.val.split('_').join(' ') }}.
+
+        img(
+            :src='profile.profile_media[0]'
+            alt='profile-avatar'
+            style='max-height: 200px; width: auto'
+            v-if='profile.reveal.map(t => t.description).includes("image")'
+        )
         h3(v-else) image not revealed
-        
-        p About: {{ profile.profile_description}}
+
+        p About: {{ profile.profile_description }}
 
         p reveal: {{ profile.reveal.map(t => t.description) }}
         p tags: {{ profile.tags.map(t => t.description) }}
         p images: {{ profile.profile_media }}
         p responses: {{ profile.responses.length }}
-        button(@click="$router.go(-1)") back
+        button(@click='$router.go(-1)') back
 
     p(v-else) Loading...
 
-    MainNav(@show-sidebar="$emit('show-sidebar')")
+    MainNav
 </template>
 
 <script>

frontend/src/views/SurveyView.vue

         p survey for profile: {{ current }}
     article.match.w-full
         ul.w-full
-            template(v-for="(q, i) in profileQuestions" :key="q.response_key_prompt")
-                li(v-if="step == i + 1")
-                    p {{q.response_key_category}}: 
+            template(
+                :key='q.response_key_prompt'
+                v-for='(q, i) in profileQuestions'
+            )
+                li(v-if='step == i + 1')
+                    p {{ q.response_key_category }}:
                         span in db:
-                        span(v-if="q.response_key_id") true - id:{{q.response_key_id}} | 
-                        span(v-else) false | 
-                        span {{q.response_key_prompt}}? 
-                        span {{q.response_key_description}} 
+                        span(v-if='q.response_key_id') true - id:{{ q.response_key_id }} |
+                        span(v-else) false |
+                        span {{ q.response_key_prompt }}?
+                        span {{ q.response_key_description }}
 
                         //- Select
-                        div(v-if="q.responses.length")
-                            button(
-                                v-for="(res, index) in q.responses"
-                                :key="index"
-                                @click="storeResponseLike(step, q.response_key_id, q.response_key_prompt, res); step++"
-                            ).p-0 {{res}}
-                        
+                        div(v-if='q.responses.length')
+                            button.p-0(
+                                :key='index'
+                                @click='storeResponseLike(step, q.response_key_id, q.response_key_prompt, res); step++'
+                                v-for='(res, index) in q.responses'
+                            ) {{ res }}
+
                         //- Fill in the blank
-                        div(v-else-if="q.response_key_category === 'profile'")
-                            input(@input="storeResponseLike(step, q.response_key_id, q.response_key_prompt, profile[q.response_key_prompt])" v-model="profile[q.response_key_prompt]" @keyup.enter="step++") 
-                            label >{{ profile[q.response_key_prompt]}}
-                        
+                        div(v-else-if='q.response_key_category === "profile"')
+                            input(
+                                @input='storeResponseLike(step, q.response_key_id, q.response_key_prompt, profile[q.response_key_prompt])'
+                                @keyup.enter='step++'
+                                v-model='profile[q.response_key_prompt]'
+                            ) 
+                            label >{{ profile[q.response_key_prompt] }}
+
                         //- Aspects
-                        div(v-else).f-col
-                            input(type="range" min="-3" max="3" list="ticks" @input="storeResponseLike(step, q.response_key_id, q.response_key_prompt, aspects[q.response_key_category])" v-model="aspects[q.response_key_category]").w-full
-                            label {{ aspectResponses[parseInt(aspects[q.response_key_category]) + 3] }} 
-                    
+                        .f-col(v-else)
+                            input.w-full(
+                                @input='storeResponseLike(step, q.response_key_id, q.response_key_prompt, aspects[q.response_key_category])'
+                                list='ticks'
+                                max='3'
+                                min='-3'
+                                type='range'
+                                v-model='aspects[q.response_key_category]'
+                            )
+                            label {{ aspectResponses[parseInt(aspects[q.response_key_category]) + 3] }}
+
                         nav.f-row
-                            button(:disabled="step == 0" @click="step--") back
-                            p {{step}} of {{profile.length}}
+                            button(:disabled='step == 0' @click='step--') back
+                            p {{ step }} of {{ profile.length }}
                             button(
-                                v-if="(q.response_key_category === 'profile')"
-                                @click="storeResponseLike(step, q.response_key_id, q.response_key_prompt, profile[q.response_key_prompt]); step++"
+                                @click='storeResponseLike(step, q.response_key_id, q.response_key_prompt, profile[q.response_key_prompt]); step++'
+                                v-if='q.response_key_category === "profile"'
                             ) next
                             button(
+                                @click='storeResponseLike(step, q.response_key_id, q.response_key_prompt, aspects[q.response_key_category]); step++'
                                 v-else
-                                @click="storeResponseLike(step, q.response_key_id, q.response_key_prompt, aspects[q.response_key_category]); step++"
                             ) next
-                    
+
             //- Confirmation
-            li(v-if="step == profileQuestions.length + 1")
+            li(v-if='step == profileQuestions.length + 1')
                 p Does this look correct?
                 h4 {{ profile }}
-                h4 {{aspects}}
+                h4 {{ aspects }}
                 nav.f-row
-                    button(@click="step--") back
-                    p(@click="step = 1").p-1 start over
-                    button(@click="onSave") save
+                    button(@click='step--') back
+                    p.p-1(@click='step = 1') start over
+                    button(@click='onSave') save
                     //- button(@click="$router.push({ name: 'HomeView' })") save
     footer
-        button(@click="bypass") +30 user profiles
+        button(@click='bypass') +30 user profiles
+
+    MainNav
 </template>
 
 <script>

frontend/src/wave.js

     WSlider,
     WSpinner,
     WSteps,
+    WToolbar,
 } from '../node_modules/wave-ui/src/wave-ui/components'
 
 export default {
     WSlider,
     WSpinner,
     WSteps,
+    WToolbar,
 }

frontend/tests/test.js

+import test from 'ava'
+
+test('make sure ava works on the frontend', async t => {
+    t.pass()
+})

frontend/vite.config.js

 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 
+import path from 'path'
+import { fileURLToPath } from 'url'
+
+const filename = fileURLToPath(import.meta.url)
+const dirname = path.dirname(filename)
+
 // https://vitejs.dev/config/
 export default defineConfig({
     css: {
     plugins: [vue()],
     resolve: {
         alias: {
-            '@': require('path').resolve(__dirname, 'src'),
+            '@': path.resolve(dirname, 'src'),
         },
     },
 })