OpenHands/OpenHands is the frontend application for the OpenHands AI agent platform, known as Agent Canvas. It is a React single-page application (SPA) built with Vite, TypeScript, Tailwind CSS, and React Router. The application provides a comprehensive user interface for interacting with AI coding agents (OpenHands, Claude Code, Codex, Gemini, or any ACP-compatible agent) via an agent server. It supports multiple backends (local self-hosted, cloud at app.all-hands.dev) with a backend registry that routes API calls accordingly. The UI includes a chat interface with real-time WebSocket event streaming, a conversation panel for managing multiple sessions, a file explorer with Monaco editor, terminal emulator, browser snapshot view, git integration (commits, diff viewer, push/pull), settings for LLM profiles, MCP servers, secrets, skills/plugins, and an automation dashboard for scheduled or event-driven agent runs. The application is also published as an npm package (@openhands/agent-canvas) for embedding in other applications, and supports Electron desktop builds. The architecture follows a modern React pattern with Zustand for client-side state management (conversations, events, UI preferences), TanStack React Query for server-state caching and synchronization, and react-i18next for internationalization. The backend abstraction layer is a key architectural feature: every service (settings, profiles, git, secrets, automations, etc.) branches on the active backend kind (local vs cloud) and delegates to either a direct SDK client (@openhands/typescript-client) or a cloud proxy (callCloudProxy). This dual-transport pattern is enforced by guard tests that prevent ad-hoc HTTP calls outside vetted files. The application also includes a manifest system for declarative automation setup, a tool visualizer registry for rendering agent tool calls (bash, file editor, search, task), and extensive mock infrastructure (MSW) for development and testing. Key entry points include the root layout (src/routes/root-layout.tsx) which provides the main shell with sidebar, command menu, and onboarding; the conversation main view (src/components/features/conversation/conversation-main/conversation-main.tsx) with resizable panels for chat and tabs; the settings pages (src/routes/settings.tsx) with schema-driven forms; and the automation dashboard (src/routes/automations-list.tsx). External dependencies include the agent server REST API, cloud proxy endpoints, @openhands/typescript-client SDK, @openhands/extensions for automation catalogs, and various UI libraries (HeroUI, framer-motion, xterm.js, Monaco editor). The codebase is actively maintained with over 84k stars, frequent commits, and a large test suite (Vitest unit tests, Playwright E2E tests, Stryker mutation testing).