From ae3ef61e2ca670a1b95ce7dfa81f07663fcb3eb9 Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Tue, 25 Apr 2023 15:46:45 +0200
Subject: [PATCH] fix(frontend): Fix frontend script (#1476)

* fix(frontend): fix frontend script intendation

* feat(frontend): wip

* feat(frontend): fix reload all

* feat(frontend): add missing donePromise call

* feat(frontend): move donePromise in setResult

* feat(frontend): revert refresh
---
 .../helpers/RunnableComponent.svelte           |  4 +++-
 .../apps/editor/RecomputeAllComponents.svelte  | 10 +++++++---
 .../EmptyInlineScript.svelte                   | 18 +++++++++---------
 .../triggerLists/ComponentTriggerList.svelte   |  5 +++++
 .../triggerLists/TriggerBadgesList.svelte      |  3 ++-
 frontend/src/lib/script_helpers.ts             |  2 +-
 6 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
index b4a095e2f9..01527d1faf 100644
--- a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
+++ b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
@@ -74,6 +74,7 @@
 			loading = false
 			rejectCb(new Error('Canceled'))
 		}
+
 		return p as CancelablePromise<void>
 	}
 
@@ -350,6 +351,8 @@
 			delete $errorByComponent[previousJobId]
 			$errorByComponent = $errorByComponent
 		}
+
+		donePromise?.()
 	}
 
 	function handleInputClick(e: CustomEvent) {
@@ -389,7 +392,6 @@
 			if (startedAt > lastStartedAt) {
 				lastStartedAt = startedAt
 				setResult(e.detail.result)
-				donePromise?.()
 			}
 		}
 		loading = false
diff --git a/frontend/src/lib/components/apps/editor/RecomputeAllComponents.svelte b/frontend/src/lib/components/apps/editor/RecomputeAllComponents.svelte
index a00a2f6650..e40e42bc1e 100644
--- a/frontend/src/lib/components/apps/editor/RecomputeAllComponents.svelte
+++ b/frontend/src/lib/components/apps/editor/RecomputeAllComponents.svelte
@@ -46,17 +46,21 @@
 			isFirstLoad = true
 		}
 		loading = true
-		Promise.all(
-			Object.keys($runnableComponents).map((id) => {
+
+		const promises = Object.keys($runnableComponents)
+			.map((id) => {
 				if (
 					!$runnableComponents?.[id]?.autoRefresh &&
 					(!isFirstLoad || !$runnableComponents?.[id]?.refreshOnStart)
 				) {
 					return
 				}
+
 				return $runnableComponents?.[id]?.cb?.()
 			})
-		).finally(() => {
+			.filter(Boolean)
+
+		Promise.all(promises).finally(() => {
 			loading = false
 		})
 	}
diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte
index 3504611784..93bcb0a8eb 100644
--- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte
+++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte
@@ -217,15 +217,15 @@
 					on:click={() => {
 						const newInlineScript = {
 							content: `// read outputs and ctx
-				console.log(ctx.email)
-				
-				// access a global state store
-				if (!state.foo) { state.foo = 0 }
-				state.foo += 1
-				
-				// you can also navigate (goto), recompute a script (recompute), or set a tab (setTab)
-				
-				return state.foo`,
+console.log(ctx.email)
+
+// access a global state store
+if (!state.foo) { state.foo = 0 }
+state.foo += 1
+
+// you can also navigate (goto), recompute a script (recompute), or set a tab (setTab)
+
+return state.foo`,
 							language: 'frontend',
 							path: 'frontend script',
 							schema: undefined
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte
index dc0f043f6a..f606384b69 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte
@@ -35,5 +35,10 @@
 	{onLoad}
 	{recomputeOnInputChanged}
 	id={$selectedComponent?.[0]}
+	shouldHideAddDependencyButton={[
+		'buttoncomponent',
+		'formcomponent',
+		'formbuttoncomponent'
+	].includes(appComponent.type)}
 	{onClick}
 />
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte
index ee3fa582ef..51966aae71 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte
@@ -12,6 +12,7 @@
 	export let onLoad: boolean = false
 	export let id: string | undefined = undefined
 	export let recomputeOnInputChanged: boolean = false
+	export let shouldHideAddDependencyButton: boolean = false
 
 	const colors = {
 		green: 'text-green-800 border-green-600 bg-green-100',
@@ -133,7 +134,7 @@
 		<div class="w-full">
 			<div class="flex justify-between items-center">
 				<div class="text-xs font-semibold text-slate-800 mb-1">Change on values</div>
-				{#if inlineScript?.language === 'frontend'}
+				{#if inlineScript?.language === 'frontend' && !shouldHideAddDependencyButton}
 					<Button
 						variant="border"
 						size="xs"
diff --git a/frontend/src/lib/script_helpers.ts b/frontend/src/lib/script_helpers.ts
index 8aef2fe686..09408857c2 100644
--- a/frontend/src/lib/script_helpers.ts
+++ b/frontend/src/lib/script_helpers.ts
@@ -139,7 +139,7 @@ export async function main(
 
 export const FETCH_INIT_CODE = `export async function main(
 	url: string | undefined,
-	method: string = 'GET',
+	method: 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH' | 'OPTIONS' = 'GET',
 	body: Object = {},
 	headers: Record<string, string> = {}
 ): Promise<Response | null> {