2 Commits

Author	SHA1	Message	Date
José Almeida	7ec639bf2f	feat(web): mobile parity (session/terminal/repo pickers + multi-terminal) (#840) ... * refactor(web): extract shared use-session-actions hook from SessionTab Move WS-level session lifecycle handlers (set primary, stop, resume, delete) into hooks/domains/session/use-session-actions so the same logic can power both the dockview tab context menu and upcoming mobile controls. Dockview-specific panel removal stays local in SessionTab via the onDeleted callback. * feat(web): humanize task and session state labels Mobile task sheet was rendering raw enum values like "IN_PROGRESS". Add formatTaskStateLabel + formatTaskSessionStateLabel helpers and use them in the mobile task sheet badge. Session state badge in the new mobile sessions picker also reuses the formatter. * feat(web): mobile session/terminal/repo pickers + multi-terminal support Address parity gaps on mobile by introducing per-pane header pills that open bottom-sheet pickers, scoped to the relevant view rather than overloading the left task sheet. Pickers: - Sessions pill in chat header → bottom sheet with launch / set-primary / stop / resume / delete (with confirm). Pill shows agent label + idx/total badge. - Terminals pill in terminal header → bottom sheet with add / close (with confirm) / switch. Replaces an earlier chip-strip prototype. - Repos pill on the top bar (multi-repo only) → bottom sheet listing task repositories; switching jumps to a session on that repo. Each pill renders with a chevron-down icon + count badge so the trigger reads as a button, not a status badge. Multi-terminal: - New useMobileTerminals hook wraps useTerminals and auto-creates a first shell when the env reports zero. - MobileTerminalPane multi-mounts PassthroughTerminal instances keyed by terminalId so switching preserves scrollback. Active xterm registers itself in a small mobile-active-terminal sender registry; the existing key-bar reroutes input through xterm.paste() so Ctrl / ^C / arrows reach whichever terminal is currently visible, not just the per-session default shell. - Skip the WebGL renderer addon on mobile (new disableWebgl prop on PassthroughTerminal). The WebGL atlas miscomputed glyph scaling after the desktop→mobile responsive switch and rendered text at several times the intended font size; the canvas renderer is correct and fast enough for shell use. Refactors: - Left sheet reverts to a single-purpose task list (the sectioned-hub variant was rolled back in favour of per-pane pickers). - session-task-switcher-sheet-hooks extracted from the sheet to keep it under the file-size lint cap. * fix(web): address review feedback on mobile pickers + multi-terminal Bots flagged a real first-mount bug and a handful of smaller items; addressed each: - mobile-terminal-pane: track xterm in state instead of a ref so the active-sender registration effect re-runs once xterm is ready. With the ref, the effect ran once on mount, found xtermRef.current === null while PassthroughTerminal was still initializing (notably under the ResizeObserver fallback path when the container starts at 0×0), and silently never registered — leaving the key-bar wired to the default shell instead of the visible terminal. - send-shell-input: wrap the activeSender call in try/catch so a stale registry entry (xterm GC'd mid-frame) falls back to the WS path instead of dropping the keystroke and silently consuming modifiers. Added tests for the activeSender routing branch (success, modifier consumption, fallback on throw). - mobile-sessions-section: remove the dead `showCloseConfirm ? "Delete" : "Delete"` ternary and the unused prop on SessionActionsMenu. - use-mobile-terminals: clear the auto-create guard when addTerminal() rejects so the user gets a retry instead of an empty terminal list. - mobile-repo-pill: sort taskRepos by position before falling back to the first repo, so the pill label matches the picker's ordering when no session is active yet. - session-task-switcher-sheet-hooks: catch loadTaskSessionsForTask rejection in handleSelectTask (was an unhandled rejection that left the sheet open on backend errors), and stabilize useCallback deps in handleWorkspaceChange by spreading the SheetNavOptions fields so a fresh literal each render doesn't defeat memoization. Extracted selectTaskWithoutPrimarySession to keep useSheetActions under the function-size lint cap. * fix(web): preserve task.repositories in sheet-hooks kanban mappers mapSnapshotToKanban (workspace switch) and handleTaskCreated (newly created task) only carried the first repository_id, dropping the full TaskRepository array. The mobile repo picker (useTaskRepoCount + MobileReposSection) reads task.repositories.length, so it silently disappeared after a workspace switch and for freshly created multi-repo tasks. Map the array with the same shape the SSR mapper uses (id, repository_id, base_branch, checkout_branch, position). Also address a small nit: wrap addTerminal in an arrow at the New terminal button so the click MouseEvent isn't passed as the (unused) first argument. * fix(web): de-dup mobile terminal auto-create + add state-label tests + repo-tap toast - use-mobile-terminals: move the auto-create-first-shell guard from per-instance refs to a module-level Set keyed by environmentId. MobileTerminalPane mounts useMobileTerminals three times for the same session (the pane itself, the picker pill via useActiveTerminalPillLabel, and the picker sheet content via MobileTerminalsList — Vaul keeps it mounted while closed). With per- instance guards, all three effects ran on first commit and each fired createUserShell, racing into up to three shells. The shared Set ensures only the first effect to observe an empty list creates, with retry-on-failure preserved (delete + next render re-checks). - mobile-repos-section: tapping a repo with no sessions now toasts a hint to open the session picker, instead of silently doing nothing. - state-labels: add tests covering known mappings, null/undefined fallbacks, and unknown-state passthrough for both formatters. * fix(web): single useMobileTerminals via context + tests + drop dead export Address two follow-up review items: - Lift useMobileTerminals to a single MobileTerminalsProvider owned by MobileTerminalPane. The picker pill and the picker sheet's list now read state from useMobileTerminalsContext instead of calling useMobileTerminals themselves. The previous setup had three independent useState-backed lists that drifted out of sync after addTerminal/removeTerminal — the pane could show a stale active terminal and the pill count could lag until a server WS push reconciled them. The module-level guard (added in 9488bb0c) fixed the creation race; this fix ensures the live list stays consistent too. - Drop the dead `subscribeActiveTerminalSender` export from the mobile active-terminal registry. The keybar reads via getActiveTerminalSender; notify/subscribe was speculative scaffolding with no production consumer. Test trimmed accordingly. - Add use-mobile-terminals.test.ts covering the auto-create logic (initial create, skip when shells exist, skip while loading, multiple instances trigger only one creation, retry after failure). Module-level guard exposes a __resetAutoCreatedEnvironmentsForTest helper so tests start from a clean slate. * test(web): capture binary AttachAddon frames in mobile keybar e2e helper The mobile-terminal-keybar Playwright spec asserted on captured shell.input WS frames. After this PR, the on-screen mobile terminal is a PassthroughTerminal with its own AttachAddon WebSocket, and the keybar routes input through xterm.paste() — bytes go on the binary terminal WS, not the kandev gateway's shell.input action. The capture helper missed those frames and every keybar-asserts-on-frame test failed (Ctrl+L, Shift+Tab, Esc, arrows, symbols, etc.). Extend attachShellInputCapture to also decode binary terminal frames (skipping the resize tag 0x01 prefix used by useSendResize) so the existing assertions on `data` continue to work regardless of which transport carried them. * fix(web): keybar control chars + session pill propagation + terminal close ordering Round-3 review feedback. Several real bugs that the previous rounds' mocks hadn't caught: - mobile-terminal-pane: switch from xterm.paste(data) to xterm.input(data, true). paste() wraps the payload in bracketed-paste escapes (\\e[200~…\\e[201~) under bash/zsh/fish, so every control byte from the keybar (^C, arrow keys, Esc, ^D, Tab) was landing in the shell as literal pasted text instead of as a control signal. - session-mobile-layout: TaskChatPanel and the agent PassthroughTerminal were rendering with the URL-derived `sessionId` prop instead of the store-driven `effectiveSessionId`. The session picker would update the top bar and terminal pane (which already read effectiveSessionId) but the chat content and passthrough agent stayed on the old session until a navigation refresh. Both consumers now follow effectiveSessionId; the now-unused `sessionId` prop is removed from MobileChatPanelContent + MobilePanelArea. - mobile-terminals-section: rework handleConfirmClose. Stop the remote shell first (and only mutate the picker on success), advance setRightPanelActiveTab to a remaining terminal when the closed one was active so terminalTabValue doesn't dangle, and call releaseAutoCreatedEnvironment when terminals drop to 0 so the pane recreates a default shell on next render instead of getting stuck on "Starting terminal…". Extracted as a useTerminalCloseHandler hook to keep the list under the function-size lint cap. - session-task-switcher-sheet-hooks: handleTaskCreated now merges session-derived fields (primarySessionId, sessionCount, etc.) from the existing kanban entry, with meta.taskSessionId as the priority source — so an "edit" call doesn't wipe the existing session and a "create with session" call sets primarySessionId correctly. Extracted into buildKanbanTaskUpsert + mergeSessionFields + mapTaskRepositories helpers. - session-task-switcher-sheet-hooks: mapSnapshotToKanban now carries optional step fields (allow_manual_move, prompt, is_start_step, show_in_command_panel, agent_profile_id) so the kanban store keeps step capabilities after a workspace switch. - use-mobile-terminals: add releaseAutoCreatedEnvironment(envId) — a runtime API to clear the module-level guard for one env, used by the picker when the user closes the last terminal. - use-mobile-terminals.test: extract SESSION_ID constant. * fix(web): restore mobile keybar modifier transforms with manual input routing Round-3 swapped mobile from ShellTerminal → PassthroughTerminal, which made AttachAddon auto-send xterm.onData straight to the WebSocket. That bypassed sendShellInput's modifier transform — so OS-keyboard input on mobile (e.g. tap Ctrl on the key-bar, then press "l") sent the raw "l" instead of "\\x0c" (form feed). Multiple e2e keybar tests caught this; my prior xterm.input(data, true) attempt only fixed the key-bar tap path, not OS-keyboard typing. Add `manualInputRouting` + `onWsReady` props to PassthroughTerminal (plumbed through useWebSocketConnection / startReconnectLoop / connectWebSocket). When `manualInputRouting` is true, AttachAddon is constructed with `bidirectional: false` so it only handles PTY → screen, and the consumer is responsible for forwarding xterm.onData itself. Mobile TerminalSlot now: - passes manualInputRouting=true and an onWsReady callback that registers an active-terminal sender writing raw bytes to that terminal's dedicated WS (replacing the prior xterm.input registry). - attaches its own xterm.onData listener that calls sendShellInput, which applies the key-bar's sticky Ctrl/Shift transforms before forwarding via the registered sender. Net effect: both key-bar taps AND OS-keyboard typing flow through sendShellInput on mobile, so modifiers apply uniformly. Desktop unaffected (default bidirectional AttachAddon path unchanged). Also extracted teardownWebSocket into ws-reconnect to keep the use-passthrough-terminal file under the line-count cap after the new options. * fix(web): tighten mobile sender registration + Set Primary + launch return - mobile-sessions-section: drop the borrowed isSessionStoppable guard on the "Set as Primary" item. The backend session.set_primary action has no such restriction, so a COMPLETED or FAILED session was being silently grayed out. Disable only when isPrimary or state isn't loaded yet. - mobile-terminal-pane: register the active key-bar sender only while the dedicated WebSocket is OPEN. Previously the sender went into the registry as soon as the tab became active, so during connect / reconnect it would silently no-op instead of letting sendShellInput fall through to its WS path. Track ws in state, drop it on close, and gate registration on readyState === OPEN. - session-task-switcher-sheet-hooks: early-return after a successful launchSession so we don't redundantly call setActiveTask after setActiveSession. Mirrors the existing "sessions exist" branch.	2026-05-06 19:05:21 +01:00
José Almeida	aa70b7dfa4	feat(web): mobile terminal key-bar — Ctrl/Shift modify OS-keyboard input + iOS keyboard fixes (#741) ... * feat(web): add mobile terminal key-bar with sticky Ctrl modifier Mobile software keyboards lack Ctrl, Esc, Tab, arrows, and shell symbols, so users had no way to interrupt a running command (Ctrl+C), escape an editor, or navigate the shell. Adds a horizontally scrolling key-bar above the virtual keyboard — sticky Ctrl modifier, dedicated Ctrl+C / Ctrl+D buttons, and visualViewport-based docking so the bar tracks the OS keyboard as it opens and closes. * test(web): add E2E coverage for mobile terminal key-bar Nine Playwright tests on the mobile-chrome project cover visibility gating, key emission verified via captured WS frames, the sticky Ctrl state machine, dedicated Ctrl+C / Ctrl+D buttons, keyboard-aware docking, accessibility, and an end-to-end ^C echo to prove the shell path works. Adds a reusable shell.input frame capture helper and a small page-object for the key-bar. * feat(web): shared shell input helpers for the mobile terminal Introduces a small toolkit the next commit will wire into the mobile key-bar: - `refocusXtermTextarea` — re-focuses xterm's hidden textarea after a virtual-key tap so iOS Safari doesn't dismiss the soft keyboard. - `suppressIOSKeyboardAssists` — strips name/autocomplete/data-* hints on the textarea so iOS / 1Password / LastPass / Bitwarden skip the AutoFill suggestion bar. - `useShellModifiersStore` (Zustand) — module-level Ctrl/Shift latch state with toggle (off → latched → sticky → off) and consume actions. - `applyShellModifiers` — pure transform: ctrl + a-z → control byte; shift + tab → CSI Z (reverse tab); single-char only. - `sendShellInput` — single entry point that reads the store, applies the transform, sends over WS, and consumes latched modifiers. `useShellKeySender` and the xterm `onData` path in `shell-terminal.tsx` now route through `sendShellInput` so any future modifier state propagates uniformly. `suppressIOSKeyboardAssists` is wired into `useTerminalInit` immediately after `terminal.open()`. * feat(web): mobile key-bar pivots to OS-keyboard input + pins to keyboard Reworks the mobile terminal key-bar around two insights: 1. The OS soft keyboard already provides letters — duplicating them in-bar was confusing and didn't address the real problem (Ctrl couldn't modify what the user typed via the OS keyboard, because that input went straight to xterm and bypassed React state). 2. iOS Safari `position: fixed; bottom:` drifts during visual-viewport scroll while the keyboard is open. Anchoring via `top` tied to the visual viewport's bottom edge stays glued. Changes: - `MobileTerminalKeybar` reads Ctrl/Shift state from the shared `useShellModifiersStore` and toggles it on tap. The actual chord transform now happens in `sendShellInput`, which both the bar and xterm's `onData` path call — so a Ctrl latch set from the bar modifies the next character typed on the OS keyboard. - Drops `LETTER_KEYS` and `chordChar` from the bar; adds a Shift toggle (Shift+Tab → reverse-tab from the bar; pairs with the modifier transform for OS-keyboard taps). - Latched state now shows the same ring as sticky (with sticky using a stronger `ring-primary`), so the first tap is visibly active. - `touch-action: manipulation` on each button so taps in the `overflow-x-auto` row don't get reinterpreted as scroll. - `useVisualViewportOffset` exports `viewportBottom = offsetTop + height`. When the keyboard is open the bar uses `top: viewportBottom - KEYBAR_HEIGHT_PX` and `bottom: auto`; closed, it keeps the `bottom`-based positioning so it sits above the bottom nav. - `SessionMobileLayout` computes the terminal panel's `paddingBottom` so terminal content's bottom edge sits exactly at the bar's top edge whether the keyboard is up or not. Tests cover the new modifier flow, Shift+Tab, the absence of in-bar letter buttons, and the `top`-anchored positioning when the keyboard is reported as open. * test(web): rewrite mobile key-bar e2e around real user flows The prior e2e leaned on in-bar letter buttons that no longer exist. Rewrites the spec around the journeys a mobile user actually performs: tap ^C to cancel, latch Ctrl + type a letter on the OS keyboard, sticky Ctrl across multiple chords, Shift+Tab from the bar, history nav with the arrow button, Esc, symbol keys, and the iOS positioning fixes (top-anchored when the keyboard opens, tracks visual viewport scroll, terminal panel reserves space for the bar). Adds a `shift` getter to the page object. * style(web): apply prettier formatting * fix(web): keep modifiers armed on dropped sends + tighten input handler Addresses bot review on PR #741: - `sendShellInput` no longer consumes Ctrl/Shift when the WS client isn't available — the chord stays armed so the user can retry once reconnected instead of seeing the latch silently clear. - Adds `send-shell-input.test.ts` with the matrix the helper needs: empty data, ctrl chord + auto-release, sticky retention, shift+tab → CSI Z, shift passthrough on non-tab, and the WS-disconnected no-send/no-consume path. - Removes dead `ctrlChord` export and its tests — the only consumer was its own test, and `applyShellModifiers` covers the same transform end-to-end. - Drops the unused `send` parameter from `useShellInputHandler` (the effect now goes through `sendShellInput` directly), removing a spurious dep that would otherwise re-fire the effect on identity changes. - Documents that `KEY_SEQUENCES.home`/`end` are intentionally readline shortcuts (Ctrl+A/E), not VT Home/End sequences, so future readers don't mistake it for a bug. * refactor(web): split mobile key-bar helpers, tighten null-viewport test Addresses two non-blocking suggestions from PR #741 review: - Move `KeyDef`, `KEYS`, `ModifierButton`, and `KeybarButton` out of `mobile-terminal-keybar.tsx` into a sibling helpers file. The main component drops from 213 to 115 lines, comfortably under the 200-line component convention. - Assert `viewportBottom === 0` in the null-viewport branch of `use-visual-viewport-offset.test.ts` so all three return-shape fields are covered there.	2026-04-30 14:05:35 +01:00