Files
openchamber/packages/ui/src/components/icon/README.md
T
Bohdan Triapitsyn e908db637b feat: agent and CLI control plane for sessions, worktrees, and scheduled tasks (#2408)
Add a shared OpenChamber control service with two thin adapters — a native
`openchamber` tool injected into managed OpenCode, and new CLI commands — so
users can manage parallel sessions, worktrees, and scheduled tasks
conversationally through agents or from the terminal.

Control plane:
- New openchamber-control service owning a fixed action contract:
  projects.list, models.list, session list/create/send/fork/status/messages,
  and schedule list/create/run/delete/toggle. Session and worktree deletion
  and project registration are deliberately not exposed.
- New openchamber-sessions module owning create/worktree/prompt orchestration,
  Goal Mode dispatch, wait semantics (initial idle never counts as completion;
  timeout and cancellation are failures), and explicit partial-failure results.
- Scheduled-task logic extracted into a service shared by routes, CLI, and the
  agent tool.

Agent tool:
- Managed OpenCode gets a materialized plugin registering one typed tool with
  a loopback-only callback, per-child ephemeral bearer (timing-safe, never
  persisted or logged), and abort propagation into the service.
- The ~1.5k-token schema applies progressive disclosure: short descriptions,
  server-side validation returning actionable usage errors, and intent
  guardrails — created sessions/tasks are user-facing work (not age
  self-delegation); worktree/goal/agent/variant/wait are omit-by-default;
  dispatches produce no completion notification, and later result r
  to session.messages, which now returns the authoritative sessionStatus.
- session.create without a user-named model picks from favorites/re
  send/fork omit the selection and the service reuses the target session's
  last user-message model, agent, and variant before falling back t
- An "Agent control tool" setting (default on, Save + Reload to apply)
  disables plugin injection entirely.

CLI:
- New `openchamber session`, `schedule`, `projects`, and `models` commands
  with automatic instance targeting, --wait/--timeout/--last-assist
  worktree flags, and Goal Mode, preserving interactive, non-TTY, --quiet,
  and --json contracts. The control HTTP timeout derives from the w
  instead of the 4-second default.

UI:
- New built-in "Schedule a Task" starter (/schedule-task) running a
  dialogue that defines a task and offers to create it via the tool after
  explicit confirmation; Craft a Goal and Feature Planning gain the
  handoff offer, and guided starters reserve the question tool for concrete
  option choices. Localized in all 10 locales, migrated into custom
  starter lists, hidden on VS Code.
- Sidebar shows CLI/agent-created sessions live via the control eve
- openchamber tool calls render with per-action titles and metadata.
2026-07-24 21:54:28 +03:00

2.5 KiB

Icon System

OpenChamber uses an SVG sprite-based icon system for performance. Remixicon glyphs and explicitly registered custom glyphs are rendered via a single hidden SVG sprite injected into the DOM, referenced by <use href="#oc-icon-name"/>.

Usage

import { Icon } from "@/components/icon/Icon";

<Icon name="arrow-down-s" className="h-4 w-4" />
<Icon name="loader-4" className="size-4 animate-spin" />

Icon Names

Icons use kebab-case names based on Remixicon. To find an icon name:

  1. Start from the Remixicon component name: RiArrowDownSLine
  2. Remove Ri prefix → ArrowDownSLine
  3. Convert to kebab-case → arrow-down-s

Common suffixes:

  • Line / Fill are dropped from the sprite name
  • Numbers are preserved: RiChat4Linechat-4

Adding a New Icon

  1. Import and use it in your code: <Icon name="new-icon-name" />
  2. Run bun run icons:sprite to regenerate the sprite with the new icon
  3. The script scans packages/ui/src for all RiX usages and extracts SVG paths

If the icon doesn't exist in the sprite, the script will warn you.

Custom product glyphs are registered in scripts/generate-icon-sprite.mjs. They must use the shared 24x24 viewbox and currentColor so they match Remixicon sizing and theme behavior.

Sizing

The Icon component does not have a size prop. Use Tailwind classes instead:

<Icon name="arrow-down-s" className="h-4 w-4" />   {/* 16px */}
<Icon name="arrow-down-s" className="size-5" />      {/* 20px */}
<Icon name="arrow-down-s" className="h-6 w-6" />     {/* 24px */}

Type Safety

import type { IconName } from "@/components/icon/icons";

const icon: IconName = "arrow-down-s"; // type-checked

Architecture

  • sprite.ts — Auto-generated SVG path data (run bun run generate-icon-sprite to regenerate)
  • Icon.tsx — The <Icon> component, injects sprite on first mount
  • icons.ts — TypeScript type IconName

The sprite is injected as a hidden <svg id="openchamber-icon-sprite"> element containing <symbol> elements. Each <Icon> renders <svg><use href="#oc-{name}"/></svg>.

Migration from @remixicon/react

Old:

import { RiArrowDownSLine } from "@remixicon/react";
<RiArrowDownSLine className="h-4 w-4" />

New:

import { Icon } from "@/components/icon/Icon";
<Icon name="arrow-down-s" className="h-4 w-4" />

If an icon is used as a component reference (not JSX):

// Old: const icon = RiStackLine; return <icon />;
// New: const icon: IconName = "stack"; return <Icon name={icon} />;