fix: ai flow nits (#2272)

frontend/src/lib/components/FlowBuilder.svelte

@@ -469,8 +469,36 @@
 			required,
 			type: 'object'
 		}
+	}
+
+	function clearFlowInputsFromStep(id: string | undefined) {
+		const module: FlowModule | undefined = dfs(id, $flowStore)[0]
+		if (module?.value.type === 'rawscript') {
+			// clear step inputs that start with flow_input. but not flow_input.iter
+			for (const key in module.value.input_transforms) {
+				const input = module.value.input_transforms[key]
+				if (
+					input.type === 'javascript' &&
+					input.expr.includes('flow_input.') &&
+					!input.expr.includes('flow_input.iter')
+				) {
+					module.value.input_transforms[key] = {
+						type: 'static',
+						value: undefined
+					}
+				}
+			}
+		}
+		$flowStore = $flowStore
+	}
+
+	async function finishStepGen() {
 		copilotFlowInputs = {}
 		copilotFlowRequiredInputs = []
+		setInitCopilotModules(flowCopilotMode)
+		copilotStatus = "Done! Just check the step's inputs and you're good to go!"
+		await sleep(3000)
+		copilotStatus = ''
 	}
 
 	async function genFlow(idx: number, flowModules: FlowModule[], stepOnly = false) {
@@ -627,8 +655,8 @@
 						Object.entries(inputs).forEach(([key, expr]) => {
 							if (
 								key in stepSchema.properties &&
-								expr.startsWith('flow_input.') &&
-								!expr.startsWith('flow_input.iter') &&
+								expr.includes('flow_input.') &&
+								!expr.includes('flow_input.iter') &&
 								(!$flowStore.schema || !(key in $flowStore.schema.properties)) // prevent overriding flow inputs
 							) {
 								copilotFlowInputs[key] = stepSchema.properties[key]
@@ -703,11 +731,14 @@
 			}
 
 			if (stepOnly) {
-				openCopilotInputsModal = true
 				$copilotCurrentStepStore = undefined
 				copilotLoading = false
-				setInitCopilotModules(flowCopilotMode)
 				copilotStatus = ''
+				if (Object.keys(copilotFlowInputs).length > 0) {
+					openCopilotInputsModal = true
+				} else {
+					finishStepGen()
+				}
 			} else {
 				copilotStatus =
 					"Waiting for the user to validate code and inputs of step '" + module.id + "'"
@@ -731,7 +762,7 @@
 
 	flowCopilotContext.genFlow = genFlow
 
-	async function handleFlowCopilotInputs() {
+	async function finishCopilotFlowBuilder() {
 		copilotLoading = true
 		select('Input')
 		$copilotCurrentStepStore = 'Input'
@@ -747,8 +778,8 @@
 						const input = module.value.input_transforms[moduleAttr]
 						if (
 							input.type === 'javascript' &&
-							input.expr.startsWith('flow_input.') &&
-							!input.expr.startsWith('flow_input.iter')
+							input.expr.includes('flow_input.') &&
+							!input.expr.includes('flow_input.iter')
 						) {
 							const flowAttr = input.expr.split('.')[1]
 							const schema = $flowStateStore[module.id].schema
@@ -814,16 +845,11 @@
 	<FlowCopilotInputsModal
 		on:confirmed={async () => {
 			applyCopilotFlowInputs()
-			copilotStatus = "Done! Just check the step's inputs and you're good to go!"
-			await sleep(3000)
-			copilotStatus = ''
+			finishStepGen()
 		}}
 		on:canceled={async () => {
-			copilotFlowInputs = {}
-			copilotFlowRequiredInputs = []
-			copilotStatus = "Done! Just check the step's inputs and you're good to go!"
-			await sleep(3000)
-			copilotStatus = ''
+			clearFlowInputsFromStep($copilotModulesStore[0]?.id)
+			finishStepGen()
 		}}
 		bind:open={openCopilotInputsModal}
 		inputs={Object.keys(copilotFlowInputs)}
@@ -911,7 +937,7 @@
 					{copilotLoading}
 					bind:copilotStatus
 					{genFlow}
-					{handleFlowCopilotInputs}
+					{finishCopilotFlowBuilder}
 					{abortController}
 				/>
 

frontend/src/lib/components/copilot/FlowCopilotInputsModal.svelte

@@ -11,7 +11,7 @@
 </script>
 
 <Modal
-	{open}
+	bind:open
 	on:confirmed={() => {
 		open = false
 		dispatch('confirmed')

frontend/src/lib/components/copilot/FlowCopilotStatus.svelte

@@ -16,7 +16,7 @@
 	export let copilotStatus: string
 	export let abortController: AbortController | undefined
 	export let genFlow: (index: number, modules: FlowModule[], stepOnly?: boolean) => void
-	export let handleFlowCopilotInputs: () => void
+	export let finishCopilotFlowBuilder: () => void
 
 	let copilotPopover: ManualPopover | undefined = undefined
 
@@ -92,7 +92,7 @@
 						}
 						const stepNb = charsToNumber($currentStepStore)
 						if (stepNb >= $modulesStore.length - 1) {
-							handleFlowCopilotInputs()
+							finishCopilotFlowBuilder()
 						} else {
 							genFlow(stepNb + 1, $flowStore.value.modules)
 						}

frontend/src/lib/components/copilot/StepGen.svelte

@@ -21,7 +21,6 @@
 	let selectedCompletion: FlowCopilotModule['selectedCompletion'] = undefined
 	let lang: FlowCopilotModule['lang'] = undefined
 	const { flowStore, flowStateStore } = getContext<FlowEditorContext>('FlowEditorContext')
-	//
 	const { modulesStore: copilotModulesStore, genFlow } =
 		getContext<FlowCopilotContext>('FlowCopilotContext')
 
@@ -85,7 +84,7 @@
 
 <div class="text-primary transition-all {funcDesc.length > 0 ? 'w-96' : 'w-60'}">
 	<div>
-		<div class="flex p-2">
+		<div class="flex p-2 relative">
 			<input
 				type="text"
 				bind:this={input}
@@ -97,9 +96,14 @@
 						hubCompletions = []
 					}
 				}}
-				placeholder="AI Gen &#xf0d0; or search hub scripts"
-				style="font-family:Inter, FontAwesome"
+				placeholder="AI Gen       or search hub scripts"
 			/>
+			{#if funcDesc.length === 0}
+				<Icon
+					data={faMagicWandSparkles}
+					class="absolute left-[65px] qhd:left-[75px] top-[18px] qhd:top-[20px] fill-current opacity-70"
+				/>
+			{/if}
 		</div>
 		{#if funcDesc.length > 0}
 			<ul class="transition-all divide-y">

frontend/src/lib/components/flows/map/InsertModuleButton.svelte

@@ -24,13 +24,6 @@
 	$: !open && (funcDesc = '')
 </script>
 
-<svelte:head>
-	<link
-		href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
-		rel="stylesheet"
-	/>
-</svelte:head>
-
 <Menu
 	transitionDuration={0}
 	pointerDown