From 10dc3f9cbea09d9d629d62f9d73aa9cdc0f32faf Mon Sep 17 00:00:00 2001
From: Vantz Stockwell <vstockwell@predator-mini.local>
Date: Mon, 30 Mar 2026 13:35:39 -0400
Subject: [PATCH] fix: synchronous ToolWindow import + bars to 48px/16px
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Tool windows (still closing instantly after every prior fix):
- Changed ToolWindow from defineAsyncComponent to direct synchronous
  import. All 14 tool components now bundled into the main JS chunk.
  Eliminates async chunk loading as a failure point — if the main
  bundle loads (which it does, since the main window works), the
  tool window code is guaranteed to be available.
- ToolWindow chunk no longer exists as a separate file

Status bar + Monitor bar:
- Both set to h-[48px] text-base px-6 (48px height, 16px text)
- Matching sizes for visual consistency

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/App.vue                            | 5 +----
 src/components/common/StatusBar.vue    | 2 +-
 src/components/terminal/MonitorBar.vue | 2 +-
 3 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 3a46f82..e2e914e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -2,15 +2,12 @@
 import { ref, onMounted, onErrorCaptured, defineAsyncComponent } from "vue";
 import { useAppStore } from "@/stores/app.store";
 import UnlockLayout from "@/layouts/UnlockLayout.vue";
+import ToolWindow from "@/components/tools/ToolWindow.vue";
 
 const MainLayout = defineAsyncComponent({
   loader: () => import("@/layouts/MainLayout.vue"),
   onError(error) { console.error("[App] MainLayout load failed:", error); },
 });
-const ToolWindow = defineAsyncComponent({
-  loader: () => import("@/components/tools/ToolWindow.vue"),
-  onError(error) { console.error("[App] ToolWindow load failed:", error); },
-});
 const DetachedSession = defineAsyncComponent({
   loader: () => import("@/components/session/DetachedSession.vue"),
   onError(error) { console.error("[App] DetachedSession load failed:", error); },
diff --git a/src/components/common/StatusBar.vue b/src/components/common/StatusBar.vue
index 2a44ae2..8d6cd9e 100644
--- a/src/components/common/StatusBar.vue
+++ b/src/components/common/StatusBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="h-6 flex items-center justify-between px-4 bg-[var(--wraith-bg-secondary)] border-t border-[var(--wraith-border)] text-[10px] text-[var(--wraith-text-muted)] shrink-0">
+  <div class="h-[48px] flex items-center justify-between px-6 bg-[var(--wraith-bg-secondary)] border-t border-[var(--wraith-border)] text-base text-[var(--wraith-text-muted)] shrink-0">
     <!-- Left: connection info -->
     <div class="flex items-center gap-3">
       <template v-if="sessionStore.activeSession">
diff --git a/src/components/terminal/MonitorBar.vue b/src/components/terminal/MonitorBar.vue
index 0d1b15f..c91956d 100644
--- a/src/components/terminal/MonitorBar.vue
+++ b/src/components/terminal/MonitorBar.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     v-if="stats"
-    class="flex items-center gap-4 px-4 h-6 bg-[var(--wraith-bg-tertiary)] border-t border-[var(--wraith-border)] text-[10px] font-mono shrink-0 select-none"
+    class="flex items-center gap-4 px-6 h-[48px] bg-[var(--wraith-bg-tertiary)] border-t border-[var(--wraith-border)] text-base font-mono shrink-0 select-none"
   >
     <!-- CPU -->
     <span class="flex items-center gap-1">