From 91b20ce909297778b867900f9b143c464c77ee1d Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Fri, 28 Feb 2025 11:02:03 +0100
Subject: [PATCH] fix: empty file list

Fixes an issue where the file list would be blank if the sidebar is open and snapped (<580px screen width) and then increasing the window size.
---
 .../web-pkg/src/components/SideBar/SideBar.vue  | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/web-pkg/src/components/SideBar/SideBar.vue b/packages/web-pkg/src/components/SideBar/SideBar.vue
index 56819b509d..11dc2289ec 100644
--- a/packages/web-pkg/src/components/SideBar/SideBar.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBar.vue
@@ -201,12 +201,24 @@ const backgroundContentEl = computed(() => {
   return unref(appSideBar)?.parentElement?.querySelector('div') as HTMLElement
 })
 
+const handleBackgroundContentVisibility = () => {
+  // handles the visibility of the content behind the sidebar. It needs to be hidden if
+  // the sidebar is open and has full width to avoid focusable elements.
+  if (!unref(backgroundContentEl)) {
+    return
+  }
+
+  const visibility = unref(fullWidthSideBar) ? 'hidden' : 'visible'
+  unref(backgroundContentEl).style.visibility = visibility
+}
+
 const onResize = () => {
   if (!isOpen) {
     return
   }
 
   windowWidth.value = window.innerWidth
+  handleBackgroundContentVisibility()
 }
 
 watch(
@@ -216,10 +228,7 @@ watch(
       return
     }
     await nextTick()
-    if (unref(fullWidthSideBar) && unref(backgroundContentEl)) {
-      // hide content behind sidebar when it has full width to avoid focusable elements
-      unref(backgroundContentEl).style.visibility = 'hidden'
-    }
+    handleBackgroundContentVisibility()
   },
   { immediate: true }
 )