From 23e1262f9c94141141aac7491aec79e5303221b9 Mon Sep 17 00:00:00 2001 From: "bert.hausmans" Date: Sat, 16 May 2026 20:41:50 +0200 Subject: [PATCH] fix(gui-v2): mount Drawer only on mobile (v-if) + shared Tailwind breakpoint CRITICAL: replace `lg:hidden` on PrimeVue Drawer with `v-if="isMobile"` so the teleported portal/overlay is never created on desktop viewports regardless of mobileOpen state. Replace useMediaQuery raw string in SidebarHeader with useBreakpoints(breakpointsTailwind).smaller('lg') shared by both components. Add desktop/mobile comments; adapt tests to useBreakpoints mock; add Drawer-absent-on-desktop and aside w-16/w-64 width-class assertions (21 tests). Co-Authored-By: Claude Opus 4.7 --- .../src/components-v2/layout/AppSidebar.vue | 33 +++++- .../components-v2/layout/SidebarHeader.vue | 7 +- .../layout/__tests__/AppSidebar.spec.ts | 108 ++++++++++++++++-- .../layout/__tests__/SidebarHeader.spec.ts | 12 +- 4 files changed, 141 insertions(+), 19 deletions(-) diff --git a/apps/app/src/components-v2/layout/AppSidebar.vue b/apps/app/src/components-v2/layout/AppSidebar.vue index a928c6ec..171f3837 100644 --- a/apps/app/src/components-v2/layout/AppSidebar.vue +++ b/apps/app/src/components-v2/layout/AppSidebar.vue @@ -13,6 +13,12 @@ *