diff --git a/template/app/components/TreeNode.vue b/template/app/components/TreeNode.vue
index cf91452..93889b6 100644
--- a/template/app/components/TreeNode.vue
+++ b/template/app/components/TreeNode.vue
@@ -1,14 +1,14 @@
 <script setup>
-import { ref } from 'vue'
+import { useTreeState } from '~/composables/useTreeState'
 
 defineProps({ nodes: Array, depth: { type: Number, default: 0 } })
 
 const router = useRouter()
-const collapsed = ref({})
+const { collapsed } = useTreeState()   // ← shared state, not local ref
 
 function getTitle(node) {
-  if (node.title == "index") return "Index"
-  return node.title || node._path?.split('/').pop() || 'Home';
+  if (node.title === 'index') return 'Index'
+  return node.title || node._path?.split('/').pop() || 'Home'
 }
 
 function navigate(path) {
diff --git a/template/app/composables/useTreeState.ts b/template/app/composables/useTreeState.ts
new file mode 100644
index 0000000..2673893
--- /dev/null
+++ b/template/app/composables/useTreeState.ts
@@ -0,0 +1,8 @@
+const collapsed = ref<Record<string, boolean>>({})
+
+export function useTreeState() {
+  function resetTree() {
+    collapsed.value = {}
+  }
+  return { collapsed, resetTree }
+}
\ No newline at end of file