siimee/frontend/src/views/HomeView.vue

<template lang="pug">
main.view--home
    
    article(v-if='cards.length && !loading')
        ProfileCardList(:pid='pid' :cards='cards' @reload='getCards')

    p(v-else-if='cards.length === 0') No profiles in match_queue.
    w-spinner(v-else bounce)

    footer
        w-form
            w-input.mb2(
                inner-icon-left='mdi mdi-account'
                label='Full Name'
                label-position='inside'
                outline
            )
            w-input.mb2(
                inner-icon-left='mdi mdi-mail'
                label='E-mail'
                label-position='inside'
                outline
            )
            w-input.mb2(
                inner-icon-left='mdi mdi-lock'
                label='Password'
                label-position='inside'
                outline
                type='password'
            )

    MainNav
</template>

<script>
import 'wave-ui/dist/wave-ui.css'
import ProfileCardList from '../components/ProfileCardList.vue'
import TagList from '../components/TagList.vue'
import AspectBar from '../components/AspectBar.vue'
import SummaryBar from '../components/SummaryBar.vue'
import PairingButton from '../components/PairingButton.vue'

import { Card } from '../entities'

import {
    fetchQueueByProfileId,
    fetchMembershipsByProfileId,
    currentProfile,
} from '../services'
import { mixins } from '../utils'

/** Callback used to format incoming into card */
const convertToCard = profile => {
    if (profile.type !== 'profile') {
        console.error(`Cannot convert ${profile} to Card. Invalid entity.`)
    }
    if (!profile.isValid()) {
        console.warn(`Profile ${profile.profile_id} is not a valid profile.`)
    }
    return new Card({
        pid: profile.profile_id,
        name: profile.user_name,
        avatar: profile.profile_media[0],
    })
}

const converGroupingToCard = grouping => {
    if (grouping.type !== 'grouping') {
        console.error(`Cannot convert ${grouping} to Card. Invalid entity.`)
    }
    if (!grouping.profile.isValid()) {
        console.warn(`Profile in ${grouping} is not a valid profile.`)
    }
    return new Card({
        pid: grouping.profile.profile_id,
        name: grouping.profile.user_name,
        avatar: grouping.profile.profile_media[0],
    })
}

export default {
    name: 'HomeView',
    components: {
        ProfileCardList,
        AspectBar,
        TagList,
        SummaryBar,
        PairingButton,
    },
    mixins: [mixins.pidMixin, mixins.cardMixin],
    methods: {
        /** Gets called from cardMixin */
        async getCards() {
            this.loading = true
            try {
                const queueList = await fetchQueueByProfileId(this.pid)
                this.cards = this._reformat(queueList, convertToCard)
                const matchList = await fetchMembershipsByProfileId(this.pid)
                this.matches = this._reformat(matchList, converGroupingToCard)
            } catch (err) {
                console.error(err)
            }
            this.loading = false
        },
        // this can be placed in utils/notification.js

        notify(payload) {
            this.$waveui.notify({
                message: payload,
                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)
        },
    },
}
</script>