diff --git a/desk/src/components/layouts/DesktopLayout.vue b/desk/src/components/layouts/DesktopLayout.vue
index ed9785f93..9e8c804e2 100644
--- a/desk/src/components/layouts/DesktopLayout.vue
+++ b/desk/src/components/layouts/DesktopLayout.vue
@@ -5,9 +5,12 @@
       <AppHeader />
       <slot />
     </div>
+    <Notifications />
+    <CommandPalette />
   </div>
 </template>
 <script setup>
+import { Notifications, CommandPalette } from "@/components";
 import AppHeader from "./AppHeader.vue";
 import Sidebar from "./Sidebar.vue";
 </script>
diff --git a/desk/src/composables/screen.ts b/desk/src/composables/screen.ts
index 0dee7d8eb..bf1874d1c 100644
--- a/desk/src/composables/screen.ts
+++ b/desk/src/composables/screen.ts
@@ -1,4 +1,4 @@
-import { onMounted, onUnmounted, reactive } from "vue";
+import { computed, onMounted, onUnmounted, reactive } from "vue";
 
 export function useScreenSize() {
   const size = reactive({
@@ -19,5 +19,11 @@ export function useScreenSize() {
     window.removeEventListener("resize", onResize);
   });
 
-  return size;
+  const mobileThreshold = 640;
+  const isMobileView = computed(() => size.width < mobileThreshold);
+
+  return {
+    size,
+    isMobileView,
+  };
 }
diff --git a/desk/src/pages/desk/AgentRoot.vue b/desk/src/pages/desk/AgentRoot.vue
index cf07f1b8c..0b99a74ad 100644
--- a/desk/src/pages/desk/AgentRoot.vue
+++ b/desk/src/pages/desk/AgentRoot.vue
@@ -2,8 +2,6 @@
   <Layout>
     <router-view class="z-0 flex flex-1 flex-col overflow-auto" />
   </Layout>
-  <CommandPalette />
-  <Notifications />
 </template>
 
 <script setup lang="ts">
@@ -12,13 +10,13 @@ import { useRouter } from "vue-router";
 import { useAuthStore } from "@/stores/auth";
 import { useConfigStore } from "@/stores/config";
 import { CUSTOMER_PORTAL_LANDING, ONBOARDING_PAGE } from "@/router";
-import { CommandPalette, Notifications } from "@/components";
+
 import { useScreenSize } from "@/composables/screen";
 const router = useRouter();
 const authStore = useAuthStore();
 const configStore = useConfigStore();
 
-const screenSize = useScreenSize();
+const { isMobileView } = useScreenSize();
 
 const MobileLayout = defineAsyncComponent(
   () => import("@/components/Layouts/MobileLayout.vue")
@@ -26,8 +24,9 @@ const MobileLayout = defineAsyncComponent(
 const DesktopLayout = defineAsyncComponent(
   () => import("@/components/Layouts/DesktopLayout.vue")
 );
+
 const Layout = computed(() => {
-  if (screenSize.width < 640) {
+  if (isMobileView.value) {
     return MobileLayout;
   } else {
     return DesktopLayout;