diff --git a/frontend/src/lib/components/InputTransformForm.svelte b/frontend/src/lib/components/InputTransformForm.svelte
index 2c3bef45a8..0e8bd9b601 100644
--- a/frontend/src/lib/components/InputTransformForm.svelte
+++ b/frontend/src/lib/components/InputTransformForm.svelte
@@ -6,7 +6,7 @@
 	import ArgInput from './ArgInput.svelte'
 	import FieldHeader from './FieldHeader.svelte'
 	import DynamicInputHelpBox from './flows/content/DynamicInputHelpBox.svelte'
-	import type { FlowEditorContext } from './flows/types'
+	import type { PropPickerWrapperContext } from './flows/propPicker/PropPickerWrapper.svelte'
 	import { codeToStaticTemplate, getDefaultExpr } from './flows/utils'
 	import SimpleEditor from './SimpleEditor.svelte'
 	import { Button } from '$lib/components/common'
@@ -39,7 +39,6 @@
 	export let argExtra: Record<string, any> = {}
 	export let pickableProperties: PickableProperties | undefined = undefined
 	export let enableAi = false
-	export let id: string
 
 	let monaco: SimpleEditor | undefined = undefined
 	let monacoTemplate: TemplateEditor | undefined = undefined
@@ -147,8 +146,6 @@
 
 	function onFocus() {
 		focused = true
-		if (!focusProp) return
-
 		if (isStaticTemplate(inputCat)) {
 			focusProp(argName, 'append', (path) => {
 				const toAppend = `\$\{${path}}`
@@ -169,7 +166,7 @@
 		}
 	}
 
-	const { flowInputsStore } = getContext<FlowEditorContext>('FlowEditorContext')
+	const { focusProp, propPickerConfig } = getContext<PropPickerWrapperContext>('PropPickerWrapper')
 
 	$: isStaticTemplate(inputCat) && propertyType == 'static' && setPropertyType(arg?.value)
 
@@ -192,14 +189,11 @@
 
 	loadResourceTypes()
 
-	$: propPickerConfig = $flowInputsStore[id]?.connectingInputs?.propPickerConfig
-	$: focusProp = $flowInputsStore[id]?.connectingInputs?.focusProp
-
 	$: connecting =
 		$propPickerConfig?.propName == argName && $propPickerConfig?.insertionMode == 'connect'
 </script>
 
-{#if arg != undefined && focusProp}
+{#if arg != undefined}
 	<div
 		class={twMerge(
 			'pl-2 pt-2 pb-2 ml-2 relative hover:bg-surface hover:shadow-md transition-all duration-200',
@@ -482,7 +476,7 @@
 					{/if}
 				</div>
 
-				{#if $propPickerConfig?.propName == argName && ($propPickerConfig?.insertionMode == 'insert' || $propPickerConfig?.insertionMode == 'append')}
+				{#if $propPickerConfig?.propName == argName && $propPickerConfig?.insertionMode == 'insert'}
 					<div class="text-blue-500 mt-2" in:fade={{ duration: 200 }}>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
diff --git a/frontend/src/lib/components/InputTransformSchemaForm.svelte b/frontend/src/lib/components/InputTransformSchemaForm.svelte
index 35046059b2..4b1dd080ec 100644
--- a/frontend/src/lib/components/InputTransformSchemaForm.svelte
+++ b/frontend/src/lib/components/InputTransformSchemaForm.svelte
@@ -23,7 +23,7 @@
 	export let noDynamicToggle = false
 	export let pickableProperties: PickableProperties | undefined = undefined
 	export let enableAi = false
-	export let id: string
+
 	let clazz: string = ''
 	export { clazz as class }
 
@@ -102,11 +102,6 @@
 							const { argName } = e.detail
 							dispatch('changeArg', { argName })
 						}}
-						on:connect={(e) => {
-							dispatch('connect', e.detail)
-							console.log('dbg connect 2', e.detail)
-						}}
-						{id}
 					/>
 				</div>
 			{/if}
diff --git a/frontend/src/lib/components/common/button/AnimatedButton.svelte b/frontend/src/lib/components/common/button/AnimatedButton.svelte
index f6696fb79b..40dfa1f024 100644
--- a/frontend/src/lib/components/common/button/AnimatedButton.svelte
+++ b/frontend/src/lib/components/common/button/AnimatedButton.svelte
@@ -4,7 +4,7 @@
 	export let marginWidth = '2px'
 	export let animationDuration = '2s'
 	export let baseRadius = '4px'
-	export let animate: boolean = true
+	export let animate = true
 	export let wrapperClasses = ''
 	export let ringColor = 'transparent'
 
diff --git a/frontend/src/lib/components/flows/content/FlowConstants.svelte b/frontend/src/lib/components/flows/content/FlowConstants.svelte
index 52b7256e0e..df0688f177 100644
--- a/frontend/src/lib/components/flows/content/FlowConstants.svelte
+++ b/frontend/src/lib/components/flows/content/FlowConstants.svelte
@@ -3,7 +3,9 @@
 	import FlowCard from '../common/FlowCard.svelte'
 	import { Alert, Badge } from '$lib/components/common'
 	import type { FlowModule, FlowModuleValue, InputTransform, PathScript, RawScript } from '$lib/gen'
-	import { getContext } from 'svelte'
+	import { getContext, setContext } from 'svelte'
+	import type { PropPickerWrapperContext } from '../propPicker/PropPickerWrapper.svelte'
+	import { writable } from 'svelte/store'
 	import Toggle from '../../Toggle.svelte'
 	import InputTransformSchemaForm from '$lib/components/InputTransformSchemaForm.svelte'
 	import type { FlowEditorContext } from '../types'
@@ -73,6 +75,12 @@
 				] as [Record<string, InputTransform>, string[], FlowModule]
 		)
 		.filter(([i, f, m]) => f.length > 0)
+
+	setContext<PropPickerWrapperContext>('PropPickerWrapper', {
+		focusProp: () => {},
+		propPickerConfig: writable(undefined),
+		clearFocus: () => {}
+	})
 </script>
 
 <div class="min-h-full">
@@ -127,7 +135,6 @@
 							class="mt-2"
 							schema={$flowStateStore[m.id]?.schema ?? {}}
 							bind:args
-							id={m.id}
 						/>
 					</div>
 				{/if}
diff --git a/frontend/src/lib/components/flows/content/FlowModuleComponent.svelte b/frontend/src/lib/components/flows/content/FlowModuleComponent.svelte
index 321b190af6..12df94be76 100644
--- a/frontend/src/lib/components/flows/content/FlowModuleComponent.svelte
+++ b/frontend/src/lib/components/flows/content/FlowModuleComponent.svelte
@@ -13,7 +13,7 @@
 	import FlowModuleHeader from './FlowModuleHeader.svelte'
 	import { getLatestHashForScript, scriptLangToEditorLang } from '$lib/scripts'
 	import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte'
-	import { afterUpdate, getContext, tick, createEventDispatcher } from 'svelte'
+	import { afterUpdate, getContext, tick } from 'svelte'
 	import type { FlowEditorContext } from '../types'
 	import FlowModuleScript from './FlowModuleScript.svelte'
 	import FlowModuleEarlyStop from './FlowModuleEarlyStop.svelte'
@@ -48,8 +48,6 @@
 	import { debounce } from '$lib/utils'
 	import { dfs } from '../dfs'
 	import FlowModuleSkip from './FlowModuleSkip.svelte'
-	import { writable } from 'svelte/store'
-	import type { PropPickerConfig } from '../types'
 
 	const {
 		selectedId,
@@ -215,33 +213,6 @@
 		}
 		debouncedWarning(argName)
 	}
-
-	function setConnect() {
-		const dispatch = createEventDispatcher()
-		if ($flowInputsStore && flowModule.id && $flowInputsStore?.[flowModule.id] === undefined) {
-			$flowInputsStore[flowModule.id] = {}
-		}
-
-		const propPickerConfig = writable<PropPickerConfig | undefined>(undefined)
-		$flowInputsStore[flowModule.id] = {
-			connectingInputs: {
-				propPickerConfig,
-				focusProp: (propName, insertionMode, onSelect) => {
-					propPickerConfig.set({
-						propName,
-						insertionMode,
-						onSelect
-					})
-				},
-				clearFocus: () => {
-					propPickerConfig.set(undefined)
-					dispatch('connect', false)
-				}
-			}
-		}
-	}
-
-	setConnect()
 </script>
 
 <svelte:window on:keydown={onKeyDown} />
@@ -408,10 +379,6 @@
 										pickableProperties={stepPropPicker.pickableProperties}
 										error={failureModule}
 										noPadding
-										on:connect={(e) => {
-											console.log('dbg connect', e.detail)
-										}}
-										id={flowModule.id}
 									>
 										<InputTransformSchemaForm
 											bind:this={inputTransformSchemaForm}
@@ -424,12 +391,7 @@
 											on:changeArg={(e) => {
 												const { argName } = e.detail
 												setFlowInput(argName)
-												console.log('dbg changeArg', argName)
 											}}
-											on:connect={(e) => {
-												console.log('dbg connect 3', e.detail)
-											}}
-											id={flowModule.id}
 										/>
 									</PropPickerWrapper>
 								</div>
diff --git a/frontend/src/lib/components/flows/map/FlowModuleSchemaItem.svelte b/frontend/src/lib/components/flows/map/FlowModuleSchemaItem.svelte
index abdf5d45df..d93d85366d 100644
--- a/frontend/src/lib/components/flows/map/FlowModuleSchemaItem.svelte
+++ b/frontend/src/lib/components/flows/map/FlowModuleSchemaItem.svelte
@@ -15,8 +15,7 @@
 		Square,
 		SkipForward,
 		Voicemail,
-		X,
-		Plug
+		X
 	} from 'lucide-svelte'
 	import { createEventDispatcher, getContext } from 'svelte'
 	import { fade } from 'svelte/transition'
@@ -29,7 +28,6 @@
 	import DrawerContent from '$lib/components/common/drawer/DrawerContent.svelte'
 	import { getDependeeAndDependentComponents } from '../flowExplorer'
 	import { replaceId } from '../flowStore'
-	import AnimatedButton from '$lib/components/common/button/AnimatedButton.svelte'
 
 	export let selected: boolean = false
 	export let deletable: boolean = false
@@ -292,25 +290,6 @@ outline-[1px] outline dark:outline-gray-500 outline-gray-300 bg-surface duration
 			</button>
 		{/if}
 
-		{#if hover || selected}
-			<AnimatedButton
-				wrapperClasses="absolute -top-[10px] right-[85px] w-fit h-fit"
-				animate={!!id && false}
-				animationDuration="1s"
-				baseRadius="9999px"
-				marginWidth="3px"
-			>
-				<button
-					class="rounded-full h-[20px] w-[20px] trash center-center text-secondary-inverse
-bg-surface-inverse duration-150 hover:bg-blue-400 hover:text-white"
-					on:click|preventDefault|stopPropagation={(event) => dispatch('connect')}
-					title="Connect"
-				>
-					<Plug class="mx-[3px]" size={12} strokeWidth={2} />
-				</button>
-			</AnimatedButton>
-		{/if}
-
 		{#if (id && Object.values($flowInputsStore?.[id]?.flowStepWarnings || {}).length > 0) || Boolean(warningMessage)}
 			<div class="absolute -top-[10px] -left-[10px]">
 				<Popover>
diff --git a/frontend/src/lib/components/flows/propPicker/PropPickerWrapper.svelte b/frontend/src/lib/components/flows/propPicker/PropPickerWrapper.svelte
index dd42f90465..13bbb6c611 100644
--- a/frontend/src/lib/components/flows/propPicker/PropPickerWrapper.svelte
+++ b/frontend/src/lib/components/flows/propPicker/PropPickerWrapper.svelte
@@ -1,15 +1,31 @@
+<script context="module" lang="ts">
+	type InsertionMode = 'append' | 'connect' | 'insert'
+
+	type SelectCallback = (path: string) => boolean
+
+	type PropPickerConfig = {
+		insertionMode: InsertionMode
+		propName: string
+		onSelect: SelectCallback
+	}
+
+	export type PropPickerWrapperContext = {
+		propPickerConfig: Writable<PropPickerConfig | undefined>
+		focusProp: (propName: string, insertionMode: InsertionMode, onSelect: SelectCallback) => void
+		clearFocus: () => void
+	}
+</script>
+
 <script lang="ts">
 	import PropPicker from '$lib/components/propertyPicker/PropPicker.svelte'
 	import PropPickerResult from '$lib/components/propertyPicker/PropPickerResult.svelte'
 	import { clickOutside } from '$lib/utils'
-	import { getContext, createEventDispatcher } from 'svelte'
+	import { createEventDispatcher, setContext } from 'svelte'
 	import { Pane, Splitpanes } from 'svelte-splitpanes'
+	import { writable, type Writable } from 'svelte/store'
 	import type { PickableProperties } from '../previousResults'
 	import { twMerge } from 'tailwind-merge'
 	import AnimatedButton from '$lib/components/common/button/AnimatedButton.svelte'
-	import type { FlowEditorContext } from '../types'
-	import { writable } from 'svelte/store'
-	import type { PropPickerConfig, InsertionMode, SelectCallback } from '../types'
 
 	export let pickableProperties: PickableProperties | undefined
 	export let result: any = undefined
@@ -19,47 +35,23 @@
 	export let displayContext = true
 	export let notSelectable = false
 	export let noPadding: boolean = false
-	export let id: string
 
 	const propPickerConfig = writable<PropPickerConfig | undefined>(undefined)
-	const { flowInputsStore } = getContext<FlowEditorContext>('FlowEditorContext')
 	const dispatch = createEventDispatcher()
 
-	function setPropPickerConfig() {
-		if ($flowInputsStore && id && $flowInputsStore?.[id] === undefined) {
-			$flowInputsStore[id] = {
-				connectingInputs: {
-					propPickerConfig,
-					focusProp: (propName: string, insertionMode: InsertionMode, onSelect: SelectCallback) => {
-						propPickerConfig.set({
-							propName,
-							insertionMode,
-							onSelect
-						})
-					},
-					clearFocus: () => {
-						propPickerConfig.set(undefined)
-					}
-				}
-			}
-		} else if ($flowInputsStore && id) {
-			$flowInputsStore[id].connectingInputs = {
-				propPickerConfig,
-				focusProp: (propName: string, insertionMode: InsertionMode, onSelect: SelectCallback) => {
-					propPickerConfig.set({
-						propName,
-						insertionMode,
-						onSelect
-					})
-				},
-				clearFocus: () => {
-					propPickerConfig.set(undefined)
-				}
-			}
+	setContext<PropPickerWrapperContext>('PropPickerWrapper', {
+		propPickerConfig,
+		focusProp: (propName, insertionMode, onSelect) => {
+			propPickerConfig.set({
+				propName,
+				insertionMode,
+				onSelect
+			})
+		},
+		clearFocus: () => {
+			propPickerConfig.set(undefined)
 		}
-	}
-
-	$: $flowInputsStore && setPropPickerConfig()
+	})
 </script>
 
 <div
@@ -77,10 +69,7 @@
 				baseRadius="4px"
 				wrapperClasses="h-full w-full pt-2"
 				marginWidth="4px"
-				ringColor={$propPickerConfig?.insertionMode == 'insert' ||
-				$propPickerConfig?.insertionMode == 'append'
-					? '#3b82f6'
-					: 'transparent'}
+				ringColor={$propPickerConfig?.insertionMode == 'insert' ? '#3b82f6' : 'transparent'}
 				animationDuration="1s"
 			>
 				{#if result}
@@ -104,12 +93,11 @@
 						{notSelectable}
 						allowCopy={!notSelectable && !$propPickerConfig}
 						on:select={({ detail }) => {
-							//dispatch('select', detail)
+							dispatch('select', detail)
 							if ($propPickerConfig?.onSelect(detail)) {
 								propPickerConfig.set(undefined)
 							}
 						}}
-						{id}
 					/>
 				{/if}
 			</AnimatedButton>
diff --git a/frontend/src/lib/components/flows/types.ts b/frontend/src/lib/components/flows/types.ts
index fd3d881fd5..2cf7127018 100644
--- a/frontend/src/lib/components/flows/types.ts
+++ b/frontend/src/lib/components/flows/types.ts
@@ -5,25 +5,9 @@ import type ScriptEditorDrawer from './content/ScriptEditorDrawer.svelte'
 import type { FlowState } from './flowState'
 import type { FlowBuilderWhitelabelCustomUi } from '../custom_ui'
 
-export type InsertionMode = 'connect' | 'insert' | 'append'
-export type SelectCallback = (detail: any) => boolean
-
-export type PropPickerConfig = {
-	propName: string
-	insertionMode: InsertionMode
-	onSelect: SelectCallback
-}
-
-export type PropPickerWrapper = {
-	propPickerConfig: Writable<PropPickerConfig | undefined>
-	focusProp: (propName: string, insertionMode: InsertionMode, onSelect: SelectCallback) => void
-	clearFocus: () => void
-}
-
 export type FlowInput = Record<
 	string,
 	{
-		connectingInputs?: PropPickerWrapper
 		flowStepWarnings?: Record<
 			string,
 			{
diff --git a/frontend/src/lib/components/propertyPicker/PropPicker.svelte b/frontend/src/lib/components/propertyPicker/PropPicker.svelte
index a00f0ea237..5311c4ae53 100644
--- a/frontend/src/lib/components/propertyPicker/PropPicker.svelte
+++ b/frontend/src/lib/components/propertyPicker/PropPicker.svelte
@@ -3,7 +3,7 @@
 	import { workspaceStore } from '$lib/stores'
 	import { getContext } from 'svelte'
 	import { Badge, Button } from '../common'
-	import type { FlowEditorContext } from '../flows/types'
+	import type { PropPickerWrapperContext } from '../flows/propPicker/PropPickerWrapper.svelte'
 
 	import ObjectViewer from './ObjectViewer.svelte'
 	import { keepByKey } from './utils'
@@ -15,7 +15,6 @@
 	export let notSelectable: boolean
 	export let error: boolean = false
 	export let allowCopy = false
-	export let id: string
 
 	$: previousId = pickableProperties?.previousId
 	let variables: Record<string, string> = {}
@@ -27,9 +26,7 @@
 	const EMPTY_STRING = ''
 	let search = ''
 
-	const { flowInputsStore } = getContext<FlowEditorContext>('FlowEditorContext')
-
-	$: propPickerConfig = flowInputsStore[id]?.connectingInputs?.propPickerConfig
+	const { propPickerConfig } = getContext<PropPickerWrapperContext>('PropPickerWrapper')
 
 	$: flowInputsFiltered =
 		search === EMPTY_STRING