ruflo 3.7.0-alpha.11 → 3.7.0-alpha.13

package/src/ruvocal/src/lib/buildPrompt.ts

@@ -1,33 +1,33 @@
-import type { EndpointParameters } from "./server/endpoints/endpoints";
-import type { BackendModel } from "./server/models";
-
-type buildPromptOptions = Pick<EndpointParameters, "messages" | "preprompt"> & {
-	model: BackendModel;
-};
-
-export async function buildPrompt({
-	messages,
-	model,
-	preprompt,
-}: buildPromptOptions): Promise<string> {
-	const filteredMessages = messages;
-
-	if (filteredMessages[0].from === "system" && preprompt) {
-		filteredMessages[0].content = preprompt;
-	}
-
-	const prompt = model
-		.chatPromptRender({
-			messages: filteredMessages.map((m) => ({
-				...m,
-				role: m.from,
-			})),
-			preprompt,
-		})
-		// Not super precise, but it's truncated in the model's backend anyway
-		.split(" ")
-		.slice(-(model.parameters?.truncate ?? 0))
-		.join(" ");
-
-	return prompt;
-}
+import type { EndpointParameters } from "./server/endpoints/endpoints";
+import type { BackendModel } from "./server/models";
+
+type buildPromptOptions = Pick<EndpointParameters, "messages" | "preprompt"> & {
+	model: BackendModel;
+};
+
+export async function buildPrompt({
+	messages,
+	model,
+	preprompt,
+}: buildPromptOptions): Promise<string> {
+	const filteredMessages = messages;
+
+	if (filteredMessages[0].from === "system" && preprompt) {
+		filteredMessages[0].content = preprompt;
+	}
+
+	const prompt = model
+		.chatPromptRender({
+			messages: filteredMessages.map((m) => ({
+				...m,
+				role: m.from,
+			})),
+			preprompt,
+		})
+		// Not super precise, but it's truncated in the model's backend anyway
+		.split(" ")
+		.slice(-(model.parameters?.truncate ?? 0))
+		.join(" ");
+
+	return prompt;
+}

package/src/ruvocal/src/lib/components/AnnouncementBanner.svelte

@@ -1,20 +1,20 @@
-<script lang="ts">
-	interface Props {
-		title?: string;
-		classNames?: string;
-		children?: import("svelte").Snippet;
-	}
-
-	let { title = "", classNames = "", children }: Props = $props();
-</script>
-
-<div class="flex items-center rounded-xl bg-gray-100 p-1 text-sm dark:bg-gray-800 {classNames}">
-	<span
-		class="mr-2 inline-flex items-center rounded-lg bg-gradient-to-br from-gray-300 px-2 py-1 text-xxs font-medium uppercase leading-3 text-gray-700 dark:from-gray-900 dark:text-gray-400"
-		>New</span
-	>
-	{title}
-	<div class="ml-auto shrink-0">
-		{@render children?.()}
-	</div>
-</div>
+<script lang="ts">
+	interface Props {
+		title?: string;
+		classNames?: string;
+		children?: import("svelte").Snippet;
+	}
+
+	let { title = "", classNames = "", children }: Props = $props();
+</script>
+
+<div class="flex items-center rounded-xl bg-gray-100 p-1 text-sm dark:bg-gray-800 {classNames}">
+	<span
+		class="mr-2 inline-flex items-center rounded-lg bg-gradient-to-br from-gray-300 px-2 py-1 text-xxs font-medium uppercase leading-3 text-gray-700 dark:from-gray-900 dark:text-gray-400"
+		>New</span
+	>
+	{title}
+	<div class="ml-auto shrink-0">
+		{@render children?.()}
+	</div>
+</div>

package/src/ruvocal/src/lib/components/BackgroundGenerationPoller.svelte

@@ -1,168 +1,168 @@
-<script lang="ts">
-	import { browser, dev } from "$app/environment";
-	import { invalidate } from "$app/navigation";
-
-	import {
-		type BackgroundGeneration,
-		backgroundGenerationEntries,
-		removeBackgroundGeneration,
-	} from "$lib/stores/backgroundGenerations";
-	import { handleResponse, useAPIClient } from "$lib/APIClient";
-	import { UrlDependency } from "$lib/types/UrlDependency";
-	import type { Message } from "$lib/types/Message";
-	import { isAssistantGenerationTerminal } from "$lib/utils/generationState";
-
-	const POLL_INTERVAL_MS = 1000;
-	const MAX_POLL_DURATION_MS = 3 * 60_000;
-
-	const client = useAPIClient();
-	const pollers = new Map<string, () => void>();
-	const inflight = new Set<string>();
-	const assistantSnapshots = new Map<string, string>();
-	const failureCounts = new Map<string, number>();
-
-	$effect.root(() => {
-		if (!browser) {
-			pollers.clear();
-			return;
-		}
-
-		let destroyed = false;
-
-		const log = (...args: unknown[]) => {
-			if (dev) {
-				console.log("background generation", ...args);
-			}
-		};
-
-		const stopPoller = (id: string, reason?: string) => {
-			const stop = pollers.get(id);
-			if (!stop) return;
-
-			stop();
-			pollers.delete(id);
-			inflight.delete(id);
-			assistantSnapshots.delete(id);
-			failureCounts.delete(id);
-			log("stop", id, reason);
-		};
-
-		const pollOnce = async (id: string) => {
-			if (destroyed || inflight.has(id)) return;
-
-			const entry = backgroundGenerationEntries.find((candidate) => candidate.id === id);
-			if (entry && Date.now() - entry.startedAt > MAX_POLL_DURATION_MS) {
-				removeBackgroundGeneration(id);
-				stopPoller(id, "timed out");
-				log("timeout", id);
-				await invalidate(UrlDependency.ConversationList);
-				await invalidate(UrlDependency.Conversation);
-				return;
-			}
-
-			inflight.add(id);
-			log("poll", id);
-
-			try {
-				const response = await client.conversations({ id }).get({ query: {} });
-				const conversation = handleResponse(response) as {
-					messages?: Message[];
-				} | null;
-				const messages: Message[] = conversation?.messages ?? [];
-				const lastAssistant = [...messages]
-					.reverse()
-					.find((message: Message) => message.from === "assistant");
-
-				const isTerminal = isAssistantGenerationTerminal(lastAssistant);
-
-				const snapshot = lastAssistant
-					? JSON.stringify({
-							id: lastAssistant.id,
-							updatedAt: lastAssistant.updatedAt,
-							contentLength: lastAssistant.content?.length ?? 0,
-							updatesLength: lastAssistant.updates?.length ?? 0,
-						})
-					: "__none__";
-				const previousSnapshot = assistantSnapshots.get(id);
-				let shouldInvalidateConversation = false;
-
-				if (lastAssistant) {
-					assistantSnapshots.set(id, snapshot);
-					if (snapshot !== previousSnapshot) {
-						shouldInvalidateConversation = true;
-					}
-				} else if (assistantSnapshots.has(id)) {
-					assistantSnapshots.delete(id);
-					shouldInvalidateConversation = true;
-				}
-
-				if (lastAssistant && isTerminal) {
-					removeBackgroundGeneration(id);
-					assistantSnapshots.delete(id);
-					failureCounts.delete(id);
-					shouldInvalidateConversation = true;
-					log("complete", id, "terminal");
-					await invalidate(UrlDependency.ConversationList);
-				}
-
-				if (shouldInvalidateConversation) {
-					await invalidate(UrlDependency.Conversation);
-				}
-
-				failureCounts.delete(id);
-			} catch (err) {
-				console.error("Background generation poll failed", id, err);
-				const failures = (failureCounts.get(id) ?? 0) + 1;
-				failureCounts.set(id, failures);
-				if (failures >= 3) {
-					removeBackgroundGeneration(id);
-					assistantSnapshots.delete(id);
-					failureCounts.delete(id);
-					log("failures", id, failures);
-					await invalidate(UrlDependency.ConversationList);
-				}
-			} finally {
-				inflight.delete(id);
-			}
-		};
-
-		const startPoller = (entry: BackgroundGeneration) => {
-			if (pollers.has(entry.id)) return;
-
-			const intervalId = setInterval(() => {
-				void pollOnce(entry.id);
-			}, POLL_INTERVAL_MS);
-
-			pollers.set(entry.id, () => clearInterval(intervalId));
-			void pollOnce(entry.id);
-			log("start", entry.id);
-		};
-
-		$effect(() => {
-			const entries = backgroundGenerationEntries;
-
-			if (destroyed) return;
-
-			const activeIds = new Set(entries.map((entry) => entry.id));
-
-			for (const id of pollers.keys()) {
-				if (!activeIds.has(id)) {
-					stopPoller(id);
-				}
-			}
-
-			for (const entry of entries) {
-				startPoller(entry);
-			}
-		});
-
-		return () => {
-			destroyed = true;
-			for (const stop of pollers.values()) stop();
-			pollers.clear();
-			inflight.clear();
-			assistantSnapshots.clear();
-			failureCounts.clear();
-		};
-	});
-</script>
+<script lang="ts">
+	import { browser, dev } from "$app/environment";
+	import { invalidate } from "$app/navigation";
+
+	import {
+		type BackgroundGeneration,
+		backgroundGenerationEntries,
+		removeBackgroundGeneration,
+	} from "$lib/stores/backgroundGenerations";
+	import { handleResponse, useAPIClient } from "$lib/APIClient";
+	import { UrlDependency } from "$lib/types/UrlDependency";
+	import type { Message } from "$lib/types/Message";
+	import { isAssistantGenerationTerminal } from "$lib/utils/generationState";
+
+	const POLL_INTERVAL_MS = 1000;
+	const MAX_POLL_DURATION_MS = 3 * 60_000;
+
+	const client = useAPIClient();
+	const pollers = new Map<string, () => void>();
+	const inflight = new Set<string>();
+	const assistantSnapshots = new Map<string, string>();
+	const failureCounts = new Map<string, number>();
+
+	$effect.root(() => {
+		if (!browser) {
+			pollers.clear();
+			return;
+		}
+
+		let destroyed = false;
+
+		const log = (...args: unknown[]) => {
+			if (dev) {
+				console.log("background generation", ...args);
+			}
+		};
+
+		const stopPoller = (id: string, reason?: string) => {
+			const stop = pollers.get(id);
+			if (!stop) return;
+
+			stop();
+			pollers.delete(id);
+			inflight.delete(id);
+			assistantSnapshots.delete(id);
+			failureCounts.delete(id);
+			log("stop", id, reason);
+		};
+
+		const pollOnce = async (id: string) => {
+			if (destroyed || inflight.has(id)) return;
+
+			const entry = backgroundGenerationEntries.find((candidate) => candidate.id === id);
+			if (entry && Date.now() - entry.startedAt > MAX_POLL_DURATION_MS) {
+				removeBackgroundGeneration(id);
+				stopPoller(id, "timed out");
+				log("timeout", id);
+				await invalidate(UrlDependency.ConversationList);
+				await invalidate(UrlDependency.Conversation);
+				return;
+			}
+
+			inflight.add(id);
+			log("poll", id);
+
+			try {
+				const response = await client.conversations({ id }).get({ query: {} });
+				const conversation = handleResponse(response) as {
+					messages?: Message[];
+				} | null;
+				const messages: Message[] = conversation?.messages ?? [];
+				const lastAssistant = [...messages]
+					.reverse()
+					.find((message: Message) => message.from === "assistant");
+
+				const isTerminal = isAssistantGenerationTerminal(lastAssistant);
+
+				const snapshot = lastAssistant
+					? JSON.stringify({
+							id: lastAssistant.id,
+							updatedAt: lastAssistant.updatedAt,
+							contentLength: lastAssistant.content?.length ?? 0,
+							updatesLength: lastAssistant.updates?.length ?? 0,
+						})
+					: "__none__";
+				const previousSnapshot = assistantSnapshots.get(id);
+				let shouldInvalidateConversation = false;
+
+				if (lastAssistant) {
+					assistantSnapshots.set(id, snapshot);
+					if (snapshot !== previousSnapshot) {
+						shouldInvalidateConversation = true;
+					}
+				} else if (assistantSnapshots.has(id)) {
+					assistantSnapshots.delete(id);
+					shouldInvalidateConversation = true;
+				}
+
+				if (lastAssistant && isTerminal) {
+					removeBackgroundGeneration(id);
+					assistantSnapshots.delete(id);
+					failureCounts.delete(id);
+					shouldInvalidateConversation = true;
+					log("complete", id, "terminal");
+					await invalidate(UrlDependency.ConversationList);
+				}
+
+				if (shouldInvalidateConversation) {
+					await invalidate(UrlDependency.Conversation);
+				}
+
+				failureCounts.delete(id);
+			} catch (err) {
+				console.error("Background generation poll failed", id, err);
+				const failures = (failureCounts.get(id) ?? 0) + 1;
+				failureCounts.set(id, failures);
+				if (failures >= 3) {
+					removeBackgroundGeneration(id);
+					assistantSnapshots.delete(id);
+					failureCounts.delete(id);
+					log("failures", id, failures);
+					await invalidate(UrlDependency.ConversationList);
+				}
+			} finally {
+				inflight.delete(id);
+			}
+		};
+
+		const startPoller = (entry: BackgroundGeneration) => {
+			if (pollers.has(entry.id)) return;
+
+			const intervalId = setInterval(() => {
+				void pollOnce(entry.id);
+			}, POLL_INTERVAL_MS);
+
+			pollers.set(entry.id, () => clearInterval(intervalId));
+			void pollOnce(entry.id);
+			log("start", entry.id);
+		};
+
+		$effect(() => {
+			const entries = backgroundGenerationEntries;
+
+			if (destroyed) return;
+
+			const activeIds = new Set(entries.map((entry) => entry.id));
+
+			for (const id of pollers.keys()) {
+				if (!activeIds.has(id)) {
+					stopPoller(id);
+				}
+			}
+
+			for (const entry of entries) {
+				startPoller(entry);
+			}
+		});
+
+		return () => {
+			destroyed = true;
+			for (const stop of pollers.values()) stop();
+			pollers.clear();
+			inflight.clear();
+			assistantSnapshots.clear();
+			failureCounts.clear();
+		};
+	});
+</script>

package/src/ruvocal/src/lib/components/CodeBlock.svelte

@@ -1,73 +1,73 @@
-<script lang="ts">
-	import CopyToClipBoardBtn from "./CopyToClipBoardBtn.svelte";
-	import DOMPurify from "isomorphic-dompurify";
-	import HtmlPreviewModal from "./HtmlPreviewModal.svelte";
-	import PlayFilledAlt from "~icons/carbon/play-filled-alt";
-	import EosIconsLoading from "~icons/eos-icons/loading";
-
-	interface Props {
-		code?: string;
-		rawCode?: string;
-		loading?: boolean;
-	}
-
-	let { code = "", rawCode = "", loading = false }: Props = $props();
-
-	let previewOpen = $state(false);
-
-	function hasStrictHtml5Doctype(input: string): boolean {
-		if (!input) return false;
-		const withoutBOM = input.replace(/^\uFEFF/, "");
-		const trimmed = withoutBOM.trimStart();
-		// Strict HTML5 doctype: <!doctype html> with optional whitespace before >
-		return /^<!doctype\s+html\s*>/i.test(trimmed);
-	}
-
-	function isSvgDocument(input: string): boolean {
-		const trimmed = input.trimStart();
-		return /^(?:<\?xml[^>]*>\s*)?(?:<!doctype\s+svg[^>]*>\s*)?<svg[\s>]/i.test(trimmed);
-	}
-
-	let showPreview = $derived(hasStrictHtml5Doctype(rawCode) || isSvgDocument(rawCode));
-</script>
-
-<div class="group relative my-4 rounded-lg">
-	<div class="pointer-events-none sticky top-0 w-full">
-		<div
-			class="pointer-events-auto absolute right-2 top-2 flex items-center gap-1.5 md:right-3 md:top-3"
-		>
-			{#if showPreview}
-				<button
-					class="btn h-7 gap-1 rounded-lg border px-2 text-xs shadow-sm backdrop-blur transition-none hover:border-gray-500 active:shadow-inner disabled:cursor-not-allowed disabled:opacity-80 dark:border-gray-600 dark:bg-gray-600/50 dark:hover:border-gray-500"
-					disabled={loading}
-					onclick={() => {
-						if (!loading) {
-							previewOpen = true;
-						}
-					}}
-					title="Preview HTML"
-					aria-label="Preview HTML"
-				>
-					{#if loading}
-						<EosIconsLoading class="size-3.5" />
-					{:else}
-						<PlayFilledAlt class="size-3.5" />
-					{/if}
-					Preview
-				</button>
-			{/if}
-			<CopyToClipBoardBtn
-				iconClassNames="size-3"
-				classNames="btn transition-none rounded-lg border size-7 text-sm shadow-sm dark:bg-gray-600/50 backdrop-blur dark:hover:border-gray-500  active:shadow-inner dark:border-gray-600  hover:border-gray-500"
-				value={rawCode}
-			/>
-		</div>
-	</div>
-	<pre class="scrollbar-custom overflow-auto px-5 font-mono transition-[height]"><code
-			><!-- eslint-disable svelte/no-at-html-tags -->{@html DOMPurify.sanitize(code)}</code
-		></pre>
-
-	{#if previewOpen}
-		<HtmlPreviewModal html={rawCode} onclose={() => (previewOpen = false)} />
-	{/if}
-</div>
+<script lang="ts">
+	import CopyToClipBoardBtn from "./CopyToClipBoardBtn.svelte";
+	import DOMPurify from "isomorphic-dompurify";
+	import HtmlPreviewModal from "./HtmlPreviewModal.svelte";
+	import PlayFilledAlt from "~icons/carbon/play-filled-alt";
+	import EosIconsLoading from "~icons/eos-icons/loading";
+
+	interface Props {
+		code?: string;
+		rawCode?: string;
+		loading?: boolean;
+	}
+
+	let { code = "", rawCode = "", loading = false }: Props = $props();
+
+	let previewOpen = $state(false);
+
+	function hasStrictHtml5Doctype(input: string): boolean {
+		if (!input) return false;
+		const withoutBOM = input.replace(/^\uFEFF/, "");
+		const trimmed = withoutBOM.trimStart();
+		// Strict HTML5 doctype: <!doctype html> with optional whitespace before >
+		return /^<!doctype\s+html\s*>/i.test(trimmed);
+	}
+
+	function isSvgDocument(input: string): boolean {
+		const trimmed = input.trimStart();
+		return /^(?:<\?xml[^>]*>\s*)?(?:<!doctype\s+svg[^>]*>\s*)?<svg[\s>]/i.test(trimmed);
+	}
+
+	let showPreview = $derived(hasStrictHtml5Doctype(rawCode) || isSvgDocument(rawCode));
+</script>
+
+<div class="group relative my-4 rounded-lg">
+	<div class="pointer-events-none sticky top-0 w-full">
+		<div
+			class="pointer-events-auto absolute right-2 top-2 flex items-center gap-1.5 md:right-3 md:top-3"
+		>
+			{#if showPreview}
+				<button
+					class="btn h-7 gap-1 rounded-lg border px-2 text-xs shadow-sm backdrop-blur transition-none hover:border-gray-500 active:shadow-inner disabled:cursor-not-allowed disabled:opacity-80 dark:border-gray-600 dark:bg-gray-600/50 dark:hover:border-gray-500"
+					disabled={loading}
+					onclick={() => {
+						if (!loading) {
+							previewOpen = true;
+						}
+					}}
+					title="Preview HTML"
+					aria-label="Preview HTML"
+				>
+					{#if loading}
+						<EosIconsLoading class="size-3.5" />
+					{:else}
+						<PlayFilledAlt class="size-3.5" />
+					{/if}
+					Preview
+				</button>
+			{/if}
+			<CopyToClipBoardBtn
+				iconClassNames="size-3"
+				classNames="btn transition-none rounded-lg border size-7 text-sm shadow-sm dark:bg-gray-600/50 backdrop-blur dark:hover:border-gray-500  active:shadow-inner dark:border-gray-600  hover:border-gray-500"
+				value={rawCode}
+			/>
+		</div>
+	</div>
+	<pre class="scrollbar-custom overflow-auto px-5 font-mono transition-[height]"><code
+			><!-- eslint-disable svelte/no-at-html-tags -->{@html DOMPurify.sanitize(code)}</code
+		></pre>
+
+	{#if previewOpen}
+		<HtmlPreviewModal html={rawCode} onclose={() => (previewOpen = false)} />
+	{/if}
+</div>