feat: use i18n in components

web/src/lib/components/tool/ParamsCard.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
 	import ParamForm from '../ParamForm.svelte';
-	import type { ParamDef } from '$lib/registry';
+	import type { ParamDef, ToolEntry } from '$lib/registry';
 	import { t } from '$lib/i18n/t';
 
 	interface Props {
+		tool: ToolEntry;
 		params: ParamDef[];
 		values: Record<string, any>;
 		pipetteTargetId?: string | null;
@@ -13,6 +14,7 @@
 	}
 
 	let {
+		tool,
 		params,
 		values = $bindable(),
 		pipetteTargetId = null,
@@ -25,6 +27,7 @@
 <div class="root">
 	{#if params.length > 0 || hasMask}
 		<ParamForm
+			{tool}
 			{params}
 			bind:values
 			{pipetteTargetId}

web/src/lib/components/tool/ResultCard.svelte

@@ -64,7 +64,7 @@
 	{:else if tool.resultType === 'text'}
 		<div class="media">
 			{#if textResult !== null}
-				<TextResult text={textResult} filename={tool.id} />
+				<TextResult text={textResult} filename={tool.id} toolId={tool.id} />
 			{/if}
 		</div>
 	{:else}

web/src/lib/components/tool/TextResult.svelte

@@ -1,29 +1,35 @@
 <script lang="ts">
 	import { downloadBlob } from '$lib/core/io';
 	import { t } from '$lib/i18n/t';
+	import { getMergedDict } from '$lib/i18n/locale.svelte';
 
 	interface Props {
 		text: string;
 		filename: string;
+		toolId?: string;
 	}
 
-	let { text, filename }: Props = $props();
+	let { text, filename, toolId }: Props = $props();
+
+	const shown = $derived(
+		toolId ? (getMergedDict().tools[toolId]?.results?.[text] ?? text) : text
+	);
 
 	let copied = $state(false);
 
 	async function copy() {
-		await navigator.clipboard.writeText(text);
+		await navigator.clipboard.writeText(shown);
 		copied = true;
 		setTimeout(() => (copied = false), 1500);
 	}
 
 	function download() {
-		downloadBlob(new Blob([text], { type: 'text/plain' }), `${filename}.txt`);
+		downloadBlob(new Blob([shown], { type: 'text/plain' }), `${filename}.txt`);
 	}
 </script>
 
 <div class="panel text-result">
-	<textarea class="output" rows="10" readonly value={text} aria-label={t('textResult.outputAria')}></textarea>
+	<textarea class="output" rows="10" readonly value={shown} aria-label={t('textResult.outputAria')}></textarea>
 	<div class="actions">
 		<button type="button" class="secondary" onclick={copy}>
 			{copied ? t('textResult.copied') : t('textResult.copy')}