From 34c39ce0abf291d612445bf32e6aa0552df7c2af Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Sun, 13 Oct 2024 01:30:01 +0200
Subject: [PATCH] nit closing flowgraph

---
 frontend/src/lib/components/copilot/StepGenQuick.svelte  | 9 ++++++++-
 .../lib/components/flows/map/InsertModuleButton.svelte   | 9 ++++++++-
 frontend/src/lib/components/graph/FlowGraphV2.svelte     | 2 +-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/components/copilot/StepGenQuick.svelte b/frontend/src/lib/components/copilot/StepGenQuick.svelte
index 86ca93251a..5cb15839ba 100644
--- a/frontend/src/lib/components/copilot/StepGenQuick.svelte
+++ b/frontend/src/lib/components/copilot/StepGenQuick.svelte
@@ -5,7 +5,7 @@
 	import { Wand2, Loader2 } from 'lucide-svelte'
 	import SearchItems from '../SearchItems.svelte'
 	import { emptyString } from '$lib/utils'
-	import { onMount } from 'svelte'
+	import { createEventDispatcher, onMount } from 'svelte'
 
 	export let funcDesc: string
 	export let trigger = false
@@ -17,6 +17,8 @@
 	export let filteredItems: (Script & { marked?: string })[] | (Item & { marked?: string })[] = []
 	$: prefilteredItems = scripts ?? []
 
+	const dispatch = createEventDispatcher()
+
 	async function loadScripts(): Promise<void> {
 		const loadedScripts = await ScriptService.listScripts({
 			workspace: $workspaceStore!,
@@ -53,6 +55,11 @@
 		<input
 			bind:this={input}
 			type="text"
+			on:keydown={(e) => {
+				if (e.key === 'Escape') {
+					dispatch('escape')
+				}
+			}}
 			bind:value={funcDesc}
 			placeholder="Search {trigger ? 'triggers' : 'scripts'} {disableAi ? '' : 'or AI gen'}"
 		/>
diff --git a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
index 9d00f9bbfe..a7bba251dc 100644
--- a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
+++ b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
@@ -95,7 +95,14 @@ shouldUsePortal={true} -->
 		role="none"
 	>
 		<div class="flex flex-row items-center gap-2">
-			<StepGenQuick {disableAi} on:insert bind:funcDesc {preFilter} {loading} />
+			<StepGenQuick
+				on:escape={() => close(null)}
+				{disableAi}
+				on:insert
+				bind:funcDesc
+				{preFilter}
+				{loading}
+			/>
 			{#if selectedKind != 'preprocessor' && selectedKind != 'flow'}
 				<ToggleHubWorkspaceQuick bind:selected={preFilter} />
 			{/if}
diff --git a/frontend/src/lib/components/graph/FlowGraphV2.svelte b/frontend/src/lib/components/graph/FlowGraphV2.svelte
index e4609f6d28..95bb0f64c8 100644
--- a/frontend/src/lib/components/graph/FlowGraphV2.svelte
+++ b/frontend/src/lib/components/graph/FlowGraphV2.svelte
@@ -267,7 +267,7 @@
 	{:else}
 		<SvelteFlow
 			on:paneclick={(e) => {
-				window.dispatchEvent(new Event('focus'))
+				document.dispatchEvent(new Event('focus'))
 			}}
 			{nodes}
 			{edges}