T4 Code: Devpost Submission Details
Inspiration
For developers who live in Oh My Pi (OMP) all day, running coding sessions and steering agentic workflows entirely from terminal interfaces can become overwhelming. While terminal interfaces are incredibly powerful, they fall short when visualizing complex agent tool flows, reviewing side-by-side file diffs, inspecting multi-step browser automations, or monitoring resource usage across multiple hosts.
We built T4 Code to be the ultimate companion app for OMP. Our inspiration was to create a beautifully polished, ultra-responsive, and secure desktop and mobile interface that mirrors the state of your OMP runtime. By acting as a pure projector that sends user commands over a clean schema-driven wire, T4 Code brings rich visual context to agentic coding without ever hijacking your runtime state.
What it does
T4 Code is a free, open-source (MIT) desktop and mobile client for OMP. Key features include:
Rich Session & Project Management: Organize coding sessions by project directory, with activity filters, search, sorting, and collapsible groups matching the Codex desktop model. Visual Composer: Prompts, inline model settings (thinking effort, fast mode toggles), and slash commands (like /model, /compact, /retry, /review, and /terminal) map directly to OMP inputs. Turn-by-Turn Tool Inspection: Follow semantic transcript rows in real-time, watching agent tools execute shell commands, perform browser automation steps, run test suites, or generate files. Panes & Diffs: Review code changes as they happen, easily keep or discard changes per-file, and attach to live terminals with full keyboard input. Browser Preview & Surfaces: Interact with host-linked browser instances via coordinate-mapped clicks/keystrokes, or launch native credential-isolated browser tabs. Tailnet Gateway Pairing: Securely pair local or remote hosts (via encrypted device credentials stored in the OS keychain) using a seamless t4-code://pair/... flow. How we built it
T4 Code is designed with a multi-layered, cross-platform architecture:
Electron + React (Vite): Powering the desktop shell, providing high-density panels, customizable workspace splits, and native windowing. Flutter (Android/iOS/macOS): Powering the native mobile and cross-platform clients to ensure consistent, highly responsive rendering and deep system integrations (like the Android Keystore and iOS Secure Enclave). TypeScript Monorepo: Clean separation of concerns with packages like @t4-code/host-wire (owning the omp-app/1 protocol), @t4-code/host-service (the core host orchestration logic), and @t4-code/host-daemon (managing background service execution). Direct Wire Protocol: The client-host communication runs on typed WebSocket frames. The app never fabricates or stores state; it strictly projects runtime updates and passes commands down. Challenges we ran into
Responsive Rendering for Huge Transcripts: Rendering transcripts containing thousands of events, rich diffs, and terminal outputs on mobile screens without lagging. We solved this by implementing newest-first transcript paging (painting recent updates immediately while tail history loads lazily). Seamless Hand-Offs: Designing the hand-off between terminal-based TUI sessions and the GUI. We developed the /continue-in-t4 workflow, ensuring that active session hand-offs happen smoothly without dropping runtime context or agent locks. Robust Service Management: Bundling the standalone t4-host and managing local host life cycles (systemd on Linux, launchd on macOS) while avoiding restart loops or stale process IDs during crashes or updates. Secure Remote Access: Letting developers access their workstation OMP hosts from anywhere (including their phones) without exposing the connection to the public internet. We leveraged Tailscale Serve and encrypted OS keychains to restrict connection boundaries strictly to authorized Tailnets. Accomplishments that we're proud of
Dual-Platform Architecture: Releasing fully functional native Android APKs, Debian packages, AppImages, and signed/notarized macOS builds from a single unified workspace. Zero State Persistence: Designing a client that is entirely ephemeral—meaning if the UI crashes or restarts, the underlying agents, locks, and terminals keep running perfectly untouched on the host. 10k-History Stress Tolerance: Passing extreme soak tests that verify 10,000+ line histories and 20+ reconnect loops without UI lag or memory leaks. What we learned
Pure Projector Pattern: Decoupling user interface rendering from backend state storage makes apps resilient. By treating the client as a pure observer of the host wire schema, we avoided complex synchronization bugs. Tailored Security Boundaries: Integrating credential management directly into the local platform's secure storage instead of storing plaintext keys or custom configuration files on disk is crucial for developer trust. What's next for T4 Code
iOS TestFlight Launch: Bringing the native iOS App to parity with Android and macOS clients. Linux/macOS Direct RPC Cutover: Replacing temporary bridges and fallbacks with direct, native RPC connections to OMP. Expanded Tool Visualizers: Rendering more detailed execution graphs for multi-agent execution hierarchies.
Log in or sign up for Devpost to join the conversation.