clean

windmill-labs · Jan 8, 2025 · a6afb72 · a6afb72
1 parent 0499113
commit a6afb72
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 20 deletions.
diff --git a/frontend/src/lib/components/flows/content/FlowInput.svelte b/frontend/src/lib/components/flows/content/FlowInput.svelte
@@ -45,6 +45,7 @@
 	let pendingJson: string
 	let addProperty: AddPropertyV2 | undefined = undefined
 	let previewSchema: Record<string, any> | undefined = undefined
+	let payloadData: Record<string, any> | undefined = undefined
 	let previewArguments: Record<string, any> | undefined = $previewArgs
 	let editOptionsOpen = false
 	let dropdownItems: Array<{
@@ -179,7 +180,7 @@
 		previewSchema = schemaFromPayload(payloadData)
 		updatePreviewArguments(payloadData)
 	}
-	$: updatePreviewSchemaAndArgs($flowInputEditorState.payloadData)
+	$: updatePreviewSchemaAndArgs(payloadData)
 
 	function applySchemaAndArgs() {
 		if (!previewSchema) {
@@ -216,18 +217,18 @@
 			return
 		}
 		if (!pendingJson?.length) {
-			$flowInputEditorState.payloadData = undefined
+			payloadData = undefined
 			updatePreviewSchemaAndArgs(undefined)
 			jsonValid = false
 			return
 		}
 		try {
 			const parsed = JSON.parse(pendingJson)
-			$flowInputEditorState.payloadData = parsed
+			payloadData = parsed
 			updatePreviewSchemaAndArgs(parsed)
 			jsonValid = true
 		} catch (error) {
-			$flowInputEditorState.payloadData = undefined
+			payloadData = undefined
 			updatePreviewSchemaAndArgs(undefined)
 			jsonValid = false
 		}
@@ -249,6 +250,13 @@
 	}
 
 	let connectFirstNode: () => void = () => {}
+
+	let init = false
+	$: if ($flowInputEditorState.payloadData && !init) {
+		init = true
+		payloadData = $flowInputEditorState.payloadData
+		$flowInputEditorState.payloadData = undefined
+	}
 </script>
 
 <!-- Add svelte:window to listen for keyboard events -->
@@ -373,29 +381,29 @@
 				<svelte:fragment slot="extraTab">
 					{#if $flowInputEditorState?.selectedTab === 'history'}
 						<FlowInputEditor
-							disabled={!$flowInputEditorState.payloadData}
+							disabled={!payloadData}
 							on:applySchemaAndArgs={applySchemaAndArgs}
 							on:applySchema={applySchema}
 							on:destroy={() => {
-								$flowInputEditorState.payloadData = undefined
+								payloadData = undefined
 							}}
 						>
 							<HistoricInputs
 								scriptHash={null}
 								scriptPath={null}
 								flowPath={$pathStore}
 								on:select={(e) => {
-									$flowInputEditorState.payloadData = e.detail ?? undefined
+									payloadData = e.detail ?? undefined
 								}}
 							/>
 						</FlowInputEditor>
 					{:else if $flowInputEditorState?.selectedTab === 'captures'}
 						<FlowInputEditor
-							disabled={!$flowInputEditorState.payloadData}
+							disabled={!payloadData}
 							on:applySchemaAndArgs={applySchemaAndArgs}
 							on:applySchema={applySchema}
 							on:destroy={() => {
-								$flowInputEditorState.payloadData = undefined
+								payloadData = undefined
 							}}
 						>
 							<svelete:fragment slot="action">
@@ -405,18 +413,18 @@
 							</svelete:fragment>
 							<CapturesInputs
 								on:select={(e) => {
-									$flowInputEditorState.payloadData = e.detail ?? undefined
+									payloadData = e.detail ?? undefined
 								}}
 								flowPath={$pathStore}
 							/>
 						</FlowInputEditor>
 					{:else if $flowInputEditorState?.selectedTab === 'savedInputs'}
 						<FlowInputEditor
-							disabled={!$flowInputEditorState.payloadData}
+							disabled={!payloadData}
 							on:applySchemaAndArgs={applySchemaAndArgs}
 							on:applySchema={applySchema}
 							on:destroy={() => {
-								$flowInputEditorState.payloadData = undefined
+								payloadData = undefined
 							}}
 						>
 							<svelete:fragment slot="header">
@@ -425,7 +433,7 @@
 							<SavedInputsPicker
 								flowPath={initialPath}
 								on:select={(e) => {
-									$flowInputEditorState.payloadData = e.detail ?? undefined
+									payloadData = e.detail ?? undefined
 								}}
 							/>
 						</FlowInputEditor>
@@ -435,7 +443,7 @@
 							on:applySchemaAndArgs={applySchemaAndArgs}
 							on:applySchema={applySchema}
 							on:destroy={() => {
-								$flowInputEditorState.payloadData = undefined
+								payloadData = undefined
 								pendingJson = ''
 							}}
 						>
@@ -450,8 +458,7 @@
 							}}
 							on:applySchema={applySchema}
 							on:destroy={() => {
-								$flowInputEditorState.payloadData = undefined
-								pendingJson = ''
+								payloadData = undefined
 							}}
 						>
 							<FirstStepInputs

diff --git a/frontend/src/lib/components/triggers/CaptureSection.svelte b/frontend/src/lib/components/triggers/CaptureSection.svelte
@@ -49,23 +49,24 @@
 		})
 	}
 
+	let openingDuration = 500
 	let pulseButton: PulseButton | undefined
 	function updateShowCaptureHint(show: boolean | undefined) {
 		if (show) {
 			$showCaptureHint = false
 			setTimeout(() => {
 				pulseButton?.triggerPulse(1)
-			}, 200)
+			}, openingDuration + 200)
 		}
 	}
 	$: updateShowCaptureHint($showCaptureHint)
 </script>
 
-<div transition:slide class="pb-12">
+<div transition:slide={{ duration: openingDuration }} class="pb-12 overflow-hidden">
 	<div class="border p-4 rounded-lg">
 		<div class="flex flex-col gap-1 mb-4">
 			<div class="flex flex-row items-center justify-start gap-1">
-				<PulseButton bind:this={pulseButton} pulseDuration={800}>
+				<PulseButton bind:this={pulseButton} pulseDuration={500}>
 					<AnimatedButton animate={captureInfo.active} baseRadius="6px" wrapperClasses="ml-[-2px]">
 						<Button
 							size="xs2"

diff --git a/frontend/src/lib/components/triggers/TriggersEditorSection.svelte b/frontend/src/lib/components/triggers/TriggersEditorSection.svelte
@@ -35,6 +35,19 @@
 	let args: Record<string, any> = {}
 
 	const dispatch = createEventDispatcher()
+
+	let showCapture = false
+	let init = false
+	$: updateShowCapture(!!$captureOn)
+	function updateShowCapture(show: boolean) {
+		if (!init) return
+		showCapture = show
+	}
+
+	setTimeout(() => {
+		init = true
+		updateShowCapture(!!$captureOn)
+	}, 300)
 </script>
 
 <Section label={captureTypeLabels[triggerType]}>
@@ -103,7 +116,7 @@
 			on:testWithArgs
 			bind:args
 			{data}
-			showCapture={$captureOn}
+			{showCapture}
 		/>
 	{:else}
 		<TriggersWrapper {path} {isFlow} {triggerType} {cloudDisabled} {args} {data} />