.md file to compare - side-by-side diff against phase-trace
phase-trace
description: "Triggers on prompt mention of 'phase-trace', 'show phases', 'currently running', 'happening right now'."
What it does for you
Shows the steps of a long task as your assistant works through them.
What it produces
A recent result, so you can see the kind of work it returns.
loading…
How to get it
These run inside the Snappy workspace. Want this working in your business? I set skills like this up with you, in one focused week.
For developers how this skill is built, graded, and how it runs
at a glance- the short version
what's inside - the parts that make up a skill 3/4 present
A skill is just a few plain-text files. Only the main one is required. The rest are optional, added as the work needs them. This is what the skill is made of; how it runs is just below.
state/skills/phase-trace/SKILL.md
present
state/lib/phase-trace.ts
present
state/bin/phase-trace/
not present
state/skills/phase-trace/AGENTS.md
present
how it runs - the shared frame every skill uses 3/5 present
Every skill runs the same way. One part does the work, a separate part checks it, and a short loader hands the AI exactly what it needs for the job. Anything this skill doesn't use shows a one-line note saying why, on purpose, not by accident.
state/log/evals.ndjson what it has learned - fixes written back in over time sample
When a run hits something this skill didn't handle, the fix gets written back into the skill so it doesn't happen again. FIXED means it was corrected on the spot. LOGGED means it's queued for a bigger rewrite. Either way, the skill gets a little better and never makes the same mistake twice.
- Loading feedback rows…
how the work flows- step by step
SKILL.md- the skill, written out in plain English
phase-trace
state/lib/phase-trace.ts - pure in-memory accumulator. Pairs with the PhaseDisclosure shape registered in web/src/components/phase-disclosure.tsx (snappy-chat). One trace per tick, many phases per trace, optional body per phase.
The disclosure pattern matches Claude Desktop's "Cowork" layout (cd-23 in the design references): a vertical stack of rows, each with a chevron, status dot, mono label, and a one-line summary. Click any row to expand the multi-paragraph body underneath.
Steps
- Open a trace with optional title:
import { startTrace } from "../lib/phase-trace.ts";
const t = startTrace("Charlotte execute");
- Add phases as the work progresses. Each
.phase(label, opts)returns
a fluent handle:
const p = t.phase("Loaded tools", { summary: "Probing connectors", status: "running" });
p.body("Now let me probe the actual connector data shapes...");
p.done();
- When the tick finishes,
emit()returns the canonical payload shape:
const { phaseDisclosure } = t.emit();
// → { phases: [{ label, summary, body?, status? }, ...], title? }
- The dispatcher in
state/bin/head-screen/server.tswraps the payload
in a TOOL_CALL_* triple keyed PhaseDisclosure and the snappy-chat surface renders the disclosure rows inline.
Status enum
pending | running | done | error. The renderer maps each to a colored status dot (text-tertiary / accent w/ glow / ok-green / danger-red).
Eval
Shape gate. The actor is startTrace().emit() and the auditor is the parser parsePhaseDisclosureArgs in web/src/tool-args.ts. A row passes if every phase has both label and summary strings and the status (when present) is in the four-value enum.
Rubric
- id: payload-shape
kind: deterministic
check: emit().phaseDisclosure.phases is a non-empty array of {label, summary} objects
- id: status-enum
kind: deterministic
check: every phase.status (when present) is one of pending|running|done|error
- id: parser-roundtrip
kind: deterministic
check: parsePhaseDisclosureArgs(JSON.stringify(emit().phaseDisclosure)) returns a non-null shapeAGENTS.md- what the AI loads when this skill comes up
phase-trace - loader
Per-turn rules for the phase-trace skill. Full reference: state/skills/phase-trace/SKILL.md.
phase-trace is the builder API long-running snappy-os skills use to accumulate phase rows (label + summary + body + status) as they work, then emit one canonical PhaseDisclosure payload at end of tick. The snappy-chat generative UI renders that payload inline as a vertical stack of collapsible disclosure rows - chevron + status dot + mono label + one-line summary, expanding to multi-paragraph body. Visual pattern matches Claude Desktop's "Cowork" layout (cd-23 in design references). Pure in-memory accumulator. Pairs with web/src/components/phase-disclosure.tsx in snappy-chat. Lib: state/lib/phase-trace.ts.
Critical Rules
- Status enum is
pending|running|done|errorexactly -parsePhaseDisclosureArgsinweb/src/tool-args.tskills any card with off-enum status. - Both
labelandsummaryare REQUIRED on every phase.bodyis optional;statusis optional (defaults handled downstream). emit()is one-shot. Call it at end of tick. Do NOT re-emit during streaming - the renderer expects one payload per trace.- Pure in-memory accumulator. Do NOT persist phase rows to disk; the eval row in
state/log/evals.ndjsonis the persistence record of record. - Phase ordering = insertion order. Sort upstream of
t.phase()calls if you want a different display order.
Commands
| ui dashboard | state/skills/phase-trace/resources/ui.openui | |invoke: import { startTrace } from "../lib/phase-trace.ts" |usage: const t = startTrace("Charlotte execute"); const p = t.phase("Loaded tools", {summary:"Probing connectors", status:"running"}); p.body("...long body..."); p.done(); ... t.emit() returns {phaseDisclosure: {phases: [...], title?}} |dispatcher: state/bin/head-screen/server.ts - regex matcher + emitTriple("PhaseDisclosure", payload.phaseDisclosure) |trigger phrases (matched in dispatcher regex, extended at L7029): running / currently-running / happening right now |eval log: state/log/evals.ndjson (skill: "phase-trace", eval_mode: shape) |tested: 2026-04-29 end-to-end with shape PhaseDisclosure paired against snappy-chat renderer; parser roundtrip OK; dispatcher routing hooked
Status enum
| status | renderer dot | use for |
|---|---|---|
| pending | text-tertiary (muted gray) | queued phases not yet started |
| running | accent w/ glow | the phase happening right now |
| done | ok-green | completed phases |
| error | danger-red | actual failures only - reserve sparingly |
Trigger phrases
runningcurrently running/currently-runninghappening right now
(Dispatcher regex extended at L7029 in state/bin/head-screen/server.ts to route these to PhaseDisclosure.)
OpenUI Resource
- Skill-owned OpenUI Lang resource:
state/skills/phase-trace/resources/ui.openui. Read it before rendering or editing this skill's generated component surface. - Treat this resource as a first-class artifact of the skill, not a generic chat response. Improve it when the skill's user-facing output needs to become richer.
- System resources compose OpenUI primitives and inherit SnappyChat tokens. Use
ui_contract: brandedin SKILL.md only for deliberate platform or client visuals.
Known Pitfalls
- A phase missing
summaryfails the parser shape gate and the card is dropped silently. Always set summary, even a one-word placeholder. bodystrings can be long (multi-paragraph) - the renderer truncates inside the closed disclosure row; full text appears on expand. Don't pre-truncate upstream.status:"error"paints a red dot. Reserve it for actual failures; using it for "warning" or "skipped" misleads the cockpit reader.
Self-Test
An agent reading this should correctly:
- [ ] Confirm
emit()output shape matchesparsePhaseDisclosureArgs(label + summary required, status enum exact) - [ ] Confirm phase ordering is insertion order
- [ ] Confirm status enum is strictly
pending|running|done|error - [ ] Confirm
emit()is called once per tick, not per phase - [ ] Confirm trigger phrases
running/currently running/happening right nowroute toPhaseDisclosurevia the dispatcher regex
Self-report
If this loader fell short, append a line:
echo "[$(date -u +%FT%TZ)] phase-trace: <what was missing or fixed> [FIXED|LOGGED] action_kind=<kind>" >> state/log/loader-feedback.log
<!-- kernel-ok: historical attribution for the PID-loader pattern. -->
Self-correcting loader (PID feedback)
This is the rule that makes loaders learn. Ported from snappy-kernel, where it demonstrably worked: the snappy-dom-cartographer skill mapped Skool admin UI once, every later ship-agent inherited the full map for free.
Before you finish, do two things:
1. Fix gaps (P - proportional). MANDATORY. If this loader didn't cover your case - if you had to read another file, run an undocumented command, work around a wrong selector, or discover a quirk - you MUST attempt an Edit to this AGENTS.md before you log.
- Default action: edit this file. Surgical. Add the missing line, table
row, or code example where it belongs. No restructuring.
- Only
LOGGEDis allowed when: the fix needs >10 lines, spans multiple
files, or requires a structural rewrite. In that case the state/regen/drain.sh queue picks it up asynchronously.
- "I didn't have time" / "it's minor" / "the next agent will figure it out"
are NOT valid reasons. Minor gaps compound - that's the whole point of this loop.
- Concrete example of a valid P-fix: discover
agent-browser screenshot
takes path positionally not as --output <path>. One line in a table. Edit it in. Do not just log it.
- The goal: the next agent never has to leave the loader.
2. Log the result.
echo "[$(date -u +%FT%TZ)] phase-trace: <what was missing or fixed> [FIXED|LOGGED] action_kind=<kind>" >> state/log/loader-feedback.log
<slug>MUST be the literal folder name of this loader
(state/skills/<slug>/AGENTS.md). The class token between [ts] and : is the producer slug, the writeback class, AND the grade class - they must be equal so state/lib/controller-tune.ts can pair the brief.
FIXED= you patched this loader inline (P-fix).LOGGED= too large for inline; the PostToolUse enqueue + Stop-hook drain
will rewrite the loader from scratch on next session-end.
action_kindis the SECOND pairing predicate (added 2026-04-27, task #327).
Pick the value that describes what you actually did - same slug, different action_kind means the writeback satisfies a different brief layer:
shape-ok- only frontmatter-shape verification passed (rare from
a human; usually emitted by the lint, not a loader echo)
skill-ran- the skill ran end-to-end and an eval row landed
in state/log/evals.ndjson
loader-rewritten- you EDITED this AGENTS.md inline (the FIXED case),
OR the regen drain rewrote it
pattern-elevated- you promoted a recurring failure to a Critical Rule
(rule fix or new-skill scaffold) If you LOGGED (couldn't fix inline), omit action_kind - the inferrer will pick it up from your body keywords.
Do not skip this. Every agent run must leave the system better than it found it. The loader is the setpoint; you are the sensor; the gap is the error signal; closing the gap is the correction.
api.ts- the code it can call
#!/usr/bin/env npx tsx
/**
* state/lib/phase-trace.ts -- builder API for accumulating phase rows
* during a long-running snappy-os tick, emitted as a PhaseDisclosure
* payload that the snappy-chat generative UI renders inline.
*
* Pairs with the renderer at web/src/components/phase-disclosure.tsx
* (snappy-chat). A "phase" is one collapsible row: short label + one-line
* summary (visible collapsed) + multi-paragraph body (visible expanded)
* + status enum.
*
* import { startTrace } from "../lib/phase-trace.ts";
* const t = startTrace("Charlotte execute");
* const p1 = t.phase("Loaded tools", { status: "running", summary: "..." });
* p1.body("Now let me probe the actual connector data shapes...");
* p1.done();
* const p2 = t.phase("Used Krisp integration");
* p2.body("The meeting/action-item connector returned empty...");
* p2.done();
* const { phaseDisclosure } = t.emit();
*
* Pure in-memory accumulator. Never writes to disk. The dispatcher emits
* the resulting payload as TOOL_CALL_* events; the chat surface picks up
* the registry name "PhaseDisclosure" and renders the disclosure rows.
*
* Consumed by:
* - state/bin/head-screen/server.ts (intent matcher for "what is X
* doing" / "trace the agent run") via state/lib/agent-recap.ts.
*/
export type PhaseStatus = "pending" | "running" | "done" | "error";
export interface PhaseRow {
label: string;
summary: string;
body?: string;
status?: PhaseStatus;
}
export interface PhaseDisclosurePayload {
phases: PhaseRow[];
title?: string;
}
export interface PhaseHandle {
body(text: string): PhaseHandle;
summary(text: string): PhaseHandle;
status(s: PhaseStatus): PhaseHandle;
done(): PhaseHandle;
error(): PhaseHandle;
}
export interface TraceHandle {
phase(label: string, opts?: { status?: PhaseStatus; summary?: string }): PhaseHandle;
emit(): { phaseDisclosure: PhaseDisclosurePayload };
}
/**
* Open a new trace. `title` is optional; when set it shows above the
* disclosure rows (e.g. "Charlotte execute" in cd-23-artifacts.png).
*/
export function startTrace(title?: string): TraceHandle {
const phases: PhaseRow[] = [];
function makeHandle(row: PhaseRow): PhaseHandle {
const h: PhaseHandle = {
body(text: string) { row.body = text; return h; },
summary(text: string) { row.summary = text; return h; },
status(s: PhaseStatus) { row.status = s; return h; },
done() { row.status = "done"; return h; },
error() { row.status = "error"; return h; }
};
return h;
}
return {
phase(label, opts) {
const row: PhaseRow = {
label,
summary: opts?.summary ?? "",
status: opts?.status ?? "pending"
};
phases.push(row);
return makeHandle(row);
},
emit() {
// Filter empty phases (no label) just in case.
const cleaned = phases.filter(p => p.label && p.label.length > 0);
return {
phaseDisclosure: {
phases: cleaned,
...(title ? { title } : {})
}
};
}
};
}
// ── CLI smoke test ───────────────────────────────────────────────────
if (import.meta.url === `file://${process.argv[1]}`) {
const t = startTrace("Charlotte execute");
t.phase("Loaded tools", { status: "done" })
.summary("Probing connector data shapes in parallel")
.body("Now let me probe the actual connector data shapes in parallel — I'll look at action items, upcoming meetings, recent activities, and check for any existing status page.");
t.phase("Used Krisp integration, used a tool", { status: "done" })
.summary("Meeting connector returned empty (04:15 UTC — too early)")
.body("The meeting/action-item connector returned empty (it's 04:15 UTC — likely too early in the user's day for meetings to have populated). Let me check Charlotte and see what plugins/connectors are actually installed before building.");
t.phase("Used charlotte-mcp integration", { status: "done" })
.summary("Charlotte has 190 tools — probing needs-attention shapes")
.body("Charlotte has 190 tools — that's the core engine here. Let me probe the key 'needs-attention' data sources in parallel: overdue actions, pending actions, today's calendar, smart inbox, knowledge graph attention items, and outstanding invoices.");
t.phase("Charlotte execute", { status: "running" })
.summary("Thinking…");
const out = t.emit();
process.stdout.write(JSON.stringify(out, null, 2) + "\n");
}
scripts- helper scripts it can run
prose-only skill - 1 inline code block live in SKILL.md above (no state/bin/ sidecar yet).
how we check it- the checks, plus the last 3 runs
| timestamp | verb | score | primary_issue | artifact |
|---|---|---|---|---|
| 2026-04-29 04:43Z | - | 1.00 | - | - |
| 2026-04-29 04:43Z | - | 1.00 | - | - |
| 2026-04-29 04:43Z | - | 1.00 | - | - |