windmill-components 1.448.50 → 1.472.2

package/package/components/triggers/CaptureWrapper.svelte

@@ -4,13 +4,16 @@ import { onDestroy } from 'svelte';
 import { capitalize, isObject, sendUserToast, sleep } from '../../utils';
 import { isCloudHosted } from '../../cloud';
 import Alert from '../common/alert/Alert.svelte';
-import RouteEditorConfigSection from './RouteEditorConfigSection.svelte';
-import WebsocketEditorConfigSection from './WebsocketEditorConfigSection.svelte';
-import WebhooksConfigSection from './WebhooksConfigSection.svelte';
+import RouteEditorConfigSection from './http/RouteEditorConfigSection.svelte';
+import WebsocketEditorConfigSection from './websocket/WebsocketEditorConfigSection.svelte';
+import WebhooksConfigSection from './webhook/WebhooksConfigSection.svelte';
 import EmailTriggerConfigSection from '../details/EmailTriggerConfigSection.svelte';
-import KafkaTriggersConfigSection from './KafkaTriggersConfigSection.svelte';
+import KafkaTriggersConfigSection from './kafka/KafkaTriggersConfigSection.svelte';
 import CaptureTable from './CaptureTable.svelte';
-import NatsTriggersConfigSection from './NatsTriggersConfigSection.svelte';
+import NatsTriggersConfigSection from './nats/NatsTriggersConfigSection.svelte';
+import SqsTriggerEditorConfigSection from './sqs/SqsTriggerEditorConfigSection.svelte';
+import PostgresEditorConfigSection from './postgres/PostgresEditorConfigSection.svelte';
+import { invalidRelations } from './postgres/utils';
 export let isFlow;
 export let path;
 export let hasPreprocessor;
@@ -22,15 +25,34 @@ export let connectionInfo = undefined;
 export let args = {};
 export let captureTable = undefined;
 export async function setConfig() {
-    await CaptureService.setCaptureConfig({
-        requestBody: {
-            trigger_kind: captureType,
-            path,
-            is_flow: isFlow,
-            trigger_config: args && Object.keys(args).length > 0 ? args : undefined
-        },
-        workspace: $workspaceStore
-    });
+    if (captureType === 'postgres') {
+        if (!args?.publication?.table_to_track) {
+            sendUserToast('Table to track must be set', true);
+            return false;
+        }
+        if (invalidRelations(args.publication.table_to_track, {
+            showError: true,
+            trackSchemaTableError: true
+        }) === true) {
+            return false;
+        }
+    }
+    try {
+        await CaptureService.setCaptureConfig({
+            requestBody: {
+                trigger_kind: captureType,
+                path,
+                is_flow: isFlow,
+                trigger_config: args && Object.keys(args).length > 0 ? args : undefined
+            },
+            workspace: $workspaceStore
+        });
+        return true;
+    }
+    catch (error) {
+        sendUserToast(error.body, true);
+        return false;
+    }
 }
 let captureActive = false;
 let captureConfigs = {};
@@ -44,7 +66,8 @@ async function getCaptureConfigs() {
         acc[c.trigger_kind] = c;
         return acc;
     }, {});
-    if ((captureType === 'websocket' || captureType === 'kafka') && captureActive) {
+    if ((captureType === 'postgres' || captureType === 'websocket' || captureType === 'kafka' || captureType === 'sqs') &&
+        captureActive) {
         const config = captureConfigs[captureType];
         if (config && config.error) {
             const serverEnabled = getServerEnabled(config);
@@ -93,23 +116,23 @@ function getServerEnabled(config) {
     return (!!config.last_server_ping &&
         new Date(config.last_server_ping).getTime() > new Date().getTime() - 15 * 1000);
 }
-export async function handleCapture() {
-    if (!captureActive) {
-        await setConfig();
-        capture();
+export async function handleCapture(e) {
+    if (captureActive || e.detail.disableOnly) {
+        captureActive = false;
     }
     else {
-        captureActive = false;
+        const configSet = await setConfig();
+        if (configSet) {
+            capture();
+        }
     }
 }
 let config;
 $: config = captureConfigs[captureType];
-let cloudDisabled = (captureType === 'websocket' || captureType === 'kafka' || captureType === 'nats') &&
-    isCloudHosted();
+const streamingCaptures = ['sqs', 'websocket', 'postgres', 'kafka', 'nats'];
+let cloudDisabled = streamingCaptures.includes(captureType) && isCloudHosted();
 function updateConnectionInfo(config, captureActive) {
-    if ((captureType === 'websocket' || captureType === 'kafka' || captureType === 'nats') &&
-        config &&
-        captureActive) {
+    if (streamingCaptures.includes(captureType) && config && captureActive) {
         const serverEnabled = getServerEnabled(config);
         const connected = serverEnabled && !config.error;
         const message = connected
@@ -155,9 +178,22 @@ $: args && (captureActive = false);
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
+				on:testWithArgs
+			/>
+		{:else if captureType === 'postgres'}
+			<PostgresEditorConfigSection
+				bind:postgres_resource_path={args.postgres_resource_path}
+				bind:publication={args.publication}
+				{showCapture}
+				{captureInfo}
+				can_write={true}
+				headless={true}
+				bind:captureTable
+				on:applyArgs
+				on:updateSchema
+				on:addPreprocessor
+				on:captureToggle={handleCapture}
 				on:testWithArgs
 			/>
 		{:else if captureType === 'webhook'}
@@ -174,28 +210,23 @@ $: args && (captureActive = false);
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
 				on:testWithArgs
 			/>
 		{:else if captureType === 'http'}
 			<RouteEditorConfigSection
-				{isFlow}
-				{path}
 				{showCapture}
 				can_write={true}
 				runnableArgs={data?.args}
-				bind:args
+				bind:route_path={args.route_path}
+				bind:http_method={args.http_method}
 				headless
 				{captureInfo}
 				bind:captureTable
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
 				on:testWithArgs
 			/>
 		{:else if captureType === 'email'}
@@ -212,9 +243,7 @@ $: args && (captureActive = false);
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
 				on:testWithArgs
 			/>
 		{:else if captureType === 'kafka'}
@@ -229,9 +258,7 @@ $: args && (captureActive = false);
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
 				on:testWithArgs
 			/>
 		{:else if captureType === 'nats'}
@@ -246,9 +273,23 @@ $: args && (captureActive = false);
 				on:applyArgs
 				on:updateSchema
 				on:addPreprocessor
-				on:captureToggle={() => {
-					handleCapture()
-				}}
+				on:captureToggle={handleCapture}
+			/>
+		{:else if captureType === 'sqs'}
+			<SqsTriggerEditorConfigSection
+				can_write={true}
+				headless={true}
+				bind:queue_url={args.queue_url}
+				bind:aws_resource_path={args.aws_resource_path}
+				bind:message_attributes={args.message_attributes}
+				{showCapture}
+				{captureInfo}
+				bind:captureTable
+				on:applyArgs
+				on:updateSchema
+				on:addPreprocessor
+				on:captureToggle={handleCapture}
+				on:testWithArgs
 			/>
 		{/if}
 	</div>

package/package/components/triggers/CaptureWrapper.svelte.d.ts

@@ -14,8 +14,10 @@ declare const __propDef: {
         connectionInfo?: ConnectionInfo | undefined;
         args?: Record<string, any> | undefined;
         captureTable?: CaptureTable | undefined;
-        setConfig?: (() => Promise<void>) | undefined;
-        handleCapture?: (() => Promise<void>) | undefined;
+        setConfig?: (() => Promise<boolean>) | undefined;
+        handleCapture?: ((e: CustomEvent<{
+            disableOnly?: boolean;
+        }>) => Promise<void>) | undefined;
     };
     events: {
         applyArgs: any;
@@ -31,7 +33,9 @@ export type CaptureWrapperProps = typeof __propDef.props;
 export type CaptureWrapperEvents = typeof __propDef.events;
 export type CaptureWrapperSlots = typeof __propDef.slots;
 export default class CaptureWrapper extends SvelteComponent<CaptureWrapperProps, CaptureWrapperEvents, CaptureWrapperSlots> {
-    get setConfig(): () => Promise<void>;
-    get handleCapture(): () => Promise<void>;
+    get setConfig(): () => Promise<boolean>;
+    get handleCapture(): (e: CustomEvent<{
+        disableOnly?: boolean | undefined;
+    }>) => Promise<void>;
 }
 export {};

package/package/components/triggers/TestTriggerConnection.svelte

@@ -0,0 +1,82 @@
+<script>import { CancelablePromise, KafkaTriggerService, NatsTriggerService, SqsTriggerService, PostgresTriggerService, WebsocketTriggerService } from '../../gen';
+import { workspaceStore } from '../../stores';
+import { sendUserToast } from '../../toast';
+import Button from '../common/button/Button.svelte';
+export let kind;
+export let args;
+export let noButton = false;
+export let testLoading = false;
+const kindToName = {
+    websocket: 'WebSocket',
+    nats: 'NATS server(s)',
+    kafka: 'Kafka broker(s)',
+    sqs: 'SQS',
+    postgres: 'Postgres'
+};
+let promise = null;
+export async function testTriggerConnection() {
+    if (testLoading) {
+        promise?.cancel();
+        return;
+    }
+    testLoading = true;
+    try {
+        if (kind === 'websocket') {
+            promise = WebsocketTriggerService.testWebsocketConnection({
+                workspace: $workspaceStore,
+                requestBody: args
+            });
+        }
+        else if (kind === 'nats') {
+            promise = NatsTriggerService.testNatsConnection({
+                workspace: $workspaceStore,
+                requestBody: args
+            });
+        }
+        else if (kind === 'kafka') {
+            promise = KafkaTriggerService.testKafkaConnection({
+                workspace: $workspaceStore,
+                requestBody: args
+            });
+        }
+        else if (kind === 'sqs') {
+            promise = SqsTriggerService.testSqsConnection({
+                workspace: $workspaceStore,
+                requestBody: args
+            });
+        }
+        else if (kind === 'postgres') {
+            promise = PostgresTriggerService.testPostgresConnection({
+                workspace: $workspaceStore,
+                requestBody: args
+            });
+        }
+        await promise;
+        sendUserToast(`Successfully connected to ${kindToName[kind]}`);
+    }
+    catch (err) {
+        if (!promise?.isCancelled) {
+            sendUserToast(`Error testing ${kindToName[kind]}: ${err?.body ?? 'Unknown error'}`, true);
+        }
+    }
+    finally {
+        testLoading = false;
+    }
+}
+</script>
+
+{#if !noButton}
+	<div class="flex flex-row justify-end mt-1">
+		<Button
+			spacingSize="sm"
+			size="xs"
+			color="light"
+			variant="border"
+			on:click={testTriggerConnection}
+			loading={testLoading}
+			clickableWhileLoading
+		>
+			Test connection
+		</Button>
+	</div>
+{/if}

package/package/components/triggers/TestTriggerConnection.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        kind: 'websocket' | 'nats' | 'kafka' | 'postgres' | 'sqs';
+        args: Record<string, any>;
+        noButton?: boolean | undefined;
+        testLoading?: boolean | undefined;
+        testTriggerConnection?: (() => Promise<void>) | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type TestTriggerConnectionProps = typeof __propDef.props;
+export type TestTriggerConnectionEvents = typeof __propDef.events;
+export type TestTriggerConnectionSlots = typeof __propDef.slots;
+export default class TestTriggerConnection extends SvelteComponent<TestTriggerConnectionProps, TestTriggerConnectionEvents, TestTriggerConnectionSlots> {
+    get testTriggerConnection(): () => Promise<void>;
+}
+export {};

package/package/components/triggers/TriggersEditor.svelte

@@ -1,20 +1,22 @@
 <script>import Tab from '../common/tabs/Tab.svelte';
 import { Tabs } from '../common';
-import WebhooksPanel from './WebhooksPanel.svelte';
+import WebhooksPanel from './webhook/WebhooksPanel.svelte';
 import EmailTriggerPanel from '../details/EmailTriggerPanel.svelte';
-import RoutesPanel from './RoutesPanel.svelte';
+import RoutesPanel from './http/RoutesPanel.svelte';
 import RunPageSchedules from '../RunPageSchedules.svelte';
 import { canWrite } from '../../utils';
 import { userStore } from '../../stores';
 import FlowCard from '../flows/common/FlowCard.svelte';
 import { getContext, onDestroy, createEventDispatcher } from 'svelte';
-import WebsocketTriggersPanel from './WebsocketTriggersPanel.svelte';
-import ScheduledPollPanel from './ScheduledPollPanel.svelte';
-import KafkaTriggersPanel from './KafkaTriggersPanel.svelte';
-import NatsTriggersPanel from './NatsTriggersPanel.svelte';
+import ScheduledPollPanel from './scheduled/ScheduledPollPanel.svelte';
+import WebsocketTriggersPanel from './websocket/WebsocketTriggersPanel.svelte';
+import PostgresTriggersPanel from './postgres/PostgresTriggersPanel.svelte';
 import ToggleButtonGroup from '../common/toggleButton-v2/ToggleButtonGroup.svelte';
 import ToggleButton from '../common/toggleButton-v2/ToggleButton.svelte';
-import { KafkaIcon, NatsIcon } from '../icons';
+import { AwsIcon, KafkaIcon, NatsIcon } from '../icons';
+import KafkaTriggersPanel from './kafka/KafkaTriggersPanel.svelte';
+import NatsTriggersPanel from './nats/NatsTriggersPanel.svelte';
+import SqsTriggerPanel from './sqs/SqsTriggerPanel.svelte';
 export let noEditor;
 export let newItem = false;
 export let currentPath;
@@ -27,7 +29,7 @@ export let hasPreprocessor = false;
 export let args = {};
 let eventStreamType = 'kafka';
 $: {
-    if ($selectedTrigger === 'kafka' || $selectedTrigger === 'nats') {
+    if ($selectedTrigger === 'kafka' || $selectedTrigger === 'nats' || $selectedTrigger === 'sqs') {
         eventStreamType = $selectedTrigger;
     }
 }
@@ -45,10 +47,11 @@ onDestroy(() => {
 				<Tab value="webhooks" selectedClass="text-primary font-semibold">Webhooks</Tab>
 				<Tab value="schedules" selectedClass="text-primary text-sm font-semibold">Schedules</Tab>
 				<Tab value="routes" selectedClass="text-primary text-sm font-semibold">HTTP</Tab>
-				<Tab value="websockets" selectedClass="text-primary text-sm font-semibold">Websockets</Tab>
+				<Tab value="websockets" selectedClass="text-primary text-sm font-semibold">WebSockets</Tab>
+				<Tab value="postgres" selectedClass="text-primary text-sm font-semibold">Postgres</Tab>
 				<Tab
 					value="kafka"
-					otherValues={['nats']}
+					otherValues={['sqs', 'nats']}
 					selectedClass="text-primary text-sm font-semibold"
 				>
 					Event streams
@@ -129,11 +132,27 @@ onDestroy(() => {
 									{hasPreprocessor}
 								/>
 							</div>
-						{:else if $selectedTrigger === 'kafka' || $selectedTrigger === 'nats'}
+						{:else if $selectedTrigger === 'postgres'}
+							<div class="p-4">
+								<PostgresTriggersPanel
+									on:applyArgs
+									on:addPreprocessor
+									on:updateSchema
+									on:testWithArgs
+									{newItem}
+									path={currentPath}
+									{isFlow}
+									{canHavePreprocessor}
+									{hasPreprocessor}
+									isEditor={true}
+								/>
+							</div>
+						{:else if $selectedTrigger === 'kafka' || $selectedTrigger === 'nats' || $selectedTrigger === 'sqs'}
 							<div class="p-4 flex flex-col gap-2">
-								<ToggleButtonGroup bind:selected={eventStreamType}>
-									<ToggleButton value="kafka" label="Kafka" icon={KafkaIcon} />
-									<ToggleButton value="nats" label="NATS" icon={NatsIcon} />
+								<ToggleButtonGroup bind:selected={eventStreamType} let:item>
+									<ToggleButton value="kafka" label="Kafka" icon={KafkaIcon} {item} />
+									<ToggleButton value="nats" label="NATS" icon={NatsIcon} {item} />
+									<ToggleButton value="sqs" label="SQS" icon={AwsIcon} {item} />
 								</ToggleButtonGroup>
 								{#if eventStreamType === 'kafka'}
 									<KafkaTriggersPanel
@@ -159,6 +178,19 @@ onDestroy(() => {
 										{canHavePreprocessor}
 										{hasPreprocessor}
 									/>
+								{:else if eventStreamType === 'sqs'}
+									<SqsTriggerPanel
+										on:applyArgs
+										on:addPreprocessor
+										on:updateSchema
+										on:testWithArgs
+										{newItem}
+										path={currentPath}
+										{isFlow}
+										isEditor={true}
+										{canHavePreprocessor}
+										{hasPreprocessor}
+									/>
 								{/if}
 							</div>
 						{:else if $selectedTrigger === 'schedules'}

package/package/components/triggers/TriggersEditorSection.svelte

@@ -18,18 +18,23 @@ export let path = '';
 export let canHavePreprocessor = false;
 export let hasPreprocessor = false;
 export let newItem;
+export let openForm = false;
+export let alwaysOpened = false;
+export let showCapture = false;
 const captureTypeLabels = {
-    http: 'New custom HTTP route',
-    websocket: 'New websocket trigger',
+    http: '+ New custom HTTP route',
+    websocket: '+ New WebSocket trigger',
     webhook: 'Webhook',
-    kafka: 'New kafka trigger',
+    kafka: '+ New Kafka trigger',
     email: 'Email trigger',
-    nats: 'NATS trigger'
+    nats: '+ New NATS trigger',
+    sqs: '+ New SQS trigger',
+    postgres: '+ New Postgres trigger'
 };
 const { captureOn } = getContext('TriggerContext');
 let args = {};
+$: collapsed = !openForm;
 const dispatch = createEventDispatcher();
-let showCapture = false;
 let init = false;
 $: updateShowCapture(!!$captureOn);
 function updateShowCapture(show) {
@@ -41,55 +46,57 @@ function updateShowCapture(show) {
 }
 </script>
 
-<Section label={captureTypeLabels[triggerType]}>
+<Section label={captureTypeLabels[triggerType]} collapsable={!alwaysOpened} bind:collapsed>
 	<svelte:fragment slot="action">
-		<div class="flex flex-row grow w-min-0 gap-2 items-center justify-end">
-			{#if isEditor}
-				<Button
-					size="xs2"
-					on:click={() => {
-						showCapture = !showCapture
-					}}
-					variant="border"
-					color="light"
-					endIcon={{
-						icon: ChevronDown,
-						classes: twMerge('transition', showCapture ? 'rotate-180' : '')
-					}}
-				>
-					Test trigger
-				</Button>
-			{/if}
-
-			{#if !noSave}
-				{@const disabled = newItem || cloudDisabled}
-				<Popover notClickable>
+		{#if !collapsed || alwaysOpened}
+			<div class="flex flex-row grow w-min-0 gap-2 items-center justify-end">
+				{#if isEditor}
 					<Button
 						size="xs2"
-						{disabled}
-						startIcon={{ icon: Save }}
 						on:click={() => {
-							dispatch('saveTrigger', {
-								config: args
-							})
+							showCapture = !showCapture
+						}}
+						variant="border"
+						color="light"
+						endIcon={{
+							icon: ChevronDown,
+							classes: twMerge('transition', showCapture ? 'rotate-180' : '')
 						}}
 					>
-						Save
+						Test trigger
 					</Button>
-					<svelte:fragment slot="text">
-						{#if disabled}
-							{#if newItem}
-								Deploy the runnable to enable trigger creation
-							{:else if cloudDisabled}
-								{capitalize(triggerType)} triggers are disabled in the multi-tenant cloud
+				{/if}
+
+				{#if !noSave}
+					{@const disabled = newItem || cloudDisabled}
+					<Popover notClickable>
+						<Button
+							size="xs2"
+							{disabled}
+							startIcon={{ icon: Save }}
+							on:click={() => {
+								dispatch('saveTrigger', {
+									config: args
+								})
+							}}
+						>
+							Save
+						</Button>
+						<svelte:fragment slot="text">
+							{#if disabled}
+								{#if newItem}
+									Deploy the runnable to enable trigger creation
+								{:else if cloudDisabled}
+									{capitalize(triggerType)} triggers are disabled in the multi-tenant cloud
+								{/if}
+							{:else}
+								Create new {captureTypeLabels[triggerType].toLowerCase()}
 							{/if}
-						{:else}
-							Create new {captureTypeLabels[triggerType].toLowerCase()}
-						{/if}
-					</svelte:fragment>
-				</Popover>
-			{/if}
-		</div>
+						</svelte:fragment>
+					</Popover>
+				{/if}
+			</div>
+		{/if}
 	</svelte:fragment>
 
 	{#if isEditor}

package/package/components/triggers/TriggersEditorSection.svelte.d.ts

@@ -12,6 +12,9 @@ declare const __propDef: {
         canHavePreprocessor?: boolean | undefined;
         hasPreprocessor?: boolean | undefined;
         newItem: boolean;
+        openForm?: boolean | undefined;
+        alwaysOpened?: boolean | undefined;
+        showCapture?: boolean | undefined;
     };
     events: {
         applyArgs: any;

package/package/components/triggers/TriggersWrapper.svelte

@@ -1,12 +1,14 @@
 <script>import {} from '../../gen';
 import { capitalize } from '../../utils';
 import Alert from '../common/alert/Alert.svelte';
-import RouteEditorConfigSection from './RouteEditorConfigSection.svelte';
-import WebsocketEditorConfigSection from './WebsocketEditorConfigSection.svelte';
-import WebhooksConfigSection from './WebhooksConfigSection.svelte';
+import RouteEditorConfigSection from './http/RouteEditorConfigSection.svelte';
+import WebsocketEditorConfigSection from './websocket/WebsocketEditorConfigSection.svelte';
+import WebhooksConfigSection from './webhook/WebhooksConfigSection.svelte';
 import EmailTriggerConfigSection from '../details/EmailTriggerConfigSection.svelte';
-import KafkaTriggersConfigSection from './KafkaTriggersConfigSection.svelte';
-import NatsTriggersConfigSection from './NatsTriggersConfigSection.svelte';
+import KafkaTriggersConfigSection from './kafka/KafkaTriggersConfigSection.svelte';
+import NatsTriggersConfigSection from './nats/NatsTriggersConfigSection.svelte';
+import SqsTriggerEditorConfigSection from './sqs/SqsTriggerEditorConfigSection.svelte';
+import PostgresEditorConfigSection from './postgres/PostgresEditorConfigSection.svelte';
 export let triggerType = 'webhook';
 export let cloudDisabled = false;
 export let args;
@@ -28,6 +30,14 @@ export let data = {};
 			bind:url_runnable_args={args.url_runnable_args}
 			showCapture={false}
 		/>
+	{:else if triggerType === 'postgres'}
+		<PostgresEditorConfigSection
+			can_write={true}
+			headless={true}
+			showCapture={false}
+			bind:publication={args.publication}
+			bind:postgres_resource_path={args.postgres_resource_path}
+		/>
 	{:else if triggerType === 'webhook'}
 		<WebhooksConfigSection
 			{isFlow}
@@ -42,10 +52,9 @@ export let data = {};
 		<RouteEditorConfigSection
 			showCapture={false}
 			can_write={true}
-			bind:args
+			bind:route_path={args.route_path}
+			bind:http_method={args.http_method}
 			headless
-			{isFlow}
-			{path}
 		/>
 	{:else if triggerType === 'email'}
 		<EmailTriggerConfigSection
@@ -60,5 +69,14 @@ export let data = {};
 		<KafkaTriggersConfigSection headless={true} bind:args staticInputDisabled={false} {path} />
 	{:else if triggerType === 'nats'}
 		<NatsTriggersConfigSection headless={true} bind:args staticInputDisabled={false} {path} />
+	{:else if triggerType === 'sqs'}
+		<SqsTriggerEditorConfigSection
+			bind:queue_url={args.queue_url}
+			bind:aws_resource_path={args.aws_resource_path}
+			bind:message_attributes={args.message_attributes}
+			headless={true}
+			can_write={true}
+			showCapture={false}
+		/>
 	{/if}
 </div>