indifferentketchup/boocode
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

handoff

Browse Source
This commit is contained in:
indifferentketchup
2026-05-20 14:56:02 +00:00
parent 8cea4a899c
commit 2d841ee0b4
15 changed files with 1041 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
apps/web/src/App.tsx
View File

@@ -68,8 +68,13 @@ function AppShell() {
// theme class on <html> is correct before any child renders.
useTheme();
useUserEvents();
// v1.10.8c: h-dvh (dynamic viewport) instead of h-screen (100vh) so the
// root height excludes the iOS URL-bar overlay area. Without this, every
// descendant — including the terminal pane — measures itself against a
// height that extends behind the URL bar, and xterm allocates extra rows
// that scroll out of reach on iPhone.
return (
<div className="h-screen flex bg-background text-foreground">
<div className="h-dvh flex bg-background text-foreground">
<ProjectSidebar />
<MobileBackdrop />
<main className="flex-1 flex flex-col min-w-0">

25
apps/web/src/api/client.ts
View File

@@ -264,18 +264,23 @@ export const api = {
// v1.10 booterm: REST control plane for terminal panes. WebSocket attach
// lives at /ws/term/sessions/:sid/panes/:pid (handled directly by
// TerminalPane). All three endpoints are tolerant of empty bodies on the
// POSTs that don't take parameters.
// TerminalPane). v1.10.8c: resize moved in-band onto the WebSocket as a
// `{type:"resize",cols,rows}` text frame — the old /resize HTTP endpoint is
// gone, eliminating the race between WS attach and PTY-map registration.
terminals: {
start: (sessionId: string, paneId: string) =>
request<{ tmux_window: string }>(
// cols/rows are optional. When passed, booterm sizes the per-pane tmux
// session at creation time so the inner bash (and any TUI it spawns) is
// born with the correct PTY dimensions instead of tmux's 80x24 default.
start: (sessionId: string, paneId: string, cols?: number, rows?: number) =>
request<{ tmux_session: string }>(
`/api/term/sessions/${sessionId}/panes/${paneId}/start`,
{ method: 'POST' },
),
resize: (sessionId: string, paneId: string, cols: number, rows: number) =>
request<{ ok: true }>(
`/api/term/sessions/${sessionId}/panes/${paneId}/resize`,
{ method: 'POST', body: JSON.stringify({ cols, rows }) },
{
method: 'POST',
body:
cols !== undefined && rows !== undefined
? JSON.stringify({ cols, rows })
: undefined,
},
),
kill: (sessionId: string, paneId: string) =>
request<{ ok: true }>(

875
apps/web/src/components/panes/TerminalPane.tsx
View File

File diff suppressed because it is too large Load Diff

11
apps/web/src/hooks/useWorkspacePanes.ts
View File

@@ -1,6 +1,7 @@
import { useCallback, useEffect, useRef, useState } from 'react';
import type { DragEvent } from 'react';
import { toast } from 'sonner';
import { api } from '@/api/client';
import type { WorkspacePane } from '@/api/types';
import { setActivePaneInfo, clearActivePane } from '@/hooks/useActivePane';
@@ -302,11 +303,19 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
}
return prev;
}
// v1.10.8c: with per-pane tmux sessions, an unkilled session leaks until
// the next `tmux kill-server`. Fire-and-forget /kill on terminal removal.
// The endpoint is idempotent (404 on missing session) so a strict-mode
// double-invoke of the updater is safe.
const removed = prev[idx];
if (removed?.kind === 'terminal') {
api.terminals.kill(sessionId, removed.id).catch(() => { /* non-fatal */ });
}
const next = prev.filter((_, i) => i !== idx);
setActivePaneIdx((ai) => Math.min(ai, next.length - 1));
return next;
});
}, []);
}, [sessionId]);
// Replaces a single empty default pane with a chat pane. Used by the initial
// chat fetch to land on the most-recent open chat if no saved pane state.

5
apps/web/src/main.tsx
View File

@@ -1,3 +1,8 @@
// Fonts imported as JS side-effect modules (boolab pattern, adapted for
// Tailwind v4 + Vite asset-pipeline URL rewriting). Must precede the React
// imports so the @font-face CSS lands before any component-tree render.
import '@fontsource-variable/inter';
import '@fontsource-variable/jetbrains-mono';
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';

96
apps/web/src/styles/globals.css
View File

@@ -1,8 +1,7 @@
@import "tailwindcss";
@import "tw-animate-css";
@import "shadcn/tailwind.css";
@import "@fontsource-variable/inter";
@import "@fontsource-variable/jetbrains-mono";
/* @fontsource-variable JBM + Inter imported from main.tsx as JS modules. */
/* themes-v1: 18 preset palettes. Order matches docs/themes_v1.md §1 with
obsidian first (default). Each file declares .theme-<id> for the light
@@ -152,3 +151,96 @@
@apply font-sans;
}
}
/*
* iOS Safari auto-enlarges text in narrow viewports (anti-zoom). On its own
* that's fine for HTML chrome, but xterm.js measures its cell width from a
* hidden text-measure element — so when iOS up-sizes that element, xterm
* computes wider cells and the terminal ends up at fewer cols than it should.
* In opencode this surfaces as the small fragmented banner instead of the
* big chunky one (opencode picks the banner glyph set based on terminal
* width). 100% disables the auto-adjust and keeps boocode at the same
* effective cols as boolab on the same iPhone.
*/
html, body {
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
text-size-adjust: 100% !important;
}
/* iOS Safari auto-zooms when a user taps an input/textarea whose font-size
* is under 16px. Pin every input/textarea/select to 16px (boolab pattern)
* to suppress the zoom — applies globally; specific components can override
* with `text-base` or inline if a smaller visual is intentional. */
input, textarea, select {
font-size: 16px !important;
}
/*
* xterm.js overrides (boolab pattern — see /opt/boolab/frontend/src/styles/globals.css).
*
* Why these live in a global stylesheet, not in an inline <style> inside the
* component: an inline <style> inserted at component-mount time races the
* upstream @xterm/xterm/css/xterm.css that ships with the addon. We saw the
* right-edge stripe persist on iOS even though the override was identical to
* boolab's — moving the rules here so they're parsed alongside index.css
* eliminates that race.
*/
.xterm,
.xterm *,
.xterm .xterm-rows,
.xterm .xterm-rows * {
font-family: 'JetBrains Mono Variable', 'JetBrains Mono', 'Fira Code', Menlo, monospace !important;
}
/* Fill the host node — xterm's only non-absolute sizing comes from the canvas,
* and fractional rounding would otherwise leave a phantom right-edge stripe.
*/
.xterm {
width: 100% !important;
height: 100% !important;
}
/* Lock cell metrics so block-element glyphs (U+2580..U+259F) tile without
* subpixel gaps. Any non-zero letter-spacing or line-height ≠ 1 leaves
* fractional space between cells that paints as a horizontal/vertical
* stripe through the opencode banner on iOS. Disabling ligatures
* (font-feature-settings + font-variant-ligatures) prevents the renderer
* from collapsing adjacent block chars into shaped glyphs at unpredictable
* widths.
*/
.xterm,
.xterm .xterm-rows {
letter-spacing: 0 !important;
line-height: 1 !important;
font-feature-settings: "liga" 0, "calt" 0 !important;
font-variant-ligatures: none !important;
}
.xterm .xterm-viewport {
overflow-y: hidden !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
/*
* xterm.css ships `background-color: #000` on the viewport (kept for OS X
* scrollbar opacity in the upstream default). FitAddon rounds cols down
* to integer cells, so .xterm-screen is up to `cellWidth - 1` pixels
* narrower than .xterm-viewport — the strip between the canvas right
* edge and the viewport right edge then paints viewport's #000, which
* differs from the theme background (#0b0f14, set on the host wrapper in
* TerminalPane.tsx + via Terminal options.theme.background) and shows up
* as a visible right-edge gap.
*
* Setting viewport's background transparent lets the host wrapper's
* #0b0f14 show through, hiding the sub-cell remainder. Single source of
* truth for the bg color: the host.
*/
background-color: transparent !important;
}
.xterm .xterm-viewport::-webkit-scrollbar {
width: 0 !important;
height: 0 !important;
display: none !important;
}