siimee/frontend/src/App.vue

<template lang="pug">
w-app 
    TopNav(@on-open="openDrawer = !openDrawer")

    w-drawer(v-model="openDrawer")
        SideBar(@updatePid="setPid" :pid="profile.id.value")
        
    RouterView(
        v-if="profile.isLoggedIn"
        :pid="profile.id.value"
        @updatePid="setPid"
        @show-sidebar="showSidebar = !showSidebar"
    )
</template>

<script>
import 'wave-ui/dist/wave-ui.css'
import SideBar from './components/SideBar.vue'
import TopNav from './components/TopNav.vue'

import { currentProfile } from './services'
import { surveyFactory } from './utils'

const DEV_MODE = import.meta.env.VITE_DEV == 'true'
// const DEV_MODE = false
const DEV_PID = 45

export default {
    components: { TopNav, SideBar },
    data: () => ({
        sliderVal: 1,
        openDrawer: false,
    }),
    computed: {
        profile: () => {
            return currentProfile
        },
    },
    async created() {
        /** Get questions so we can compare against profile responses */
        await surveyFactory.getQuestions()

        /**
         * Development mode turns router guards off so
         * we hard set the profile id instead of
         * using the login form
         */
        if (DEV_MODE) {
            await this.setPid(DEV_PID)
        }
    },
    methods: {
        /**
         * Sync up this components state with
         * the currentProfile handler
         */
        async setPid(profileId) {
            if (currentProfile.isLoggedIn) {
                currentProfile.logout()
            }

            await currentProfile.login(profileId, this.$waveui.notify)
            console.log('---')

            /**
             * Default to the HomeView and alter as needed (side-effects!)
             */
            const toRoute = { name: 'HomeView' }
            this.$router.push(toRoute)
        },
    },
}
</script>

<style lang="sass">
#app > .w-app > main
    position: relative
    top: 50px
</style>