From a20d3fae6fed85a67e72b2bbd4d37d8d6f3cea2f Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Fri, 30 Dec 2022 05:31:32 +0100
Subject: [PATCH] feat: add a All Static Inputs module to the flow editor

---
 .../lib/components/InputTransformForm.svelte  | 162 ++++++++++--------
 frontend/src/lib/components/Popover.svelte    |   2 +-
 frontend/src/lib/components/SchemaForm.svelte |  88 +++++-----
 .../src/lib/components/TemplateEditor.svelte  |   2 +-
 .../flows/content/FlowConstants.svelte        |  68 ++++++++
 .../flows/content/FlowEditorPanel.svelte      |   3 +
 .../flows/content/FlowModuleHeader.svelte     |   8 +-
 .../flows/header/FlowPreviewButtons.svelte    |   3 +-
 .../flows/map/FlowConstantsItem.svelte        |  22 +++
 .../flows/map/FlowInputsItem.svelte           |   3 +-
 .../flows/map/FlowModuleSchemaMap.svelte      |  13 +-
 .../flows/map/FlowSettingsItem.svelte         |   4 +-
 12 files changed, 247 insertions(+), 131 deletions(-)
 create mode 100644 frontend/src/lib/components/flows/content/FlowConstants.svelte
 create mode 100644 frontend/src/lib/components/flows/map/FlowConstantsItem.svelte

diff --git a/frontend/src/lib/components/InputTransformForm.svelte b/frontend/src/lib/components/InputTransformForm.svelte
index c236372d9a..a089b1b530 100644
--- a/frontend/src/lib/components/InputTransformForm.svelte
+++ b/frontend/src/lib/components/InputTransformForm.svelte
@@ -27,7 +27,7 @@
 	export let pickForField: string | undefined = undefined
 	export let variableEditor: VariableEditor | undefined = undefined
 	export let itemPicker: ItemPicker | undefined = undefined
-	export let noVariablePicker = false
+	export let noDynamicToggle = false
 
 	let monaco: SimpleEditor | undefined = undefined
 	let monacoTemplate: TemplateEditor | undefined = undefined
@@ -113,7 +113,7 @@
 
 	const { focusProp, propPickerConfig } = getContext<PropPickerWrapperContext>('PropPickerWrapper')
 
-	$: isStaticTemplate(inputCat) && propertyType == 'static' && setPropertyType(arg.value)
+	$: isStaticTemplate(inputCat) && propertyType == 'static' && setPropertyType(arg?.value)
 	const openBracket = '${'
 	const closeBracket = '}'
 </script>
@@ -141,75 +141,83 @@
 				</span>
 			{/if}
 		</div>
-		<div class="flex flex-row gap-x-4 gap-y-1 flex-wrap">
-			<ToggleButtonGroup
-				bind:selected={propertyType}
-				on:selected={(e) => {
-					const staticTemplate = isStaticTemplate(inputCat)
-					if (e.detail === 'javascript') {
-						if (arg.expr == undefined) {
-							arg.expr = getDefaultExpr(
-								argName,
-								previousModuleId,
-								staticTemplate
-									? `\`${arg.value ?? ''}\``
-									: arg.value
-									? JSON.stringify(arg.value, null, 4)
-									: ''
-							)
-						}
-
-						arg.value = undefined
-						propertyType = 'javascript'
-						arg.type = 'javascript'
-					} else {
-						if (staticTemplate) {
-							arg.value = codeToStaticTemplate(arg.expr)
-							setPropertyType(arg.value)
+		{#if !noDynamicToggle}
+			<div class="flex flex-row gap-x-4 gap-y-1 flex-wrap">
+				<ToggleButtonGroup
+					bind:selected={propertyType}
+					on:selected={(e) => {
+						const staticTemplate = isStaticTemplate(inputCat)
+						if (e.detail === 'javascript') {
+							if (arg.expr == undefined) {
+								arg.expr = getDefaultExpr(
+									argName,
+									previousModuleId,
+									staticTemplate
+										? `\`${arg?.value ?? ''}\``
+										: arg.value
+										? JSON.stringify(arg?.value, null, 4)
+										: ''
+								)
+							}
+							if (arg) {
+								arg.value = undefined
+							}
+							propertyType = 'javascript'
+							arg.type = 'javascript'
 						} else {
-							arg.type = 'static'
-							arg.value = undefined
-							arg.expr = undefined
+							if (staticTemplate) {
+								if (arg) {
+									arg.value = codeToStaticTemplate(arg.expr)
+								}
+								setPropertyType(arg?.value)
+							} else {
+								if (arg) {
+									arg.type = 'static'
+									arg.value = undefined
+									arg.expr = undefined
+								}
+							}
+							propertyType = 'static'
 						}
-						propertyType = 'static'
-					}
-				}}
-			>
-				{#if isStaticTemplate(inputCat)}
-					<ToggleButton light position="left" value="static" size="xs">
-						{'${} '}Templatable &nbsp; <Tooltip
-							>Write javascript expressions between "{openBracket}" and "{closeBracket}". You may
-							refer to contextual objects like 'flow_input', or 'result' or functions like
-							'resource' and 'variable'
-						</Tooltip></ToggleButton
-					>
-				{:else}
-					<ToggleButton light position="left" value="static" size="xs">Static</ToggleButton>
-				{/if}
-
-				<ToggleButton
-					light
-					position="right"
-					value="javascript"
-					startIcon={{ icon: faCode }}
-					size="xs"
+					}}
 				>
-					Dynamic (JS)
-				</ToggleButton>
-			</ToggleButtonGroup>
-			<Button
-				variant="contained"
-				color="blue"
-				size="xs"
-				on:click={() => {
-					focusProp(argName, 'connect', (path) => {
-						connectProperty(path)
-						return true
-					})
-				}}>Connect &rightarrow;</Button
-			>
-		</div>
+					{#if isStaticTemplate(inputCat)}
+						<ToggleButton light position="left" value="static" size="xs">
+							{'${} '}Templatable &nbsp; <Tooltip
+								>Write javascript expressions between "{openBracket}" and "{closeBracket}". You may
+								refer to contextual objects like 'flow_input', or 'result' or functions like
+								'resource' and 'variable'
+							</Tooltip></ToggleButton
+						>
+					{:else}
+						<ToggleButton light position="left" value="static" size="xs">Static</ToggleButton>
+					{/if}
+
+					<ToggleButton
+						light
+						position="right"
+						value="javascript"
+						startIcon={{ icon: faCode }}
+						size="xs"
+					>
+						Dynamic (JS)
+					</ToggleButton>
+				</ToggleButtonGroup>
+				<Button
+					variant="contained"
+					color="blue"
+					size="xs"
+					on:click={() => {
+						focusProp(argName, 'connect', (path) => {
+							connectProperty(path)
+							return true
+						})
+					}}>Connect &rightarrow;</Button
+				>
+			</div>
+		{/if}
 	</div>
+
 	<div class="max-w-xs" />
 
 	<div
@@ -224,15 +232,17 @@
 				Connect input &rightarrow;
 			</span>
 		{/if}
-		{#if isStaticTemplate(inputCat) && propertyType == 'static'}
-			<div class="py-1 rounded border border-1 border-gray-500">
-				<TemplateEditor
-					bind:this={monacoTemplate}
-					{extraLib}
-					on:focus={onFocus}
-					bind:code={arg.value}
-					fontSize={12}
-				/>
+		{#if isStaticTemplate(inputCat) && propertyType == 'static' && !noDynamicToggle}
+			<div class="py-1 mt-2 min-h-[28px] rounded border border-1 border-gray-500">
+				{#if arg}
+					<TemplateEditor
+						bind:this={monacoTemplate}
+						{extraLib}
+						on:focus={onFocus}
+						bind:code={arg.value}
+						fontSize={14}
+					/>
+				{/if}
 			</div>
 		{:else if propertyType === undefined || propertyType == 'static'}
 			<ArgInput
diff --git a/frontend/src/lib/components/Popover.svelte b/frontend/src/lib/components/Popover.svelte
index d18a838809..94e78dbd2d 100644
--- a/frontend/src/lib/components/Popover.svelte
+++ b/frontend/src/lib/components/Popover.svelte
@@ -55,7 +55,7 @@
 		use:popperContent={extraOpts}
 		on:mouseenter={open}
 		on:mouseleave={close}
-		class="z-50 text-sm font-normal text-gray-300 bg-gray-800 py-2 px-3 rounded-md 
+		class="z-50  py-2 px-3 rounded-md  text-sm font-normal !text-gray-300 bg-gray-800
 		whitespace-normal text-left {$$props.class}"
 	>
 		<div class="max-w-sm">
diff --git a/frontend/src/lib/components/SchemaForm.svelte b/frontend/src/lib/components/SchemaForm.svelte
index 7d11e26a1b..3337c1780f 100644
--- a/frontend/src/lib/components/SchemaForm.svelte
+++ b/frontend/src/lib/components/SchemaForm.svelte
@@ -26,6 +26,8 @@
 	export let compact = false
 	export let password: string | undefined = undefined
 	export let noVariablePicker = false
+	export let filter: string[] | undefined = undefined
+	export let noDynamicToggle = false
 
 	let clazz: string = ''
 	export { clazz as class }
@@ -56,48 +58,50 @@
 <div class="w-full {clazz}">
 	{#if Object.keys(schema?.properties ?? {}).length > 0}
 		{#each Object.keys(schema?.properties ?? {}) as argName, i (argName)}
-			<div transition:slide|local>
-				{#if inputTransform}
-					<InputTransformForm
-						{previousModuleId}
-						bind:arg={args[argName]}
-						bind:schema
-						bind:argName
-						bind:inputCheck={inputCheck[argName]}
-						bind:extraLib
-						{variableEditor}
-						{itemPicker}
-						{noVariablePicker}
-						bind:pickForField
-					/>
-				{:else if typeof args == 'object'}
-					<ArgInput
-						autofocus={i == 0 && autofocus}
-						label={argName}
-						bind:description={schema.properties[argName].description}
-						bind:value={args[argName]}
-						type={schema.properties[argName].type}
-						required={schema.required.includes(argName)}
-						bind:pattern={schema.properties[argName].pattern}
-						bind:valid={inputCheck[argName]}
-						defaultValue={schema.properties[argName].default}
-						bind:enum_={schema.properties[argName].enum}
-						bind:format={schema.properties[argName].format}
-						contentEncoding={schema.properties[argName].contentEncoding}
-						properties={schema.properties[argName].properties}
-						bind:itemsType={schema.properties[argName].items}
-						disabled={disabledArgs.includes(argName) || disabled}
-						{editableSchema}
-						{compact}
-						password={argName == password}
-						{variableEditor}
-						{itemPicker}
-						bind:pickForField
-					/>
-				{:else}
-					Expected argument to be an object, got {JSON.stringify(args)} instead
-				{/if}
-			</div>
+			{#if !filter || filter.includes(argName)}
+				<div transition:slide|local>
+					{#if inputTransform}
+						<InputTransformForm
+							{previousModuleId}
+							bind:arg={args[argName]}
+							bind:schema
+							bind:argName
+							bind:inputCheck={inputCheck[argName]}
+							bind:extraLib
+							{variableEditor}
+							{itemPicker}
+							bind:pickForField
+							{noDynamicToggle}
+						/>
+					{:else if typeof args == 'object'}
+						<ArgInput
+							autofocus={i == 0 && autofocus}
+							label={argName}
+							bind:description={schema.properties[argName].description}
+							bind:value={args[argName]}
+							type={schema.properties[argName].type}
+							required={schema.required.includes(argName)}
+							bind:pattern={schema.properties[argName].pattern}
+							bind:valid={inputCheck[argName]}
+							defaultValue={schema.properties[argName].default}
+							bind:enum_={schema.properties[argName].enum}
+							bind:format={schema.properties[argName].format}
+							contentEncoding={schema.properties[argName].contentEncoding}
+							properties={schema.properties[argName].properties}
+							bind:itemsType={schema.properties[argName].items}
+							disabled={disabledArgs.includes(argName) || disabled}
+							{editableSchema}
+							{compact}
+							password={argName == password}
+							{variableEditor}
+							{itemPicker}
+							bind:pickForField
+						/>
+					{:else}
+						Expected argument to be an object, got {JSON.stringify(args)} instead
+					{/if}
+				</div>
+			{/if}
 		{/each}
 	{:else if !shouldHideNoInputs}
 		<div class="text-gray-500 text-sm">No inputs</div>
diff --git a/frontend/src/lib/components/TemplateEditor.svelte b/frontend/src/lib/components/TemplateEditor.svelte
index 1e25091ed8..493e4a5f10 100644
--- a/frontend/src/lib/components/TemplateEditor.svelte
+++ b/frontend/src/lib/components/TemplateEditor.svelte
@@ -423,7 +423,7 @@
 			lineNumbers: 'off',
 			fontSize,
 			suggestOnTriggerCharacters: true,
-			lineDecorationsWidth: 20
+			lineDecorationsWidth: 24
 		})
 
 		const stdLib = { content: libStdContent, filePath: 'es5.d.ts' }
diff --git a/frontend/src/lib/components/flows/content/FlowConstants.svelte b/frontend/src/lib/components/flows/content/FlowConstants.svelte
new file mode 100644
index 0000000000..12ccf88fa0
--- /dev/null
+++ b/frontend/src/lib/components/flows/content/FlowConstants.svelte
@@ -0,0 +1,68 @@
+<script lang="ts">
+	import { flowStore } from '$lib/components/flows/flowStore'
+
+	import FlowCard from '../common/FlowCard.svelte'
+
+	import { Alert, Badge } from '$lib/components/common'
+	import type { FlowModule, FlowModuleValue, InputTransform, PathScript, RawScript } from '$lib/gen'
+	import SchemaForm from '$lib/components/SchemaForm.svelte'
+	import { flowStateStore } from '../flowState'
+	import { setContext } from 'svelte'
+	import type { PropPickerWrapperContext } from '../propPicker/PropPickerWrapper.svelte'
+	import { writable } from 'svelte/store'
+
+	$: steps = (
+		$flowStore.value.modules
+			.map((x) => [x.value, x] as [FlowModuleValue, FlowModule])
+			.filter((x) => x[0].type == 'script' || x[0].type == 'rawscript') as [
+			PathScript | RawScript,
+			FlowModule
+		][]
+	).map(
+		([v, m]) =>
+			[
+				v.input_transforms,
+				Object.entries(v.input_transforms)
+					.filter((x) => x[1].type == 'static')
+					.map((x) => x[0]),
+				m
+			] as [Record<string, InputTransform>, string[], FlowModule]
+	)
+
+	setContext<PropPickerWrapperContext>('PropPickerWrapper', {
+		focusProp: () => {},
+		propPickerConfig: writable(undefined),
+		clearFocus: () => {}
+	})
+</script>
+
+<div class="h-full overflow-hidden">
+	<FlowCard title="All Static Inputs">
+		<div class="h-full flex-1">
+			<Alert type="info" title="Static Inputs"
+				>This page centralizes the static inputs of every steps. It is akin to a file containing all
+				constants. Modifying a value here modify it in the step input directly. It is especially
+				useful when forking a flow to get an overview of all the variables to parametrize that are
+				not exposed directly as flow inputs.</Alert
+			>
+			{#each steps as [args, filter, m] (m.id)}
+				{#if filter.length > 0}
+					<div class="box">
+						<h2 class="pb-4 inline-flex items-center"
+							><span class="mr-4">{m.summary || m.value['path'] || 'Inline script'}</span>
+							<Badge large color="indigo">{m.id}</Badge>
+						</h2>
+
+						<SchemaForm
+							noDynamicToggle
+							inputTransform
+							{filter}
+							schema={$flowStateStore[m.id]?.schema ?? {}}
+							bind:args
+						/>
+					</div>
+				{/if}
+			{/each}
+		</div>
+	</FlowCard>
+</div>
diff --git a/frontend/src/lib/components/flows/content/FlowEditorPanel.svelte b/frontend/src/lib/components/flows/content/FlowEditorPanel.svelte
index d6bc942499..f7b1ef1ee0 100644
--- a/frontend/src/lib/components/flows/content/FlowEditorPanel.svelte
+++ b/frontend/src/lib/components/flows/content/FlowEditorPanel.svelte
@@ -7,6 +7,7 @@
 	import FlowInput from './FlowInput.svelte'
 	import FlowFailureModule from './FlowFailureModule.svelte'
 	import { flowStore } from '../flowStore'
+	import FlowConstants from './FlowConstants.svelte'
 
 	export let initialPath: string
 
@@ -17,6 +18,8 @@
 	<FlowSettings {initialPath} />
 {:else if $selectedId === 'inputs'}
 	<FlowInput />
+{:else if $selectedId === 'constants'}
+	<FlowConstants />
 {:else if $selectedId === 'failure'}
 	<FlowFailureModule />
 {:else}
diff --git a/frontend/src/lib/components/flows/content/FlowModuleHeader.svelte b/frontend/src/lib/components/flows/content/FlowModuleHeader.svelte
index f43eb9e4c7..c74b67959b 100644
--- a/frontend/src/lib/components/flows/content/FlowModuleHeader.svelte
+++ b/frontend/src/lib/components/flows/content/FlowModuleHeader.svelte
@@ -20,7 +20,7 @@
 <div class="flex flex-row space-x-2" bind:clientWidth={width}>
 	{#if module.value.type === 'script' || module.value.type === 'rawscript'}
 		<Popover
-			class="center-center rounded border p-2 duration-200
+			class="center-center rounded border p-2 
 			{moduleRetry
 				? 'bg-blue-100 text-blue-800 border-blue-300 hover:bg-blue-200'
 				: 'bg-white text-gray-800 border-gray-300 hover:bg-gray-100'}"
@@ -30,7 +30,7 @@
 			<svelte:fragment slot="text">Retries</svelte:fragment>
 		</Popover>
 		<Popover
-			class="center-center rounded border p-2 duration-200
+			class="center-center rounded border p-2
 			{module.stop_after_if
 				? 'bg-blue-100 text-blue-800 border-blue-300 hover:bg-blue-200'
 				: 'bg-white text-gray-800 border-gray-300 hover:bg-gray-100'}"
@@ -40,7 +40,7 @@
 			<svelte:fragment slot="text">Early stop/break</svelte:fragment>
 		</Popover>
 		<Popover
-			class="center-center rounded border p-2 duration-200
+			class="center-center rounded border p-2 
 			{module.suspend
 				? 'bg-blue-100 text-blue-800 border-blue-300 hover:bg-blue-200'
 				: 'bg-white text-gray-800 border-gray-300 hover:bg-gray-100'}"
@@ -50,7 +50,7 @@
 			<svelte:fragment slot="text">Suspend</svelte:fragment>
 		</Popover>
 		<Popover
-			class="center-center rounded border p-2 duration-200
+			class="center-center rounded border p-2
 			{module.sleep
 				? 'bg-blue-100 text-blue-800 border-blue-300 hover:bg-blue-200'
 				: 'bg-white text-gray-800 border-gray-300 hover:bg-gray-100'}"
diff --git a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
index c904626dc8..a1893fdb66 100644
--- a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
+++ b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte
@@ -27,7 +27,8 @@
 			'settings-graph',
 			'inputs',
 			'schedules',
-			'failure'
+			'failure',
+			'constants'
 		].includes($selectedId) ||
 		$selectedId?.includes('branch')
 
diff --git a/frontend/src/lib/components/flows/map/FlowConstantsItem.svelte b/frontend/src/lib/components/flows/map/FlowConstantsItem.svelte
new file mode 100644
index 0000000000..c7453e2ad5
--- /dev/null
+++ b/frontend/src/lib/components/flows/map/FlowConstantsItem.svelte
@@ -0,0 +1,22 @@
+<script lang="ts">
+	import type { FlowEditorContext } from '../types'
+	import { getContext } from 'svelte'
+	import Icon from 'svelte-awesome'
+	import { faDollarSign } from '@fortawesome/free-solid-svg-icons'
+	import { classNames } from '$lib/utils'
+
+	const { select, selectedId } = getContext<FlowEditorContext>('FlowEditorContext')
+
+	$: settingsClass = classNames(
+		'border w-full rounded-sm p-2 bg-white border-gray-400 text-sm cursor-pointer flex items-center',
+		$selectedId == 'constants' ? 'outline outline-offset-1 outline-2  outline-slate-900' : ''
+	)
+</script>
+
+<!-- svelte-ignore a11y-click-events-have-key-events -->
+<div on:click={() => select('constants')} class={settingsClass}>
+	<Icon data={faDollarSign} class="mr-2" />
+	<span class="text-xs flex flex-row justify-between w-full gap-2 items-center truncate">
+		All Static Inputs
+	</span>
+</div>
diff --git a/frontend/src/lib/components/flows/map/FlowInputsItem.svelte b/frontend/src/lib/components/flows/map/FlowInputsItem.svelte
index 950c7d40a2..c9e753199d 100644
--- a/frontend/src/lib/components/flows/map/FlowInputsItem.svelte
+++ b/frontend/src/lib/components/flows/map/FlowInputsItem.svelte
@@ -3,14 +3,13 @@
 	import { getContext } from 'svelte'
 	import FlowModuleSchemaItem from './FlowModuleSchemaItem.svelte'
 	import Icon from 'svelte-awesome'
-	import { faFlagCheckered, faPen } from '@fortawesome/free-solid-svg-icons'
+	import { faFlagCheckered } from '@fortawesome/free-solid-svg-icons'
 
 	const { select, selectedId } = getContext<FlowEditorContext>('FlowEditorContext')
 </script>
 
 <FlowModuleSchemaItem
 	on:click={() => select('inputs')}
-	isFirst
 	hasLine
 	selected={$selectedId === 'inputs'}
 	bold
diff --git a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
index fb4178bb41..a1bf0af859 100644
--- a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
+++ b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
@@ -19,6 +19,10 @@
 	import FlowInputsItem from './FlowInputsItem.svelte'
 	import InsertModuleButton from './InsertModuleButton.svelte'
 	import { slide } from 'svelte/transition'
+	import FlowModuleSchemaItem from './FlowModuleSchemaItem.svelte'
+	import { Icon } from 'svelte-awesome'
+	import { faDollarSign } from '@fortawesome/free-solid-svg-icons'
+	import FlowConstantsItem from './FlowConstantsItem.svelte'
 
 	export let root: boolean = false
 	export let modules: FlowModule[] | undefined
@@ -102,12 +106,17 @@
 <div class="flex flex-col h-full relative">
 	{#if root}
 		<div
-			class="z-10 sticky top-0 bg-gray-50 flex-initial inline-flex px-3 py-2 items-center h-full max-h-12 border-b border-gray-300"
+			class="z-10 sticky inline-flex top-0 bg-gray-50 flex-initial  px-3 py-2 items-center h-full max-h-12 border-b border-gray-300"
 		>
 			<FlowSettingsItem />
 		</div>
+		<div
+			class="z-10 sticky inline-flex top-0 bg-gray-50 flex-initial  px-3 py-2 items-center h-full max-h-12 border-b border-gray-300"
+		>
+			<FlowConstantsItem />
+		</div>
 	{/if}
-	<ul class="w-full flex-auto   {root ? 'px-2 pb-2 pt-3' : ''} py-1">
+	<ul class="w-full flex-auto {root ? 'px-2 pb-2 pt-3' : ''} py-1">
 		{#if root}
 			<li>
 				<FlowInputsItem />
diff --git a/frontend/src/lib/components/flows/map/FlowSettingsItem.svelte b/frontend/src/lib/components/flows/map/FlowSettingsItem.svelte
index efbc739c33..bf34b88fd0 100644
--- a/frontend/src/lib/components/flows/map/FlowSettingsItem.svelte
+++ b/frontend/src/lib/components/flows/map/FlowSettingsItem.svelte
@@ -2,12 +2,12 @@
 	import type { FlowEditorContext } from '../types'
 	import { getContext } from 'svelte'
 	import Icon from 'svelte-awesome'
-	import { faCalendarAlt, faSliders } from '@fortawesome/free-solid-svg-icons'
+	import { faSliders } from '@fortawesome/free-solid-svg-icons'
 	import { classNames } from '$lib/utils'
 	import { Badge } from '$lib/components/common'
 	import { flowStore } from '../flowStore'
 
-	const { select, selectedId, schedule } = getContext<FlowEditorContext>('FlowEditorContext')
+	const { select, selectedId } = getContext<FlowEditorContext>('FlowEditorContext')
 
 	$: settingsClass = classNames(
 		'border w-full rounded-sm p-2 bg-white border-gray-400 text-sm cursor-pointer flex items-center',