feat: implement web server mode

[eisbaw]

🌐 Claudia Web Server Implementation

Add comprehensive web server functionality to Claudia, enabling Claude Code execution from mobile browsers while maintaining feature parity with the desktop Tauri app.

This makes it possible to use from a phone - something I find useful of Codex/Jules.

🎯 Objective

Enable users to access Claude Code from mobile devices via web browser, addressing the limitation of desktop-only access. This allows for:

• Mobile development workflows
• Remote access to Claude Code functionality
• Browser-based Claude execution without desktop app installation
• Cross-platform compatibility

🚀 Implementation Overview

Core Features

• Axum web server with WebSocket support for real-time streaming
• Dual-mode event system supporting both Tauri desktop and DOM web events
• Session management with HashMap-based tracking of active WebSocket connections
• Process spawning for actual Claude binary execution with stdout streaming
• REST API mirroring all Tauri command functionality

📁 Key Components

Backend Implementation

web_server.rs

• Main server with WebSocket handlers and REST endpoints
• Real Claude binary execution with subprocess spawning
• WebSocket message streaming for real-time output
• Comprehensive session state management
• CORS configuration for mobile browser access

Frontend Implementation

apiAdapter.ts

• Environment detection and unified API layer
• WebSocket client with automatic failover from Tauri to web mode
• Event dispatching system compatible with existing UI components

ClaudeCodeSession.tsx

• Enhanced with DOM event support for web mode
• Session-scoped event handling
• Seamless mode switching between desktop and web

🔧 Technical Details

Build & Deployment

• Build system: just web command for integrated build and run
• Binary detection: Bundled binary first, system PATH fallback
• Message protocol: JSON-based WebSocket communication
• Event handling: Session-scoped and generic event dispatching
• Error handling: Comprehensive error propagation and UI feedback

Architecture

┌─────────────────┐    ┌──────────────────┐    ┌─────────────────┐
│   Mobile/Web    │    │   Axum Server    │    │  Claude Binary  │
│    Browser      │◄──►│   WebSocket      │◄──►│   Subprocess    │
│                 │    │   REST API       │    │                 │
└─────────────────┘    └──────────────────┘    └─────────────────┘

✅ Completed Features

• Basic WebSocket streaming and session management
• REST API endpoints for all core functionality
• Event handling compatibility between Tauri and web modes
• Error handling and WebSocket connection management
• Process spawning and output streaming
• Comprehensive debugging and tracing

🔄 Outstanding Work

• Session-scoped event dispatching refinement for multi-user scenarios
• Process cancellation implementation
• Complete stderr handling implementation
• Multi-session support per connection

🚀 Getting Started

Prerequisites

• Rust toolchain
• Node.js and npm/yarn
• Tauri development environment

Building and Running

# Build and run web server
just web

# Development mode
cargo run --features web-server

# Build frontend assets
npm run build

Usage

1. Desktop Mode: Use existing Tauri application
2. Web Mode: Navigate to localhost in (mobile) browser
3. Automatic Detection: Application detects environment and adapts accordingly

🛠️ Development Notes

Event System

The dual-mode event system supports both Tauri's native event handling and DOM events for web browsers:

// Automatic environment detection
const eventHandler = new EventHandler(isWebMode);
eventHandler.listen('claude-output', handleOutput);

Session Management

WebSocket connections are tracked per session with automatic cleanup:

// Session state management
struct SessionManager {
    sessions: HashMap<Uuid, WebSocketSession>,
    // ... other fields
}

[eisbaw]

Sessions, chat history, submitting prompts and getting responses work -- which is good enough for me, but there may be other rough corners.