@flowdular/sandbox 0.2.5 → 0.2.7

package/src/client/ComposerSettings.tsrx

@@ -0,0 +1,99 @@
+import { useEffect, useRef, useState } from 'octane';
+import { Icon } from '@flowdular/sdk/ui';
+import { useTranslation } from './i18n.ts';
+
+export function ComposerSettings(props: {
+	readonly autoContinue: boolean;
+	readonly freshContext: boolean;
+	readonly running: boolean;
+	readonly onAutoContinue: (enabled: boolean) => void;
+	readonly onFreshContext: (enabled: boolean) => void;
+}) @{
+	const { t } = useTranslation();
+	const root = useRef<HTMLDivElement | null>(null);
+	const trigger = useRef<HTMLButtonElement | null>(null);
+	const [position, setPosition] = useState<
+		{ left: number; bottom: number } | null
+	>(null);
+	const toggle = () => {
+		if (position) return setPosition(null);
+		const rect = trigger.current?.getBoundingClientRect();
+		if (!rect) return;
+		setPosition({
+			left: Math.max(16, Math.min(rect.left, window.innerWidth - 336)),
+			bottom: window.innerHeight - rect.top + 8,
+		});
+	};
+	useEffect(() => {
+		if (!position) return;
+		const dismiss = (event: PointerEvent | FocusEvent) => {
+			if (!root.current?.contains(event.target as Node)) setPosition(null);
+		};
+		const escape = (event: KeyboardEvent) => {
+			if (event.key !== 'Escape') return;
+			event.preventDefault();
+			setPosition(null);
+			trigger.current?.focus();
+		};
+		const resize = () => setPosition(null);
+		document.addEventListener('pointerdown', dismiss);
+		document.addEventListener('focusin', dismiss);
+		document.addEventListener('keydown', escape);
+		window.addEventListener('resize', resize);
+		return () => {
+			document.removeEventListener('pointerdown', dismiss);
+			document.removeEventListener('focusin', dismiss);
+			document.removeEventListener('keydown', escape);
+			window.removeEventListener('resize', resize);
+		};
+	}, [position]);
+
+	<div ref={root} class="chat-settings">
+		<button
+			ref={trigger}
+			class="ui-btn ui-btn--ghost ui-btn--sm ui-btn--icon"
+			type="button"
+			aria-expanded={position !== null}
+			aria-controls="composer-settings"
+			aria-label={t('sandbox.chat.settings')}
+			title={t('sandbox.chat.settings')}
+			onClick={toggle}
+		>
+			<Icon name="settings" size={14} />
+		</button>
+		@if (position) {
+			<div
+				id="composer-settings"
+				class="ui-menu chat-settings__panel"
+				role="group"
+				aria-label={t('sandbox.chat.settings')}
+				style={{ left: position.left + 'px', bottom: position.bottom + 'px' }}
+			>
+				<label class="ui-menu__item ui-checkbox">
+					<input
+						type="checkbox"
+						checked={props.autoContinue}
+						onChange={(event) => props.onAutoContinue(
+							event.currentTarget.checked,
+						)}
+					/>
+					<span>{t('sandbox.chat.autoHandoff')}</span>
+				</label>
+				<label
+					class="ui-menu__item ui-checkbox"
+					title={t('sandbox.chat.freshHelp')}
+				>
+					<input
+						type="checkbox"
+						checked={props.freshContext}
+						disabled={props.running}
+						onChange={(event) => props.onFreshContext(
+							event.currentTarget.checked,
+						)}
+					/>
+					<span>{t('sandbox.chat.fresh')}</span>
+				</label>
+			</div>
+		}
+	</div>
+}

package/src/client/ToolEvent.tsrx

@@ -0,0 +1,77 @@
+import { Icon } from '@flowdular/sdk/ui';
+import { useTranslation } from './i18n.ts';
+import {
+	shortToolDetail,
+	toolAction,
+	type TranscriptRow,
+} from './transcript.ts';
+
+export function ToolEvent(props: {
+	readonly row: TranscriptRow;
+	readonly running: boolean;
+}) @{
+	const { t } = useTranslation();
+	const event = props.row.entry.event!;
+	const original = props.row.started?.event ?? event;
+	if (
+		event.type !== 'tool.started' && event.type !== 'tool.completed' ||
+			original.type !== 'tool.started' && original.type !== 'tool.completed'
+	) return;
+	const status =
+		event.type === 'tool.completed'
+			? event.ok
+				? 'done'
+				: 'failed'
+			: props.row.pending && props.running
+				? 'running'
+				: 'unknown';
+	const detail = original.detail || event.detail;
+	const action = toolAction(original.tool);
+	const target =
+		action === 'command' ? detail : shortToolDetail(detail);
+	const duration =
+		props.row.started
+			? (Math.max(0, props.row.entry.at - props.row.started.at) / 1000).toFixed(
+					1,
+				)
+			: null;
+	<details class={['chat-tool', 'chat-tool--' + status]} data-status={status}>
+		<summary class="chat-tool__summary">
+			<Icon
+				name={status === 'running'
+					? 'refresh'
+					: status === 'done'
+						? 'check'
+						: 'alert'}
+				size={14}
+			/>
+			<span class="chat-tool__action">{t(
+				'sandbox.chat.tool.action.' + action,
+			)}</span>
+			<span class="chat-tool__target" title={detail}>
+				{target || original.tool}
+			</span>
+			<span class="chat-tool__status">{t(
+				'sandbox.chat.tool.status.' + status,
+			)}</span>
+			@if (duration !== null) {
+				<span class="chat-tool__duration">{t('sandbox.chat.tool.duration', {
+					seconds: duration,
+				})}</span>
+			}
+			<Icon name="chevron-down" size={14} />
+		</summary>
+		<dl class="chat-tool__details">
+			<dt>{t('sandbox.chat.tool.name')}</dt>
+			<dd>{original.tool}</dd>
+			<dt>{t('sandbox.chat.tool.detail')}</dt>
+			<dd>{detail || t('sandbox.chat.tool.noDetail')}</dd>
+			@if (event.detail && event.detail !== detail) {
+				<>
+					<dt>{t('sandbox.chat.tool.result')}</dt>
+					<dd>{event.detail}</dd>
+				</>
+			}
+		</dl>
+	</details>
+}

package/src/client/TurnActivity.tsrx

@@ -0,0 +1,26 @@
+import { useEffect, useState } from 'octane';
+import { useTranslation } from './i18n.ts';
+
+/* Mounted only while a turn runs. Age measures received updates, not provider
+   health: a quiet process can still be generating or waiting on the network. */
+export function TurnActivity(props: {
+	readonly lastUpdateAt: number | undefined;
+}) @{
+	const { t } = useTranslation();
+	const [startedAt] = useState(Date.now());
+	const [now, setNow] = useState(Date.now());
+	useEffect(() => {
+		const timer = setInterval(() => setNow(Date.now()), 1000);
+		return () => clearInterval(timer);
+	}, []);
+	const seconds = Math.max(
+		0,
+		Math.floor((now - (props.lastUpdateAt ?? startedAt)) / 1000),
+	);
+	<span class="chat__activity-age">{t(
+		seconds >= 30
+			? 'sandbox.chat.activity.quiet'
+			: 'sandbox.chat.activity.updated',
+		{ seconds },
+	)}</span>
+}

package/src/client/locales/en.json

@@ -257,6 +257,7 @@
 	"chat.role": "Role",
 	"chat.targetModule": "Target module",
 	"chat.auto": "Auto",
+	"chat.settings": "Settings",
 	"chat.autoHandoff": "Continue handoffs automatically",
 	"chat.stop": "Stop",
 	"chat.send": "Send",
@@ -480,8 +481,27 @@
 	"models.save": "Save",
 	"models.saved": "Model settings saved.",
 	"models.error": "Could not save model settings.",
+	"chat.activity.updated": "Last update {seconds}s ago",
+	"chat.activity.quiet": "No update for {seconds}s. The agent may still be working.",
 	"chat.activity.thinking": "Agent is thinking…",
 	"chat.activity.responding": "Agent is preparing a response…",
 	"chat.fresh": "Fresh agent context",
-	"chat.freshHelp": "The next message starts a fresh context with the brief and recent messages. Draft files, specification and sandbox history are preserved."
+	"chat.freshHelp": "The next message starts a fresh context with the brief and recent messages. Draft files, specification and sandbox history are preserved.",
+	"chat.tool.name": "Tool",
+	"chat.tool.detail": "Target or command",
+	"chat.tool.result": "Completion detail",
+	"chat.tool.noDetail": "No detail provided",
+	"chat.tool.duration": "{seconds}s",
+	"chat.tool.action.read": "Read file",
+	"chat.tool.action.edit": "Edit file",
+	"chat.tool.action.write": "Write file",
+	"chat.tool.action.delete": "Delete file",
+	"chat.tool.action.list": "Find files",
+	"chat.tool.action.search": "Search",
+	"chat.tool.action.command": "Run command",
+	"chat.tool.action.tool": "Tool call",
+	"chat.tool.status.done": "Done",
+	"chat.tool.status.failed": "Failed",
+	"chat.tool.status.running": "Running",
+	"chat.tool.status.unknown": "No result"
 }

package/src/client/locales/pl.json

@@ -257,6 +257,7 @@
 	"chat.role": "Rola",
 	"chat.targetModule": "Moduł docelowy",
 	"chat.auto": "Automatycznie",
+	"chat.settings": "Ustawienia",
 	"chat.autoHandoff": "Automatycznie kontynuuj przekazania",
 	"chat.stop": "Zatrzymaj",
 	"chat.send": "Wyślij",
@@ -480,8 +481,27 @@
 	"models.save": "Zapisz",
 	"models.saved": "Zapisano ustawienia modeli.",
 	"models.error": "Nie udało się zapisać ustawień modeli.",
+	"chat.activity.updated": "Ostatnia aktualizacja {seconds}s temu",
+	"chat.activity.quiet": "Brak aktualizacji od {seconds}s. Agent może nadal pracować.",
 	"chat.activity.thinking": "Agent analizuje zadanie…",
 	"chat.activity.responding": "Agent przygotowuje odpowiedź…",
 	"chat.fresh": "Świeży kontekst agenta",
-	"chat.freshHelp": "Następna wiadomość rozpocznie nowy kontekst z briefem i ostatnimi wiadomościami. Pliki, specyfikacja i historia sandboxa pozostaną zachowane."
+	"chat.freshHelp": "Następna wiadomość rozpocznie nowy kontekst z briefem i ostatnimi wiadomościami. Pliki, specyfikacja i historia sandboxa pozostaną zachowane.",
+	"chat.tool.name": "Narzędzie",
+	"chat.tool.detail": "Plik lub polecenie",
+	"chat.tool.result": "Szczegóły zakończenia",
+	"chat.tool.noDetail": "Brak szczegółów",
+	"chat.tool.duration": "{seconds}s",
+	"chat.tool.action.read": "Odczyt pliku",
+	"chat.tool.action.edit": "Edycja pliku",
+	"chat.tool.action.write": "Zapis pliku",
+	"chat.tool.action.delete": "Usunięcie pliku",
+	"chat.tool.action.list": "Wyszukiwanie plików",
+	"chat.tool.action.search": "Wyszukiwanie",
+	"chat.tool.action.command": "Polecenie",
+	"chat.tool.action.tool": "Narzędzie",
+	"chat.tool.status.done": "Gotowe",
+	"chat.tool.status.failed": "Błąd",
+	"chat.tool.status.running": "W toku",
+	"chat.tool.status.unknown": "Brak wyniku"
 }

package/src/client/transcript.ts

@@ -0,0 +1,110 @@
+import type { ChatEntry } from '../server/sessions.ts';
+
+export interface TranscriptRow {
+	readonly key: number;
+	entry: ChatEntry;
+	started?: ChatEntry;
+	pending: boolean;
+}
+
+/* Pair calls by provider identity, including parallel calls to the same file.
+   Old transcripts without ids are paired only with one unambiguous pending call.
+   This is presentation only: persisted events and their full details stay intact. */
+export function transcriptRows(entries: readonly ChatEntry[]): TranscriptRow[] {
+	const rows: TranscriptRow[] = [];
+	const calls = new Map<string, TranscriptRow>();
+	const pending = new Set<TranscriptRow>();
+	const closeTurn = () => {
+		for (const row of pending) row.pending = false;
+		pending.clear();
+		calls.clear();
+	};
+	for (const entry of entries) {
+		const event = entry.event;
+		if (
+			entry.kind === 'user' ||
+			entry.handoff ||
+			event?.type === 'turn.started' ||
+			event?.type === 'turn.completed'
+		)
+			closeTurn();
+		if (event?.type === 'reasoning' && !event.text.trim()) continue;
+		if (event?.type === 'tool.completed') {
+			let start = event.callId ? calls.get(event.callId) : undefined;
+			if (!event.callId && pending.size === 1) {
+				const candidate = pending.values().next().value!;
+				const original = candidate.entry.event;
+				if (
+					original?.type === 'tool.started' &&
+					!original.callId &&
+					(event.tool === original.tool || event.tool === 'tool') &&
+					(!event.detail || event.detail === original.detail)
+				)
+					start = candidate;
+			}
+			if (
+				start &&
+				start.entry.role === entry.role &&
+				start.entry.module === entry.module
+			) {
+				start.started = start.entry;
+				start.entry = entry;
+				start.pending = false;
+				pending.delete(start);
+				if (event.callId) calls.delete(event.callId);
+				continue;
+			}
+		}
+		const row: TranscriptRow = {
+			key: entry.sequence,
+			entry,
+			pending: event?.type === 'tool.started',
+		};
+		rows.push(row);
+		if (event?.type === 'tool.started') {
+			pending.add(row);
+			if (event.callId) calls.set(event.callId, row);
+		}
+	}
+	return rows;
+}
+
+export function shortToolDetail(detail: string): string {
+	if (!/^(?:\/|[A-Za-z]:[\\/]|modules[\\/])/.test(detail)) return detail;
+	return detail
+		.replaceAll('\\', '/')
+		.replace(
+			/^.*?\/(?:\.flowdular|\.coreloom)\/sandbox\/sessions\/[^/]+\/workspace\//,
+			'',
+		)
+		.replace(/^modules\//, '');
+}
+
+export function toolAction(name: string): string {
+	switch (name.toLowerCase()) {
+		case 'read':
+		case 'read_file':
+			return 'read';
+		case 'edit':
+		case 'multiedit':
+		case 'update':
+			return 'edit';
+		case 'write':
+		case 'write_file':
+		case 'create':
+			return 'write';
+		case 'delete_file':
+		case 'delete':
+			return 'delete';
+		case 'glob':
+		case 'list_files':
+			return 'list';
+		case 'grep':
+			return 'search';
+		case 'bash':
+		case 'command':
+			return 'command';
+		default:
+			return 'tool';
+	}
+}

package/src/server/auto-review.ts

@@ -9,6 +9,7 @@ import {
 	writeFile,
 } from 'node:fs/promises';
 import { basename, join } from 'node:path';
+import { referenceSource } from './reference.ts';
 import {
 	basePathOf,
 	modulePathOf,
@@ -107,7 +108,7 @@ export async function prepareAutoReview(
 	const skill = join(paths.workspace, 'reference', 'skills', 'auto-review');
 	await mkdir(skill, { recursive: true });
 	await cp(
-		join(workspaceRoot, '.ai', 'skills', 'auto-review', 'SKILL.md'),
+		await referenceSource(workspaceRoot, '.ai/skills/auto-review/SKILL.md'),
 		join(skill, 'SKILL.md'),
 	);
 }

package/src/server/gate-repair.ts

@@ -0,0 +1,88 @@
+import { matchesGlob } from 'node:path';
+import type { AgentRoleDefinition } from '#coding-agent';
+import type { GateResult } from './gates.ts';
+
+interface DiagnosticPath {
+	path: string;
+	module: string;
+}
+
+/* Read diagnostic locations, never instructions embedded in output. Manifest
+   reports name the module; their issues name the file that actually failed. */
+function locations(gate: GateResult, activeModule: string): DiagnosticPath[] {
+	const module = gate.module ?? activeModule;
+	const output = gate.output.slice(0, 16_000);
+	try {
+		const result = JSON.parse(
+			output.slice(output.indexOf('{'), output.lastIndexOf('}') + 1),
+		);
+		const reports = result?.error?.details?.reports;
+		if (Array.isArray(reports)) {
+			return reports.flatMap((report) => {
+				const target =
+					typeof report.file === 'string'
+						? (/(?:^|\/)modules\/([a-z0-9-]+)\/module\.json$/.exec(
+								report.file,
+							)?.[1] ?? module)
+						: module;
+				return Array.isArray(report.issues)
+					? report.issues
+							.filter(
+								(issue: { severity?: string; path?: unknown }) =>
+									issue.severity === 'error' && typeof issue.path === 'string',
+							)
+							.map((issue: { path: string }) => ({
+								path: issue.path,
+								module: target,
+							}))
+					: [];
+			});
+		}
+	} catch {
+		/* Compiler and formatter output is plain text. */
+	}
+	return output.split('\n').flatMap((line) => {
+		const match =
+			/^\s*(?:FAIL\s+)?((?:modules\/[a-z0-9-]+\/)?(?:src|tests|translations|migrations)\/[^\s:(]+)(?:\(\d+,\d+\)|:\d+|\s|$)/.exec(
+				line,
+			);
+		if (!match) return [];
+		const qualified = /^modules\/([a-z0-9-]+)\/(.+)$/.exec(match[1]!);
+		return [
+			{ path: qualified?.[2] ?? match[1]!, module: qualified?.[1] ?? module },
+		];
+	});
+}
+
+export function gateRepairOwner(
+	gate: GateResult,
+	activeModule: string,
+	roles: readonly AgentRoleDefinition[],
+	modules: readonly string[],
+): { role: string; module: string } | null {
+	for (const location of locations(gate, activeModule)) {
+		if (
+			!modules.includes(location.module) ||
+			location.path.split('/').includes('..')
+		)
+			continue;
+		const preferred =
+			location.path.startsWith('src/client/') ||
+			location.path.startsWith('translations/')
+				? 'frontend-engineer'
+				: location.path.startsWith('spec/')
+					? 'business-manager'
+					: location.path.startsWith('src/agent/') ||
+						  location.path.startsWith('src/tools/')
+						? 'agentic-engineer'
+						: 'backend-engineer';
+		const candidates = roles.filter((role) =>
+			role.allowedPaths.some((pattern) => matchesGlob(location.path, pattern)),
+		);
+		const owner =
+			candidates.find((role) => role.id === preferred) ??
+			(candidates.length === 1 ? candidates[0] : undefined);
+		if (owner) return { role: owner.id, module: location.module };
+	}
+	return null;
+}

package/src/server/planning.ts

@@ -8,6 +8,7 @@ import type {
 	HandoffDeclaration,
 } from '#coding-agent';
 import type { GateResult } from './gates.ts';
+import { gateRepairOwner } from './gate-repair.ts';
 import { SandboxSetupError } from './workspace-root.ts';
 import {
 	moduleSuffixOf,
@@ -573,20 +574,29 @@ export function planHandoff(context: HandoffContext): HandoffPlan {
 	   there even when the finished turn worked somewhere else. */
 	const failedGate = context.gates.find((gate) => gate.status !== 'passed');
 	if (failedGate) {
-		const repairRole = context.reviewing
-			? (validateDeclared(context).role ?? context.role)
-			: context.role;
+		const owner = gateRepairOwner(
+			failedGate,
+			context.module,
+			roles,
+			context.routing.session.modules.map((module) => module.directory),
+		);
+		const repairRole =
+			owner?.role ??
+			(context.reviewing
+				? (validateDeclared(context).role ?? context.role)
+				: context.role);
 		return plan(
 			'continue',
 			repairRole,
 			`The ${gateLabel(failedGate)} gate failed, so the responsible specialist fixes it before delivery.`,
 			[
-				`The ${gateLabel(failedGate)} gate failed after your change. Fix exactly what it reports, change nothing else, and end with your handoff line.`,
+				`Continue as ${roleName(roles, repairRole)}. The ${gateLabel(failedGate)} gate failed. Fix the reported files within your role, preserve other work, and end with your handoff line.`,
+				`Recorded gate results:\n${context.gates.map((gate) => `${gateLabel(gate)}: ${gate.status}`).join('\n')}`,
 				`Gate command: ${failedGate.command}`,
 				`Gate output (first ${GATE_PROMPT_OUTPUT} characters; the transcript holds the rest):`,
 				failedGate.output.slice(0, GATE_PROMPT_OUTPUT),
 			].join('\n\n'),
-			failedGate.module ?? context.module,
+			owner?.module ?? failedGate.module ?? context.module,
 		);
 	}
 

package/src/server/preview-hot-updates.ts

@@ -0,0 +1,40 @@
+import { relative } from 'node:path';
+import type { Plugin } from 'vite';
+
+/* Octane broadcasts full-reload for every TSRX change, including modules used
+   only by preview iframes. Draft saves must invalidate cached transforms without
+   navigating the operator's page. The preview refreshes at turn completion or
+   on request, when its isolated worker also selects the current revision. */
+export function isolatePreviewHotUpdates(
+	plugins: Plugin[],
+	workspaceRoot: string,
+): Plugin[] {
+	return plugins.map((plugin) => {
+		const hook = plugin.hotUpdate;
+		if (!hook) return plugin;
+		const original = typeof hook === 'function' ? hook : hook.handler;
+		return {
+			...plugin,
+			hotUpdate: {
+				...(typeof hook === 'function' ? {} : hook),
+				async handler(options) {
+					const path = relative(workspaceRoot, options.file).replaceAll(
+						'\\',
+						'/',
+					);
+					if (/^(?:\.flowdular|\.coreloom)\/sandbox\/sessions\//.test(path)) {
+						for (const environment of Object.values(
+							options.server.environments,
+						)) {
+							const graph = environment.moduleGraph;
+							for (const module of graph.getModulesByFile(options.file) ?? [])
+								graph.invalidateModule(module);
+						}
+						return [];
+					}
+					return original.call(this, options);
+				},
+			},
+		};
+	});
+}

package/src/server/reference.ts

@@ -9,7 +9,7 @@ import {
 } from 'node:fs/promises';
 import { dirname, join, relative } from 'node:path';
 
-async function referenceSource(
+export async function referenceSource(
 	workspaceRoot: string,
 	path: string,
 ): Promise<string> {

package/src/server/reload-log.ts

@@ -0,0 +1,68 @@
+import { relative } from 'node:path';
+import type { ViteDevServer } from 'vite';
+
+/* Watch notifications describe source changes, not successful preview builds.
+   Collect one bounded burst so atomic saves do not flood the terminal. */
+export function watchSandboxReloads(
+	server: Pick<ViteDevServer, 'watcher' | 'httpServer'>,
+	appRoot: string,
+	write: (message: string) => void,
+	verbose = false,
+): () => void {
+	const groups = new Map<string, Set<string>>();
+	let timer: ReturnType<typeof setTimeout> | undefined;
+	let pendingFiles = 0;
+	const flush = () => {
+		if (timer) clearTimeout(timer);
+		timer = undefined;
+		for (const [label, files] of groups) {
+			if (verbose) {
+				for (const path of files) write(path);
+			} else {
+				write(
+					`${label} · ${files.size} ${files.size === 1 ? 'file' : 'files'} changed`,
+				);
+			}
+		}
+		groups.clear();
+		pendingFiles = 0;
+	};
+	const changed = (event: string, path: string) => {
+		if (!['add', 'change', 'unlink'].includes(event)) return;
+		const normalized = path.replaceAll('\\', '/');
+		const draft = normalized.match(
+			/\/(?:\.flowdular|\.coreloom)\/sandbox\/sessions\/([^/]+)\/workspace\/modules\/([^/]+)\//,
+		);
+		const local = relative(appRoot, path);
+		if (
+			!draft &&
+			(local === '..' || local.startsWith('../') || local.startsWith('..\\'))
+		)
+			return;
+		const label = draft
+			? `Draft ${draft[2]} (${draft[1]!.slice(0, 8)})`
+			: 'Sandbox';
+		const files = groups.get(label) ?? new Set<string>();
+		if (!files.has(path)) pendingFiles += 1;
+		files.add(path);
+		groups.set(label, files);
+		// Fixed window, not a reset-on-every-event debounce: continuous writes
+		// remain visible and retained notifications cannot grow without a flush.
+		if (!timer) {
+			timer = setTimeout(flush, 750);
+			timer.unref?.();
+		}
+		if (pendingFiles >= 256) flush();
+	};
+	const dispose = () => {
+		if (timer) clearTimeout(timer);
+		timer = undefined;
+		groups.clear();
+		pendingFiles = 0;
+		server.watcher.off('all', changed);
+		server.httpServer?.off('close', dispose);
+	};
+	server.watcher.on('all', changed);
+	server.httpServer?.once('close', dispose);
+	return dispose;
+}