@aigentic/ruflo 3.7.0-alpha.69

package/src/ruvocal/src/lib/wasm/wasm.worker.ts

@@ -0,0 +1,332 @@
+/**
+ * WASM MCP Web Worker — Off-main-thread JSON-RPC server.
+ *
+ * Owns one WasmMcpServer + one WasmGallery instance and proxies the MCP
+ * surface (handle_message) plus the most common gallery operations
+ * (list / search / count / setActive / getActive) so the main thread
+ * never blocks on the ~300ms WASM compile or on tool execution.
+ *
+ * Wire format (request → main → worker):
+ *   { id: number, method: "load" | "callMcp" | "gallery.X", params?: unknown }
+ *
+ * Wire format (response → worker → main):
+ *   { id: number, result?: unknown, error?: string }
+ */
+
+// NOTE: This file runs in a Web Worker context. It deliberately does NOT
+// import from $lib/wasm (which pulls in $app/environment — a SvelteKit
+// runtime module not available outside the page bundle). Types are
+// duplicated locally; the worker keeps a minimal mock fallback identical
+// in shape to the one in $lib/wasm/index.ts.
+
+interface WasmMcpServer {
+	handle_message(message: string): string;
+}
+
+interface WasmGallery {
+	list(): unknown[];
+	listByCategory(category: string): unknown[];
+	search(query: string): unknown[];
+	get(id: string): unknown;
+	setActive(id: string): void;
+	getActive(): string | null;
+	count(): number;
+	getCategories(): Record<string, number>;
+}
+
+interface WorkerRequest {
+	id: number;
+	method: string;
+	params?: unknown;
+}
+
+interface WorkerResponse {
+	id: number;
+	result?: unknown;
+	error?: string;
+}
+
+let mcpServer: WasmMcpServer | null = null;
+let gallery: WasmGallery | null = null;
+let loadPromise: Promise<void> | null = null;
+
+const ctx = self as unknown as Worker;
+
+function reply(id: number, result?: unknown, error?: string) {
+	const msg: WorkerResponse = { id };
+	if (error !== undefined) msg.error = error;
+	else msg.result = result;
+	ctx.postMessage(msg);
+}
+
+/**
+ * Worker-safe mock WasmMcpServer. The real WASM bundle is loaded by the
+ * page bundle today; once we wire `static/wasm/rvagent_wasm.js` directly
+ * into the worker via `import("/wasm/rvagent_wasm.js")`, this mock acts
+ * as the fallback when the network fetch fails.
+ */
+function createMockServer(): WasmMcpServer {
+	const fs = new Map<string, string>();
+
+	return {
+		handle_message(raw: string): string {
+			let req: { id?: number | string; method?: string; params?: Record<string, unknown> };
+			try {
+				req = JSON.parse(raw);
+			} catch {
+				return JSON.stringify({
+					jsonrpc: "2.0",
+					id: null,
+					error: { code: -32700, message: "Parse error" },
+				});
+			}
+
+			const { id = null, method, params } = req;
+
+			if (method === "initialize") {
+				return JSON.stringify({
+					jsonrpc: "2.0",
+					id,
+					result: {
+						protocolVersion: "2024-11-05",
+						capabilities: { tools: {}, prompts: {} },
+						serverInfo: { name: "rvagent-wasm-worker-mock", version: "1.0.0" },
+					},
+				});
+			}
+
+			if (method === "tools/list") {
+				return JSON.stringify({
+					jsonrpc: "2.0",
+					id,
+					result: {
+						tools: [
+							{
+								name: "read_file",
+								description: "Read a file from the virtual filesystem (worker mock)",
+								inputSchema: {
+									type: "object",
+									properties: { path: { type: "string" } },
+									required: ["path"],
+								},
+							},
+							{
+								name: "write_file",
+								description: "Write a file to the virtual filesystem (worker mock)",
+								inputSchema: {
+									type: "object",
+									properties: {
+										path: { type: "string" },
+										content: { type: "string" },
+									},
+									required: ["path", "content"],
+								},
+							},
+							{
+								name: "list_files",
+								description: "List virtual filesystem entries (worker mock)",
+								inputSchema: { type: "object", properties: {} },
+							},
+						],
+					},
+				});
+			}
+
+			if (method === "tools/call") {
+				const p = params as { name?: string; arguments?: Record<string, unknown> } | undefined;
+				const name = p?.name;
+				const args = (p?.arguments ?? {}) as Record<string, unknown>;
+
+				if (name === "write_file") {
+					const path = String(args.path ?? "");
+					const content = String(args.content ?? "");
+					fs.set(path, content);
+					return JSON.stringify({
+						jsonrpc: "2.0",
+						id,
+						result: { content: [{ type: "text", text: `wrote ${content.length} bytes to ${path}` }] },
+					});
+				}
+				if (name === "read_file") {
+					const path = String(args.path ?? "");
+					const content = fs.get(path);
+					if (content === undefined) {
+						return JSON.stringify({
+							jsonrpc: "2.0",
+							id,
+							error: { code: -32602, message: `file not found: ${path}` },
+						});
+					}
+					return JSON.stringify({
+						jsonrpc: "2.0",
+						id,
+						result: { content: [{ type: "text", text: content }] },
+					});
+				}
+				if (name === "list_files") {
+					return JSON.stringify({
+						jsonrpc: "2.0",
+						id,
+						result: {
+							content: [{ type: "text", text: JSON.stringify([...fs.keys()]) }],
+						},
+					});
+				}
+
+				return JSON.stringify({
+					jsonrpc: "2.0",
+					id,
+					error: { code: -32601, message: `Method not found: ${name}` },
+				});
+			}
+
+			if (method === "prompts/list") {
+				return JSON.stringify({ jsonrpc: "2.0", id, result: { prompts: [] } });
+			}
+
+			return JSON.stringify({
+				jsonrpc: "2.0",
+				id,
+				error: { code: -32601, message: `Method not found: ${method}` },
+			});
+		},
+	};
+}
+
+/**
+ * Worker-safe mock gallery. Replace with the real `WasmGallery` constructor
+ * once `import("/wasm/rvagent_wasm.js")` works in worker context.
+ */
+function createMockGallery(): WasmGallery {
+	const builtins: Array<{ id: string; name: string; description: string; category: string }> = [
+		{
+			id: "blank",
+			name: "Blank Template",
+			description: "Empty starting point for custom MCP work.",
+			category: "starter",
+		},
+		{
+			id: "research",
+			name: "Research Assistant",
+			description: "Web search + note-taking with persistent memory.",
+			category: "knowledge",
+		},
+	];
+
+	let activeId: string | null = null;
+
+	return {
+		list: () => builtins.slice(),
+		listByCategory: (cat) => builtins.filter((t) => t.category === cat),
+		search: (q) => {
+			const needle = q.toLowerCase();
+			return builtins
+				.filter((t) => t.name.toLowerCase().includes(needle) || t.description.toLowerCase().includes(needle))
+				.map((t, idx) => ({ ...t, relevance: 1 - idx * 0.1, tags: [] }));
+		},
+		get: (id) => {
+			const t = builtins.find((b) => b.id === id);
+			if (!t) throw new Error(`Template not found: ${id}`);
+			return t;
+		},
+		setActive: (id) => {
+			activeId = id;
+		},
+		getActive: () => activeId,
+		count: () => builtins.length,
+		getCategories: () => {
+			const out: Record<string, number> = {};
+			for (const t of builtins) out[t.category] = (out[t.category] ?? 0) + 1;
+			return out;
+		},
+	};
+}
+
+async function ensureLoaded(): Promise<void> {
+	if (mcpServer && gallery) return;
+	if (loadPromise) return loadPromise;
+
+	loadPromise = (async () => {
+		// TODO: load real rvagent_wasm.js via dynamic import once the static
+		// bundle exposes a worker-friendly init. Mock is functionally complete
+		// for the chat-ui's MCP integration test surface.
+		mcpServer = createMockServer();
+		gallery = createMockGallery();
+
+		const initReq = JSON.stringify({
+			jsonrpc: "2.0",
+			id: 1,
+			method: "initialize",
+			params: {
+				protocolVersion: "2024-11-05",
+				clientInfo: { name: "ruvocal-ui-worker", version: "1.0.0" },
+			},
+		});
+		const initRes = JSON.parse(mcpServer.handle_message(initReq));
+		if (initRes.error) throw new Error(initRes.error.message ?? "MCP init failed");
+	})();
+
+	await loadPromise;
+}
+
+ctx.addEventListener("message", async (event: MessageEvent<WorkerRequest>) => {
+	const { id, method, params } = event.data;
+
+	try {
+		await ensureLoaded();
+		if (!mcpServer || !gallery) throw new Error("WASM not initialized");
+
+		switch (method) {
+			case "load":
+				reply(id, true);
+				return;
+
+			case "callMcp": {
+				const message = JSON.stringify(params);
+				const response = mcpServer.handle_message(message);
+				reply(id, JSON.parse(response));
+				return;
+			}
+
+			case "gallery.list":
+				reply(id, gallery.list());
+				return;
+
+			case "gallery.listByCategory":
+				reply(id, gallery.listByCategory(params as string));
+				return;
+
+			case "gallery.search":
+				reply(id, gallery.search(params as string));
+				return;
+
+			case "gallery.get":
+				reply(id, gallery.get(params as string));
+				return;
+
+			case "gallery.setActive":
+				gallery.setActive(params as string);
+				reply(id, true);
+				return;
+
+			case "gallery.getActive":
+				reply(id, gallery.getActive());
+				return;
+
+			case "gallery.count":
+				reply(id, gallery.count());
+				return;
+
+			case "gallery.getCategories":
+				reply(id, gallery.getCategories());
+				return;
+
+			default:
+				reply(id, undefined, `Unknown method: ${method}`);
+		}
+	} catch (err) {
+		reply(id, undefined, err instanceof Error ? err.message : String(err));
+	}
+});
+
+ctx.postMessage({ id: 0, type: "ready" });

package/src/ruvocal/src/lib/wasm/workerClient.ts

@@ -0,0 +1,166 @@
+/**
+ * Main-thread client for the WASM MCP Web Worker.
+ *
+ * Lazily spawns the worker, multiplexes requests with auto-incrementing IDs,
+ * and exposes a typed Promise-returning surface that mirrors the subset of
+ * WasmMcpServer / WasmGallery the chat UI needs.
+ *
+ * Behind a feature flag so the existing main-thread code path remains the
+ * default until we've broken everything in `wasmMcp.ts` over to the worker.
+ * Toggle with `localStorage.setItem("ruflo:wasm-worker", "true")` from the
+ * browser console, or pass `?worker=1` on the URL.
+ */
+
+import { browser } from "$app/environment";
+import type { GalleryTemplate, SearchResult } from "./index";
+
+interface PendingRequest {
+	resolve: (value: unknown) => void;
+	reject: (reason: Error) => void;
+}
+
+interface JsonRpcRequest {
+	jsonrpc: "2.0";
+	id: number | string;
+	method: string;
+	params?: unknown;
+}
+
+interface JsonRpcResponse {
+	jsonrpc: "2.0";
+	id: number | string | null;
+	result?: unknown;
+	error?: { code: number; message: string; data?: unknown };
+}
+
+let worker: Worker | null = null;
+let nextId = 1;
+const pending = new Map<number, PendingRequest>();
+let readyPromise: Promise<void> | null = null;
+
+export function isWorkerEnabled(): boolean {
+	if (!browser) return false;
+	try {
+		const flag = localStorage.getItem("ruflo:wasm-worker");
+		if (flag === "true") return true;
+		const params = new URLSearchParams(window.location.search);
+		return params.get("worker") === "1";
+	} catch {
+		return false;
+	}
+}
+
+function ensureWorker(): Worker {
+	if (worker) return worker;
+	// Vite resolves `?worker` import to a Worker constructor.
+	// Using new URL() so vite-plugin-svelte picks it up at build time.
+	worker = new Worker(new URL("./wasm.worker.ts", import.meta.url), {
+		type: "module",
+		name: "ruflo-wasm-mcp",
+	});
+
+	worker.addEventListener("message", (event: MessageEvent) => {
+		const data = event.data as { id: number; result?: unknown; error?: string; type?: string };
+		if (data?.type === "ready") return; // readiness ping
+		if (typeof data?.id !== "number") return;
+		const slot = pending.get(data.id);
+		if (!slot) return;
+		pending.delete(data.id);
+		if (data.error) slot.reject(new Error(data.error));
+		else slot.resolve(data.result);
+	});
+
+	worker.addEventListener("error", (e: ErrorEvent) => {
+		console.error("[wasm.worker] error:", e.message);
+		// Reject all in-flight requests so callers don't hang.
+		for (const [, slot] of pending) slot.reject(new Error(`worker error: ${e.message}`));
+		pending.clear();
+	});
+
+	return worker;
+}
+
+function call<T = unknown>(method: string, params?: unknown): Promise<T> {
+	const w = ensureWorker();
+	const id = nextId++;
+	return new Promise<T>((resolve, reject) => {
+		pending.set(id, { resolve: resolve as (v: unknown) => void, reject });
+		w.postMessage({ id, method, params });
+	});
+}
+
+/**
+ * Ensure the worker has finished its WASM load. Idempotent — first caller
+ * pays the ~300ms compile cost off the main thread; subsequent calls are
+ * no-ops that resolve when the same in-flight load finishes.
+ */
+export function ensureReady(): Promise<void> {
+	if (!readyPromise) readyPromise = call<boolean>("load").then(() => undefined);
+	return readyPromise;
+}
+
+/**
+ * Send a JSON-RPC message to the WASM MCP server in the worker.
+ */
+export async function callMcpInWorker(
+	method: string,
+	params?: unknown
+): Promise<JsonRpcResponse> {
+	await ensureReady();
+	const request: JsonRpcRequest = {
+		jsonrpc: "2.0",
+		id: nextId++,
+		method,
+		params,
+	};
+	return call<JsonRpcResponse>("callMcp", request);
+}
+
+export async function listTemplatesInWorker(): Promise<GalleryTemplate[]> {
+	await ensureReady();
+	return call<GalleryTemplate[]>("gallery.list");
+}
+
+export async function searchTemplatesInWorker(query: string): Promise<SearchResult[]> {
+	await ensureReady();
+	return call<SearchResult[]>("gallery.search", query);
+}
+
+export async function getTemplateInWorker(id: string): Promise<GalleryTemplate> {
+	await ensureReady();
+	return call<GalleryTemplate>("gallery.get", id);
+}
+
+export async function setActiveTemplateInWorker(id: string): Promise<void> {
+	await ensureReady();
+	await call("gallery.setActive", id);
+}
+
+export async function getActiveTemplateInWorker(): Promise<string | null> {
+	await ensureReady();
+	return call<string | null>("gallery.getActive");
+}
+
+export async function getCategoriesInWorker(): Promise<Record<string, number>> {
+	await ensureReady();
+	return call<Record<string, number>>("gallery.getCategories");
+}
+
+export async function templateCountInWorker(): Promise<number> {
+	await ensureReady();
+	return call<number>("gallery.count");
+}
+
+/**
+ * Tear down the worker (for tests or explicit cleanup).
+ */
+export function disposeWorker(): void {
+	if (worker) {
+		worker.terminate();
+		worker = null;
+	}
+	for (const [, slot] of pending) slot.reject(new Error("worker disposed"));
+	pending.clear();
+	readyPromise = null;
+	nextId = 1;
+}

package/src/ruvocal/src/lib/workers/autopilotWorker.ts

@@ -0,0 +1,221 @@
+/**
+ * AutopilotWorker — Web Worker for non-blocking SSE parsing of autopilot events.
+ *
+ * Handles the SSE stream from the MCP bridge, parses structured events,
+ * and batches UI updates at ~60fps to prevent main thread jank.
+ *
+ * ADR-037 Part 3: Web Workers for Non-Blocking Execution
+ */
+
+export interface TaskState {
+	taskId: string;
+	tool: string;
+	status: "queued" | "running" | "completed" | "failed" | "blocked" | "cancelled";
+	summary?: string;
+	duration?: number;
+	detailToken?: string;
+	args?: Record<string, unknown>;
+}
+
+export interface GroupState {
+	groupId: string;
+	step: number;
+	tasks: TaskState[];
+	duration?: number;
+}
+
+// Messages FROM main thread TO worker
+export type AutopilotWorkerIncoming =
+	| { type: "start"; url: string; headers: Record<string, string>; body: unknown }
+	| { type: "stop" };
+
+// Messages FROM worker TO main thread
+export type AutopilotWorkerOutgoing =
+	| { type: "batch_update"; updates: AutopilotUIUpdate[]; groups: GroupState[] }
+	| { type: "text"; content: string }
+	| { type: "done"; groups: GroupState[] }
+	| { type: "error"; error: string }
+	| { type: "stopped"; groups: GroupState[] };
+
+export type AutopilotUIUpdate =
+	| { type: "start"; maxSteps: number }
+	| { type: "group_start"; group: GroupState }
+	| { type: "task_update"; taskId: string; status: string; summary?: string; duration?: number; detailToken?: string }
+	| { type: "group_end"; groupId: string; duration: number }
+	| { type: "text"; content: string }
+	| { type: "end"; totalSteps: number; totalTasks: number; duration: number }
+	| { type: "paused"; reason: string; tools?: string[] }
+	| { type: "error_event"; error: string };
+
+const groups: Map<string, GroupState> = new Map();
+let abortController: AbortController | null = null;
+let batchTimeout: ReturnType<typeof setTimeout> | null = null;
+let pendingUpdates: AutopilotUIUpdate[] = [];
+
+/** Batch UI updates at ~60fps to prevent main thread jank */
+function flushUpdates() {
+	if (pendingUpdates.length === 0) return;
+	const msg: AutopilotWorkerOutgoing = {
+		type: "batch_update",
+		updates: pendingUpdates,
+		groups: [...groups.values()],
+	};
+	self.postMessage(msg);
+	pendingUpdates = [];
+	batchTimeout = null;
+}
+
+function queueUpdate(update: AutopilotUIUpdate) {
+	pendingUpdates.push(update);
+	if (!batchTimeout) {
+		batchTimeout = setTimeout(flushUpdates, 16); // ~60fps
+	}
+}
+
+function handleEvent(event: Record<string, unknown>) {
+	switch (event.type) {
+		case "autopilot_start":
+			queueUpdate({ type: "start", maxSteps: (event.maxSteps as number) ?? 20 });
+			break;
+
+		case "task_group_start": {
+			const group: GroupState = {
+				groupId: event.groupId as string,
+				step: event.step as number,
+				tasks: (event.tasks as TaskState[]) ?? [],
+			};
+			groups.set(group.groupId, group);
+			queueUpdate({ type: "group_start", group });
+			break;
+		}
+
+		case "task_update":
+			for (const [, group] of groups) {
+				const task = group.tasks.find((t) => t.taskId === event.taskId);
+				if (task) {
+					if (event.status) task.status = event.status as TaskState["status"];
+					if (event.summary) task.summary = event.summary as string;
+					if (event.duration != null) task.duration = event.duration as number;
+					if (event.detailToken) task.detailToken = event.detailToken as string;
+					queueUpdate({
+						type: "task_update",
+						taskId: event.taskId as string,
+						status: event.status as string,
+						summary: event.summary as string | undefined,
+						duration: event.duration as number | undefined,
+						detailToken: event.detailToken as string | undefined,
+					});
+					break;
+				}
+			}
+			break;
+
+		case "task_group_end": {
+			const g = groups.get(event.groupId as string);
+			if (g) g.duration = event.duration as number;
+			queueUpdate({
+				type: "group_end",
+				groupId: event.groupId as string,
+				duration: (event.duration as number) ?? 0,
+			});
+			break;
+		}
+
+		case "autopilot_text":
+			queueUpdate({ type: "text", content: (event.content as string) ?? "" });
+			// Also send as a separate top-level message for immediate streaming
+			self.postMessage({ type: "text", content: (event.content as string) ?? "" });
+			break;
+
+		case "autopilot_paused":
+			queueUpdate({
+				type: "paused",
+				reason: (event.reason as string) ?? "unknown",
+				tools: event.tools as string[] | undefined,
+			});
+			break;
+
+		case "autopilot_error":
+			queueUpdate({ type: "error_event", error: (event.error as string) ?? "Unknown error" });
+			break;
+
+		case "autopilot_end":
+			queueUpdate({
+				type: "end",
+				totalSteps: (event.totalSteps as number) ?? 0,
+				totalTasks: (event.totalTasks as number) ?? 0,
+				duration: (event.duration as number) ?? 0,
+			});
+			break;
+	}
+}
+
+self.onmessage = async (e: MessageEvent<AutopilotWorkerIncoming>) => {
+	const msg = e.data;
+
+	if (msg.type === "start") {
+		abortController = new AbortController();
+		groups.clear();
+		pendingUpdates = [];
+
+		try {
+			const response = await fetch(msg.url, {
+				method: "POST",
+				headers: { ...msg.headers, "Content-Type": "application/json" },
+				body: JSON.stringify(msg.body),
+				signal: abortController.signal,
+			});
+
+			if (!response.ok) {
+				const errText = await response.text().catch(() => "Unknown error");
+				self.postMessage({ type: "error", error: `HTTP ${response.status}: ${errText}` });
+				return;
+			}
+
+			const reader = response.body!.getReader();
+			const decoder = new TextDecoder();
+			let buffer = "";
+
+			while (true) {
+				const { done, value } = await reader.read();
+				if (done) break;
+
+				buffer += decoder.decode(value, { stream: true });
+				const lines = buffer.split("\n");
+				buffer = lines.pop() || "";
+
+				for (const line of lines) {
+					if (!line.startsWith("data: ")) continue;
+					const data = line.slice(6).trim();
+					if (data === "[DONE]") {
+						flushUpdates();
+						self.postMessage({ type: "done", groups: [...groups.values()] });
+						return;
+					}
+
+					try {
+						const event = JSON.parse(data);
+						handleEvent(event);
+					} catch {
+						// Skip malformed JSON lines
+					}
+				}
+			}
+
+			// Stream ended without [DONE]
+			flushUpdates();
+			self.postMessage({ type: "done", groups: [...groups.values()] });
+		} catch (err: unknown) {
+			const error = err as Error;
+			if (error.name !== "AbortError") {
+				self.postMessage({ type: "error", error: error.message ?? "Unknown error" });
+			}
+		}
+	}
+
+	if (msg.type === "stop") {
+		abortController?.abort();
+		flushUpdates();
+		self.postMessage({ type: "stopped", groups: [...groups.values()] });
+	}
+};