opendesk

1<template>
2  <Layout class="isolate">
3    <router-view class="flex flex-1 flex-col overflow-auto" />
4  </Layout>
5</template>
6
7<script setup lang="ts">
8import { useAgentStatusStore } from "@/stores/agentStatus";
9import { computed, defineAsyncComponent } from "vue";
10
11import { useScreenSize } from "@/composables/screen";
12// eager: subscribes the availability socket handler and runs the login
13// greeting at boot instead of on first ticket open.
14useAgentStatusStore();
15
16const { isMobileView } = useScreenSize();
17
18const MobileLayout = defineAsyncComponent(
19  () => import("@/components/layouts/MobileLayout.vue")
20);
21const DesktopLayout = defineAsyncComponent(
22  () => import("@/components/layouts/DesktopLayout.vue")
23);
24
25const Layout = computed(() => {
26  if (isMobileView.value) {
27    return MobileLayout;
28  } else {
29    return DesktopLayout;
30  }
31});
32</script>
33