From 8bc7ee50bf72f745df530182a09ecb6bfc9aa328 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Sun, 20 Aug 2023 12:11:43 +0200
Subject: [PATCH] add copy to clipboard to display result

---
 frontend/src/lib/components/ArgInfo.svelte       |  2 +-
 frontend/src/lib/components/DisplayResult.svelte | 16 +++++++++++++++-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/ArgInfo.svelte b/frontend/src/lib/components/ArgInfo.svelte
index 9bc252684d..52138b045c 100644
--- a/frontend/src/lib/components/ArgInfo.svelte
+++ b/frontend/src/lib/components/ArgInfo.svelte
@@ -30,7 +30,7 @@
 				color="light"
 				size="xs"
 			>
-				<div class="flex gap-2 items-center">Copy to clipboard <ClipboardCopy /> </div>
+				<div class="flex gap-2 items-center">Copy <ClipboardCopy /> </div>
 			</Button>
 		</svelte:fragment>
 		{#if isString(jsonViewerContent)}
diff --git a/frontend/src/lib/components/DisplayResult.svelte b/frontend/src/lib/components/DisplayResult.svelte
index 986f131c67..ece57a43f0 100644
--- a/frontend/src/lib/components/DisplayResult.svelte
+++ b/frontend/src/lib/components/DisplayResult.svelte
@@ -137,7 +137,8 @@
 				class="mb-2 w-full text-sm relative"
 				>The result keys are: <b>{truncate(Object.keys(result).join(', '), 50)}</b>
 				{#if !disableExpand}
-					<div class="text-tertiary text-xs absolute top-5.5 right-0">
+					<div class="text-tertiary text-xs absolute top-5.5 right-0 inline-flex gap-2">
+						<button on:click={() => copyToClipboard(jsonStr)}><ClipboardCopy size={16} /></button>
 						<button on:click={jsonViewer.openDrawer}><Expand size={16} /></button>
 					</div>
 				{/if}
@@ -280,6 +281,13 @@
 				<ObjectViewer json={result} />
 			{:else}
 				<Highlight language={json} code={jsonStr} />
+				{#if typeof result == 'string'}
+					<div class="flex">
+						<Button size="xs" on:click={() => copyToClipboard(result)} color="light">
+							<div class="flex gap-2 items-center">Copy <ClipboardCopy size={12} /> </div>
+						</Button>
+					</div>
+				{/if}
 			{/if}
 		{/if}
 	{:else}
@@ -313,7 +321,13 @@
 						JSON is too large to be displayed in full.
 					</div>
 				{:else}
+					FOO
 					<Highlight language={json} code={jsonStr.replace(/\\n/g, '\n')} />
+					{#if typeof result == 'string'}
+						<Button on:click={() => copyToClipboard(result)} color="light" size="xs">
+							<div class="flex gap-2 items-center">Copy <ClipboardCopy /> </div>
+						</Button>
+					{/if}
 				{/if}
 			</DrawerContent>
 		</Drawer>