Pixxl

All-in-one development workspace. Electron + React + Effect-TS monorepo.

Structure

apps/
  desktop/     # Electron main process (@pixxl/desktop)
  webview/     # React UI (@pixxl/webview)
packages/
  shared/      # Contracts/schemas (@pixxl/shared)

Stack

• Package Manager: pnpm with workspace catalogs
• Build: vite-plus (vp)
• Desktop: Electron + Effect-TS + node-pty
• UI: React + TanStack Router + Jotai + Tailwind CSS
• IPC: Effect services (no direct window.pixxl calls in UI)

Quick Start

# Install
pnpm install

# Dev (both desktop + webview)
vp dev

# Build all
vp build

# Check/format/lint
vp check
vp fmt
vp lint

Commands

Command	Description
vp dev	Start dev mode
vp build	Build all packages
vp check	Typecheck, lint, format
vp test	Run tests

Per-package commands work from any directory:

cd apps/desktop && vp dev    # Electron dev
cd apps/webview && vp dev    # Vite dev server
cd packages/shared && vp test

Key Patterns

IPC via Effect Service (webview):

// CORRECT: Use PixxlClient service
const config = yield * PixxlClient.pipe(Effect.flatMap((c) => c.getConfig));

// WRONG: Never call window.pixxl directly
const config = await window.pixxl?.getConfig();

Shared contracts (packages/shared): Source of truth for IPC channels, config schemas, branded IDs. Never duplicate in app packages.

Docs

• AGENTS.md — Root guidelines
• apps/*/AGENTS.md — Package-specific rules
• docs/agents/style.md — Code style
• effect-solutions list — Effect patterns