feat(friendshipper): add "copy logs to clipboard" button (#273)

* Added a button to the build logs page to copy the currently-displayed log to the clipboard.

friendshipper/src-tauri/Cargo.toml

@@ -40,7 +40,7 @@ serde_with = { workspace = true }
 serde_yaml = { workspace = true }
 rmp-serde = { workspace = true }
 sysinfo = { workspace = true }
-tauri = { workspace = true, features = ["fs-read-file"] }
+tauri = { workspace = true, features = ["fs-read-file", "clipboard-write-text"] }
 tokio = { workspace = true }
 tokio-stream = { workspace = true }
 tower-http = { workspace = true }

friendshipper/src-tauri/tauri.conf.json

@@ -13,6 +13,9 @@
 	"tauri": {
 		"allowlist": {
 			"all": false,
+			"clipboard": {
+				"writeText": true
+			},
 			"dialog": {
 				"open": true
 			},

friendshipper/src/lib/components/workflows/WorkflowLogsModal.svelte

@@ -1,12 +1,15 @@
 <script lang="ts">
-	import { Button, Hr, Input, Modal, Spinner } from 'flowbite-svelte';
+	import { Button, Hr, Input, Modal, Spinner, Tooltip } from 'flowbite-svelte';
 	import { emit } from '@tauri-apps/api/event';
+	import { writeText } from '@tauri-apps/api/clipboard';
+	import { FileCopySolid } from 'flowbite-svelte-icons';
 	import type { Workflow, WorkflowNode } from '$lib/types';
 	import { getWorkflowNodeLogs } from '$lib/builds';
 
 	export let showModal: boolean;
 	export let workflow: Workflow;
 	let loading: boolean = false;
+	let rawLogs: string = '';
 	let lines: string[] = [];
 	let searchTerm: string = '';
 	let selectedNode: string = '';
@@ -35,6 +38,7 @@
 		const logs = await getWorkflowNodeLogs(uid, nodeId);
 
 		if (logs) {
+			rawLogs = logs;
 			lines = logs.split('\n').reverse();
 		}
 	};
@@ -82,6 +86,14 @@
 			await refreshLogs(importantNode.id);
 		}
 	};
+
+	const copyLogToClipboard = async () => {
+		try {
+			await writeText(rawLogs);
+		} catch (e) {
+			await emit('error', e);
+		}
+	};
 </script>
 
 <Modal
@@ -107,6 +119,18 @@
 				class="w-1/4 tracking-wider"
 				bind:value={searchTerm}
 			/>
+			<Button
+				disabled={loading || rawLogs === ''}
+				on:click={() => copyLogToClipboard()}
+				class="px-3 py-2 focus:outline-none"
+			>
+				<FileCopySolid />
+			</Button>
+			<Tooltip
+				class="w-auto bg-secondary-600 dark:bg-space-800 font-semibold shadow-2xl"
+				placement="bottom"
+				>Copy entire log to clipboard
+			</Tooltip>
 		</div>
 		<div class="flex gap-2">
 			{#each filteredNodes as node}