Files
CodeNomad/packages/ui
MusiCode 13596e8082 feat(ui): add dynamic RTL layout support
- Sync document.documentElement.dir dynamically from I18nProvider
  based on selected locale (RTL for 'he', LTR for all others)
- Flip MUI Drawer anchor props (left/right) reactively via isRTL()
- Convert ~60 physical CSS directional properties to logical equivalents
  (border-inline-start/end, inset-inline-start/end, margin-inline-*, etc.)
- Add [dir="rtl"] overrides for translateX animations (sidebar slide,
  resize handle hit-area extensions, settings nav selection nudge)
- Preserve intentional direction:rtl + text-align:left truncation tricks
  (file path display in .truncate-start and .files-tab-selected-path)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-24 21:04:32 +00:00
..
2025-12-06 12:17:33 +00:00

CodeNomad UI

This package contains the frontend user interface for CodeNomad, built with SolidJS and Tailwind CSS.

Overview

The UI is designed to be a high-performance, low-latency cockpit for managing OpenCode sessions. It connects to the CodeNomad server (either running locally via CLI or embedded in the Electron app).

Features

  • SolidJS: Fine-grained reactivity for high performance.
  • Tailwind CSS: Utility-first styling for rapid development.
  • Vite: Fast build tool and dev server.

Development

To run the UI in standalone mode (connected to a running server):

npm run dev

This starts the Vite dev server at http://localhost:3000.

Building

To build the production assets:

npm run build

The output will be generated in the dist directory, which is then consumed by the Server or Electron app.

Debug Logging

The UI now routes all logging through a lightweight wrapper around debug. The logger exposes four namespaces that can be toggled at runtime:

  • sse Server-sent event transport and handlers
  • api HTTP/API calls and workspace lifecycle
  • session Session/model state, prompt handling, tool calls
  • actions User-driven interactions in UI components

You can enable or disable namespaces from DevTools (in dev or production builds) via the global window.codenomadLogger helpers:

window.codenomadLogger?.listLoggerNamespaces() // => [{ name: "sse", enabled: false }, ...]
window.codenomadLogger?.enableLogger("sse") // turn on SSE logs
window.codenomadLogger?.disableLogger("sse") // turn them off again
window.codenomadLogger?.enableAllLoggers() // optional helper

Enabled namespaces are persisted in localStorage under opencode:logger:namespaces, so your preference survives reloads.