From 70ca6527f6de92136b0e56f0f9c9760058104dce Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Sun, 6 Oct 2024 01:27:21 -0700
Subject: [PATCH] enh: copy artifacts

---
 src/lib/components/chat/Artifacts.svelte | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/chat/Artifacts.svelte b/src/lib/components/chat/Artifacts.svelte
index 6df05ade0..5e4699a54 100644
--- a/src/lib/components/chat/Artifacts.svelte
+++ b/src/lib/components/chat/Artifacts.svelte
@@ -6,7 +6,7 @@
 
 	import { showArtifacts, showControls } from '$lib/stores';
 	import XMark from '../icons/XMark.svelte';
-	import { createMessagesList } from '$lib/utils';
+	import { copyToClipboard, createMessagesList } from '$lib/utils';
 
 	export let overlay = false;
 	export let history;
@@ -15,6 +15,7 @@
 	let contents: Array<{ content: string }> = [];
 	let selectedContentIdx = 0;
 
+	let copied = false;
 	let iframeElement: HTMLIFrameElement;
 
 	$: if (history) {
@@ -239,6 +240,20 @@
 					</button>
 				</div>
 			</div>
+
+			<div>
+				<button
+					class="copy-code-button bg-none border-none text-xs bg-gray-50 hover:bg-gray-100 dark:bg-gray-850 dark:hover:bg-gray-800 transition rounded-md px-1.5 py-0.5"
+					on:click={() => {
+						copyToClipboard(contents[selectedContentIdx].content);
+						copied = true;
+
+						setTimeout(() => {
+							copied = false;
+						}, 2000);
+					}}>{copied ? $i18n.t('Copied') : $i18n.t('Copy')}</button
+				>
+			</div>
 		</div>
 	{/if}
 </div>