From 784000afcceee7da61635f57b4f00b27a848ad34 Mon Sep 17 00:00:00 2001
From: Farnabaz <farnabaz@gmail.com>
Date: Thu, 6 Nov 2025 11:59:39 +0100
Subject: [PATCH 1/2] fix(studio): prevent mixing active files between media
 and content pages

---
 src/app/src/composables/useContext.ts |  2 ++
 src/app/src/pages/content.vue         | 10 +++++-----
 src/app/src/pages/media.vue           | 10 +++++-----
 3 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/app/src/composables/useContext.ts b/src/app/src/composables/useContext.ts
index 329e91a5..204059eb 100644
--- a/src/app/src/composables/useContext.ts
+++ b/src/app/src/composables/useContext.ts
@@ -230,6 +230,8 @@ export const useContext = createSharedComposable((
   }
 
   return {
+    documentTree,
+    mediaTree,
     activeTree,
     itemActions,
     itemActionHandler,
diff --git a/src/app/src/pages/content.vue b/src/app/src/pages/content.vue
index 55509b50..ba92996b 100644
--- a/src/app/src/pages/content.vue
+++ b/src/app/src/pages/content.vue
@@ -5,11 +5,11 @@ import { StudioItemActionId, TreeStatus, StudioFeature } from '../types'
 
 const { context } = useStudio()
 
-const folderTree = computed(() => (context.activeTree.value.current.value || []).filter(f => f.type === 'directory'))
-const fileTree = computed(() => (context.activeTree.value.current.value || []).filter(f => f.type === 'file'))
+const folderTree = computed(() => (context.documentTree.current.value || []).filter(f => f.type === 'directory'))
+const fileTree = computed(() => (context.documentTree.current.value || []).filter(f => f.type === 'file'))
 
-const currentTreeItem = computed(() => context.activeTree.value.currentItem.value)
-const currentDraftItem = computed(() => context.activeTree.value.draft.current.value)
+const currentTreeItem = computed(() => context.documentTree.currentItem.value)
+const currentDraftItem = computed(() => context.documentTree.draft.current.value)
 
 const showFolderForm = computed(() => {
   return context.actionInProgress.value?.id === StudioItemActionId.CreateDocumentFolder
@@ -36,7 +36,7 @@ const showFileForm = computed(() => {
 
     <div class="flex-1 relative">
       <div
-        v-if="context.activeTree.value.draft.isLoading.value"
+        v-if="context.documentTree.draft.isLoading.value"
         class="absolute inset-0 bg-primary/3 animate-pulse z-10 pointer-events-none"
       />
       <template v-else>
diff --git a/src/app/src/pages/media.vue b/src/app/src/pages/media.vue
index a5743fa9..50095f74 100644
--- a/src/app/src/pages/media.vue
+++ b/src/app/src/pages/media.vue
@@ -6,11 +6,11 @@ import { StudioItemActionId, StudioFeature } from '../types'
 const { context } = useStudio()
 const isUploading = ref(false)
 
-const folderTree = computed(() => (context.activeTree.value.current.value || []).filter(f => f.type === 'directory'))
-const fileTree = computed(() => (context.activeTree.value.current.value || []).filter(f => f.type === 'file' && !f.fsPath.endsWith('.gitkeep')))
+const folderTree = computed(() => (context.mediaTree.current.value || []).filter(f => f.type === 'directory'))
+const fileTree = computed(() => (context.mediaTree.current.value || []).filter(f => f.type === 'file' && !f.fsPath.endsWith('.gitkeep')))
 
-const currentTreeItem = computed(() => context.activeTree.value.currentItem.value)
-const currentDraftItem = computed(() => context.activeTree.value.draft.current.value)
+const currentTreeItem = computed(() => context.mediaTree.currentItem.value)
+const currentDraftItem = computed(() => context.mediaTree.draft.current.value)
 
 const showFolderForm = computed(() => {
   return context.actionInProgress.value?.id === StudioItemActionId.CreateMediaFolder
@@ -56,7 +56,7 @@ async function onFileDrop(event: DragEvent) {
 
     <div class="flex-1 relative">
       <div
-        v-if="context.activeTree.value.draft.isLoading.value"
+        v-if="context.mediaTree.draft.isLoading.value"
         class="absolute inset-0 bg-primary/3 animate-pulse pointer-events-none"
       />
 

From 8535de2f94e6c79fee37de11837ae353b95f77c6 Mon Sep 17 00:00:00 2001
From: Baptiste Leproux <leproux.baptiste@gmail.com>
Date: Thu, 6 Nov 2025 16:32:40 +0100
Subject: [PATCH 2/2] expose trees from useStudio and remove keepalive

---
 src/app/src/app.vue                   | 20 ++++++++------------
 src/app/src/composables/useContext.ts |  2 --
 src/app/src/composables/useStudio.ts  |  1 +
 src/app/src/pages/content.vue         | 12 ++++++------
 src/app/src/pages/media.vue           | 12 ++++++------
 5 files changed, 21 insertions(+), 26 deletions(-)

diff --git a/src/app/src/app.vue b/src/app/src/app.vue
index 032892ae..4c496cd6 100644
--- a/src/app/src/app.vue
+++ b/src/app/src/app.vue
@@ -92,12 +92,10 @@ router.beforeEach((to, from) => {
             leave-from-class="translate-y-0"
             leave-to-class="-translate-y-full"
           >
-            <KeepAlive>
-              <component
-                :is="Component"
-                class="w-full h-full"
-              />
-            </KeepAlive>
+            <component
+              :is="Component"
+              class="w-full h-full"
+            />
           </Transition>
           <Transition
             v-else
@@ -108,12 +106,10 @@ router.beforeEach((to, from) => {
             leave-from-class="translate-x-0"
             :leave-to-class="direction === 'right' ? '-translate-x-full' : 'translate-x-full'"
           >
-            <KeepAlive>
-              <component
-                :is="Component"
-                class="w-full h-full"
-              />
-            </KeepAlive>
+            <component
+              :is="Component"
+              class="w-full h-full"
+            />
           </Transition>
         </RouterView>
       </AppLayout>
diff --git a/src/app/src/composables/useContext.ts b/src/app/src/composables/useContext.ts
index 204059eb..329e91a5 100644
--- a/src/app/src/composables/useContext.ts
+++ b/src/app/src/composables/useContext.ts
@@ -230,8 +230,6 @@ export const useContext = createSharedComposable((
   }
 
   return {
-    documentTree,
-    mediaTree,
     activeTree,
     itemActions,
     itemActionHandler,
diff --git a/src/app/src/composables/useStudio.ts b/src/app/src/composables/useStudio.ts
index 6e4b47a7..2183ea82 100644
--- a/src/app/src/composables/useStudio.ts
+++ b/src/app/src/composables/useStudio.ts
@@ -76,6 +76,7 @@ export const useStudio = createSharedComposable(() => {
     git,
     ui,
     context,
+    documentTree,
     mediaTree,
   }
 })
diff --git a/src/app/src/pages/content.vue b/src/app/src/pages/content.vue
index ba92996b..b129e64a 100644
--- a/src/app/src/pages/content.vue
+++ b/src/app/src/pages/content.vue
@@ -3,13 +3,13 @@ import { computed } from 'vue'
 import { useStudio } from '../composables/useStudio'
 import { StudioItemActionId, TreeStatus, StudioFeature } from '../types'
 
-const { context } = useStudio()
+const { context, documentTree } = useStudio()
 
-const folderTree = computed(() => (context.documentTree.current.value || []).filter(f => f.type === 'directory'))
-const fileTree = computed(() => (context.documentTree.current.value || []).filter(f => f.type === 'file'))
+const folderTree = computed(() => (documentTree.current.value || []).filter(f => f.type === 'directory'))
+const fileTree = computed(() => (documentTree.current.value || []).filter(f => f.type === 'file'))
 
-const currentTreeItem = computed(() => context.documentTree.currentItem.value)
-const currentDraftItem = computed(() => context.documentTree.draft.current.value)
+const currentTreeItem = computed(() => documentTree.currentItem.value)
+const currentDraftItem = computed(() => documentTree.draft.current.value)
 
 const showFolderForm = computed(() => {
   return context.actionInProgress.value?.id === StudioItemActionId.CreateDocumentFolder
@@ -36,7 +36,7 @@ const showFileForm = computed(() => {
 
     <div class="flex-1 relative">
       <div
-        v-if="context.documentTree.draft.isLoading.value"
+        v-if="documentTree.draft.isLoading.value"
         class="absolute inset-0 bg-primary/3 animate-pulse z-10 pointer-events-none"
       />
       <template v-else>
diff --git a/src/app/src/pages/media.vue b/src/app/src/pages/media.vue
index 50095f74..8f1bf7f3 100644
--- a/src/app/src/pages/media.vue
+++ b/src/app/src/pages/media.vue
@@ -3,14 +3,14 @@ import { computed, ref } from 'vue'
 import { useStudio } from '../composables/useStudio'
 import { StudioItemActionId, StudioFeature } from '../types'
 
-const { context } = useStudio()
+const { context, mediaTree } = useStudio()
 const isUploading = ref(false)
 
-const folderTree = computed(() => (context.mediaTree.current.value || []).filter(f => f.type === 'directory'))
-const fileTree = computed(() => (context.mediaTree.current.value || []).filter(f => f.type === 'file' && !f.fsPath.endsWith('.gitkeep')))
+const folderTree = computed(() => (mediaTree.current.value || []).filter(f => f.type === 'directory'))
+const fileTree = computed(() => (mediaTree.current.value || []).filter(f => f.type === 'file' && !f.fsPath.endsWith('.gitkeep')))
 
-const currentTreeItem = computed(() => context.mediaTree.currentItem.value)
-const currentDraftItem = computed(() => context.mediaTree.draft.current.value)
+const currentTreeItem = computed(() => mediaTree.currentItem.value)
+const currentDraftItem = computed(() => mediaTree.draft.current.value)
 
 const showFolderForm = computed(() => {
   return context.actionInProgress.value?.id === StudioItemActionId.CreateMediaFolder
@@ -56,7 +56,7 @@ async function onFileDrop(event: DragEvent) {
 
     <div class="flex-1 relative">
       <div
-        v-if="context.mediaTree.draft.isLoading.value"
+        v-if="mediaTree.draft.isLoading.value"
         class="absolute inset-0 bg-primary/3 animate-pulse pointer-events-none"
       />