portable-agent-layer 0.70.0 → 0.71.0

package/src/tools/control-room/ui/signal.tsx

@@ -0,0 +1,161 @@
+import type { DueBadge, RatingPoint, SignalView } from "../data";
+import { percent, tenths } from "./format";
+import { Panel, Pending, useLoaded } from "./panel";
+
+const LOW_RATING = 3;
+const W = 320;
+const H = 72;
+const PAD = 4;
+
+function sparkPath(points: RatingPoint[]): {
+  line: string;
+  area: string;
+  xy: [number, number][];
+} {
+  if (points.length === 0) return { line: "", area: "", xy: [] };
+  const step = points.length > 1 ? (W - PAD * 2) / (points.length - 1) : 0;
+  const xy = points.map<[number, number]>((p, i) => [
+    PAD + i * step,
+    H - PAD - ((p.rating - 1) / 9) * (H - PAD * 2),
+  ]);
+  const line = xy
+    .map(([x, y], i) => `${i === 0 ? "M" : "L"}${x.toFixed(1)} ${y.toFixed(1)}`)
+    .join(" ");
+  const area = `${line} L${xy.at(-1)?.[0].toFixed(1)} ${H} L${xy[0][0].toFixed(1)} ${H} Z`;
+  return { line, area, xy };
+}
+
+function Sparkline({ points }: { points: RatingPoint[] }) {
+  const { line, area, xy } = sparkPath(points);
+  const last = xy.at(-1);
+  const midY = H - PAD - (4 / 9) * (H - PAD * 2);
+  return (
+    <svg
+      className="spark"
+      viewBox={`0 0 ${W} ${H}`}
+      preserveAspectRatio="none"
+      role="img"
+      aria-label="ratings"
+    >
+      <title>ratings, oldest to newest</title>
+      <defs>
+        <linearGradient id="sparkfill" x1="0" x2="0" y1="0" y2="1">
+          <stop offset="0" stopColor="#f0b14a" stopOpacity="0.28" />
+          <stop offset="1" stopColor="#f0b14a" stopOpacity="0" />
+        </linearGradient>
+      </defs>
+      <line className="rule" x1={PAD} x2={W - PAD} y1={midY} y2={midY} />
+      <path className="area" d={area} />
+      <path className="line" d={line} />
+      {points.map((p, i) =>
+        p.rating <= LOW_RATING ? (
+          <circle key={p.ts} className="low" cx={xy[i][0]} cy={xy[i][1]} r="2" />
+        ) : null
+      )}
+      {last && <circle className="last" cx={last[0]} cy={last[1]} r="3" />}
+    </svg>
+  );
+}
+
+function Figure({ value, label, tone }: { value: string; label: string; tone?: string }) {
+  return (
+    <div className="figure">
+      <div className={`value ${tone ?? ""}`}>{value}</div>
+      <div className="label">{label}</div>
+    </div>
+  );
+}
+
+const BADGE_LOOK: Record<DueBadge["state"], { row: string; tag: string }> = {
+  due: { row: "due", tag: "amber" },
+  clear: { row: "clear", tag: "good" },
+  "n/a": { row: "na", tag: "ghost" },
+};
+
+function Due({ name, badge }: { name: string; badge: DueBadge }) {
+  const look = BADGE_LOOK[badge.state];
+  return (
+    <div className={`due-row ${look.row}`}>
+      <span className={`tag ${look.tag}`}>{badge.state}</span>
+      <span className="detail">
+        {name}
+        {badge.detail ? ` — ${badge.detail}` : ""}
+      </span>
+    </div>
+  );
+}
+
+function ratingTone(avg: number): string {
+  if (avg < 5) return "bad";
+  if (avg >= 7) return "good";
+  return "";
+}
+
+export function Signal() {
+  const view = useLoaded<SignalView>("/api/signal");
+  return (
+    <Panel
+      index="02 · feedback"
+      title="Signal"
+      span={4}
+      order={1}
+      aside={
+        view.state === "ready" && view.data.synthesizedAt
+          ? `synthesised ${view.data.synthesizedAt.slice(0, 10)}`
+          : ""
+      }
+    >
+      <Pending value={view} />
+      {view.state === "ready" && (
+        <>
+          <div className="figures">
+            <Figure
+              value={view.data.ratings ? tenths(view.data.ratings.recentAvg) : "–"}
+              label="last 10"
+              tone={view.data.ratings ? ratingTone(view.data.ratings.recentAvg) : ""}
+            />
+            <Figure
+              value={view.data.ratings ? tenths(view.data.ratings.avg) : "–"}
+              label={`avg of ${view.data.ratings?.count ?? 0}`}
+            />
+            <Figure
+              value={view.data.ratings ? String(view.data.ratings.lowCount) : "–"}
+              label="low (≤3)"
+              tone={view.data.ratings && view.data.ratings.lowCount > 5 ? "bad" : ""}
+            />
+          </div>
+          {view.data.series.length > 0 ? (
+            <Sparkline points={view.data.series} />
+          ) : (
+            <div className="empty">No ratings yet.</div>
+          )}
+          <div className="spark-caption">
+            <span>last {view.data.series.length} ratings</span>
+            <span>{view.data.ratings?.trend ?? ""}</span>
+          </div>
+          <div className="figures" style={{ marginTop: 16 }}>
+            <Figure
+              value={
+                view.data.algorithm ? String(view.data.algorithm.reflectionCount) : "–"
+              }
+              label="reflections"
+            />
+            <Figure
+              value={view.data.algorithm ? percent(view.data.algorithm.passRate) : "–"}
+              label="criteria pass"
+            />
+            <Figure
+              value={view.data.algorithm ? tenths(view.data.algorithm.avgSentiment) : "–"}
+              label="sentiment"
+            />
+          </div>
+          <div className="due">
+            <Due name="learning analysis" badge={view.data.due.analysis} />
+            <Due name="algorithm review" badge={view.data.due.algorithmReview} />
+            <Due name="relationship reflect" badge={view.data.due.relationshipReflect} />
+          </div>
+        </>
+      )}
+    </Panel>
+  );
+}

package/assets/templates/ledger-page.html

@@ -1,213 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>Action Ledger</title>
-<style>
-  :root {
-    --bg: #eef0f2;
-    --panel: #ffffff;
-    --ink: #1b2026;
-    --muted: #6b7480;
-    --line: #d5dae0;
-    --accent: #0f6e6e;
-    --accent-ink: #ffffff;
-    --block: #b4471c;
-    --block-bg: #fbf0ea;
-    --ok: #2f7a3e;
-    --ok-bg: #edf6ee;
-    --pending: #8a6d00;
-    --pending-bg: #fbf5df;
-    --agent: #4a3fa3;
-    --agent-bg: #efedf9;
-    --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
-    --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
-  }
-  * { box-sizing: border-box; }
-  html, body { height: 100%; }
-  body { margin: 0; background: var(--bg); color: var(--ink); font: 13px/1.45 var(--sans); }
-  header {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 10px 16px; background: var(--panel); border-bottom: 1px solid var(--line);
-  }
-  header h1 { font-size: 14px; margin: 0; font-weight: 600; letter-spacing: .01em; }
-  header .model { font-family: var(--mono); font-size: 11px; color: var(--muted); }
-  header .who { font-size: 12px; color: var(--muted); }
-  header .who b { color: var(--ink); font-weight: 600; }
-
-  main { background: var(--panel); min-height: calc(100% - 45px); }
-  h2 {
-    font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted);
-    margin: 0; padding: 12px 14px 8px; font-weight: 600;
-  }
-
-  .filters { display: flex; gap: 10px; padding: 0 14px 12px; flex-wrap: wrap; align-items: end; }
-  .filters label { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
-  select, input { font: inherit; padding: 4px 6px; border: 1px solid var(--line); border-radius: 3px; }
-
-  .stats { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 1px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
-  .stat { background: var(--panel); padding: 12px 14px; }
-  .stat label { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
-  .stat .n { font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
-  .stat.headline { background: var(--block-bg); }
-  .stat.headline .n { font-size: 40px; color: var(--block); }
-  .stat.applied .n { color: var(--ok); }
-  .stat.failed .n { color: var(--pending); }
-  .stat.denied .n, .stat.blocked .n { color: var(--block); }
-  .st { font-size: 11px; color: var(--muted); }
-
-  table { width: 100%; border-collapse: collapse; }
-  td, th { text-align: left; padding: 7px 14px; border-top: 1px solid var(--line); vertical-align: top; font-variant-numeric: tabular-nums; }
-  th { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); border-top: 0; font-weight: 600; }
-  td.ts { font-family: var(--mono); font-size: 11px; color: var(--muted); white-space: nowrap; }
-  td.target { font-family: var(--mono); font-size: 11px; word-break: break-all; }
-  td.diff { font-family: var(--mono); font-size: 11px; }
-  .actor { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 11px; }
-  .actor.human { background: #eef0f2; }
-  .actor.agent { background: var(--agent-bg); color: var(--agent); }
-  .out { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 11px; font-weight: 600; }
-  .out.applied { background: var(--ok-bg); color: var(--ok); }
-  .out.failed { background: var(--pending-bg); color: var(--pending); }
-  .out.denied { background: var(--block-bg); color: var(--block); }
-  .out.blocked { background: var(--block-bg); color: var(--block); }
-  footer { font-family: var(--mono); font-size: 10.5px; color: var(--muted); padding: 10px 14px; border-top: 1px solid var(--line); }
-</style>
-</head>
-<body>
-<header>
-  <h1>Action Ledger</h1>
-  <span class="model" id="modelLine"></span>
-  <span class="who" id="who"></span>
-</header>
-
-<main>
-  <h2>Window</h2>
-  <div class="filters">
-    <div><label for="project">Project</label><select id="project"><option value="">all projects</option></select></div>
-    <div><label for="since">From</label><input type="date" id="since"></div>
-    <div><label for="until">To</label><input type="date" id="until"></div>
-  </div>
-
-  <div class="stats" id="stats"></div>
-
-  <h2>Action log</h2>
-  <table>
-    <thead><tr><th>When</th><th>Actor</th><th>Action</th><th>Target</th><th>Change</th><th>Outcome</th></tr></thead>
-    <tbody id="log"></tbody>
-  </table>
-  <footer id="footer">Every row is one action an agent tried to make. The ledger saw each from both sides, before and after. Nothing here was written by hand.</footer>
-</main>
-
-<script>
-const $ = id => document.getElementById(id);
-const OUTCOMES = ['applied', 'failed', 'denied', 'blocked'];
-let ledgerFiles = 0;
-
-function el(tag, cls, text) {
-  const node = document.createElement(tag);
-  if (cls) node.className = cls;
-  if (text !== undefined) node.textContent = text;
-  return node;
-}
-
-const pad = n => String(n).padStart(2, '0');
-function when(ts) {
-  const d = new Date(ts);
-  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`;
-}
-
-const authorityWord = key => key === 'user' ? 'human' : key;
-function tally(counts, word = k => k) {
-  const parts = Object.entries(counts).sort((a, b) => b[1] - a[1]).map(([k, v]) => `${word(k)} ${v}`);
-  return parts.length ? parts.join(' · ') : '—';
-}
-
-function query() {
-  const p = new URLSearchParams();
-  if ($('project').value) p.set('project', $('project').value);
-  if ($('since').value) p.set('since', $('since').value);
-  if ($('until').value) p.set('until', `${$('until').value}T23:59:59.999Z`);
-  return p.toString();
-}
-
-function windowText() {
-  const from = $('since').value, to = $('until').value;
-  if (!from && !to) return 'all time';
-  return `${from || 'start'} → ${to || 'now'}`;
-}
-
-function renderStats(s) {
-  const strip = $('stats');
-  strip.replaceChildren();
-  const headline = el('div', 'stat headline');
-  headline.append(el('label', '', 'Refusals'), el('div', 'n', String(s.refusals)),
-    el('div', 'st', `denied ${s.outcomes.denied.total} · blocked ${s.outcomes.blocked.total}`));
-  strip.append(headline);
-  for (const key of OUTCOMES) {
-    const o = s.outcomes[key];
-    const card = el('div', `stat ${key}`);
-    card.append(el('label', '', key), el('div', 'n', String(o.total)),
-      el('div', 'st', tally(o.byAuthority, authorityWord)), el('div', 'st', tally(o.byRuntime)));
-    strip.append(card);
-  }
-}
-
-function actorCell(r) {
-  const td = el('td');
-  const agent = r.authority === 'agent';
-  td.append(el('span', `actor ${agent ? 'agent' : 'human'}`, agent ? `agent · ${r.runtime}` : r.actor));
-  td.append(el('div', 'st', agent ? `on behalf of ${r.actor}` : `via ${r.runtime}`));
-  return td;
-}
-
-function changeCell(r) {
-  const td = el('td', 'diff');
-  td.append(r.reason ? el('span', 'st', r.reason) : document.createTextNode(r.change));
-  return td;
-}
-
-function renderRows(rows) {
-  const body = $('log');
-  body.replaceChildren();
-  if (!rows.length) {
-    const td = el('td', 'st', 'No actions in this window.');
-    td.colSpan = 6;
-    const tr = el('tr'); tr.append(td); body.append(tr);
-    return;
-  }
-  for (const r of rows) {
-    const tr = el('tr');
-    const outcome = el('td'); outcome.append(el('span', `out ${r.outcome}`, r.outcome));
-    tr.append(el('td', 'ts', when(r.ts)), actorCell(r), el('td', '', r.tool), el('td', 'target', r.target), changeCell(r), outcome);
-    body.append(tr);
-  }
-}
-
-async function load() {
-  const res = await fetch(`/api/ledger?${query()}`);
-  const body = await res.json();
-  if (!res.ok) { $('modelLine').textContent = body.error; return; }
-  renderStats(body.stats);
-  renderRows(body.rows);
-  $('modelLine').textContent = `${body.stats.total} actions · ${windowText()} · ${ledgerFiles} ledger file(s)`;
-}
-
-async function loadProjects() {
-  const list = await (await fetch('/api/projects')).json();
-  for (const { slug } of list) {
-    const o = el('option', '', slug); o.value = slug; $('project').append(o);
-  }
-}
-
-async function loadStatus() {
-  const s = await (await fetch('/api/status')).json();
-  ledgerFiles = s.ledgerFiles;
-  $('who').replaceChildren('machine ', Object.assign(el('b', '', s.machine)));
-}
-
-for (const id of ['project', 'since', 'until']) $(id).addEventListener('change', load);
-Promise.all([loadProjects(), loadStatus()]).then(load);
-</script>
-</body>
-</html>

package/src/cli/setup-telos.ts

@@ -1,52 +0,0 @@
-/**
- * Interactive TELOS setup — prompts for personal context during `pal install`.
- * Skips any step whose TELOS file already has real content.
- */
-
-import { writeFileSync } from "node:fs";
-import { resolve } from "node:path";
-import * as clack from "@clack/prompts";
-import { palHome } from "../hooks/lib/paths";
-import { hasRealContent, SETUP_STEPS, STEP_ORDER } from "../hooks/lib/setup";
-
-/** Prompt for missing TELOS context. Skips any step whose file already has real content. */
-export async function promptTelos(): Promise<void> {
-  // Skip interactive prompts in non-TTY environments (tests, CI)
-  if (!process.stdin.isTTY) return;
-
-  const home = palHome();
-  const pending = STEP_ORDER.filter(
-    (key) => !hasRealContent(resolve(home, SETUP_STEPS[key].file))
-  );
-
-  if (pending.length === 0) {
-    clack.log.info("TELOS already configured");
-    return;
-  }
-
-  clack.intro("Personal Context Setup");
-  clack.note(
-    "Answer in a sentence or two — you can edit the files in ~/.pal/telos/ for more detail later.",
-    "Quick setup"
-  );
-
-  for (const key of pending) {
-    const step = SETUP_STEPS[key];
-    const title = key.charAt(0).toUpperCase() + key.slice(1);
-
-    const answer = await clack.text({
-      message: step.question,
-      placeholder: step.hint,
-    });
-
-    if (clack.isCancel(answer)) {
-      clack.cancel("Setup cancelled");
-      return;
-    }
-
-    const filePath = resolve(home, step.file);
-    writeFileSync(filePath, `# ${title}\n\n${answer}\n`, "utf-8");
-  }
-
-  clack.outro("Personal context saved ✓");
-}

package/src/hooks/lib/setup.ts

@@ -1,60 +0,0 @@
-/**
- * Setup state management for PAL first-run wizard.
- *
- * State lives in memory/state/setup.json. Each step maps to a TELOS file.
- * The AI is instructed to mark steps done after writing each file.
- */
-
-import { existsSync, readFileSync } from "node:fs";
-
-interface SetupStep {
-  done: boolean;
-  file: string;
-  question: string;
-  hint: string;
-}
-
-/** Ordered setup steps — defines the wizard flow */
-export const SETUP_STEPS: Record<string, Omit<SetupStep, "done">> = {
-  mission: {
-    file: "telos/MISSION.md",
-    question:
-      "What do you do? What's your role and core purpose? (~/.pal/telos/MISSION.md)",
-    hint: "e.g. Senior software engineer building developer tooling at Acme Corp",
-  },
-  goals: {
-    file: "telos/GOALS.md",
-    question:
-      "What are your current goals? (short-term, medium-term, long-term) (~/.pal/telos/GOALS.md)",
-    hint: "e.g. Ship v2 by Q3, learn Rust, get promoted to staff engineer",
-  },
-  beliefs: {
-    file: "telos/BELIEFS.md",
-    question: "What principles or values guide your work? (~/.pal/telos/BELIEFS.md)",
-    hint: "e.g. Simple code > clever code, ship early and iterate, always write tests",
-  },
-  challenges: {
-    file: "telos/CHALLENGES.md",
-    question: "What are your biggest current challenges? (~/.pal/telos/CHALLENGES.md)",
-    hint: "e.g. Context switching between projects, unclear requirements, work-life balance",
-  },
-};
-
-export const STEP_ORDER = Object.keys(SETUP_STEPS);
-
-/** Check if a TELOS file has real content (not just template scaffolding) */
-export function hasRealContent(filePath: string): boolean {
-  if (!existsSync(filePath)) return false;
-  try {
-    const content = readFileSync(filePath, "utf-8").trim();
-    return content.split("\n").some((l) => {
-      if (!l.trim()) return false;
-      if (l.startsWith("#")) return false;
-      if (l.startsWith("<!--") || l.startsWith("-->")) return false;
-      if (/^\s*-\s*$/.test(l)) return false;
-      return true; // includes table rows (| ... |) — counts as real content
-    });
-  } catch {
-    return false;
-  }
-}

package/src/tools/ledger/server.ts

@@ -1,111 +0,0 @@
-/**
- * A local page over the ledger, for showing the action log to someone who
- * will not read a terminal.
- *
- * Loopback only, stateless, no store of its own: every request reads the
- * ledger afresh through the same query the CLI uses, so the page and
- * `pal cli ledger` can never disagree. The browser holds nothing but the
- * current filter selection.
- */
-
-import { readFileSync } from "node:fs";
-import { loadMachine } from "../../hooks/lib/machine";
-import { assets } from "../../hooks/lib/paths";
-import { readAllProjects } from "../../hooks/lib/projects";
-import { type LedgerFilter, ledgerFiles, parseSince } from "./query";
-import { ledgerView } from "./view";
-
-export const DEFAULT_PORT = 7250;
-export const LOOPBACK = "127.0.0.1";
-
-export interface ServerStatus {
-  pid: number;
-  port: number;
-  startedAt: string;
-  ledgerFiles: number;
-  machine: string;
-}
-
-function json(body: unknown, status = 200): Response {
-  return Response.json(body, { status });
-}
-
-/** A window the page cannot parse is an error, not the whole ledger. */
-function filterFromQuery(params: URLSearchParams): LedgerFilter | string {
-  const filter: LedgerFilter = {};
-  const project = params.get("project");
-  if (project) filter.project = project;
-  for (const key of ["since", "until"] as const) {
-    const spec = params.get(key);
-    if (!spec) continue;
-    const at = parseSince(spec);
-    if (!at) return `Unrecognised ${key}: ${spec}`;
-    filter[key] = at;
-  }
-  return filter;
-}
-
-function page(): Response {
-  return new Response(readFileSync(assets.ledgerPageTemplate()), {
-    headers: { "content-type": "text/html; charset=utf-8" },
-  });
-}
-
-function projects(): Response {
-  const slugs = readAllProjects()
-    .map((p) => p.name)
-    .sort((a, b) => a.localeCompare(b));
-  return json(slugs.map((slug) => ({ slug })));
-}
-
-function ledger(url: URL): Response {
-  const filter = filterFromQuery(url.searchParams);
-  if (typeof filter === "string") return json({ error: filter }, 400);
-  return json(ledgerView(filter));
-}
-
-function status(port: number, startedAt: string): Response {
-  const body: ServerStatus = {
-    pid: process.pid,
-    port,
-    startedAt,
-    ledgerFiles: ledgerFiles().length,
-    machine: loadMachine().label,
-  };
-  return json(body);
-}
-
-export function startLedgerServer(port: number = DEFAULT_PORT) {
-  const startedAt = new Date().toISOString();
-  return Bun.serve({
-    hostname: LOOPBACK,
-    port,
-    fetch(request, server) {
-      if (request.method !== "GET") return json({ error: "read only" }, 405);
-      const url = new URL(request.url);
-      switch (url.pathname) {
-        case "/":
-          return page();
-        case "/api/ledger":
-          return ledger(url);
-        case "/api/projects":
-          return projects();
-        case "/api/status":
-          return status(server.port ?? port, startedAt);
-        default:
-          return json({ error: "not found" }, 404);
-      }
-    },
-  });
-}
-
-function portFromArgv(argv: string[]): number {
-  const flag = argv.find((arg) => arg.startsWith("--port="));
-  const port = flag ? Number(flag.slice("--port=".length)) : DEFAULT_PORT;
-  return Number.isInteger(port) && port >= 0 ? port : DEFAULT_PORT;
-}
-
-if (import.meta.main) {
-  const server = startLedgerServer(portFromArgv(process.argv.slice(2)));
-  console.log(`http://${LOOPBACK}:${server.port}/`);
-}