windmill-components 1.35.43 → 1.36.1

package/components/flows/content/FlowModule.svelte

@@ -19,21 +19,25 @@ import { flowStateStore } from '../flowState';
 import { scriptLangToEditorLang } from '../../../utils';
 import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
 import { getContext, setContext } from 'svelte';
-import FlowModuleAdvancedSettings from './FlowModuleAdvancedSettings.svelte';
-import { loadSchemaFromModule } from '../utils';
+import { loadSchemaFromModule, selectedIdToIndexes } from '../utils';
 import { writable } from 'svelte/store';
 import FlowModuleScript from './FlowModuleScript.svelte';
-const { selectedId, select } = getContext('FlowEditorContext');
+import FlowModuleEarlyStop from './FlowModuleEarlyStop.svelte';
+import FlowModuleSuspend from './FlowModuleSuspend.svelte';
+import FlowRetries from './FlowRetries.svelte';
+const { selectedId, select, previewArgs } = getContext('FlowEditorContext');
 export let flowModule;
-export let previewArgs = {};
 export let flowModuleState;
-$: [parentIndex, childIndex] = $selectedId.split('-').map(Number);
+export let failureModule;
+$: [parentIndex, childIndex] = selectedIdToIndexes($selectedId);
 let editor;
 let modulePreview;
 let websocketAlive = { pyright: false, black: false, deno: false };
 let selected = 'inputs';
 $: shouldPick = isEmptyFlowModule(flowModule);
-$: stepPropPicker = getStepPropPicker($selectedId.split('-').map(Number), $flowStore.schema, $flowStateStore, previewArgs);
+$: stepPropPicker = failureModule
+    ? { pickableProperties: { previous_result: { error: 'the error message' } }, extraLib: '' }
+    : getStepPropPicker([parentIndex, childIndex], $flowStore.schema, $flowStateStore, $previewArgs);
 function onKeyDown(event) {
     if ((event.ctrlKey || event.metaKey) && event.key == 'Enter') {
         event.preventDefault();
@@ -73,6 +77,8 @@ setContext('FlowModuleWidth', {
 			<FlowModuleHeader
 				bind:module={flowModule}
 				on:delete
+				on:toggleRetry={() => (selected = 'retries')}
+				on:toggleStopAfterIf={() => (selected = 'early-stop')}
 				on:fork={() => apply(fork, flowModule)}
 				on:createScriptFromInlineScript={() => {
 					apply(createScriptFromInlineScript, {
@@ -100,6 +106,7 @@ setContext('FlowModuleWidth', {
 						kind: e.detail.kind,
 						subkind: e.detail.subkind
 					})}
+				{failureModule}
 			/>
 		{:else}
 			{#if flowModule.value.type === 'rawscript'}
@@ -147,14 +154,16 @@ setContext('FlowModuleWidth', {
 						<Tabs bind:selected>
 							<Tab value="inputs">Inputs</Tab>
 							<Tab value="test">Test</Tab>
+							<Tab value="retries">Retries</Tab>
 							{#if !$selectedId.includes('failure')}
-								<Tab value="advanced">Advanced</Tab>
+								<Tab value="early-stop">Early Stop</Tab>
+								<Tab value="suspend">Suspend</Tab>
 							{/if}
 
 							<svelte:fragment slot="content">
 								<div class="overflow-hidden bg-white" style="height:calc(100% - 32px);">
 									<TabContent value="inputs" class="flex flex-col flex-1 h-full">
-										<PropPickerWrapper bind:pickableProperties={stepPropPicker.pickableProperties}>
+										<PropPickerWrapper pickableProperties={stepPropPicker.pickableProperties}>
 											<!-- <pre class="text-xs">{JSON.stringify($flowStateStore, null, 4)}</pre> -->
 											<SchemaForm
 												schema={flowModuleState.schema}
@@ -174,9 +183,21 @@ setContext('FlowModuleWidth', {
 										/>
 									</TabContent>
 
-									<TabContent value="advanced" class="flex flex-col flex-1 h-full">
+									<TabContent value="retries" class="flex flex-col flex-1 h-full">
 										<div class="p-4 overflow-y-auto">
-											<FlowModuleAdvancedSettings bind:flowModule />
+											<FlowRetries bind:flowModule />
+										</div>
+									</TabContent>
+
+									<TabContent value="early-stop" class="flex flex-col flex-1 h-full">
+										<div class="p-4 overflow-y-auto">
+											<FlowModuleEarlyStop bind:flowModule />
+										</div>
+									</TabContent>
+
+									<TabContent value="suspend" class="flex flex-col flex-1 h-full">
+										<div class="p-4 overflow-y-auto">
+											<FlowModuleSuspend bind:flowModule />
 										</div>
 									</TabContent>
 								</div>

package/components/flows/content/FlowModule.svelte.d.ts

@@ -9,8 +9,8 @@ import { type Writable } from 'svelte/store';
 declare const __propDef: {
     props: {
         flowModule: FlowModule;
-        previewArgs?: Record<string, any> | undefined;
         flowModuleState: FlowModuleState;
+        failureModule: boolean;
         FLOW_MODULE_WIDTH_THRESHOLD?: 768 | undefined;
     };
     events: {

package/components/flows/content/FlowModuleEarlyStop.svelte

@@ -0,0 +1,76 @@
+<script>import SimpleEditor from '../../SimpleEditor.svelte';
+import Toggle from '../../Toggle.svelte';
+import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
+import { getStepPropPicker } from '../flowStateUtils';
+import { flowStore } from '../flowStore';
+import { flowStateStore } from '../flowState';
+import { getContext } from 'svelte';
+import { selectedIdToIndexes } from '../utils';
+const { selectedId, previewArgs } = getContext('FlowEditorContext');
+export let flowModule;
+let editor = undefined;
+$: isStopAfterIfEnabled = Boolean(flowModule.stop_after_if);
+let pickableProperties = {};
+$: {
+    let indices = selectedIdToIndexes($selectedId);
+    if (indices[1]) {
+        indices[1] += 1;
+    }
+    else {
+        indices[0] += 1;
+    }
+    const props = getStepPropPicker(indices, $flowStore.schema, $flowStateStore, $previewArgs).pickableProperties;
+    props['result'] = props['previous_result'];
+    delete props['previous_result'];
+    props.step = props.step?.slice(0, props.step.length - 1);
+    pickableProperties = props;
+}
+</script>
+
+<div class="flex flex-col items-start space-y-2">
+	<Toggle
+		checked={isStopAfterIfEnabled}
+		on:change={() => {
+			if (isStopAfterIfEnabled && flowModule.stop_after_if) {
+				flowModule.stop_after_if = undefined
+			} else {
+				flowModule.stop_after_if = {
+					expr: 'result == undefined',
+					skip_if_stopped: false
+				}
+			}
+		}}
+		options={{
+			right: 'Early stop if condition met'
+		}}
+	/>
+
+	{#if flowModule.stop_after_if}
+		<span class="text-xs font-bold">Should skip if stopped</span>
+
+		<input type="checkbox" bind:checked={flowModule.stop_after_if.skip_if_stopped} />
+
+		<span class="text-xs font-bold">Stop condition expression</span>
+
+		<div class="border w-full">
+			<PropPickerWrapper
+				{pickableProperties}
+				on:select={({ detail }) => {
+					editor?.insertAtCursor(detail)
+				}}
+			>
+				<SimpleEditor
+					bind:this={editor}
+					lang="javascript"
+					bind:code={flowModule.stop_after_if.expr}
+					class="small-editor"
+				/>
+			</PropPickerWrapper>
+		</div>
+	{:else}
+		<span class="text-xs font-bold">Should skip if stopped</span>
+		<input type="checkbox" disabled />
+		<span class="text-xs font-bold">Stop condition expression</span>
+		<textarea disabled rows="3" />
+	{/if}
+</div>

package/components/flows/content/FlowModuleEarlyStop.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
+declare const __propDef: {
+    props: {
+        flowModule: FlowModule;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type FlowModuleEarlyStopProps = typeof __propDef.props;
+export declare type FlowModuleEarlyStopEvents = typeof __propDef.events;
+export declare type FlowModuleEarlyStopSlots = typeof __propDef.slots;
+export default class FlowModuleEarlyStop extends SvelteComponentTyped<FlowModuleEarlyStopProps, FlowModuleEarlyStopEvents, FlowModuleEarlyStopSlots> {
+}
+export {};

package/components/flows/content/FlowModuleHeader.svelte

@@ -1,7 +1,9 @@
 <script>import Button from '../../common/button/Button.svelte';
 import { isEmptyFlowModule } from '../flowStateUtils';
-import { faCodeBranch, faSave, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
+import { classNames } from '../../../utils';
+import { faArrowRotateBack, faArrowRotateForward, faBed, faCodeBranch, faSave, faStop, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
 import { createEventDispatcher, getContext } from 'svelte';
+import Icon from 'svelte-awesome';
 import RemoveStepConfirmationModal from './RemoveStepConfirmationModal.svelte';
 export let module;
 let confirmationModalOpen = false;
@@ -10,9 +12,30 @@ const dispatch = createEventDispatcher();
 const { selectedId, select } = getContext('FlowEditorContext');
 const { width, threshold } = getContext('FlowModuleWidth');
 $: iconOnly = $width < threshold;
+$: moduleRetry = module.retry?.constant || module.retry?.exponential;
 </script>
 
 <div class="flex flex-row space-x-2">
+	{#if !shouldPick}
+		<span
+			class={classNames('badge', module.stop_after_if ? 'badge-on' : 'badge-off')}
+			on:click={() => dispatch('toggleStopAfterIf')}
+		>
+			<Icon data={faStop} scale={0.8} />
+		</span>
+		<span
+			class={classNames('badge', moduleRetry ? 'badge-on' : 'badge-off')}
+			on:click={() => dispatch('toggleRetry')}
+		>
+			<Icon data={faArrowRotateForward} scale={0.8} />
+		</span>
+		<span
+			class={classNames('badge', Boolean(module.suspend) ? 'badge-on' : 'badge-off')}
+			on:click={() => dispatch('toggleSuspend')}
+		>
+			<Icon data={faBed} scale={0.8} />
+		</span>
+	{/if}
 	{#if module.value.type === 'script' && !shouldPick}
 		<Button
 			size="xs"
@@ -44,8 +67,8 @@ $: iconOnly = $width < threshold;
 		variant="border"
 		startIcon={{ icon: faTrashAlt }}
 		{iconOnly}
-		on:click={(event) => {
-			if (event.shiftKey || shouldPick) {
+		on:click={({ detail }) => {
+			if (detail.shiftKey || shouldPick) {
 				dispatch('delete')
 				select('settings')
 			} else {
@@ -66,3 +89,69 @@ $: iconOnly = $width < threshold;
 		})
 	}}
 />
+
+<style>
+	.badge {
+
+    display: flex;
+
+    cursor: pointer;
+
+    align-items: center;
+
+    white-space: nowrap;
+
+    border-radius: 0.25rem;
+
+    border-width: 1px;
+
+    padding-left: 0.625rem;
+
+    padding-right: 0.625rem;
+
+    padding-top: 0.125rem;
+
+    padding-bottom: 0.125rem;
+
+    font-size: 0.875rem;
+
+    line-height: 1.25rem;
+
+    font-weight: 500
+}
+
+	.badge-on {
+
+    --tw-bg-opacity: 1;
+
+    background-color: rgb(225 239 254 / var(--tw-bg-opacity));
+
+    --tw-text-opacity: 1;
+
+    color: rgb(30 66 159 / var(--tw-text-opacity))
+}
+
+	.badge-on:hover {
+
+    --tw-bg-opacity: 1;
+
+    background-color: rgb(195 221 253 / var(--tw-bg-opacity))
+}
+
+	.badge-off {
+
+    --tw-bg-opacity: 1;
+
+    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+
+    --tw-text-opacity: 1;
+
+    color: rgb(31 41 55 / var(--tw-text-opacity))
+}
+
+	.badge-off:hover {
+
+    --tw-bg-opacity: 1;
+
+    background-color: rgb(229 231 235 / var(--tw-bg-opacity))
+}</style>

package/components/flows/content/FlowModuleHeader.svelte.d.ts

@@ -5,6 +5,9 @@ declare const __propDef: {
         module: FlowModule;
     };
     events: {
+        toggleStopAfterIf: CustomEvent<any>;
+        toggleRetry: CustomEvent<any>;
+        toggleSuspend: CustomEvent<any>;
         fork: CustomEvent<any>;
         createScriptFromInlineScript: CustomEvent<any>;
         delete: CustomEvent<any>;

package/components/flows/content/FlowModuleSuspend.svelte

@@ -0,0 +1,27 @@
+<script>import Toggle from '../../Toggle.svelte';
+export let flowModule;
+$: isSuspendEnabled = Boolean(flowModule.suspend);
+</script>
+
+<Toggle
+	checked={isSuspendEnabled}
+	on:change={() => {
+		if (isSuspendEnabled && flowModule.suspend != undefined) {
+			flowModule.suspend = undefined
+		} else {
+			flowModule.suspend = 1
+		}
+	}}
+	options={{
+		right: 'Suspend flow execution until events received'
+	}}
+/>
+<div>
+	<span class="text-xs font-bold">Number of events to wait for</span>
+
+	{#if flowModule.suspend}
+		<input bind:value={flowModule.suspend} type="number" min="1" placeholder="1" />
+	{:else}
+		<input type="number" disabled />
+	{/if}
+</div>

package/components/flows/content/FlowModuleSuspend.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
+declare const __propDef: {
+    props: {
+        flowModule: FlowModule;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type FlowModuleSuspendProps = typeof __propDef.props;
+export declare type FlowModuleSuspendEvents = typeof __propDef.events;
+export declare type FlowModuleSuspendSlots = typeof __propDef.slots;
+export default class FlowModuleSuspend extends SvelteComponentTyped<FlowModuleSuspendProps, FlowModuleSuspendEvents, FlowModuleSuspendSlots> {
+}
+export {};

package/components/flows/content/FlowModuleWrapper.svelte

@@ -1,11 +1,9 @@
 <script>import { getContext } from 'svelte';
 import { flowStateStore } from '../flowState';
 import { flowStore } from '../flowStore';
+import { selectedIdToIndexes } from '../utils';
 import FlowModule from './FlowModule.svelte';
-const { selectedId, previewArgs, select } = getContext('FlowEditorContext');
-function selectedIdToIndexes(selectedId) {
-    return selectedId.split('-').map(Number);
-}
+const { selectedId } = getContext('FlowEditorContext');
 $: [parentIndex, childIndex] = selectedIdToIndexes($selectedId);
 </script>
 
@@ -14,7 +12,7 @@ $: [parentIndex, childIndex] = selectedIdToIndexes($selectedId);
 		{#each [$flowStateStore.modules[parentIndex].childFlowModules] as state}
 			{#if mod.type == 'forloopflow' && state != undefined}
 				<FlowModule
-					previewArgs={$previewArgs}
+					failureModule={false}
 					bind:flowModule={mod.modules[childIndex]}
 					bind:flowModuleState={state[childIndex]}
 					on:delete={() => {
@@ -34,7 +32,7 @@ $: [parentIndex, childIndex] = selectedIdToIndexes($selectedId);
 	{/each}
 {:else if $flowStore.value.modules[parentIndex]}
 	<FlowModule
-		previewArgs={$previewArgs}
+		failureModule={false}
 		bind:flowModule={$flowStore.value.modules[parentIndex]}
 		bind:flowModuleState={$flowStateStore.modules[parentIndex]}
 		on:delete={() => {

package/components/flows/content/FlowRetries.svelte

@@ -1,8 +1,8 @@
 <script>import Toggle from '../../Toggle.svelte';
-import { flowStore } from '../flowStore';
+export let flowModule;
 function setConstantRetries() {
-    $flowStore.value.retry = {
-        ...$flowStore.value.retry,
+    flowModule.retry = {
+        ...flowModule.retry,
         constant: {
             attempts: 0,
             seconds: 0
@@ -10,8 +10,8 @@ function setConstantRetries() {
     };
 }
 function setExpoentialRetries() {
-    $flowStore.value.retry = {
-        ...$flowStore.value.retry,
+    flowModule.retry = {
+        ...flowModule.retry,
         exponential: {
             attempts: 0,
             multiplier: 1,
@@ -19,16 +19,16 @@ function setExpoentialRetries() {
         }
     };
 }
-$: isConstantRetryEnabled = Boolean($flowStore.value.retry?.constant);
-$: isExponentialRetryEnabled = Boolean($flowStore.value.retry?.exponential);
+$: isConstantRetryEnabled = Boolean(flowModule.retry?.constant);
+$: isExponentialRetryEnabled = Boolean(flowModule.retry?.exponential);
 </script>
 
 <div class="flex flex-col items-start space-y-1">
 	<Toggle
 		checked={isConstantRetryEnabled}
 		on:change={() => {
-			if (isConstantRetryEnabled && $flowStore.value.retry?.constant) {
-				$flowStore.value.retry.constant = undefined
+			if (isConstantRetryEnabled && flowModule.retry?.constant) {
+				flowModule.retry.constant = undefined
 			} else {
 				setConstantRetries()
 			}
@@ -37,11 +37,11 @@ $: isExponentialRetryEnabled = Boolean($flowStore.value.retry?.exponential);
 			right: 'Constant retry enabled'
 		}}
 	/>
-	{#if $flowStore.value.retry?.constant}
+	{#if flowModule.retry?.constant}
 		<span class="text-xs font-bold">Attempts</span>
-		<input bind:value={$flowStore.value.retry.constant.attempts} type="number" />
+		<input bind:value={flowModule.retry.constant.attempts} type="number" />
 		<span class="text-xs font-bold">Delay (seconds)</span>
-		<input bind:value={$flowStore.value.retry.constant.seconds} type="number" />
+		<input bind:value={flowModule.retry.constant.seconds} type="number" />
 	{:else}
 		<span class="text-xs font-bold">Attempts</span>
 		<input type="number" disabled />
@@ -52,8 +52,8 @@ $: isExponentialRetryEnabled = Boolean($flowStore.value.retry?.exponential);
 	<Toggle
 		checked={isExponentialRetryEnabled}
 		on:change={() => {
-			if (isExponentialRetryEnabled && $flowStore.value.retry?.exponential) {
-				$flowStore.value.retry.exponential = undefined
+			if (isExponentialRetryEnabled && flowModule.retry?.exponential) {
+				flowModule.retry.exponential = undefined
 			} else {
 				setExpoentialRetries()
 			}
@@ -62,13 +62,13 @@ $: isExponentialRetryEnabled = Boolean($flowStore.value.retry?.exponential);
 			right: 'Exponential retry enabled'
 		}}
 	/>
-	{#if $flowStore.value.retry?.exponential}
+	{#if flowModule.retry?.exponential}
 		<span class="text-xs font-bold">Attempts</span>
-		<input bind:value={$flowStore.value.retry.exponential.attempts} type="number" />
+		<input bind:value={flowModule.retry.exponential.attempts} type="number" />
 		<span class="text-xs font-bold">Mulitplier</span>
-		<input bind:value={$flowStore.value.retry.exponential.multiplier} type="number" />
+		<input bind:value={flowModule.retry.exponential.multiplier} type="number" />
 		<span class="text-xs font-bold">Initial delay (seconds)</span>
-		<input bind:value={$flowStore.value.retry.exponential.seconds} type="number" />
+		<input bind:value={flowModule.retry.exponential.seconds} type="number" />
 	{:else}
 		<span class="text-xs font-bold">Attempts</span>
 		<input type="number" disabled />

package/components/flows/content/FlowRetries.svelte.d.ts

@@ -1,6 +1,9 @@
 import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
 declare const __propDef: {
-    props: {};
+    props: {
+        flowModule: FlowModule;
+    };
     events: {
         [evt: string]: CustomEvent<any>;
     };

package/components/flows/content/FlowSettings.svelte

@@ -4,23 +4,23 @@ import TabContent from '../../common/tabs/TabContent.svelte';
 import { flowStore } from '../flowStore';
 import Path from '../../Path.svelte';
 import Required from '../../Required.svelte';
-import { getContext } from 'svelte';
 import FlowCard from '../common/FlowCard.svelte';
 import FlowSchedules from './FlowSchedules.svelte';
-import FlowRetries from './FlowRetries.svelte';
-const { path } = getContext('FlowEditorContext');
-export let defaultTab = 'configuration';
+import SvelteMarkdown from 'svelte-markdown';
+import { Toggle } from 'flowbite-svelte';
+export let initialPath;
+export let defaultTab = 'metadata';
 </script>
 
 <FlowCard title="Settings">
 	<Tabs selected={defaultTab}>
-		<Tab value="configuration">Configuration</Tab>
+		<Tab value="metadata">Metadata</Tab>
 		<Tab value="schedule">Schedule</Tab>
-		<Tab value="retries">Retries</Tab>
+		<Tab value="same-worker">Same Worker</Tab>
 
 		<svelte:fragment slot="content">
-			<TabContent value="configuration" class="p-4">
-				<Path bind:path={$flowStore.path} initialPath={path} namePlaceholder="my_flow" kind="flow">
+			<TabContent value="metadata" class="p-4">
+				<Path bind:path={$flowStore.path} {initialPath} namePlaceholder="my_flow" kind="flow">
 					<div slot="ownerToolkit">
 						Flow permissions depend on their path. Select the group <span class="font-mono"
 							>all</span
@@ -30,21 +30,61 @@ export let defaultTab = 'configuration';
 					</div>
 				</Path>
 
-				<label class="block mt-4">
+				<label class="block my-4">
 					<span class="text-gray-700">Summary <Required required={false} /></span>
 					<textarea
 						bind:value={$flowStore.summary}
 						class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
 						placeholder="A very short summary of the flow displayed when the flow is listed"
 						rows="1"
+						id="flow-summary"
 					/>
 				</label>
+
+				<label class="block my-4" for="inp">
+					<span class="text-gray-700"
+						>Description<Required required={false} detail="accept markdown formatting" />
+						<textarea
+							id="inp"
+							bind:value={$flowStore.description}
+							class="
+					mt-1
+					block
+					w-full
+					rounded-md
+					border-gray-300
+					shadow-sm
+					focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50
+					"
+							placeholder="A description to help users understand what this script does and how to use it."
+							rows="3"
+						/>
+					</span>
+				</label>
+
+				<div>
+					<h3 class="text-gray-700 ">Description rendered</h3>
+					<div
+						class="prose mt-5 text-xs shadow-inner shadow-blue p-4 overflow-auto"
+						style="max-height: 200px;"
+					>
+						<SvelteMarkdown source={$flowStore.description ?? ''} />
+					</div>
+				</div>
 			</TabContent>
 			<TabContent value="schedule" class="p-4">
 				<FlowSchedules />
 			</TabContent>
-			<TabContent value="retries" class="px-4">
-				<FlowRetries />
+
+			<TabContent value="same-worker" class="p-4">
+				<span class="my-2 text-sm font-bold">Same Worker</span>
+
+				<Toggle
+					bind:checked={$flowStore.value.same_worker}
+					options={{
+						right: 'Same Worker'
+					}}
+				/>
 			</TabContent>
 		</svelte:fragment>
 	</Tabs>

package/components/flows/content/FlowSettings.svelte.d.ts

@@ -1,6 +1,7 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
+        initialPath: string;
         defaultTab?: string | undefined;
     };
     events: {

package/components/flows/content/RemoveStepConfirmationModal.svelte

@@ -24,7 +24,7 @@ const dispatch = createEventDispatcher();
 		<Alert type="info" title="Bypass confirmation">
 			<div>
 				You can press
-				<Badge color="dark-gray">SHIFT</Badge>
+				<kbd color="dark-gray">SHIFT</kbd>
 				while removing a step to bypass confirmation.
 			</div>
 		</Alert>

package/components/flows/flowStateUtils.d.ts

@@ -22,7 +22,7 @@ declare type Result = any;
 declare type PickableProperties = {
     flow_input?: Object;
     previous_result: Result | undefined;
-    step: Result[];
+    step?: Result[];
 };
 declare type StepPropPicker = {
     pickableProperties: PickableProperties;

package/components/flows/flowStateUtils.js

@@ -1,5 +1,5 @@
 import { CompletedJob, Job, Script, ScriptService } from '../../gen';
-import { initialCode } from '../../script_helpers';
+import { DENO_FAILURE_MODULE_CODE, initialCode } from '../../script_helpers';
 import { userStore, workspaceStore } from '../../stores';
 import { buildExtraLib, emptySchema, getScriptByPath, objectToTsType, schemaToObject, schemaToTsType } from '../../utils';
 import { get } from 'svelte/store';
@@ -149,7 +149,7 @@ export function getStepPropPicker(indexes, flowInputSchema, flowState, args) {
         if (flowState.modules[parentIndex]?.previewArgs) {
             forLoopFlowInput = flowState.modules[parentIndex]?.previewArgs;
         }
-        const innerResults = getPreviousResults(flowState.modules[parentIndex].childFlowModules, childIndex);
+        const innerResults = getPreviousResults(flowState.modules[parentIndex]?.childFlowModules, childIndex);
         const innerLastResult = childIndex == 0
             ? forLoopFlowInput
             : innerResults.length > 0