windmill-components 1.504.6 → 1.510.1

package/package/components/triggers/mqtt/MqttEditorConfigSection.svelte

@@ -7,18 +7,12 @@ import ResourcePicker from '../../ResourcePicker.svelte';
 import Button from '../../common/button/Button.svelte';
 import { fade } from 'svelte/transition';
 import ToggleButton from '../../common/toggleButton-v2/ToggleButton.svelte';
-import Toggle from '../../Toggle.svelte';
 import { emptyStringTrimmed } from '../../../utils';
-import { DEFAULT_V3_CONFIG, DEFAULT_V5_CONFIG } from './constant';
 import TestTriggerConnection from '../TestTriggerConnection.svelte';
 import Tooltip from '../../Tooltip.svelte';
 import ToggleButtonGroup from '../../common/toggleButton-v2/ToggleButtonGroup.svelte';
 import TestingBadge from '../testingBadge.svelte';
-let { can_write = false, headless = false, mqtt_resource_path = $bindable(''), subscribe_topics = $bindable([]), v3_config = $bindable(DEFAULT_V3_CONFIG), v5_config = $bindable(DEFAULT_V5_CONFIG), client_version = $bindable('v5'), isValid = $bindable(false), client_id = $bindable(''), showTestingBadge = false } = $props();
-const activateV5Options = $state({
-    topic_alias: Boolean(v5_config.topic_alias),
-    session_expiry_interval: Boolean(v5_config.session_expiry_interval)
-});
+let { can_write = false, mqtt_resource_path = $bindable(''), subscribe_topics = $bindable([]), client_version = $bindable('v5'), isValid = $bindable(false), client_id = $bindable(''), showTestingBadge = false } = $props();
 const isValidSubscribeTopics = (subscribe_topics) => {
     if (subscribe_topics.length === 0 ||
         subscribe_topics.find((subscribe_topic) => emptyStringTrimmed(subscribe_topic.topic))) {
@@ -31,14 +25,14 @@ run(() => {
 });
 </script>
 
-<div>
-	<Section label="MQTT" {headless}>
+<div class="flex flex-col gap-12">
+	<Section label="MQTT">
 		{#snippet header()}
 			{#if showTestingBadge}
 				<TestingBadge />
 			{/if}
 		{/snippet}
-		<div class="flex flex-col w-full gap-4">
+		<div class="flex flex-col w-full gap-12">
 			<Subsection label="Connection setup">
 				<ResourcePicker resourceType="mqtt" disabled={!can_write} bind:value={mqtt_resource_path} />
 				{#if !emptyStringTrimmed(mqtt_resource_path)}
@@ -162,128 +156,6 @@ run(() => {
 					</div>
 				</div>
 			</Subsection>
-
-			<Subsection label="Advanced" collapsable={true}>
-				<div class="flex p-2 flex-col gap-2 mt-3">
-					<ToggleButtonGroup bind:selected={client_version}>
-						{#snippet children({ item })}
-							<ToggleButton value="v5" label="Version 5" {item} />
-							<ToggleButton value="v3" label="Version 3" {item} />
-						{/snippet}
-					</ToggleButtonGroup>
-
-					<input
-						type="text"
-						bind:value={client_id}
-						disabled={!can_write}
-						placeholder="Client id"
-						autocomplete="off"
-					/>
-
-					{#if client_version === 'v5'}
-						<Toggle
-							textClass="font-normal text-sm"
-							color="nord"
-							size="xs"
-							checked={v5_config.clean_start}
-							on:change={() => {
-								v5_config.clean_start = !v5_config.clean_start
-							}}
-							options={{
-								right: 'Clean start',
-								rightTooltip:
-									'Start a new session without any stored messages or subscriptions if enabled. Otherwise, resume the previous session with stored subscriptions and undelivered messages. The default setting is 0.',
-								rightDocumentationLink:
-									'https://docs.oasis-open.org/mqtt/mqtt/v5.0/os/mqtt-v5.0-os.html#_Toc3901039'
-							}}
-							class="py-1"
-						/>
-
-						<div class="flex flex-col gap-2">
-							<Toggle
-								textClass="font-normal text-sm"
-								color="nord"
-								size="xs"
-								checked={activateV5Options.session_expiry_interval}
-								on:change={() => {
-									activateV5Options.session_expiry_interval =
-										!activateV5Options.session_expiry_interval
-									if (!activateV5Options.session_expiry_interval) {
-										v5_config.session_expiry_interval = undefined
-									}
-								}}
-								options={{
-									right: 'Session expiry interval',
-									rightTooltip:
-										'Defines the time in seconds that the broker will retain the session after disconnection. If set to 0, the session ends immediately. If set to 4,294,967,295, the session will be retained indefinitely. Otherwise, subscriptions and undelivered messages are stored until the interval expires.',
-									rightDocumentationLink: ''
-								}}
-								class="py-1"
-							/>
-
-							{#if activateV5Options.session_expiry_interval}
-								<input
-									type="number"
-									bind:value={v5_config.session_expiry_interval}
-									disabled={!can_write}
-									placeholder="Session expiry interval"
-									autocomplete="off"
-								/>
-							{/if}
-						</div>
-
-						<div class="flex flex-col gap-2">
-							<Toggle
-								textClass="font-normal text-sm"
-								color="nord"
-								size="xs"
-								checked={activateV5Options.topic_alias}
-								on:change={() => {
-									activateV5Options.topic_alias = !activateV5Options.topic_alias
-									if (!activateV5Options.topic_alias) {
-										v5_config.topic_alias = undefined
-									}
-								}}
-								options={{
-									right: 'Topic alias maximum',
-									rightTooltip:
-										'Defines the maximum topic alias value the client will accept from the broker. A value of 0 indicates that topic aliases are not supported. The default value is 65536, which is the maximum allowed topic alias.',
-									rightDocumentationLink:
-										'https://docs.oasis-open.org/mqtt/mqtt/v5.0/os/mqtt-v5.0-os.html#_Toc3901051'
-								}}
-								class="py-1"
-							/>
-
-							{#if activateV5Options.topic_alias}
-								<input
-									type="number"
-									bind:value={v5_config.topic_alias}
-									disabled={!can_write}
-									placeholder="Topic alias"
-									autocomplete="off"
-								/>
-							{/if}
-						</div>
-					{:else if client_version === 'v3'}
-						<Toggle
-							textClass="font-normal text-sm"
-							color="nord"
-							size="xs"
-							checked={v3_config.clean_session}
-							on:change={() => {
-								v3_config.clean_session = !v3_config.clean_session
-							}}
-							options={{
-								right: 'Clean session',
-								rightTooltip:
-									'Starts a new session without any stored messages or subscriptions if enabled. Otherwise, it resumes the previous session with stored subscriptions and undelivered messages. The default value is 0',
-								rightDocumentationLink: ''
-							}}
-							class="py-1"
-						/>
-					{/if}
-				</div>
-			</Subsection>
 		</div>
 	</Section>
 </div>

package/package/components/triggers/mqtt/MqttEditorConfigSection.svelte.d.ts

@@ -1,16 +1,13 @@
-import type { MqttClientVersion, MqttV3Config, MqttV5Config, MqttSubscribeTopic } from '../../../gen';
+import type { MqttClientVersion, MqttSubscribeTopic } from '../../../gen';
 interface Props {
     can_write?: boolean;
-    headless?: boolean;
     mqtt_resource_path?: string;
     subscribe_topics?: MqttSubscribeTopic[];
-    v3_config?: MqttV3Config;
-    v5_config?: MqttV5Config;
     client_version?: MqttClientVersion;
     isValid?: boolean;
     client_id?: string;
     showTestingBadge?: boolean;
 }
-declare const MqttEditorConfigSection: import("svelte").Component<Props, {}, "subscribe_topics" | "mqtt_resource_path" | "client_id" | "client_version" | "v3_config" | "v5_config" | "isValid">;
+declare const MqttEditorConfigSection: import("svelte").Component<Props, {}, "subscribe_topics" | "mqtt_resource_path" | "client_id" | "client_version" | "isValid">;
 type MqttEditorConfigSection = ReturnType<typeof MqttEditorConfigSection>;
 export default MqttEditorConfigSection;

package/package/components/triggers/mqtt/MqttTriggerEditorInner.svelte

@@ -13,7 +13,14 @@ import { MqttTriggerService } from '../../../gen';
 import MqttEditorConfigSection from './MqttEditorConfigSection.svelte';
 import TriggerEditorToolbar from '../TriggerEditorToolbar.svelte';
 import { saveMqttTriggerFromCfg } from './utils';
-import { handleConfigChange } from '../utils';
+import { getHandlerType, handleConfigChange } from '../utils';
+import Tabs from '../../common/tabs/Tabs.svelte';
+import Tab from '../../common/tabs/Tab.svelte';
+import TriggerRetriesAndErrorHandler from '../TriggerRetriesAndErrorHandler.svelte';
+import Toggle from '../../Toggle.svelte';
+import ToggleButtonGroup from '../../common/toggleButton-v2/ToggleButtonGroup.svelte';
+import ToggleButton from '../../common/toggleButton-v2/ToggleButton.svelte';
+import { DEFAULT_V3_CONFIG, DEFAULT_V5_CONFIG } from './constant';
 let { useDrawer = true, description = undefined, hideTarget = false, hideTooltips = false, isEditor = false, allowDraft = false, trigger = undefined, customLabel = undefined, isDeployed = false, onConfigChange = undefined, onCaptureConfigChange = undefined, onUpdate = undefined, onDelete = undefined, onReset = undefined, cloudDisabled = false } = $props();
 let mqtt_resource_path = $state('');
 let drawer = $state(undefined);
@@ -32,16 +39,25 @@ let can_write = $state(true);
 let drawerLoading = $state(true);
 let showLoading = $state(false);
 let subscribe_topics = $state([]);
-let v3_config = $state({});
-let v5_config = $state({});
+let v3_config = $state(DEFAULT_V3_CONFIG);
+let v5_config = $state(DEFAULT_V5_CONFIG);
 let client_version = $state();
 let client_id = $state('');
 let isValid = $state(false);
 let initialConfig = {};
 let deploymentLoading = $state(false);
+let errorHandlerSelected = $state('slack');
+let error_handler_path = $state();
+let error_handler_args = $state({});
+let retry = $state();
+let optionTabSelected = $state('connection_options');
 const mqttConfig = $derived.by(getSaveCfg);
 const captureConfig = $derived.by(isEditor ? getCaptureConfig : () => ({}));
 const saveDisabled = $derived(pathError != '' || emptyString(script_path) || !can_write || !isValid);
+const activateV5Options = $state({
+    topic_alias_maximum: Boolean(DEFAULT_V5_CONFIG.topic_alias_maximum),
+    session_expiry_interval: Boolean(DEFAULT_V5_CONFIG.session_expiry_interval)
+});
 $effect(() => {
     is_flow = itemKind === 'flow';
 });
@@ -91,6 +107,14 @@ export async function openNew(nis_flow, fixedScriptPath_, defaultValues) {
         client_version = defaultValues?.client_version ?? 'v5';
         client_id = defaultValues?.client_id ?? '';
         enabled = defaultValues?.enabled ?? false;
+        error_handler_path = defaultValues?.error_handler_path ?? undefined;
+        error_handler_args = defaultValues?.error_handler_args ?? {};
+        retry = defaultValues?.retry ?? undefined;
+        errorHandlerSelected = getHandlerType(error_handler_path ?? '');
+        v3_config = defaultValues?.v3_config ?? DEFAULT_V3_CONFIG;
+        v5_config = defaultValues?.v5_config ?? DEFAULT_V5_CONFIG;
+        activateV5Options.topic_alias_maximum = Boolean(defaultValues?.v5_config?.topic_alias_maximum);
+        activateV5Options.session_expiry_interval = Boolean(defaultValues?.v5_config?.session_expiry_interval);
     }
     finally {
         clearTimeout(loadingTimeout);
@@ -108,10 +132,16 @@ async function loadTriggerConfig(cfg) {
         path = cfg?.path;
         enabled = cfg?.enabled;
         client_version = cfg?.client_version;
-        v3_config = cfg?.v3_config;
-        v5_config = cfg?.v5_config;
+        v3_config = cfg?.v3_config ?? DEFAULT_V3_CONFIG;
+        v5_config = cfg?.v5_config ?? DEFAULT_V5_CONFIG;
         client_id = cfg?.client_id ?? '';
         can_write = canWrite(cfg?.path, cfg?.extra_perms, $userStore);
+        error_handler_path = cfg?.error_handler_path;
+        error_handler_args = cfg?.error_handler_args ?? {};
+        retry = cfg?.retry;
+        errorHandlerSelected = getHandlerType(error_handler_path ?? '');
+        activateV5Options.topic_alias_maximum = Boolean(v5_config.topic_alias_maximum);
+        activateV5Options.session_expiry_interval = Boolean(v5_config.session_expiry_interval);
     }
     catch (error) {
         sendUserToast(`Could not load mqtt trigger config: ${error.body}`, true);
@@ -146,7 +176,10 @@ function getSaveCfg() {
         path,
         script_path,
         enabled,
-        is_flow
+        is_flow,
+        error_handler_path,
+        error_handler_args,
+        retry
     };
 }
 function getCaptureConfig() {
@@ -317,13 +350,149 @@ $effect(() => {
 				bind:subscribe_topics
 				{can_write}
 				bind:client_version
-				bind:v3_config
-				bind:v5_config
 				bind:isValid
 				bind:client_id
-				headless={true}
 				showTestingBadge={isEditor}
 			/>
+
+			<Section label="Advanced" collapsable>
+				<div class="flex flex-col gap-4">
+					<div class="min-h-96">
+						<Tabs bind:selected={optionTabSelected}>
+							<Tab value="connection_options">Connection Options</Tab>
+							<Tab value="error_handler">Error Handler</Tab>
+							<Tab value="retries">Retries</Tab>
+						</Tabs>
+						<div class="mt-4">
+							{#if optionTabSelected === 'connection_options'}
+								<div class="flex p-2 flex-col gap-2 mt-3">
+									<ToggleButtonGroup bind:selected={client_version}>
+										{#snippet children({ item })}
+											<ToggleButton value="v5" label="Version 5" {item} />
+											<ToggleButton value="v3" label="Version 3" {item} />
+										{/snippet}
+									</ToggleButtonGroup>
+
+									<input
+										type="text"
+										bind:value={client_id}
+										disabled={!can_write}
+										placeholder="Client id"
+										autocomplete="off"
+									/>
+
+									{#if client_version === 'v5'}
+										<Toggle
+											textClass="font-normal text-sm"
+											color="nord"
+											size="xs"
+											bind:checked={v5_config.clean_start}
+											options={{
+												right: 'Clean start',
+												rightTooltip:
+													'Start a new session without any stored messages or subscriptions if enabled. Otherwise, resume the previous session with stored subscriptions and undelivered messages. The default setting is 0.',
+												rightDocumentationLink:
+													'https://docs.oasis-open.org/mqtt/mqtt/v5.0/os/mqtt-v5.0-os.html#_Toc3901039'
+											}}
+											class="py-1"
+										/>
+
+										<div class="flex flex-col gap-2">
+											<Toggle
+												textClass="font-normal text-sm"
+												color="nord"
+												size="xs"
+												bind:checked={activateV5Options.session_expiry_interval}
+												on:change={(ev) => {
+													if (!ev.detail) {
+														v5_config.session_expiry_interval = undefined
+													}
+												}}
+												options={{
+													right: 'Session expiry interval',
+													rightTooltip:
+														'Defines the time in seconds that the broker will retain the session after disconnection. If set to 0, the session ends immediately. If set to 4,294,967,295, the session will be retained indefinitely. Otherwise, subscriptions and undelivered messages are stored until the interval expires.',
+													rightDocumentationLink: ''
+												}}
+												class="py-1"
+											/>
+
+											{#if activateV5Options.session_expiry_interval}
+												<input
+													type="number"
+													bind:value={v5_config.session_expiry_interval}
+													disabled={!can_write}
+													placeholder="Session expiry interval"
+													autocomplete="off"
+												/>
+											{/if}
+										</div>
+
+										<div class="flex flex-col gap-2">
+											<Toggle
+												textClass="font-normal text-sm"
+												color="nord"
+												size="xs"
+												bind:checked={activateV5Options.topic_alias_maximum}
+												on:change={(ev) => {
+													if (!ev.detail) {
+														v5_config.topic_alias_maximum = undefined
+													}
+												}}
+												options={{
+													right: 'Topic alias maximum',
+													rightTooltip:
+														'Defines the maximum topic alias value the client will accept from the broker. A value of 0 indicates that topic aliases are not supported. The default value is 65536, which is the maximum allowed topic alias.',
+													rightDocumentationLink:
+														'https://docs.oasis-open.org/mqtt/mqtt/v5.0/os/mqtt-v5.0-os.html#_Toc3901051'
+												}}
+												class="py-1"
+											/>
+
+											{#if activateV5Options.topic_alias_maximum}
+												<input
+													type="number"
+													bind:value={v5_config.topic_alias_maximum}
+													disabled={!can_write}
+													placeholder="Topic alias"
+													autocomplete="off"
+												/>
+											{/if}
+										</div>
+									{:else if client_version === 'v3'}
+										<Toggle
+											textClass="font-normal text-sm"
+											color="nord"
+											size="xs"
+											checked={v3_config.clean_session}
+											on:change={() => {
+												v3_config.clean_session = !v3_config.clean_session
+											}}
+											options={{
+												right: 'Clean session',
+												rightTooltip:
+													'Starts a new session without any stored messages or subscriptions if enabled. Otherwise, it resumes the previous session with stored subscriptions and undelivered messages. The default value is 0',
+												rightDocumentationLink: ''
+											}}
+											class="py-1"
+										/>
+									{/if}
+								</div>
+							{:else}
+								<TriggerRetriesAndErrorHandler
+									{optionTabSelected}
+									{itemKind}
+									{can_write}
+									bind:errorHandlerSelected
+									bind:error_handler_path
+									bind:error_handler_args
+									bind:retry
+								/>
+							{/if}
+						</div>
+					</div>
+				</div>
+			</Section>
 		</div>
 	{/if}
 {/snippet}

package/package/components/triggers/mqtt/utils.js

@@ -2,6 +2,13 @@ import { MqttTriggerService } from '../../../gen';
 import { sendUserToast } from '../../../toast';
 import { get } from 'svelte/store';
 export async function saveMqttTriggerFromCfg(initialPath, cfg, edit, workspace, usedTriggerKinds) {
+    const errorHandlerAndRetries = !cfg.is_flow
+        ? {
+            error_handler_path: cfg.error_handler_path,
+            error_handler_args: cfg.error_handler_path ? cfg.error_handler_args : undefined,
+            retry: cfg.retry
+        }
+        : {};
     const requestBody = {
         client_id: cfg.client_id,
         client_version: cfg.client_version,
@@ -12,7 +19,8 @@ export async function saveMqttTriggerFromCfg(initialPath, cfg, edit, workspace,
         path: cfg.path,
         script_path: cfg.script_path,
         enabled: cfg.enabled,
-        is_flow: cfg.is_flow
+        is_flow: cfg.is_flow,
+        ...errorHandlerAndRetries
     };
     try {
         if (edit) {

package/package/components/triggers/nats/NatsTriggerEditorInner.svelte

@@ -14,7 +14,10 @@ import NatsTriggersConfigSection from './NatsTriggersConfigSection.svelte';
 import { untrack } from 'svelte';
 import TriggerEditorToolbar from '../TriggerEditorToolbar.svelte';
 import { saveNatsTriggerFromCfg } from './utils';
-import { handleConfigChange } from '../utils';
+import { getHandlerType, handleConfigChange } from '../utils';
+import Tabs from '../../common/tabs/Tabs.svelte';
+import Tab from '../../common/tabs/Tab.svelte';
+import TriggerRetriesAndErrorHandler from '../TriggerRetriesAndErrorHandler.svelte';
 let { useDrawer = true, description = undefined, hideTarget = false, hideTooltips = false, isEditor = false, allowDraft = false, trigger = undefined, isDeployed = false, cloudDisabled = false, customLabel = undefined, onConfigChange = undefined, onCaptureConfigChange = undefined, onUpdate = undefined, onDelete = undefined, onReset = undefined } = $props();
 let drawer = $state(undefined);
 let is_flow = $state(false);
@@ -40,6 +43,11 @@ let consumerName = $state('');
 let initialConfig = undefined;
 let deploymentLoading = $state(false);
 let isValid = $state(false);
+let optionTabSelected = $state('error_handler');
+let errorHandlerSelected = $state('slack');
+let error_handler_path = $state();
+let error_handler_args = $state({});
+let retry = $state();
 const saveDisabled = $derived(pathError != '' || emptyString(script_path) || !can_write || !isValid);
 const natsConfig = $derived.by(getSaveCfg);
 const captureConfig = $derived.by(isEditor ? getCaptureConfig : () => ({}));
@@ -94,6 +102,10 @@ export async function openNew(nis_flow, fixedScriptPath_, nDefaultValues) {
         dirtyPath = false;
         defaultValues = nDefaultValues;
         enabled = nDefaultValues?.enabled ?? false;
+        error_handler_path = nDefaultValues?.error_handler_path ?? undefined;
+        error_handler_args = nDefaultValues?.error_handler_args ?? {};
+        retry = nDefaultValues?.retry ?? undefined;
+        errorHandlerSelected = getHandlerType(error_handler_path ?? '');
     }
     finally {
         clearTimeout(loadingTimeout);
@@ -113,6 +125,10 @@ async function loadTriggerConfig(cfg) {
     useJetstream = cfg?.use_jetstream || false;
     enabled = cfg?.enabled;
     can_write = canWrite(cfg?.path, cfg?.extra_perms, $userStore);
+    error_handler_path = cfg?.error_handler_path;
+    error_handler_args = cfg?.error_handler_args ?? {};
+    retry = cfg?.retry;
+    errorHandlerSelected = getHandlerType(error_handler_path ?? '');
 }
 async function loadTrigger(defaultConfig) {
     if (defaultConfig) {
@@ -137,7 +153,10 @@ function getSaveCfg() {
         stream_name: streamName,
         consumer_name: consumerName,
         subjects,
-        use_jetstream: useJetstream
+        use_jetstream: useJetstream,
+        error_handler_path,
+        error_handler_args,
+        retry
     };
 }
 async function updateTrigger() {
@@ -317,6 +336,28 @@ $effect(() => {
 				{can_write}
 				showTestingBadge={isEditor}
 			/>
+
+			<Section label="Advanced" collapsable>
+				<div class="flex flex-col gap-4">
+					<div class="min-h-96">
+						<Tabs bind:selected={optionTabSelected}>
+							<Tab value="error_handler">Error Handler</Tab>
+							<Tab value="retries">Retries</Tab>
+						</Tabs>
+						<div class="mt-4">
+							<TriggerRetriesAndErrorHandler
+								{optionTabSelected}
+								{itemKind}
+								{can_write}
+								bind:errorHandlerSelected
+								bind:error_handler_path
+								bind:error_handler_args
+								bind:retry
+							/>
+						</div>
+					</div>
+				</div>
+			</Section>
 		</div>
 	{/if}
 {/snippet}

package/package/components/triggers/nats/utils.js

@@ -2,6 +2,13 @@ import { NatsTriggerService } from '../../../gen';
 import { sendUserToast } from '../../../toast';
 import { get } from 'svelte/store';
 export async function saveNatsTriggerFromCfg(initialPath, cfg, edit, workspace, usedTriggerKinds) {
+    const errorHandlerAndRetries = !cfg.is_flow
+        ? {
+            error_handler_path: cfg.error_handler_path,
+            error_handler_args: cfg.error_handler_path ? cfg.error_handler_args : undefined,
+            retry: cfg.retry
+        }
+        : {};
     const requestBody = {
         path: cfg.path,
         script_path: cfg.script_path,
@@ -10,7 +17,8 @@ export async function saveNatsTriggerFromCfg(initialPath, cfg, edit, workspace,
         stream_name: cfg.stream_name,
         consumer_name: cfg.consumer_name,
         subjects: cfg.subjects,
-        use_jetstream: cfg.use_jetstream
+        use_jetstream: cfg.use_jetstream,
+        ...errorHandlerAndRetries
     };
     try {
         if (edit) {

package/package/components/triggers/postgres/PostgresTriggerEditorInner.svelte

@@ -26,7 +26,8 @@ import { base } from '../../../base';
 import { untrack } from 'svelte';
 import TriggerEditorToolbar from '../TriggerEditorToolbar.svelte';
 import TestingBadge from '../testingBadge.svelte';
-import { handleConfigChange } from '../utils';
+import { getHandlerType, handleConfigChange } from '../utils';
+import TriggerRetriesAndErrorHandler from '../TriggerRetriesAndErrorHandler.svelte';
 import { fade } from 'svelte/transition';
 import MultiSelect from '../../select/MultiSelect.svelte';
 import { safeSelectItems } from '../../select/utils.svelte';
@@ -66,6 +67,11 @@ let deploymentLoading = $state(false);
 let creatingSlot = $state(false);
 let creatingPublication = $state(false);
 let pg14 = $derived(postgresVersion.startsWith('14'));
+let optionTabSelected = $state('error_handler');
+let errorHandlerSelected = $state('slack');
+let error_handler_path = $state();
+let error_handler_args = $state({});
+let retry = $state();
 const errorMessage = $derived.by(() => {
     if (relations && relations.length > 0) {
         return invalidRelations(relations, {
@@ -200,6 +206,10 @@ export async function openNew(nis_flow, fixedScriptPath_, defaultValues, newDraf
                 table_to_track: []
             }
         ];
+        error_handler_path = defaultValues?.error_handler_path ?? undefined;
+        error_handler_args = defaultValues?.error_handler_args ?? {};
+        retry = defaultValues?.retry ?? undefined;
+        errorHandlerSelected = getHandlerType(error_handler_path ?? '');
     }
     finally {
         clearTimeout(loadingTimeout);
@@ -221,7 +231,10 @@ function getSaveCfg() {
                 transaction_to_track: transaction_to_track,
                 table_to_track: relations
             }
-            : undefined
+            : undefined,
+        error_handler_path,
+        error_handler_args,
+        retry
     };
     return cfg;
 }
@@ -237,6 +250,10 @@ async function loadTriggerConfig(cfg) {
     can_write = canWrite(path, cfg?.extra_perms, $userStore);
     transaction_to_track = [...cfg?.publication?.transaction_to_track];
     relations = cfg?.publication?.table_to_track ?? [];
+    error_handler_path = cfg?.error_handler_path;
+    error_handler_args = cfg?.error_handler_args ?? {};
+    retry = cfg?.retry;
+    errorHandlerSelected = getHandlerType(error_handler_path ?? '');
 }
 async function loadTrigger(defaultConfig) {
     if (defaultConfig) {
@@ -705,6 +722,28 @@ $effect(() => {
 					{/if}
 				</div>
 			</Section>
+
+			<Section label="Advanced" collapsable>
+				<div class="flex flex-col gap-4">
+					<div class="min-h-96">
+						<Tabs bind:selected={optionTabSelected}>
+							<Tab value="error_handler">Error Handler</Tab>
+							<Tab value="retries">Retries</Tab>
+						</Tabs>
+						<div class="mt-4">
+							<TriggerRetriesAndErrorHandler
+								{optionTabSelected}
+								{itemKind}
+								{can_write}
+								bind:errorHandlerSelected
+								bind:error_handler_path
+								bind:error_handler_args
+								bind:retry
+							/>
+						</div>
+					</div>
+				</div>
+			</Section>
 		</div>
 	{/if}
 {/snippet}

package/package/components/triggers/postgres/utils.js

@@ -81,6 +81,13 @@ export function invalidRelations(relations, options) {
 }
 export async function savePostgresTriggerFromCfg(initialPath, config, edit, workspace, usedTriggerKinds) {
     try {
+        const errorHandlerAndRetries = !config.is_flow
+            ? {
+                error_handler_path: config.error_handler_path,
+                error_handler_args: config.error_handler_path ? config.error_handler_args : undefined,
+                retry: config.retry
+            }
+            : {};
         const requestBody = {
             path: config.path,
             script_path: config.script_path,
@@ -89,7 +96,8 @@ export async function savePostgresTriggerFromCfg(initialPath, config, edit, work
             replication_slot_name: config.replication_slot_name,
             publication_name: config.publication_name,
             publication: config.publication,
-            enabled: config.enabled
+            enabled: config.enabled,
+            ...errorHandlerAndRetries
         };
         if (edit) {
             await PostgresTriggerService.updatePostgresTrigger({