From 8f7aa84c2dbd27f2b403f167d66f4259747d5411 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Wed, 1 Nov 2023 20:19:18 +0100
Subject: [PATCH] fix aggrid table empty selected

---
 .../display/table/AppAggridTable.svelte       |  2 +-
 .../flows/content/FlowInputs.svelte           | 69 +++++++++++++++----
 .../flows/content/FlowModuleWrapper.svelte    |  6 +-
 .../lib/components/flows/flowStateUtils.ts    |  4 +-
 .../flows/header/FlowPreviewButtons.svelte    |  1 +
 .../flows/map/FlowModuleSchemaMap.svelte      | 26 +++----
 .../(root)/(logged)/flows/dev/+page.svelte    | 21 +++---
 7 files changed, 91 insertions(+), 38 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/display/table/AppAggridTable.svelte b/frontend/src/lib/components/apps/components/display/table/AppAggridTable.svelte
index 5352eaf357..623feeb0aa 100644
--- a/frontend/src/lib/components/apps/components/display/table/AppAggridTable.svelte
+++ b/frontend/src/lib/components/apps/components/display/table/AppAggridTable.svelte
@@ -38,7 +38,7 @@
 			: [{ error: 'input was not an array' }]
 		if (api && loaded) {
 			let selected = api.getSelectedNodes()
-			if (selected.length > 0) {
+			if (selected && selected.length > 0) {
 				let data = { ...selected[0].data }
 				delete data['__index']
 				outputs?.selectedRow?.set(data)
diff --git a/frontend/src/lib/components/flows/content/FlowInputs.svelte b/frontend/src/lib/components/flows/content/FlowInputs.svelte
index fa1a3b044c..05df2a0584 100644
--- a/frontend/src/lib/components/flows/content/FlowInputs.svelte
+++ b/frontend/src/lib/components/flows/content/FlowInputs.svelte
@@ -16,6 +16,7 @@
 
 	export let failureModule: boolean
 	export let shouldDisableTriggerScripts: boolean = false
+	export let noEditor: boolean
 	export let summary: string | undefined = undefined
 
 	const dispatch = createEventDispatcher()
@@ -77,41 +78,59 @@
 				reuse. You can always save an inline script to your workspace later.
 			</Tooltip>
 		</h3>
+
+		{#if noEditor}
+			<div
+				class="py-0.5 text-2xs {summary == undefined || summary == ''
+					? 'text-red-600'
+					: 'text-ternary'}"
+				>Pick a summary first, it will be used to create a separate file whose name will be derived
+				from the summary</div
+			>
+			<input class="w-full" type="text" bind:value={summary} placeholder="Summary" />
+			<div class="pb-2" />
+		{/if}
 		<div class="flex flex-row">
 			<div class="flex flex-row flex-wrap gap-2" id="flow-editor-action-script">
 				<FlowScriptPicker
+					disabled={noEditor && (summary == undefined || summary == '')}
 					label="TypeScript (Deno)"
 					lang={Script.language.DENO}
 					on:click={() => {
 						dispatch('new', {
 							language: RawScript.language.DENO,
 							kind,
-							subkind: 'flow'
+							subkind: 'flow',
+							summary
 						})
 					}}
 				/>
 
 				<FlowScriptPicker
+					disabled={noEditor && (summary == undefined || summary == '')}
 					label="Python"
 					lang={Script.language.PYTHON3}
 					on:click={() => {
 						dispatch('new', {
 							language: RawScript.language.PYTHON3,
 							kind,
-							subkind: 'flow'
+							subkind: 'flow',
+							summary
 						})
 					}}
 				/>
 
 				{#if kind != 'approval'}
 					<FlowScriptPicker
+						disabled={noEditor && (summary == undefined || summary == '')}
 						label="Go"
 						lang={Script.language.GO}
 						on:click={() => {
 							dispatch('new', {
 								language: RawScript.language.GO,
 								kind,
-								subkind: 'flow'
+								subkind: 'flow',
+								summary
 							})
 						}}
 					/>
@@ -119,88 +138,103 @@
 
 				{#if kind == 'script'}
 					<FlowScriptPicker
+						disabled={noEditor && (summary == undefined || summary == '')}
 						label="Bash"
 						lang={Script.language.BASH}
 						on:click={() => {
 							dispatch('new', {
 								language: RawScript.language.BASH,
 								kind,
-								subkind: 'flow'
+								subkind: 'flow',
+								summary
 							})
 						}}
 					/>
 
 					<FlowScriptPicker
+						disabled={noEditor && (summary == undefined || summary == '')}
 						label="REST"
 						lang={Script.language.NATIVETS}
 						on:click={() => {
 							dispatch('new', {
 								language: RawScript.language.NATIVETS,
 								kind,
-								subkind: 'flow'
+								subkind: 'flow',
+								summary
 							})
 						}}
 					/>
 
 					{#if !failureModule}
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="PostgreSQL"
 							lang={Script.language.POSTGRESQL}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.POSTGRESQL,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="MySQL"
 							lang={Script.language.MYSQL}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.MYSQL,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="BigQuery"
 							lang={Script.language.BIGQUERY}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.BIGQUERY,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="Snowflake"
 							lang={Script.language.SNOWFLAKE}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.SNOWFLAKE,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
 
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="GraphQL"
 							lang={Script.language.GRAPHQL}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.GRAPHQL,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
 
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label={`Docker`}
 							lang="docker"
 							on:click={() => {
@@ -219,18 +253,25 @@
 									)
 									return
 								}
-								dispatch('new', { language: RawScript.language.BASH, kind, subkind: 'docker' })
+								dispatch('new', {
+									language: RawScript.language.BASH,
+									kind,
+									subkind: 'docker',
+									summary
+								})
 							}}
 						/>
 
 						<FlowScriptPicker
+							disabled={noEditor && (summary == undefined || summary == '')}
 							label="PowerShell"
 							lang={Script.language.POWERSHELL}
 							on:click={() => {
 								dispatch('new', {
 									language: RawScript.language.POWERSHELL,
 									kind,
-									subkind: 'flow'
+									subkind: 'flow',
+									summary
 								})
 							}}
 						/>
@@ -245,13 +286,15 @@
 				{/if}
 
 				<FlowScriptPicker
+					disabled={noEditor && (summary == undefined || summary == '')}
 					label="TypeScript (Bun)"
 					lang={Script.language.BUN}
 					on:click={() => {
 						dispatch('new', {
 							language: RawScript.language.BUN,
 							kind,
-							subkind: 'flow'
+							subkind: 'flow',
+							summary
 						})
 					}}
 				/>
diff --git a/frontend/src/lib/components/flows/content/FlowModuleWrapper.svelte b/frontend/src/lib/components/flows/content/FlowModuleWrapper.svelte
index 4c62067b5a..a87e201fc6 100644
--- a/frontend/src/lib/components/flows/content/FlowModuleWrapper.svelte
+++ b/frontend/src/lib/components/flows/content/FlowModuleWrapper.svelte
@@ -62,6 +62,7 @@
 			/>
 		{:else}
 			<FlowInputs
+				{noEditor}
 				summary={flowModule.summary}
 				shouldDisableTriggerScripts={parentModule !== undefined ||
 					previousModule !== undefined ||
@@ -90,13 +91,14 @@
 					$flowStateStore[module.id] = state
 				}}
 				on:new={async ({ detail }) => {
-					const { language, kind, subkind } = detail
+					const { language, kind, subkind, summary } = detail
 
 					const [module, state] = await createInlineScriptModule(
 						language,
 						kind,
 						subkind,
-						flowModule.id
+						flowModule.id,
+						summary
 					)
 					scriptKind = kind
 					scriptTemplate = subkind
diff --git a/frontend/src/lib/components/flows/flowStateUtils.ts b/frontend/src/lib/components/flows/flowStateUtils.ts
index 80c1a9fcdf..67ed19c255 100644
--- a/frontend/src/lib/components/flows/flowStateUtils.ts
+++ b/frontend/src/lib/components/flows/flowStateUtils.ts
@@ -69,12 +69,14 @@ export async function createInlineScriptModule(
 	language: RawScript.language,
 	kind: Script.kind,
 	subkind: 'pgsql' | 'flow',
-	id: string
+	id: string,
+	summary?: string
 ): Promise<[FlowModule, FlowModuleState]> {
 	const code = initialCode(language, kind, subkind)
 
 	const flowModule: FlowModule = {
 		id,
+		summary,
 		value: { type: 'rawscript', content: code, language, input_transforms: {} }
 	}
 
diff --git a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
index 44ac05ee63..eb4be3c5c3 100644
--- a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
+++ b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
@@ -28,6 +28,7 @@
 			'settings-worker-group',
 			'settings-cache',
 			'settings-concurrency',
+			'settings-early-stop',
 			'inputs',
 			'schedules',
 			'failure',
diff --git a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
index 892ea5b499..c749346c0f 100644
--- a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
+++ b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
@@ -30,7 +30,7 @@
 
 	export let modules: FlowModule[] | undefined
 	export let sidebarSize: number | undefined = undefined
-	export let disableHeader = false
+	export let disableStaticInputs = false
 	export let disableTutorials = false
 	export let disableAi = false
 	export let smallErrorHandler = false
@@ -189,19 +189,19 @@
 	</ConfirmationModal>
 </Portal>
 <div class="flex flex-col h-full relative -pt-1">
-	{#if !disableHeader}
-		<div
-			class={`z-10 sticky inline-flex flex-col gap-2 top-0 bg-surface-secondary flex-initial p-2 items-center transition-colors duration-[400ms] ease-linear border-b ${
-				$copilotCurrentStepStore !== undefined ? 'border-gray-500/75' : ''
-			}`}
-		>
-			{#if $copilotCurrentStepStore !== undefined}
-				<div transition:fade class="absolute inset-0 bg-gray-500 bg-opacity-75 z-[900] !m-0" />
-			{/if}
-			<FlowSettingsItem />
+	<div
+		class={`z-10 sticky inline-flex flex-col gap-2 top-0 bg-surface-secondary flex-initial p-2 items-center transition-colors duration-[400ms] ease-linear border-b ${
+			$copilotCurrentStepStore !== undefined ? 'border-gray-500/75' : ''
+		}`}
+	>
+		{#if $copilotCurrentStepStore !== undefined}
+			<div transition:fade class="absolute inset-0 bg-gray-500 bg-opacity-75 z-[900] !m-0" />
+		{/if}
+		<FlowSettingsItem />
+		{#if !disableStaticInputs}
 			<FlowConstantsItem />
-		</div>
-	{/if}
+		{/if}
+	</div>
 
 	<div class="z-10 flex-auto grow" bind:clientHeight={minHeight}>
 		<FlowGraph
diff --git a/frontend/src/routes/(root)/(logged)/flows/dev/+page.svelte b/frontend/src/routes/(root)/(logged)/flows/dev/+page.svelte
index 4ffb68ae55..cae74ffa56 100644
--- a/frontend/src/routes/(root)/(logged)/flows/dev/+page.svelte
+++ b/frontend/src/routes/(root)/(logged)/flows/dev/+page.svelte
@@ -62,6 +62,7 @@
 		saveDraft: () => {},
 		initialPath: ''
 	})
+
 	type LastEdit = {
 		content: string
 		path: string
@@ -173,6 +174,16 @@
 			editor.setCode(JSON.stringify(flow, null, 4))
 		}
 	}
+
+	function updateFromCode(code: string) {
+		try {
+			if (!deepEqual(JSON.parse(code), $flowStore)) {
+				$flowStore = JSON.parse(code)
+			}
+		} catch (e) {
+			console.error('issue parsing new change:', code, e)
+		}
+	}
 </script>
 
 <svelte:window on:keydown={onKeyDown} />
@@ -186,14 +197,7 @@
 			code={initialCode}
 			lang="json"
 			on:change={(e) => {
-				const code = e.detail.code
-				try {
-					if (!deepEqual(JSON.parse(code), $flowStore)) {
-						$flowStore = JSON.parse(code)
-					}
-				} catch (e) {
-					console.error('issue parsing new change:', code, e)
-				}
+				updateFromCode(e.detail.code)
 			}}
 		/>
 		<div class="flex flex-col max-h-screen h-full relative">
@@ -208,6 +212,7 @@
 							disableAi
 							disableTutorials
 							smallErrorHandler={true}
+							disableStaticInputs
 						/>
 					{:else}
 						<div class="text-red-400 mt-20">Missing flow modules</div>