* feat: expand terminal quick keys
Add navigation keys plus ctrl/alt modifiers for the web terminal.
* feat: make terminal modifiers sticky
Keep Ctrl/Alt active until toggled off, Termux-style.
* style: improve terminal quick key buttons
Boost active contrast and adjust sizing for mobile.
* feat: add terminal key popups
Use long-press popups for / and - keys.
* fix: make terminal modifiers mutually exclusive
* fix(web): keep soft keyboard open on terminal buttons
* fix(web): allow mouse clicks on terminal quick keys
* refactor(web): simplify terminal quick input modifier handling
Remove the applyModifiers callback and inline modifier state application.
Add automatic modifier reset after quick input when appropriate.
* refactor(web): extract dispatchSequence helper for terminal input handling
Create a reusable dispatchSequence callback to handle modifier application
and reset logic for both terminal data input and quick input handlers.
---------
Co-authored-by: weishu <twsxtd@gmail.com>
Previously, useTerminalSocket used a relative path `/terminal` for Socket.IO,
which would connect to the frontend host instead of the actual HAPI server.
Now it uses the baseUrl from context to connect to the correct server, enabling
scenarios like hosting the frontend on GitHub Pages while the server runs elsewhere.
Integrates tunwg (WireGuard tunnel) to enable optional public access
to the hapi server. Tunnel is disabled by default and enabled via
--relay flag or HAPI_TUNNEL=true environment variable.
Users can now run 'hapi server --relay' and get a direct link like:
https://app.hapi.run/?server=https://xxx.relay.hapi.run&token=xxx
Codex elicitation requests from MCP use the 'message' field (from
ElicitRequest schema), not 'command' or 'cwd'. Update the permission
handler to extract and pass this field, and display it as the card
subtitle with fallback to command.
Adds onRequest and onComplete callbacks to CodexPermissionHandler to track
permission request/response lifecycle. Includes helper functions to normalize
command and cwd inputs, and displays permission requests in the web UI.
Codex API sends 'shell_command' as the tool name for bash commands, but
the web app didn't recognize it, falling back to a generic wrench icon.
This adds proper presentation with a terminal icon, matching Claude's
Bash tool display.
Parse the "Exit code: X\nWall time: Y\nOutput:\n..." format from bash tool
results and display metadata (exit code and wall time) separately from the
output content as a code block.
- Updated useLongPress.ts to pass click coordinates to onLongPress callback
- Modified SessionList.tsx to use menuAnchorPoint state instead of menuAnchorRef
- Updated SessionActionMenu.tsx to position menu based on anchorPoint coordinates
- Enhanced SessionHeader.tsx to calculate anchorPoint from button position and added stopPropagation to fix toggle issue
The menu now appears at the exact touch/click position instead of being centered or aligned to the button edge.
The IntersectionObserver's useEffect had handleLoadMore in its dependency
array, but handleLoadMore depended on isLoadingMoreMessages. When loading
completed, isLoadingMoreMessages changed, causing handleLoadMore to be
recreated and the observer to rebuild, immediately firing again and
triggering continuous load requests.
Fixed by storing handleLoadMore in a ref and removing it from the
IntersectionObserver's dependency array, allowing it to rebuild only when
hasMoreMessages or isLoadingMessages change.
Implement a visibility-aware notification system that delivers toast messages via SSE to visible browser tabs instead of sending push notifications, reducing unnecessary push requests. Includes VisibilityTracker for monitoring connection visibility, toast UI components, and enhanced SSEManager with toast delivery capability.
Introduces visibility tracking for pending messages to distinguish between
total pending messages and those that are actually visible to the user. This
allows the overflow warning to trigger only when visible messages are dropped,
not just any messages. Includes caching of visibility checks for pending
messages to improve performance.
Introduces a new message-window-store module to manage message state with
automatic windowing of visible and pending messages. This replaces manual
React Query cache operations with a centralized, observable state system.
close#39
Key changes:
- New MessageWindowState tracks visible/pending messages with size limits
- Automatic trimming of message windows (400 visible, 200 pending messages)
- Pending message buffering when user scrolls away from bottom
- Centralized status updates for optimistic messages
- Thread component simplified with forwarded scroll and pending callbacks
- Removes message count tracking from components
This improves performance for chats with many messages and provides a
cleaner separation of concerns between UI and state management.
Reorganizes the LoginPrompt layout by moving the Server button from an
absolute-positioned top-right corner into the main content flow as a text
link in a new "Help links" section below the login form. Also adds a
"Needs help?" link pointing to the documentation. This reduces visual
clutter, improves hierarchy by grouping related actions, and provides
better guidance for new users.
- Update subtitle to official slogan "Vibe Coding Anytime, Anywhere"
- Simplify input placeholder to "Access token"
- Remove verbose help text below the input field
- Move server settings from top-right corner to footer below form
- Add "Needs help?" link to docs (https://hapi.run/docs)
- Add underline styling to both help and server links for better affordance
- Add footer with copyright and Vibe Coding message
Implements MCP server configuration and developer instructions support in
Codex local mode, bringing it to parity with remote mode.
Key additions:
- buildMcpServerConfigArgs() and buildDeveloperInstructionsArg() utilities
to construct -c config arguments for passing MCP servers and instructions
to the Codex CLI at runtime
- TITLE_INSTRUCTION for Codex to call hapi__change_title to update chat
session titles dynamically
- Codex local mode now starts hapi MCP bridge server and passes both MCP
configuration and developer instructions to Claude, enabling full feature
parity with remote mode
Files changed:
- New: codexMcpConfig.ts (utilities), systemPrompt.ts (prompt definition),
codexMcpConfig.test.ts (comprehensive tests)
- Updated: codexLocal.ts (accepts mcpServers, builds config args),
codexLocalLauncher.ts (starts hapi server, passes config),
codexStartConfig.ts (imports TITLE_INSTRUCTION)
Introduces support for displaying API error system messages in the web UI with
automatic folding of consecutive retry messages to show only the latest state.
Extract permission mode display logic into shared utilities for better reusability and maintainability. Add PermissionModeTone type and related helpers to centralize mode-based styling rules across components. Update components to use new PermissionModeOption type for consistent permission mode presentation.
Add close button to Chrome/Edge install prompt and respect dismissed state
when determining if prompt can be shown. iOS version already had dismiss
capability, so this brings feature parity across all supported browsers.
Implement push notification system with VAPID keys, client service worker integration, and push subscription management. Includes server-side PushService for sending notifications and PushNotifier for reactive event handling, plus client-side usePushNotifications hook and service worker support.
Implements comprehensive session lifecycle management with user-friendly interactions:
Rename: Update session metadata.name via PATCH endpoint with conflict detection
Archive: Abort active sessions via DELETE endpoint with validation
Delete: Permanently remove inactive sessions with cascade cleanup
Backend:
- Store.deleteSession() removes session and cascade-deletes messages
- SyncEngine.renameSession() with concurrency error handling
- SyncEngine.deleteSession() with active session validation
- PATCH /sessions/:id for rename, DELETE /sessions/:id for delete
Frontend Components:
- RenameSessionDialog: Text input with auto-focus and error display
- SessionActionMenu: Modal with rename, archive, delete buttons
- ConfirmDialog: Reusable confirmation with error feedback
- SessionHeader: Menu button (⋮) triggering action menu
- SessionList: Long-press detection triggering item actions
Interactions:
- Long-press on session list items (500ms threshold) opens action menu
- Menu button in session header (non-Telegram environments only)
- Confirmation dialogs with descriptive warnings for destructive actions
- Real-time error display in dialogs on operation failure
- Haptic feedback on long-press via usePlatform hook
Accessibility:
- Keyboard support (Enter/Space) for long-press handler
- Focus management in RenameSessionDialog
- Proper ARIA labels and semantic HTML
The selected button was using bg-[var(--app-link)] with white text, which
resulted in invisible text in dark mode (white background + white text).
Changed to use bg-[var(--app-button)] and text-[var(--app-button-text)]
with opacity-80 for proper contrast in both light and dark themes.
Implement namespace support across sessions, machines, and users for multi-user server deployments. Add access control with specific error reasons (namespace-missing, access-denied, not-found) and database schema updates with namespace columns and indexes.
* feat(web): add session list grouping by project directory
- Group sessions by project path with collapsible sections
- Sort groups by active status first, then by latest update time
- Sort sessions within each group by update time (descending)
- Add visual indicators for groups with active sessions
- Display project count in header statistics
Co-authored-by: weishu <twsxtd@gmail.com>
Implements bidirectional sync of permission/model modes between CLI sessions and web app. Adds Codex-specific permission modes (read-only, safe-yolo, yolo) alongside Claude's modes. Web can now control CLI session state via RPC set-session-config handler, while CLI broadcasts state changes through keep-alive payloads. UI controls are flavor-aware, showing appropriate modes for Claude vs Codex vs Gemini. Type centralization in api/types eliminates circular dependencies.
