diff --git a/src/index.html b/src/index.html
index 6fb32eb..868e990 100644
--- a/src/index.html
+++ b/src/index.html
@@ -13,7 +13,7 @@
   <body class="antialiased md:subpixel-antialiased">
     <div x-data="app" class="relative flex flex-col md:flex-row lg:justify-center justify-normal">
       <div class="2xl:min-w-80 min-w-72 min-h-12 max-h-screen">
-        <div x-data="{ open: false }" x-init="router.on('ready', () => open = false)"
+        <div x-data="{ open: false }" x-init="router.on('active', () => open = false)"
              class="flex flex-col fixed 2xl:w-80 md:w-72 size-full md:border-r border-0 pointer-events-none z-20"
         >
           <div class="md:block flex items-center gap-x-4 px-5 md:pt-8 py-3 md:border-0 border-b bg-white pointer-events-auto select-none">
diff --git a/src/scripts/app.js b/src/scripts/app.js
index 79917cf..2e20ecf 100644
--- a/src/scripts/app.js
+++ b/src/scripts/app.js
@@ -83,10 +83,10 @@ export default () => ({
               <div class="uppercase text-sm font-semibold mb-3">Interactive graph</div>
               <div x-data="{ expand: false,
                              anchor: $el.parentElement,
-                             destroy: () => $el.remove(),
+                             remove: () => $el.remove(),
                              collapse: () => { $data.expand = false;
                                                $data.anchor.appendChild($el);
-                                               $data.toggleGlobal(false)
+                                               $data.toggleGlobal(false);
                                              },
                              toggleGlobal: (value) => router.emit('graphview toggle global', { value })
                            }"
@@ -95,8 +95,8 @@ export default () => ({
               >
                 <div class="relative rounded-md border size-full p-1 bg-white"
                      x-data="{ ready: false }"
-                     x-init="if (graph.value?.nodeType) { ready = true; $el.appendChild(graph.value) } else ready = false;"
-                     @click="if (expand && !ready) { destroy(); toggleGlobal(false) }"
+                     x-init="if (graph.value?.nodeType) { ready = true; $el.appendChild(graph.value) }"
+                     @click="if ($el.children.length < 4) { remove(); toggleGlobal(false) }"
                 >
                   <template x-if="ready">
                     <div class="flex items-center gap-x-1 mr-1 mt-1 absolute top-0 right-0 z-20 text-neutral-600">
diff --git a/src/scripts/object.js b/src/scripts/object.js
index d818e1a..318cf72 100644
--- a/src/scripts/object.js
+++ b/src/scripts/object.js
@@ -236,7 +236,7 @@ export class Folder extends BaseNode {
                                { behavior: 'smooth', block: 'center' }), 150);
                        };
                        router.on('ready', () => {
-                           react();
+                           $nextTick(() => react());
                        });
                        router.on('navigate', () => {
                            navigate = true;
@@ -305,7 +305,9 @@ export class Document extends BaseNode {
         `;
 
         return `
-          <div class="flex flex-col w-full md:mx-12 m-6 md:mt-8">
+          <div x-init="$nextTick(() => router.emit('ready'))"
+               class="flex flex-col w-full md:mx-12 m-6 md:mt-8" 
+          >
             <div class="font-bold text-4xl mb-6">${title}</div>
             <div x-ref="page" class="prose prose-neutral max-w-none w-full
                                      ${this.metadata['no_sidebar'] ? '' : 'md:max-w-prose'}"
diff --git a/src/scripts/router.js b/src/scripts/router.js
index d78678a..d61d227 100644
--- a/src/scripts/router.js
+++ b/src/scripts/router.js
@@ -22,7 +22,7 @@ export default {
             else this.goto(Routes.error);
         }
 
-        this.emit('ready');
+        this.emit('active');
     },
     route(path) {
         return true;
