From 630ae7ec4b243e41d841bdae41c1c87b0fda5a82 Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Wed, 8 May 2024 14:36:33 +0200
Subject: [PATCH] feat(frontend): Add a button tocopy the path of a subflow
 (#3691)

---
 .../lib/components/FlowGraphViewerStep.svelte | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/src/lib/components/FlowGraphViewerStep.svelte b/frontend/src/lib/components/FlowGraphViewerStep.svelte
index 21675d3eb6..813d31b0c7 100644
--- a/frontend/src/lib/components/FlowGraphViewerStep.svelte
+++ b/frontend/src/lib/components/FlowGraphViewerStep.svelte
@@ -10,11 +10,12 @@
 	import FlowPathViewer from './flows/content/FlowPathViewer.svelte'
 	import SchemaViewer from './SchemaViewer.svelte'
 	import { scriptPathToHref } from '$lib/scripts'
-	import { cleanExpr } from '$lib/utils'
+	import { cleanExpr, copyToClipboard } from '$lib/utils'
 	import { hubBaseUrlStore } from '$lib/stores'
 
 	import { twMerge } from 'tailwind-merge'
 	import FlowModuleScript from './flows/content/FlowModuleScript.svelte'
+	import { Copy } from 'lucide-svelte'
 
 	export let flow: {
 		summary: string
@@ -212,6 +213,23 @@
 				{/each}
 			</div>
 		{:else if stepDetail.value.type == 'flow'}
+			<div class="text-sm mb-1 flex justify-end flex-row">
+				<Button
+					size="xs2"
+					startIcon={{ icon: Copy }}
+					color="light"
+					on:click={() => {
+						if (typeof stepDetail !== 'string') {
+							const val = stepDetail?.value
+							if (val?.type == 'flow') {
+								copyToClipboard(val.path)
+							}
+						}
+					}}
+				>
+					Copy path
+				</Button>
+			</div>
 			<FlowPathViewer noSide path={stepDetail.value.path} />
 		{/if}
 	{:else}