pilotswarm 0.5.23 → 0.5.25

package/ui/core/src/selectors.js

@@ -12,6 +12,7 @@ import {
     extractHttpLinks,
     formatHumanDurationSeconds,
     formatTimestamp,
+    formatTimestampCompact,
     padRunsToDisplayWidth,
     parseMarkdownLines,
     shortModelName,
@@ -324,7 +325,38 @@ function splitTypedSessionTitle(displayTitle) {
     return { userTitle, typeTitle };
 }
 
+// Titles are plain text everywhere they are rendered (terminal runs, DOM
+// text nodes) — never interpreted as HTML. A title that arrived already
+// HTML-escaped therefore shows its entities literally ("PostgreSQL &
+// MySQL"). Decoding the handful of entities an escaper emits repairs those
+// rows on read; the write path also normalizes now, so this covers history.
+const HTML_ENTITY_REPLACEMENTS = [
+    [/&lt;/g, "<"],
+    [/&gt;/g, ">"],
+    [/&quot;/g, '"'],
+    [/&#0?39;/g, "'"],
+    [/&apos;/g, "'"],
+    [/&nbsp;/g, " "],
+    // Ampersand LAST: decoding it first would let "&amp;lt;" collapse to "<".
+    [/&amp;/g, "&"],
+];
+
+export function decodeHtmlEntitiesForDisplay(value) {
+    let text = String(value ?? "");
+    if (!text.includes("&")) return text;
+    for (const [pattern, replacement] of HTML_ENTITY_REPLACEMENTS) {
+        text = text.replace(pattern, replacement);
+    }
+    return text;
+}
+
 function buildSessionDisplayTitle(session) {
+    // Decode at the single exit so the agent-prefixed and typed-title paths
+    // are covered too, not just the bare title.
+    return decodeHtmlEntitiesForDisplay(buildRawSessionDisplayTitle(session));
+}
+
+function buildRawSessionDisplayTitle(session) {
     const title = String(session?.title || "").trim();
     const splitTitle = splitAgentPrefixedSessionTitle(session);
     if (!splitTitle) return title;
@@ -2356,6 +2388,8 @@ export function selectChatLines(state, maxWidth = 80, options = {}) {
             lines.push(buildEpochDividerLine(message, maxWidth));
         } else if (message?.kind === "regen-refused") {
             lines.push(buildRegenRefusedLine(message, maxWidth));
+        } else if (message?.kind === "regen-failed") {
+            lines.push(buildRegenFailedLine(message, maxWidth));
         } else {
             const messageLines = buildChatMessageLines(message, maxWidth, buildOptions);
             appendChatBlockLines(lines, messageLines);
@@ -2380,7 +2414,7 @@ export function selectChatLines(state, maxWidth = 80, options = {}) {
 // knows every edge case.
 function isRichRenderableChatMessage(message) {
     if (!message) return false;
-    if (message.kind === "epoch-divider" || message.kind === "regen-refused") return false;
+    if (message.kind === "epoch-divider" || message.kind === "regen-refused" || message.kind === "regen-failed") return false;
     if (message.splash || message.thinking || message.noChrome) return false;
     if (message.role !== "user" && message.role !== "assistant") return false;
     if (message.role === "user" && parseAskedAndAnsweredExchange(message?.text || "")) return false;
@@ -2431,6 +2465,10 @@ export function selectChatBlocks(state, maxWidth = 80, options = {}) {
             blocks.push({ kind: "lines", variant: "divider", lines: [buildEpochDividerLine(message, maxWidth)] });
             continue;
         }
+        if (message?.kind === "regen-failed") {
+            blocks.push({ kind: "lines", variant: "divider", lines: [buildRegenFailedLine(message, maxWidth)] });
+            continue;
+        }
         if (message?.kind === "regen-refused") {
             blocks.push({ kind: "lines", variant: "divider", lines: [buildRegenRefusedLine(message, maxWidth)] });
             continue;
@@ -2508,6 +2546,18 @@ function buildRegenRefusedLine(message, maxWidth) {
     return buildRuleLine(label, "yellow", maxWidth);
 }
 
+// A regeneration that was accepted then failed downstream. RED (vs yellow for
+// a refusal): a refusal is the system declining on purpose, a failure is the
+// pipeline breaking. Names the stage and the underlying cause, because the
+// agent's own turn will have already claimed success from the optimistic ack.
+function buildRegenFailedLine(message, maxWidth) {
+    const stage = String(message?.stage || "unknown");
+    const raw = String(message?.error || "").split("\n")[0];
+    const cause = raw.length > 120 ? `${raw.slice(0, 117)}…` : raw;
+    const label = ` ✕ regeneration failed at ${stage}${cause ? ` · ${cause}` : ""} `;
+    return buildRuleLine(label, "red", maxWidth);
+}
+
 export function selectOutboxOverlayLines(state, maxWidth = 80, options = {}) {
     const messages = selectActiveOutboxMessages(state);
     if (!messages || messages.length === 0) return [];
@@ -2524,11 +2574,15 @@ export function selectOutboxOverlayLines(state, maxWidth = 80, options = {}) {
     if (rejectedCount > 0) parts.push(`${rejectedCount} rejected`);
     const label = parts.length > 0 ? parts.join(" · ") : "queued prompts";
     const labelText = ` queued prompts: ${label} `;
-    const rightRule = Math.max(1, safeWidth - labelText.length);
+    // The trailing rule is drawn by CSS, not by repeating "─" to a computed
+    // character count. That count is derived from a pane width measured in
+    // CHARACTERS, and when the estimate exceeds what actually fits — easily
+    // triggered by a font-size change, or by probing a pane whose font differs
+    // from this one — label + rule overflow and the rule wraps onto its own
+    // line. A flex rule fills whatever space is really left, at any font size.
     const lines = [
         [
-            { text: labelText, color: "gray" },
-            { text: "─".repeat(rightRule), color: "gray" },
+            { text: labelText, color: "gray", trailingRule: true },
         ],
     ];
 
@@ -2904,6 +2958,40 @@ export function selectFileSessionIdsForScope(state, scope = selectFilesScope(sta
     return ordered;
 }
 
+/**
+ * Artifacts in the order they appear in the CONVERSATION.
+ *
+ * The Files list is sorted for browsing (alphabetical); the transcript order is
+ * the order the work actually happened in. Stepping through a preview opened
+ * from a chat link should follow the conversation, not the filing cabinet — so
+ * these are two distinct sequences and neither can be derived from the other.
+ *
+ * Ids are `<sessionId>/<filename>`, matching files.selectedArtifactId.
+ */
+export function selectChatOrderedArtifactIds(state) {
+    const session = selectActiveSession(state);
+    const sessionId = session?.sessionId;
+    if (!sessionId) return [];
+    const history = state.history?.bySessionId?.get?.(sessionId);
+    const events = history?.events || [];
+    const seen = new Set();
+    const ordered = [];
+    const re = /artifact:\/\/([a-f0-9-]+)\/([^\s"'{})\]]+)/g;
+    for (const event of events) {
+        const text = typeof event?.data?.content === "string" ? event.data.content : "";
+        if (!text) continue;
+        re.lastIndex = 0;
+        let m;
+        while ((m = re.exec(text)) !== null) {
+            const id = `${m[1]}/${m[2]}`;
+            if (seen.has(id)) continue;
+            seen.add(id);
+            ordered.push(id);
+        }
+    }
+    return ordered;
+}
+
 export function selectFileBrowserItems(state) {
     const scope = selectFilesScope(state);
     const activeSessionId = selectActiveSession(state)?.sessionId || null;
@@ -3656,7 +3744,9 @@ function isSequenceOrchestratorType(type) {
 }
 
 function mapEventToSequenceEntry(event) {
-    const time = formatTimestamp(event?.createdAt);
+    // Compact: the sequence TIME column is fixed-width, and the full form
+    // truncates any dated row to "26 Jul …", losing the time entirely.
+    const time = formatTimestampCompact(event?.createdAt);
     const nodeLabel = shortNodeLabel(event?.workerNodeId);
     const detailText = eventMessageText(event);
     const preview = summarizeEventPreview(detailText, 20);
@@ -3849,7 +3939,7 @@ function buildSessionStatusSequenceEntry(session) {
     const safeCreatedAtMs = Number.isFinite(createdAtMs) ? createdAtMs : Date.now();
 
     return {
-        time: formatTimestamp(safeCreatedAtMs),
+        time: formatTimestampCompact(safeCreatedAtMs),
         createdAtMs: safeCreatedAtMs,
         nodeLabel: "orch",
         color: errorKind === "failed" ? "red" : "yellow",
@@ -3908,6 +3998,39 @@ function buildNodeMapNodeUnionForWindow(state, window) {
     return Array.from(labels).sort((left, right) => left.localeCompare(right));
 }
 
+/**
+ * Strip trailing pad from the last run of a sequence line.
+ *
+ * Every column is padded to colWidth for alignment, but the FINAL column's
+ * trailing spaces align nothing — there is no column after them. With
+ * `white-space: pre` those spaces occupy real width, so every line rendered at
+ * exactly the computed width and the pane had zero tolerance for rounding
+ * between "columns x char width" and its actual pixel width. The result was a
+ * horizontal scrollbar that never went away, on content that visibly fit.
+ */
+function trimTrailingRunPad(runs) {
+    const out = runs.slice();
+    while (out.length > 0) {
+        const last = out[out.length - 1];
+        const trimmed = String(last.text ?? "").replace(/\s+$/, "");
+        if (trimmed === "") { out.pop(); continue; }
+        out[out.length - 1] = { ...last, text: trimmed };
+        break;
+    }
+    return out;
+}
+
+/** Widest rendered line, so decoration never outruns real content. */
+function sequenceLineWidth(line) {
+    if (Array.isArray(line?.runs)) {
+        return line.runs.reduce((n, r) => n + displayLength(String(r.text ?? "")), 0);
+    }
+    if (Array.isArray(line)) {
+        return line.reduce((n, r) => n + displayLength(String(r.text ?? "")), 0);
+    }
+    return displayLength(String(line?.text ?? ""));
+}
+
 function buildSequenceHeaderLine(nodeLabels, timeWidth, colWidth) {
     const runs = [
         { text: padDisplayText("TIME", timeWidth), color: "white", bold: true },
@@ -3917,12 +4040,15 @@ function buildSequenceHeaderLine(nodeLabels, timeWidth, colWidth) {
         if (index > 0) runs.push({ text: " ", color: null });
         runs.push({ text: padDisplayText(nodeLabel, colWidth), color: "white", bold: true });
     });
-    return runs;
+    return trimTrailingRunPad(runs);
 }
 
-function buildSequenceDividerLine(nodeLabels, timeWidth, colWidth) {
+function buildSequenceDividerLine(nodeLabels, timeWidth, colWidth, contentWidth = Infinity) {
+    const full = `${"-".repeat(timeWidth)} ${nodeLabels.map(() => "─".repeat(colWidth)).join(" ")}`;
+    // Clip to the widest real line: a full-width rule under short content is
+    // itself enough to force the scrollbar this trimming exists to remove.
     return plainInspectorLine(
-        `${"-".repeat(timeWidth)} ${nodeLabels.map(() => "─".repeat(colWidth)).join(" ")}`,
+        Number.isFinite(contentWidth) ? full.slice(0, Math.max(timeWidth, contentWidth)) : full,
         "gray",
     );
 }
@@ -4011,7 +4137,7 @@ function buildSequenceEventLine(entry, nodeLabels, timeWidth, colWidth) {
         }
     });
 
-    return runs;
+    return trimTrailingRunPad(runs);
 }
 
 function buildNodeMapHeaderLine(nodeLabels, colWidth) {
@@ -4117,7 +4243,13 @@ function buildSequenceViewForSession(state, session, maxWidth, options = {}) {
         .map((entry) => entry.nodeLabel)
         .filter((nodeLabel) => nodeLabel && nodeLabel !== "orch"))).sort((left, right) => left.localeCompare(right));
     const uniqueNodes = unionNodes.length > 0 ? unionNodes : activeSessionNodes;
-    const timeWidth = 8;
+    // Size the TIME column to what is actually in it. A fixed 8 fits "20:10:19"
+    // but silently truncates any dated row, which is precisely the row where
+    // the date matters. Capped so one odd stamp cannot starve the lanes.
+    const timeWidth = Math.min(13, Math.max(
+        8,
+        ...visibleEntries.map((entry) => displayLength(String(entry.time || ""))),
+    ));
     const availableWidth = Math.max(18, maxWidth);
     const maxNodes = Math.max(1, Math.floor((availableWidth - timeWidth - 1) / 6));
     let nodeLabels = ["orch", ...uniqueNodes];
@@ -4158,12 +4290,21 @@ function buildSequenceViewForSession(state, session, maxWidth, options = {}) {
         }
     }
 
+    // Decoration is sized to real content, never to the pane's nominal width:
+    // a full-width rule under short content forces the very scrollbar the
+    // trimming above exists to remove.
+    const headerLine = buildSequenceHeaderLine(nodeLabels, timeWidth, colWidth);
+    const contentWidth = lines.reduce(
+        (widest, line) => Math.max(widest, sequenceLineWidth(line)),
+        sequenceLineWidth(headerLine),
+    );
+
     return {
         stickyLines: [
             ...statsLines,
             plainInspectorLine(`Window: ${recentWindow.label}`, "gray"),
-            buildSequenceHeaderLine(nodeLabels, timeWidth, colWidth),
-            buildSequenceDividerLine(nodeLabels, timeWidth, colWidth),
+            headerLine,
+            buildSequenceDividerLine(nodeLabels, timeWidth, colWidth, contentWidth),
         ],
         lines,
     };

package/ui/core/src/state.js

@@ -201,6 +201,17 @@ export function createInitialState({ mode = "local", branding = null, themeId =
             bySessionId: {},
             fullscreen: false,
             selectedArtifactId: null,
+            // Bulk selection. Deliberately separate from selectedArtifactId:
+            // marking rows must not move the preview, which keeps showing the
+            // originally selected artifact.
+            markedIds: [],
+            // How the preview was opened. "chat" must back out to the chat
+            // pane and leave the artifact list exactly as it was; "list" backs
+            // out to the list. One back button cannot serve both without this.
+            previewOrigin: null,
+            // Selection to restore when leaving a chat-opened preview, so
+            // following a chat link never disturbs the list.
+            restoreArtifactId: null,
             filter: {
                 scope: "selectedSession",
                 query: "",

package/ui/core/src/themes/github-light.js

@@ -5,7 +5,11 @@ const githubLightTheme = createTheme({
     label: "GitHub Light",
     description: "GitHub light palette with crisp neutrals, blue actions, and high-contrast status colors.",
     page: {
-        background: "#ffffff",
+        // Canvas, deliberately NOT the same as tui.surface (#ffffff). When the
+        // page and the panes are both pure white there is nothing for a pane to
+        // sit on, and every surface-vs-transparent color-mix in the stylesheet
+        // collapses to white. GitHub's own light UI uses exactly this pairing.
+        background: "#f6f8fa",
         foreground: "#1f2328",
         overlayBackground: "#ffffff",
         overlayForeground: "#1f2328",

package/ui/core/src/themes/index.js

@@ -16,6 +16,8 @@ import darkHighContrastTheme from "./dark-high-contrast.js";
 import terminalGreenTheme from "./terminal-green.js";
 import solarizedOpsTheme from "./solarized-ops.js";
 import highContrastMonoTheme from "./high-contrast-mono.js";
+import win95Theme from "./win95.js";
+import msDosTheme from "./ms-dos.js";
 
 const THEMES = Object.freeze([
     draculaTheme,
@@ -36,6 +38,8 @@ const THEMES = Object.freeze([
     terminalGreenTheme,
     solarizedOpsTheme,
     highContrastMonoTheme,
+    win95Theme,
+    msDosTheme,
 ].sort((left, right) => left.label.localeCompare(right.label, undefined, { sensitivity: "base" })));
 
 const THEME_MAP = new Map(THEMES.map((theme) => [theme.id, theme]));

package/ui/core/src/themes/light-high-contrast.js

@@ -8,7 +8,10 @@ const lightHighContrastTheme = createTheme({
     label: "Light High Contrast",
     description: "Pure black on white with maximum-contrast accents — nothing washes out, ever.",
     page: {
-        background: "#ffffff",
+        // Canvas only — panes stay pure #ffffff (tui.surface), so "black on
+        // white" still holds for every piece of text. Without this the panes,
+        // headers and composer were all the same white as the page.
+        background: "#eef0f2",
         foreground: "#000000",
         overlayBackground: "#ffffff",
         overlayForeground: "#000000",

package/ui/core/src/themes/ms-dos.js

@@ -0,0 +1,84 @@
+import { createTheme } from "./helpers.js";
+
+// MS-DOS 2.0 (1983) — MDA/CGA, text only, no windows.
+//
+// The detail that makes or breaks this: DOS's default attribute was 0x07,
+// which is LIGHT GREY on black, not white. White (#ffffff) was attribute 15,
+// used sparingly for emphasis. A pure white-on-black theme reads as "modern
+// terminal"; #aaaaaa reads as DOS instantly.
+//
+// The palette is the CGA 16, including the quirk everyone remembers — dark
+// yellow rendered as BROWN (#aa5500), never as olive.
+//
+// DOS 2.0 itself drew no boxes; the shell was an 80x25 scrolling field. The
+// code-page-437 framing that index.css adds is how DOS APPLICATIONS looked,
+// and CP437 shipped with the original PC, so it is era-correct even though the
+// 2.0 command line never used it. A multi-pane portal needs some framing, and
+// this is the honest period answer.
+const msDosTheme = createTheme({
+    id: "ms-dos",
+    label: "MS-DOS 2.0",
+    description: "CGA light-grey on black, the 16-colour CGA palette with brown, and CP437 box framing.",
+    page: {
+        background: "#000000",
+        foreground: "#aaaaaa",
+        overlayBackground: "#000000",
+        overlayForeground: "#aaaaaa",
+        // DEVIATION, deliberate: authentic CGA dark grey is #555555, which is
+        // roughly 3:1 on black and fails the muted-contrast bar the theme suite
+        // enforces. This is the lightest grey that still reads as secondary
+        // against #aaaaaa body text while staying legible.
+        hintColor: "#8f8f8f",
+        modalBackdrop: "rgba(0, 0, 0, 0.78)",
+        modalBackground: "#000000",
+        modalBorder: "#aaaaaa",
+        modalForeground: "#aaaaaa",
+        modalMuted: "#8f8f8f",
+        // Reverse video — exactly how CGA highlighted a selection.
+        modalSelectedBackground: "#aaaaaa",
+        modalSelectedBorder: "#ffffff",
+        modalSelectedForeground: "#000000",
+    },
+    terminal: {
+        background: "#000000",
+        foreground: "#aaaaaa",
+        cursor: "#aaaaaa",
+        cursorAccent: "#000000",
+        selectionBackground: "#aaaaaa",
+        // The CGA 16, unmodified.
+        black: "#000000",
+        red: "#aa0000",
+        green: "#00aa00",
+        yellow: "#aa5500",      // brown — the CGA quirk, not olive
+        blue: "#0000aa",
+        magenta: "#aa00aa",
+        cyan: "#00aaaa",
+        white: "#aaaaaa",       // attribute 7, the DOS default
+        brightBlack: "#8f8f8f",
+        brightRed: "#ff5555",
+        brightGreen: "#55ff55",
+        brightYellow: "#ffff55",
+        brightBlue: "#5555ff",
+        brightMagenta: "#ff55ff",
+        brightCyan: "#55ffff",
+        brightWhite: "#ffffff", // attribute 15, emphasis only
+    },
+    tui: {
+        surface: "#000000",
+        // Frames are drawn in body grey so they read as CP437 line characters
+        // rather than as chrome borrowed from a modern UI.
+        border: "#aaaaaa",
+        // Bright white is reserved for emphasis, so the operator's own turns
+        // get it — the one place attribute 15 is worth spending.
+        userChat: "#ffffff",
+        userChatLabel: "#ffffff",
+        activeHighlightBackground: "#aaaaaa",
+        activeHighlightForeground: "#000000",
+        selectionBackground: "#aaaaaa",
+        selectionForeground: "#000000",
+        promptCursorBackground: "#aaaaaa",
+        promptCursorForeground: "#000000",
+    },
+});
+
+export default msDosTheme;

package/ui/core/src/themes/win95.js

@@ -0,0 +1,81 @@
+import { createTheme } from "./helpers.js";
+
+// Windows 95, as it actually was — not a pastel homage.
+//
+// The palette is the real one: #C0C0C0 button face, #000080 active title bar,
+// #008080 desktop teal, and the 16-colour VGA set for terminal output. Those
+// exact values are what make it read as Win95 rather than "grey theme"; the
+// bevels that complete the look are in index.css, keyed on the theme id, since
+// this file can only carry colours.
+//
+// One deliberate departure: the chat pane keeps readable accent colours rather
+// than pure VGA on grey, because a transcript is prose, not a DOS screen.
+const win95Theme = createTheme({
+    id: "win95",
+    label: "Windows 95",
+    description: "Authentic 3D-bevelled grey, navy title bars, teal desktop, and the 16-colour VGA terminal set.",
+    page: {
+        // Desktop teal behind the panes — the single most recognizable colour
+        // of the era, and it makes the grey panes read as raised windows.
+        background: "#008080",
+        foreground: "#000000",
+        overlayBackground: "#c0c0c0",
+        overlayForeground: "#000000",
+        // The classic disabled/secondary grey; darker than the face so it
+        // stays legible on #c0c0c0 rather than vanishing into it.
+        hintColor: "#5a5a5a",
+        modalBackdrop: "rgba(0, 0, 0, 0.45)",
+        modalBackground: "#c0c0c0",
+        modalBorder: "#808080",
+        modalForeground: "#000000",
+        modalMuted: "#5a5a5a",
+        // Selection is the title-bar navy, exactly as Explorer did it.
+        modalSelectedBackground: "#000080",
+        modalSelectedBorder: "#000080",
+        modalSelectedForeground: "#ffffff",
+    },
+    terminal: {
+        // Button face, not white: this is a Win95 window, and pure white would
+        // break the bevel illusion the whole theme depends on.
+        background: "#c0c0c0",
+        foreground: "#000000",
+        cursor: "#000080",
+        cursorAccent: "#c0c0c0",
+        selectionBackground: "#000080",
+        // The 16-colour VGA palette, unmodified.
+        black: "#000000",
+        red: "#800000",
+        green: "#008000",
+        yellow: "#808000",
+        blue: "#000080",
+        magenta: "#800080",
+        cyan: "#008080",
+        white: "#c0c0c0",
+        brightBlack: "#5a5a5a",
+        brightRed: "#c00000",
+        brightGreen: "#006000",
+        brightYellow: "#7a5c00",
+        brightBlue: "#0000c0",
+        brightMagenta: "#a000a0",
+        brightCyan: "#006a6a",
+        brightWhite: "#000000",
+    },
+    tui: {
+        surface: "#c0c0c0",
+        // Mid-grey is the Win95 shadow edge; it separates panes from the teal
+        // desktop without the black hairline a modern theme would use.
+        border: "#808080",
+        // Navy on grey for the operator's own turns — the highest-contrast
+        // pairing available in this palette.
+        userChat: "#000080",
+        userChatLabel: "#000080",
+        activeHighlightBackground: "#000080",
+        activeHighlightForeground: "#ffffff",
+        selectionBackground: "#000080",
+        selectionForeground: "#ffffff",
+        promptCursorBackground: "#000080",
+        promptCursorForeground: "#ffffff",
+    },
+});
+
+export default win95Theme;