Files
discord-clone/layouts/default.vue

58 lines
1.4 KiB
Vue

<template>
<Suspense>
<div class="flex h-screen max-h-screen text-white">
<Nav />
<Sidebar />
<div class="w-[calc(100vw-88px-240px)] h-full">
<slot />
</div>
</div>
<template #fallback>
Loading...
</template>
</Suspense>
</template>
<script lang="ts">
import { Nav, Sidebar } from '~/.nuxt/components'
import { useGlobalStore } from '~/stores/store'
import { SafeUser } from '~/types'
export default {
data() {
return {
user: storeToRefs(useGlobalStore()).user,
}
},
async setup() {
const globalStore = useGlobalStore()
const sessionToken = useCookie('sessionToken')
if (globalStore.user.id === undefined && sessionToken.value) {
const route = useRoute()
const headers = useRequestHeaders(['cookie']) as Record<string, string>
const [user, { dms, servers }] = await Promise.all([
$fetch('/api/getCurrentUser', { headers }) as unknown as SafeUser,
$fetch('/api/user/getServers', { headers })
])
if (!user || !servers || !dms) return;
globalStore.setUser(user)
globalStore.setServers(servers)
globalStore.setDms(dms)
console.log('params', route.params.id)
if (route.params.id && typeof route.params.id === 'string') {
globalStore.setActive(route.path.includes('@me') ? 'dms' : 'servers', route.params.id)
}
const server = globalStore.activeServer
return {
server
}
}
}
}
</script>