:recycle: moved mixins to utils

frontend/src/components/Messages.vue

 </template>
 
 <script>
+import { mixins } from '../utils'
+
 export default {
     name: 'ProfileMessages',
+    mixins: [ mixins.pidMixin ],
     props: {
         matches: {
             type: [Object, Array],
             default: () => []
         },
-        pid: {
-            required: true,
-            type: Number
-        }
     },
 }
 </script>

frontend/src/utils/index.js

 import { Connector } from './db'
 import { SurveyFactory } from './survey'
 import { possible } from './lang'
+import { pidMixin, cardMixin } from './mixins'
 
 const api = new Connector('kittens')
 
 
 const surveyFactory = new SurveyFactory(possible['usa'])
 
-export { api, validatorMapping, surveyFactory, makeKebob }
+const mixins = { pidMixin, cardMixin }
+
+export { 
+    api,
+    validatorMapping,
+    surveyFactory,
+    makeKebob,
+    mixins
+}

frontend/src/views/mixins.js → frontend/src/utils/mixins.js

             required: true,
             validator: prop => typeof prop === 'number' || prop === null
         },
-    },
+    }
+}
+
+const cardMixin = {
     data: () => ({
         cards: [],
         loading: true,
     }
 }
 
-export { pidMixin }
+export { pidMixin, cardMixin }

frontend/src/views/HomeView.vue

 
 import { Card } from '../entities'
 import { fetchQueueByProfileId } from '../services'
-import { pidMixin } from './mixins'
+import { mixins } from '../utils'
 
 /** Callback used to format incoming into card */
 const convertToCard = profile => {
 export default {
     name: 'HomeView',
     components: { ProfileCardList },
-    mixins: [ pidMixin ],
+    mixins: [ mixins.pidMixin, mixins.cardMixin ],
     methods: {
         /** Gets called from pidMixins */
         async getCards() {

frontend/src/views/MatchesView.vue

 
 import { Card } from '../entities'
 import { fetchMembershipsByProfileId } from '../services'
-import { pidMixin } from './mixins'
+import { mixins } from '../utils'
 
 /** Callback used to format incoming into card */
 const convertToCard = grouping => {
 export default {
     name: 'MatchView',
     components: { ProfileCardList },
-    mixins: [ pidMixin ],
+    mixins: [ mixins.pidMixin, mixins.cardMixin ],
     methods: {
         /** Gets called from pidMixins */
         async getCards() {