From 0902bec9827997d68081afb6ef3bd94fffd31148 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Thu, 10 Oct 2024 00:04:25 +0200
Subject: [PATCH] fix: remove monaco-editor for app preview code path for
 faster app loads

---
 .../src/lib/components/flows/header/FlowYamlEditor.svelte | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/flows/header/FlowYamlEditor.svelte b/frontend/src/lib/components/flows/header/FlowYamlEditor.svelte
index e1f268c738..0409aaee63 100644
--- a/frontend/src/lib/components/flows/header/FlowYamlEditor.svelte
+++ b/frontend/src/lib/components/flows/header/FlowYamlEditor.svelte
@@ -6,9 +6,9 @@
 	import { filteredContentForExport } from '../utils'
 	import YAML from 'yaml'
 
-	import SimpleEditor from '$lib/components/SimpleEditor.svelte'
 	import { Button } from '$lib/components/common'
 	import { sendUserToast } from '$lib/toast'
+	import { Loader2 } from 'lucide-svelte'
 
 	const { flowStore } = getContext<FlowEditorContext>('FlowEditorContext')
 
@@ -56,7 +56,11 @@
 		</svelte:fragment>
 
 		{#if $flowStore}
-			<SimpleEditor autoHeight bind:code lang="yaml" />
+			{#await import('../../SimpleEditor.svelte')}
+				<Loader2 class="animate-spin" />
+			{:then Module}
+				<Module.default autoHeight bind:code lang="yaml" />
+			{/await}
 		{/if}
 	</DrawerContent>
 </Drawer>