From a2665b825ad9a95ccd2c8f8a487e019029ee3c4b Mon Sep 17 00:00:00 2001
From: Dominik Schmidt <dev@dominik-schmidt.de>
Date: Sat, 8 Aug 2026 11:24:04 +0200
Subject: [PATCH 1/3] fix(web-pkg): keep sidebar panels mounted while loading

The loading state swapped all panels for a spinner via v-if/v-else, so any
stateful panel (e.g. the maps location panel) was unmounted and recreated on
every resource change, losing its state. Wrap the panels in a container and
render the spinner as an overlay instead, so panels stay mounted while loading.
---
 .../web-pkg/src/components/SideBar/SideBarPanels.vue   | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
index 4a3e0ac1ec3..be26a2dbc9b 100644
--- a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
@@ -1,6 +1,5 @@
 <template>
-  <oc-spinner v-if="loading" :aria-label="$gettext('Loading sidebar content')" />
-  <template v-else>
+  <div class="sidebar-panels relative size-full">
     <div
       v-for="panel in displayPanels"
       :id="`sidebar-panel-${panel.name}`"
@@ -95,7 +94,12 @@
         </div>
       </div>
     </div>
-  </template>
+    <oc-spinner
+      v-if="loading"
+      :aria-label="$gettext('Loading sidebar content')"
+      class="sidebar-panels-loading absolute inset-0 z-10 flex items-center justify-center"
+    />
+  </div>
 </template>
 <script setup lang="ts">
 import { computed, ref, unref } from 'vue'

From 51fee9fd9c143940dafb1212ea87cb7480f5f74e Mon Sep 17 00:00:00 2001
From: Dominik Schmidt <dev@dominik-schmidt.de>
Date: Sat, 8 Aug 2026 12:35:05 +0200
Subject: [PATCH 2/3] fix(web-pkg): position the sidebar loading spinner as an
 actual overlay

oc-spinner ships its own relative/inline-block, so absolute inset-0 set on it
never applied and it only looked centered via a flex fallback on the sidebar.
Wrap it in the positioned element and drop the now-dead flex classes.
---
 packages/web-pkg/src/components/SideBar/SideBar.vue       | 3 ---
 packages/web-pkg/src/components/SideBar/SideBarPanels.vue | 7 ++++---
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/packages/web-pkg/src/components/SideBar/SideBar.vue b/packages/web-pkg/src/components/SideBar/SideBar.vue
index e355fbf6dc3..226eca117b5 100644
--- a/packages/web-pkg/src/components/SideBar/SideBar.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBar.vue
@@ -88,9 +88,6 @@ const sidebarProps = computed(() => {
     'focus-visible:shadow-none',
     ...(unref(attrs)?.class ? [unref(attrs).class] : [])
   ]
-  if (loading) {
-    classes.push('flex', 'justify-center', 'items-center')
-  }
   return {
     ...unref(attrs),
     class: classes
diff --git a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
index be26a2dbc9b..7d3661c3de1 100644
--- a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
@@ -94,11 +94,12 @@
         </div>
       </div>
     </div>
-    <oc-spinner
+    <div
       v-if="loading"
-      :aria-label="$gettext('Loading sidebar content')"
       class="sidebar-panels-loading absolute inset-0 z-10 flex items-center justify-center"
-    />
+    >
+      <oc-spinner :aria-label="$gettext('Loading sidebar content')" />
+    </div>
   </div>
 </template>
 <script setup lang="ts">

From 4026d29971687bf368917a3f6696f5def694fb03 Mon Sep 17 00:00:00 2001
From: Dominik Schmidt <dev@dominik-schmidt.de>
Date: Sat, 8 Aug 2026 14:20:40 +0200
Subject: [PATCH 3/3] fix(web-pkg): keep the active sidebar panel inert while
 loading

Panels now stay mounted during loading, so make the active one inert too, so
controls behind the loading overlay can't be focused until loading finishes.
---
 packages/web-pkg/src/components/SideBar/SideBarPanels.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
index 7d3661c3de1..fafb59f3122 100644
--- a/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBarPanels.vue
@@ -7,7 +7,7 @@
       :data-testid="`sidebar-panel-${panel.name}`"
       :tabindex="activePanelName === panel.name ? -1 : null"
       class="sidebar-panel absolute top-0 grid grid-rows-[auto_1fr] bg-role-surface w-full size-full max-w-full max-h-full motion-reduce:transition-none"
-      :inert="activePanelName !== panel.name"
+      :inert="activePanelName !== panel.name || loading"
       :class="{
         'is-root-panel transition-[right] duration-[0.4s,0s]': panel.isRoot?.(panelContext),
         'is-active-sub-panel': hasActiveSubPanel && activeSubPanelName === panel.name, // only one specific sub panel can be active