@rubytech/create-maxy-lite 0.1.0

package/payload/webchat/public/style.css

@@ -0,0 +1,161 @@
+:root {
+  --bg: #0f1115;
+  --panel: #171a21;
+  --user: #2563eb;
+  --assistant: #232733;
+  --tool: #14171e;
+  --tool-border: #2c3340;
+  --tool-err: #4a1f1f;
+  --text: #e7e9ee;
+  --muted: #8b93a5;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+html,
+body {
+  margin: 0;
+  height: 100%;
+  background: var(--bg);
+  color: var(--text);
+  font: 15px/1.45 -apple-system, system-ui, sans-serif;
+}
+
+body {
+  display: flex;
+  flex-direction: column;
+}
+
+#bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 14px;
+  background: var(--panel);
+  border-bottom: 1px solid #00000044;
+}
+
+#title {
+  font-weight: 600;
+}
+
+#status {
+  font-size: 12px;
+  color: var(--muted);
+}
+
+#status.on {
+  color: #34d399;
+}
+
+#status.off {
+  color: #f59e0b;
+}
+
+#messages {
+  flex: 1;
+  overflow-y: auto;
+  padding: 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.msg {
+  max-width: 84%;
+  padding: 8px 12px;
+  border-radius: 14px;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+
+.msg.user {
+  align-self: flex-end;
+  background: var(--user);
+  color: #fff;
+  border-bottom-right-radius: 4px;
+}
+
+.msg.assistant {
+  align-self: flex-start;
+  background: var(--assistant);
+  border-bottom-left-radius: 4px;
+}
+
+.msg.tool {
+  align-self: flex-start;
+  max-width: 92%;
+  background: var(--tool);
+  border: 1px solid var(--tool-border);
+  border-radius: 8px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 12.5px;
+}
+
+.msg.tool.error {
+  background: var(--tool-err);
+  border-color: #6b2a2a;
+}
+
+.tool-head {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: var(--muted);
+  margin-bottom: 4px;
+}
+
+.tool-head svg {
+  flex: none;
+}
+
+.tool-body {
+  margin: 0;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  max-height: 200px;
+  overflow: auto;
+}
+
+#composer {
+  display: flex;
+  align-items: flex-end;
+  gap: 8px;
+  padding: 10px;
+  background: var(--panel);
+  border-top: 1px solid #00000044;
+  padding-bottom: calc(10px + env(safe-area-inset-bottom));
+}
+
+#input {
+  flex: 1;
+  resize: none;
+  max-height: 140px;
+  padding: 10px 12px;
+  border-radius: 18px;
+  border: 1px solid var(--tool-border);
+  background: var(--bg);
+  color: var(--text);
+  font: inherit;
+}
+
+#input:focus {
+  outline: none;
+  border-color: var(--user);
+}
+
+#send {
+  flex: none;
+  width: 40px;
+  height: 40px;
+  border: none;
+  border-radius: 50%;
+  background: var(--user);
+  color: #fff;
+  display: grid;
+  place-items: center;
+  cursor: pointer;
+}
+

package/payload/webchat/server.mjs

@@ -0,0 +1,229 @@
+#!/usr/bin/env node
+// maxy-lite structured web chat relay.
+//
+// Runs inside the proot-distro Ubuntu layer on the phone. It spawns the `claude`
+// code binary in a node-pty (the sanctioned PTY-only runtime), delivers the
+// browser's message by writing it into the pty, and renders replies by tailing
+// the session JSONL — NOT by scraping terminal bytes. Parsed rows stream to the
+// browser as structured user/assistant/tool messages over a WebSocket. Localhost
+// only; off-device exposure (cloudflared) is out of scope here.
+//
+// Every per-turn step emits one structured `[lite-chat]` line to stderr,
+// correlated by `turn=<n>`; `grep '\[lite-chat\]' <log> | grep 'turn=<n>'`
+// reconstructs a turn end to end.
+
+import http from 'node:http'
+import fs from 'node:fs'
+import path from 'node:path'
+import os from 'node:os'
+import { randomUUID } from 'node:crypto'
+import { StringDecoder } from 'node:string_decoder'
+import { fileURLToPath } from 'node:url'
+import pty from 'node-pty'
+import { WebSocketServer } from 'ws'
+import { parseTranscript } from './parse-transcript.mjs'
+
+const HERE = path.dirname(fileURLToPath(import.meta.url))
+const PUBLIC_DIR = path.join(HERE, 'public')
+
+const PORT = Number(process.env.LITE_PORT || 7682)
+const AGENT_HOME = process.env.LITE_AGENT_HOME || process.cwd()
+const CLAUDE_BIN = process.env.LITE_CLAUDE_BIN || 'claude'
+const PROJECTS_DIR = path.join(os.homedir(), '.claude', 'projects')
+const STATE_DIR = process.env.LITE_STATE_DIR || path.join(AGENT_HOME, '.maxy-lite')
+const SESSION_FILE = path.join(STATE_DIR, 'session-id')
+const TAIL_MS = 250 // JSONL poll interval
+const QUIET_MS = 1500 // silence that ends a turn for op=done
+
+const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i
+
+function log(op, fields = {}) {
+  const parts = [`[lite-chat] op=${op}`]
+  for (const [k, v] of Object.entries(fields)) parts.push(`${k}=${v}`)
+  process.stderr.write(parts.join(' ') + '\n')
+}
+
+// ---- claude session: fresh (--session-id) or resumed (--resume) -------------
+
+/** First existing `${dir}/${id}.jsonl` under PROJECTS_DIR, or null. */
+function transcriptFor(id) {
+  let dirs
+  try {
+    dirs = fs.readdirSync(PROJECTS_DIR)
+  } catch {
+    return null
+  }
+  for (const d of dirs) {
+    const candidate = path.join(PROJECTS_DIR, d, `${id}.jsonl`)
+    if (fs.existsSync(candidate)) return candidate
+  }
+  return null
+}
+
+function resolveSession() {
+  try {
+    const saved = fs.readFileSync(SESSION_FILE, 'utf8').trim()
+    // Resume only when the saved session's transcript still exists; a persisted
+    // id whose JSONL was deleted (cache clear, proot reset) would make
+    // `claude --resume` exit and brick the relay, so fall through to a fresh one.
+    if (UUID_RE.test(saved) && transcriptFor(saved)) {
+      return { sessionId: saved, args: ['--resume', saved] }
+    }
+  } catch {
+    /* no persisted session: start fresh */
+  }
+  const sessionId = randomUUID()
+  fs.mkdirSync(STATE_DIR, { recursive: true })
+  fs.writeFileSync(SESSION_FILE, sessionId)
+  return { sessionId, args: ['--session-id', sessionId] }
+}
+
+const { sessionId, args } = resolveSession()
+
+const child = pty.spawn(CLAUDE_BIN, args, {
+  name: 'xterm-256color',
+  cols: 120,
+  rows: 40,
+  cwd: AGENT_HOME,
+  env: process.env,
+})
+// The pty is input-only for our purposes; draining stdout prevents backpressure
+// from stalling claude. Render comes from the JSONL, never these bytes.
+child.onData(() => {})
+child.onExit(({ exitCode }) => log('child-exit', { exitCode }))
+log('spawn', { turn: 0, pty: true, pid: child.pid })
+
+// ---- JSONL discovery + tail -------------------------------------------------
+
+const allMessages = [] // full ordered transcript, replayed to every new client
+let turn = 0 // increments per browser send
+let turnActive = false
+let turnSawGrowth = false // a turn is only "done-able" once its reply has begun
+let turnStart = 0
+let lastActivity = 0
+
+let transcriptPath = null
+let offset = 0
+let residual = '' // partial trailing LINE carried across reads
+const decoder = new StringDecoder('utf8') // carries a partial multibyte CHAR across reads
+
+function tail() {
+  if (!transcriptPath) {
+    transcriptPath = transcriptFor(sessionId)
+    if (!transcriptPath) return
+    log('jsonl-found', { path: transcriptPath })
+  }
+  let size
+  try {
+    size = fs.statSync(transcriptPath).size
+  } catch {
+    return
+  }
+  if (size <= offset) return
+  const newBytes = size - offset
+  const fd = fs.openSync(transcriptPath, 'r')
+  const buf = Buffer.alloc(newBytes)
+  fs.readSync(fd, buf, 0, newBytes, offset)
+  fs.closeSync(fd)
+  offset = size
+
+  if (turnActive) {
+    log('jsonl', { turn, path: transcriptPath, newBytes })
+    turnSawGrowth = true
+    lastActivity = Date.now()
+  }
+
+  // decoder.write buffers a multibyte char split across this read boundary, so a
+  // UTF-8 sequence straddling two tail reads is decoded whole, not corrupted.
+  residual += decoder.write(buf)
+  const lines = residual.split('\n')
+  residual = lines.pop() ?? '' // keep the trailing partial line for next read
+
+  const skips = []
+  const msgs = parseTranscript(lines, {
+    onSkip: (idx, reason) => skips.push({ idx, reason }),
+  })
+  for (const s of skips) log('parse-skip', { line: s.idx, reason: s.reason })
+  if (msgs.length === 0) return
+
+  allMessages.push(...msgs)
+  if (turnActive) {
+    const kinds = [...new Set(msgs.map((m) => m.kind))].join('|')
+    log('render', { turn, msgs: msgs.length, kinds: `[${kinds}]` })
+  }
+  broadcast({ type: 'append', messages: msgs })
+}
+
+setInterval(tail, TAIL_MS)
+
+// A turn ends when the JSONL has been quiet for QUIET_MS after the last growth.
+// Gated on turnSawGrowth so a slow first JSONL write (cold start, discovery
+// latency) cannot mark the turn done before any reply has rendered.
+setInterval(() => {
+  if (turnActive && turnSawGrowth && Date.now() - lastActivity > QUIET_MS) {
+    turnActive = false
+    log('done', { turn, ranMs: Date.now() - turnStart })
+  }
+}, 500)
+
+// ---- transport: HTTP static + WebSocket -------------------------------------
+
+const CONTENT_TYPES = { '.html': 'text/html', '.js': 'text/javascript', '.css': 'text/css' }
+const STATIC = { '/': 'index.html', '/app.js': 'app.js', '/style.css': 'style.css' }
+
+const server = http.createServer((req, res) => {
+  const file = STATIC[req.url]
+  if (!file) {
+    res.writeHead(404)
+    res.end('not found')
+    return
+  }
+  fs.readFile(path.join(PUBLIC_DIR, file), (err, data) => {
+    if (err) {
+      res.writeHead(404)
+      res.end('not found')
+      return
+    }
+    res.writeHead(200, { 'content-type': CONTENT_TYPES[path.extname(file)] || 'text/plain' })
+    res.end(data)
+  })
+})
+
+const wss = new WebSocketServer({ server, path: '/ws' })
+
+function broadcast(obj) {
+  const payload = JSON.stringify(obj)
+  for (const c of wss.clients) {
+    if (c.readyState === 1) c.send(payload)
+  }
+}
+
+wss.on('connection', (ws) => {
+  // Reload resumes the transcript: every new client gets the full snapshot.
+  ws.send(JSON.stringify({ type: 'snapshot', messages: allMessages }))
+  ws.on('message', (raw) => {
+    let m
+    try {
+      m = JSON.parse(raw.toString())
+    } catch {
+      return
+    }
+    if (m.type !== 'send' || typeof m.text !== 'string' || m.text === '') return
+    turn += 1
+    turnActive = true
+    turnSawGrowth = false
+    turnStart = Date.now()
+    lastActivity = Date.now()
+    log('inbound', { turn, chars: m.text.length })
+    // Deliver to claude by writing into the pty, then submit with a carriage
+    // return. This is the TUI typing model — the same input path ttyd uses. An
+    // embedded newline would submit the TUI early and truncate the message, so
+    // collapse any newline to a space: v0 chat is single-line per send.
+    child.write(m.text.replace(/[\r\n]+/g, ' ') + '\r')
+    log('spawn', { turn, pty: true, pid: child.pid })
+  })
+})
+
+server.listen(PORT, '127.0.0.1', () => {
+  log('listening', { port: PORT, sessionId, home: AGENT_HOME })
+})

package/versions.json

@@ -0,0 +1,5 @@
+{
+  "nodeMajor": "20",
+  "claudeCode": "2.1.185",
+  "ttyd": "1.7.7"
+}