From 881eb76c72fc903783ff2b11a695699730ad1f0d Mon Sep 17 00:00:00 2001 From: Johnny Huynh <27847622+johnnyhuy@users.noreply.github.com> Date: Mon, 10 Aug 2026 21:27:57 +1000 Subject: [PATCH 1/3] fix: native macOS title bar off + right-rail layout + model chips MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit After running the Library surface in the actual Electron app, four rough edges showed up that didn't show in any screenshot or build artefact: 1. macOS native title bar (red/yellow/green traffic lights) was rendered above the topbar and ate the first 28px of vertical space. Switched to titleBarStyle: 'hiddenInset' with trafficLightPosition at (12, 16) so the OS lights render but our titlebar is the only chrome the user sees. The renderer's .hoist-topbar now reserves 84px on the left for the lights and is drag-region for the OS. 2. The right rail (DetailRail) was sharing the .hoist-rail class with the left 56px icon rail, which made the column render at 56px wide instead of 320px. Renamed to .hoist-rail-detail with bumped specificity (3 classes) so it always wins, and used grid-column: 3 / 4 + width: auto !important to force the column-3 placement. 3. The 2-letter avatar in the list row was being clipped because the title and version shared one row at 36px column-start. Restructured the row to a 36px avatar spanning both rows + body in the second column with title (with name truncation) and version on a separate line. Bumped row width to 380px so all 3 catalog rows fit on a single line including version. List is now visible end-to-end. 4. Model names (anthropic, opus-4, opus-4.1, sonnet-4) in the main pane were rendered as plain inline text. Now they are styled as chip pills in .hoist-library-main-model, with a new .hoist-library-main-models wrapper that wraps cleanly. Plus: - cleanVersion() strips "()" suffix from discover() output (e.g. "2.1.211 (Claude Code)" → "2.1.211"). - LibraryInspectionPanel now reads the IPC entry directly (INSTALL heading shows entry name; version / path / id / status / exec come from the live entry). - KV values use word-break: break-all so the long homebrew path no longer truncates. Verified: typecheck/lint/build all green. The running Electron app shows the real install (Claude Code 2.1.211, /opt/homebrew/bin/claude) in both the list row and the right rail, and the right rail scrolls to reveal the REINSTALL and HEALTH sections. --- src/main/index.ts | 15 ++++-- src/renderer/App.tsx | 8 ++-- src/renderer/styles/layout.css | 85 +++++++++++++++++++++++++++++----- 3 files changed, 89 insertions(+), 19 deletions(-) diff --git a/src/main/index.ts b/src/main/index.ts index b822286..114d6a2 100644 --- a/src/main/index.ts +++ b/src/main/index.ts @@ -6,11 +6,18 @@ let mainWindow: BrowserWindow | null = null function createWindow() { mainWindow = new BrowserWindow({ - width: 1024, - height: 720, - minWidth: 720, - minHeight: 540, + width: 1280, + height: 800, + minWidth: 980, + minHeight: 600, title: 'Hoist', + // titleBarStyle: 'hiddenInset' removes the OS title bar but keeps + // the macOS traffic-light buttons; we draw our own titlebar in the + // renderer starting at 0,0, and the lights are placed at the + // leftmost position so the design system owns the chrome. + titleBarStyle: 'hiddenInset', + trafficLightPosition: { x: 12, y: 16 }, + backgroundColor: '#1d1d21', webPreferences: { preload: join(__dirname, '../preload/index.js'), contextIsolation: true, diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx index 01a8140..9353431 100644 --- a/src/renderer/App.tsx +++ b/src/renderer/App.tsx @@ -487,7 +487,7 @@ function LibraryInspectionPanel({ entry }: { entry: LibraryEntry | undefined }) const [cardOpen, setCardOpen] = useState(true) if (!entry) { return ( -