windmill-components 1.558.4 → 1.596.0

package/package/components/triggers/email/EmailTriggerEditorInner.svelte

@@ -6,7 +6,7 @@ import Required from '../../Required.svelte';
 import ScriptPicker from '../../ScriptPicker.svelte';
 import { EmailTriggerService } from '../../../gen';
 import { usedTriggerKinds, userStore, workspaceStore } from '../../../stores';
-import { canWrite, emptyString, sendUserToast } from '../../../utils';
+import { canWrite, capitalize, emptyString, sendUserToast } from '../../../utils';
 import Section from '../../Section.svelte';
 import { Loader2 } from 'lucide-svelte';
 import Label from '../../Label.svelte';
@@ -18,6 +18,9 @@ import Tabs from '../../common/tabs/Tabs.svelte';
 import Tab from '../../common/tabs/Tab.svelte';
 import TriggerRetriesAndErrorHandler from '../TriggerRetriesAndErrorHandler.svelte';
 import { saveEmailTriggerFromCfg } from './utils';
+import { deepEqual } from 'fast-equals';
+import TriggerSuspendedJobsAlert from '../TriggerSuspendedJobsAlert.svelte';
+import TriggerSuspendedJobsModal from '../TriggerSuspendedJobsModal.svelte';
 let { useDrawer = true, hideTarget = false, description = undefined, isEditor = false, customLabel = undefined, allowDraft = false, isDeployed = false, onConfigChange = undefined, onCaptureConfigChange = undefined, onUpdate = undefined, onDelete = undefined, onReset = undefined, trigger = undefined, customSaveBehavior = undefined } = $props();
 // Form data state
 let initialPath = $state('');
@@ -41,16 +44,25 @@ let extraPerms = $state(undefined);
 let error_handler_path = $state();
 let error_handler_args = $state({});
 let retry = $state();
+let mode = $state('enabled');
 // Component references
 let drawer = $state(undefined);
 let initialConfig = undefined;
 let deploymentLoading = $state(false);
 let optionTabSelected = $state('error_handler');
 let errorHandlerSelected = $state('slack');
+let suspendedJobsModal = $state(null);
+let originalConfig = $state(undefined);
+let hasChanged = $derived(!deepEqual(getEmailTriggerConfig(), originalConfig ?? {}));
 const isAdmin = $derived($userStore?.is_admin || $userStore?.is_super_admin);
-const routeConfig = $derived.by(getEmailTriggerConfig);
+const emailConfig = $derived.by(getEmailTriggerConfig);
 const captureConfig = $derived.by(isEditor ? getCaptureConfig : () => ({}));
-const saveDisabled = $derived(drawerLoading || !can_write || pathError != '' || !isValid || emptyString(script_path));
+const saveDisabled = $derived(drawerLoading ||
+    !can_write ||
+    pathError != '' ||
+    !isValid ||
+    emptyString(script_path) ||
+    !hasChanged);
 $effect(() => {
     is_flow = itemKind === 'flow';
 });
@@ -68,6 +80,7 @@ export async function openEdit(ePath, isFlow, defaultConfig) {
         dirtyPath = false;
         dirtyLocalPart = false;
         await loadTrigger(defaultConfig);
+        originalConfig = structuredClone($state.snapshot(getEmailTriggerConfig()));
     }
     catch (err) {
         sendUserToast(`Could not load email trigger: ${err}`, true);
@@ -105,6 +118,8 @@ export async function openNew(nis_flow, fixedScriptPath_, defaultValues) {
         error_handler_args = defaultValues?.error_handler_args ?? {};
         retry = defaultValues?.retry ?? undefined;
         errorHandlerSelected = getHandlerType(error_handler_path ?? '');
+        mode = defaultValues?.mode ?? 'enabled';
+        originalConfig = undefined;
     }
     finally {
         clearTimeout(loader);
@@ -125,6 +140,7 @@ function loadTriggerConfig(cfg) {
     error_handler_args = cfg?.error_handler_args ?? {};
     retry = cfg?.retry;
     errorHandlerSelected = getHandlerType(error_handler_path ?? '');
+    mode = cfg?.mode ?? 'enabled';
 }
 async function loadTrigger(defaultConfig) {
     if (defaultConfig) {
@@ -141,16 +157,21 @@ async function loadTrigger(defaultConfig) {
 }
 async function triggerScript() {
     if (customSaveBehavior) {
-        customSaveBehavior(routeConfig);
+        customSaveBehavior(emailConfig);
         drawer?.closeDrawer();
     }
     else {
         deploymentLoading = true;
-        const saveCfg = routeConfig;
+        const saveCfg = emailConfig;
         const isSaved = await saveEmailTriggerFromCfg(initialPath, saveCfg, edit, $workspaceStore, !!$userStore?.is_admin || !!$userStore?.is_super_admin, usedTriggerKinds);
         if (isSaved) {
             onUpdate(saveCfg.path);
-            drawer?.closeDrawer();
+            originalConfig = structuredClone($state.snapshot(getEmailTriggerConfig()));
+            initialPath = saveCfg.path;
+            initialScriptPath = saveCfg.script_path;
+            if (mode !== 'suspended') {
+                drawer?.closeDrawer();
+            }
         }
         deploymentLoading = false;
     }
@@ -165,15 +186,31 @@ function getEmailTriggerConfig() {
         extra_perms: extraPerms,
         error_handler_path,
         error_handler_args,
-        retry
+        retry,
+        mode
     };
     return nCfg;
 }
+async function handleToggleMode(newMode) {
+    mode = newMode;
+    if (!trigger?.draftConfig) {
+        await EmailTriggerService.setEmailTriggerMode({
+            path: initialPath,
+            workspace: $workspaceStore ?? '',
+            requestBody: { mode: newMode }
+        });
+        sendUserToast(`${capitalize(newMode)} email trigger ${initialPath}`);
+        onUpdate(initialPath);
+    }
+    if (originalConfig) {
+        originalConfig['mode'] = newMode;
+    }
+}
 // Update config for captures
 function getCaptureConfig() {
     const newCaptureConfig = {
-        local_part: routeConfig.local_part,
-        path: routeConfig.path
+        local_part: emailConfig.local_part,
+        path: emailConfig.path
     };
     //
     return newCaptureConfig;
@@ -184,11 +221,28 @@ $effect(() => {
 });
 $effect(() => {
     if (!drawerLoading) {
-        handleConfigChange(routeConfig, initialConfig, saveDisabled, edit, onConfigChange);
+        handleConfigChange(emailConfig, initialConfig, saveDisabled, edit, onConfigChange);
     }
 });
 </script>
 
+{#if mode === 'suspended'}
+	<TriggerSuspendedJobsModal
+		bind:this={suspendedJobsModal}
+		triggerPath={path}
+		triggerKind="email"
+		{hasChanged}
+		onToggleMode={handleToggleMode}
+		runnableConfig={{
+			path: script_path,
+			kind: itemKind,
+			retry,
+			errorHandlerPath: error_handler_path,
+			errorHandlerArgs: error_handler_args
+		}}
+	/>
+{/if}
+
 {#snippet config()}
 	{#if drawerLoading}
 		{#if showLoader}
@@ -196,6 +250,9 @@ $effect(() => {
 		{/if}
 	{:else}
 		<div class="flex flex-col gap-12">
+			{#if mode === 'suspended'}
+				<TriggerSuspendedJobsAlert {suspendedJobsModal} />
+			{/if}
 			<Section label="Metadata">
 				<div class="flex flex-col gap-2">
 					<Label label="Path">
@@ -216,7 +273,7 @@ $effect(() => {
 
 			{#if !hideTarget}
 				<Section label="Target">
-					<p class="text-xs mt-3 mb-1 text-tertiary">
+					<p class="text-xs mt-3 mb-1 text-primary">
 						Pick a script or flow to be triggered<Required required={true} />
 					</p>
 					<div class="flex flex-col gap-2">
@@ -235,8 +292,8 @@ $effect(() => {
 
 							{#if emptyString(script_path)}
 								<Button
-									btnClasses="ml-4 mt-2"
-									color="dark"
+									btnClasses="ml-4"
+									variant="accent"
 									size="xs"
 									href={itemKind === 'flow' ? '/flows/add?hub=72' : '/scripts/add?hub=hub%2F19813'}
 									target="_blank">Create from template</Button
@@ -262,8 +319,8 @@ $effect(() => {
 				<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>
+							<Tab value="error_handler" label="Error Handler" />
+							<Tab value="retries" label="Retries" />
 						</Tabs>
 						<div class="mt-4">
 							<TriggerRetriesAndErrorHandler
@@ -289,7 +346,6 @@ $effect(() => {
 			{trigger}
 			permissions={drawerLoading || !can_write ? 'none' : can_write && isAdmin ? 'create' : 'write'}
 			{saveDisabled}
-			enabled={undefined}
 			{allowDraft}
 			{edit}
 			isLoading={deploymentLoading}
@@ -297,6 +353,9 @@ $effect(() => {
 			{onReset}
 			{onDelete}
 			{isDeployed}
+			{mode}
+			onToggleMode={handleToggleMode}
+			{suspendedJobsModal}
 		/>
 	{/if}
 {/snippet}

package/package/components/triggers/email/utils.d.ts

@@ -1,4 +1,4 @@
 import type { Writable } from 'svelte/store';
 export declare function getEmailAddress(local_part: string | undefined, workspaced_local_part: boolean, workspace_id: string, emailDomain: string): string;
-export declare function saveEmailTriggerFromCfg(initialPath: string, routeCfg: Record<string, any>, edit: boolean, workspace: string, isAdmin: boolean, usedTriggerKinds: Writable<string[]>): Promise<boolean>;
+export declare function saveEmailTriggerFromCfg(initialPath: string, emailCfg: Record<string, any>, edit: boolean, workspace: string, isAdmin: boolean, usedTriggerKinds: Writable<string[]>): Promise<boolean>;
 export declare function getEmailDomain(): Promise<string>;

package/package/components/triggers/email/utils.js

@@ -5,16 +5,17 @@ import { get } from 'svelte/store';
 export function getEmailAddress(local_part, workspaced_local_part, workspace_id, emailDomain) {
     return `${isCloudHosted() || workspaced_local_part ? workspace_id + '-' : ''}${local_part ?? ''}@${emailDomain}`;
 }
-export async function saveEmailTriggerFromCfg(initialPath, routeCfg, edit, workspace, isAdmin, usedTriggerKinds) {
+export async function saveEmailTriggerFromCfg(initialPath, emailCfg, edit, workspace, isAdmin, usedTriggerKinds) {
     const requestBody = {
-        path: routeCfg.path,
-        script_path: routeCfg.script_path,
-        local_part: routeCfg.local_part,
-        is_flow: routeCfg.is_flow,
-        workspaced_local_part: routeCfg.workspaced_local_part,
-        error_handler_path: routeCfg.error_handler_path,
-        error_handler_args: routeCfg.error_handler_path ? routeCfg.error_handler_args : undefined,
-        retry: routeCfg.retry
+        path: emailCfg.path,
+        script_path: emailCfg.script_path,
+        local_part: emailCfg.local_part,
+        is_flow: emailCfg.is_flow,
+        workspaced_local_part: emailCfg.workspaced_local_part,
+        error_handler_path: emailCfg.error_handler_path,
+        error_handler_args: emailCfg.error_handler_path ? emailCfg.error_handler_args : undefined,
+        mode: emailCfg.mode,
+        retry: emailCfg.retry
     };
     try {
         if (edit) {
@@ -23,17 +24,17 @@ export async function saveEmailTriggerFromCfg(initialPath, routeCfg, edit, works
                 path: initialPath,
                 requestBody: {
                     ...requestBody,
-                    local_part: isAdmin || !edit ? routeCfg.local_part : undefined
+                    local_part: isAdmin || !edit ? emailCfg.local_part : undefined
                 }
             });
-            sendUserToast(`Route ${routeCfg.path} updated`);
+            sendUserToast(`Email trigger ${emailCfg.path} updated`);
         }
         else {
             await EmailTriggerService.createEmailTrigger({
                 workspace: workspace,
-                requestBody: requestBody
+                requestBody: { ...requestBody, mode: 'enabled' }
             });
-            sendUserToast(`Route ${routeCfg.path} created`);
+            sendUserToast(`Email trigger ${emailCfg.path} created`);
         }
         if (!get(usedTriggerKinds).includes('email')) {
             usedTriggerKinds.update((t) => [...t, 'email']);

package/package/components/triggers/gcp/GcpCapture.svelte.d.ts

@@ -34,7 +34,9 @@ declare const GcpCapture: $$__sveltets_2_IsomorphicComponent<Props, {
         redirect: boolean;
         args?: boolean;
     }>;
-    addPreprocessor: CustomEvent<null>;
+    addPreprocessor: CustomEvent<{
+        args: Record<string, any>;
+    } | null>;
     testWithArgs: CustomEvent<Record<string, any>>;
 } & {
     [evt: string]: CustomEvent<any>;

package/package/components/triggers/gcp/GcpTriggerEditorConfigSection.svelte

@@ -71,9 +71,7 @@ $effect(() => {
     if (!delivery_type) {
         delivery_type = 'pull';
     }
-});
-$effect(() => {
-    if (!delivery_config) {
+    else if (delivery_type === 'push' && !delivery_config) {
         delivery_config = DEFAULT_PUSH_CONFIG;
     }
 });
@@ -140,8 +138,7 @@ $effect(() => {
 							/>
 							<Button
 								disabled={!can_write}
-								variant="border"
-								color="light"
+								variant="default"
 								wrapperClasses="self-stretch"
 								on:click={loadAllPubSubTopicsFromProject}
 								startIcon={{ icon: RefreshCw }}
@@ -233,7 +230,7 @@ $effect(() => {
 											<Url url={`${base_endpoint}/${path}`} label="Production URL" />
 										</div>
 										<Subsection label="Authenticate">
-											<p class="text-xs mb-2 text-tertiary">
+											<p class="text-xs mb-2 text-primary">
 												Enable Google Cloud authentication for push delivery using a verified token.<Required
 													required={true}
 												/>
@@ -276,8 +273,7 @@ $effect(() => {
 									/>
 									<Button
 										disabled={!can_write}
-										variant="border"
-										color="light"
+										variant="default"
 										wrapperClasses="self-stretch"
 										on:click={loadAllSubscriptionFromGooglePubSubTopic}
 										startIcon={{ icon: RefreshCw }}

package/package/components/triggers/gcp/GcpTriggerEditorInner.svelte

@@ -3,7 +3,7 @@ import Drawer from '../../common/drawer/Drawer.svelte';
 import DrawerContent from '../../common/drawer/DrawerContent.svelte';
 import Path from '../../Path.svelte';
 import { usedTriggerKinds, userStore, workspaceStore } from '../../../stores';
-import { canWrite, emptyString, sendUserToast } from '../../../utils';
+import { canWrite, capitalize, emptyString, sendUserToast } from '../../../utils';
 import { Loader2 } from 'lucide-svelte';
 import Label from '../../Label.svelte';
 import { GcpTriggerService } from '../../../gen';
@@ -15,6 +15,9 @@ import { untrack } from 'svelte';
 import TriggerEditorToolbar from '../TriggerEditorToolbar.svelte';
 import { saveGcpTriggerFromCfg } from './utils';
 import { getHandlerType, handleConfigChange } from '../utils';
+import { deepEqual } from 'fast-equals';
+import TriggerSuspendedJobsAlert from '../TriggerSuspendedJobsAlert.svelte';
+import TriggerSuspendedJobsModal from '../TriggerSuspendedJobsModal.svelte';
 import { base } from '../../../base';
 import Tabs from '../../common/tabs/Tabs.svelte';
 import Tab from '../../common/tabs/Tab.svelte';
@@ -22,7 +25,6 @@ import TriggerRetriesAndErrorHandler from '../TriggerRetriesAndErrorHandler.svel
 import Subsection from '../../Subsection.svelte';
 import Toggle from '../../Toggle.svelte';
 let drawer = $state(undefined);
-let is_flow = $state(false);
 let initialPath = $state('');
 let edit = $state(true);
 let delivery_type = $state('pull');
@@ -32,7 +34,7 @@ let initialScriptPath = $state('');
 let fixedScriptPath = $state('');
 let path = $state('');
 let pathError = $state('');
-let enabled = $state(false);
+let mode = $state('enabled');
 let dirtyPath = $state(false);
 let can_write = $state(true);
 let drawerLoading = $state(true);
@@ -52,9 +54,12 @@ let errorHandlerSelected = $state('slack');
 let error_handler_path = $state();
 let error_handler_args = $state({});
 let retry = $state();
+let suspendedJobsModal = $state(null);
+let originalConfig = $state(undefined);
 let { useDrawer = true, description = undefined, hideTarget = false, hideTooltips = false, isEditor = false, allowDraft = false, trigger = undefined, isDeployed = false, customLabel = undefined, onConfigChange = undefined, onCaptureConfigChange = undefined, onUpdate = undefined, onDelete = undefined, onReset = undefined, cloudDisabled = false } = $props();
+let hasChanged = $derived(!deepEqual(getGcpConfig(), originalConfig ?? {}));
 const gcpConfig = $derived.by(getGcpConfig);
-const saveDisabled = $derived(pathError != '' || emptyString(script_path) || !isValid || !can_write);
+const saveDisabled = $derived(pathError != '' || emptyString(script_path) || !isValid || !can_write || !hasChanged);
 const captureConfig = $derived.by(isEditor ? getGcpCaptureConfig : () => ({}));
 export async function openEdit(ePath, isFlow, defaultValues) {
     drawerLoading = true;
@@ -65,6 +70,7 @@ export async function openEdit(ePath, isFlow, defaultValues) {
         edit = true;
         dirtyPath = false;
         await loadTrigger(defaultValues);
+        originalConfig = structuredClone($state.snapshot(getGcpConfig()));
     }
     catch (err) {
         sendUserToast(`Could not load GCP Pub/Sub trigger: ${err.body}`, true);
@@ -80,7 +86,6 @@ export async function openNew(nis_flow, fixedScriptPath_, defaultValues) {
     drawerLoading = true;
     try {
         drawer?.openDrawer();
-        is_flow = nis_flow;
         itemKind = nis_flow ? 'flow' : 'script';
         initialScriptPath = '';
         fixedScriptPath = fixedScriptPath_ ?? '';
@@ -95,13 +100,14 @@ export async function openNew(nis_flow, fixedScriptPath_, defaultValues) {
         initialPath = '';
         edit = false;
         dirtyPath = false;
-        enabled = defaultValues?.enabled ?? false;
+        mode = defaultValues?.mode ?? 'enabled';
         error_handler_path = defaultValues?.error_handler_path ?? undefined;
         error_handler_args = defaultValues?.error_handler_args ?? {};
         retry = defaultValues?.retry ?? undefined;
         auto_acknowledge_msg = defaultValues?.auto_acknowledge_msg ?? true;
         ack_deadline = defaultValues?.ack_deadline;
         errorHandlerSelected = getHandlerType(error_handler_path ?? '');
+        originalConfig = undefined;
     }
     finally {
         drawerLoading = false;
@@ -133,9 +139,8 @@ async function loadTriggerConfig(cfg) {
     subscription_id = cfg?.subscription_id;
     delivery_config = cfg?.delivery_config;
     subscription_mode = cfg?.subscription_mode;
-    is_flow = cfg?.is_flow;
     path = cfg?.path;
-    enabled = cfg?.enabled;
+    mode = cfg?.mode ?? 'enabled';
     topic_id = cfg?.topic_id ?? '';
     can_write = canWrite(cfg?.path, cfg?.extra_perms, $userStore);
     error_handler_path = cfg?.error_handler_path;
@@ -154,7 +159,12 @@ async function updateTrigger() {
     const isSaved = await saveGcpTriggerFromCfg(initialPath, cfg, edit, $workspaceStore, usedTriggerKinds);
     if (isSaved) {
         onUpdate?.(cfg.path);
-        drawer?.closeDrawer();
+        originalConfig = structuredClone($state.snapshot(getGcpConfig()));
+        initialPath = cfg.path;
+        initialScriptPath = cfg.script_path;
+        if (mode !== 'suspended') {
+            drawer?.closeDrawer();
+        }
     }
     deploymentLoading = false;
 }
@@ -169,8 +179,8 @@ function getGcpConfig() {
         topic_id,
         path,
         script_path,
-        enabled,
-        is_flow,
+        mode,
+        is_flow: itemKind === 'flow',
         error_handler_path,
         error_handler_args,
         retry,
@@ -192,15 +202,19 @@ function getGcpCaptureConfig() {
         path
     };
 }
-async function handleToggleEnabled(toggleEnabled) {
-    enabled = toggleEnabled;
+async function handleToggleMode(newMode) {
+    mode = newMode;
     if (!trigger?.draftConfig) {
-        await GcpTriggerService.setGcpTriggerEnabled({
+        await GcpTriggerService.setGcpTriggerMode({
             path: initialPath,
             workspace: $workspaceStore ?? '',
-            requestBody: { enabled: toggleEnabled }
+            requestBody: { mode: newMode }
         });
-        sendUserToast(`${toggleEnabled ? 'enabled' : 'disabled'} GCP Pub/Sub trigger ${initialPath}`);
+        sendUserToast(`${capitalize(newMode)} GCP Pub/Sub trigger ${initialPath}`);
+        onUpdate?.(initialPath);
+    }
+    if (originalConfig) {
+        originalConfig['mode'] = newMode;
     }
 }
 $effect(() => {
@@ -214,6 +228,23 @@ $effect(() => {
 });
 </script>
 
+{#if mode === 'suspended'}
+	<TriggerSuspendedJobsModal
+		bind:this={suspendedJobsModal}
+		triggerPath={path}
+		triggerKind="gcp"
+		{hasChanged}
+		onToggleMode={handleToggleMode}
+		runnableConfig={{
+			path: script_path,
+			kind: itemKind,
+			retry,
+			errorHandlerPath: error_handler_path,
+			errorHandlerArgs: error_handler_args
+		}}
+	/>
+{/if}
+
 {#if useDrawer}
 	<Drawer size="800px" bind:this={drawer}>
 		<DrawerContent
@@ -249,7 +280,7 @@ $effect(() => {
 		<TriggerEditorToolbar
 			permissions={drawerLoading || !can_write ? 'none' : 'create'}
 			{saveDisabled}
-			{enabled}
+			{mode}
 			isLoading={deploymentLoading}
 			{edit}
 			{allowDraft}
@@ -257,9 +288,10 @@ $effect(() => {
 			onUpdate={updateTrigger}
 			{onReset}
 			{onDelete}
-			onToggleEnabled={handleToggleEnabled}
+			onToggleMode={handleToggleMode}
 			{cloudDisabled}
 			{trigger}
+			{suspendedJobsModal}
 		/>
 	{/if}
 {/snippet}
@@ -272,6 +304,9 @@ $effect(() => {
 		</div>
 	{:else}
 		<div class="flex flex-col gap-5">
+			{#if mode === 'suspended'}
+				<TriggerSuspendedJobsAlert {suspendedJobsModal} />
+			{/if}
 			{#if description}
 				{@render description()}
 			{/if}
@@ -304,7 +339,7 @@ $effect(() => {
 
 			{#if !hideTarget}
 				<Section label="Runnable">
-					<p class="text-xs mb-1 text-tertiary">
+					<p class="text-xs mb-1 text-primary">
 						Pick a script or flow to be triggered <Required required={true} />
 					</p>
 					<div class="flex flex-row mb-2">
@@ -321,9 +356,9 @@ $effect(() => {
 						/>
 						{#if emptyString(script_path)}
 							<Button
-								btnClasses="ml-4 mt-2"
-								color="dark"
-								size="xs"
+								btnClasses="ml-4"
+								variant="default"
+								unifiedSize="md"
 								disabled={!can_write}
 								href={itemKind === 'flow' ? '/flows/add?hub=68' : '/scripts/add?hub=hub%2F19796'}
 								target="_blank">Create from template</Button
@@ -355,9 +390,9 @@ $effect(() => {
 				<div class="flex flex-col gap-4">
 					<div class="min-h-96">
 						<Tabs bind:selected={optionTabSelected}>
-							<Tab value="settings">Settings</Tab>
-							<Tab value="error_handler">Error Handler</Tab>
-							<Tab value="retries">Retries</Tab>
+							<Tab value="settings" label="Settings" />
+							<Tab value="error_handler" label="Error Handler" />
+							<Tab value="retries" label="Retries" />
 						</Tabs>
 						<div class="mt-4">
 							{#if optionTabSelected === 'settings'}

package/package/components/triggers/gcp/utils.js

@@ -20,7 +20,7 @@ export async function saveGcpTriggerFromCfg(initialPath, cfg, edit, workspace, u
             topic_id: cfg.topic_id,
             path: cfg.path,
             script_path: cfg.script_path,
-            enabled: cfg.enabled,
+            mode: cfg.mode,
             is_flow: cfg.is_flow,
             auto_acknowledge_msg: cfg.auto_acknowledge_msg,
             ack_deadline: cfg.ack_deadline,
@@ -39,7 +39,7 @@ export async function saveGcpTriggerFromCfg(initialPath, cfg, edit, workspace, u
                 workspace: workspace,
                 requestBody: {
                     ...requestBody,
-                    enabled: true
+                    mode: 'enabled'
                 }
             });
             sendUserToast(`GCP Pub/Sub trigger ${cfg.path} created`);

package/package/components/triggers/http/OpenAPISpecGenerator.svelte

@@ -332,7 +332,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 																<div class="flex justify-start w-full">
 																	<Badge
 																		color="gray"
-																		class="center-center !bg-surface-secondary !text-tertiary !w-[70px] !h-[24px] rounded-r-none border"
+																		class="center-center !bg-surface-secondary !text-primary !w-[70px] !h-[24px] rounded-r-none border"
 																	>
 																		Full path
 																	</Badge>
@@ -408,7 +408,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 																	<div class="flex justify-start w-full">
 																		<Badge
 																			color="gray"
-																			class="center-center !bg-surface-secondary !text-tertiary !w-[70px] !h-[24px] rounded-r-none border"
+																			class="center-center !bg-surface-secondary !text-primary !w-[70px] !h-[24px] rounded-r-none border"
 																		>
 																			Full path
 																		</Badge>
@@ -431,8 +431,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 								</div>
 
 								<Button
-									variant="border"
-									color="light"
+									variant="default"
 									size="xs"
 									btnClasses="bg-surface-secondary hover:bg-red-500 hover:text-white p-2 rounded-full"
 									aria-label="Clear"
@@ -454,10 +453,9 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 						<div class="w-1/2">
 							<Button
 								spacingSize="sm"
-								color="light"
 								btnClasses="h-10"
 								size="xs"
-								variant="border"
+								variant="default"
 								on:click={() => {
 									webhookAndHttpRouteFilter.push({
 										path: '*',
@@ -506,8 +504,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 							<Button
 								size="xs"
 								btnClasses="h-10"
-								color="light"
-								variant="border"
+								variant="default"
 								on:click={() => {
 									webhookAndHttpRouteFilter.push({
 										path_regex: '*',
@@ -565,9 +562,8 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 					<Button
 						{disabled}
 						spacingSize="sm"
-						color="light"
 						size="xs"
-						variant="border"
+						variant="default"
 						on:click={copyCommandToClipboard}
 						startIcon={{ icon: ClipboardCopy }}
 					>
@@ -608,8 +604,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 						<Button
 							disabled={emptyStringTrimmed(openapiDocument)}
 							spacingSize="sm"
-							color="light"
-							variant="border"
+							variant="default"
 							btnClasses="mb-2"
 							on:click={async () => {
 								await copyToClipboard(openapiDocument)
@@ -621,8 +616,7 @@ curl -X POST "${window.location.origin}${base}/api/w/${$workspaceStore!}/openapi
 						<Button
 							disabled={emptyStringTrimmed(openapiDocument)}
 							spacingSize="sm"
-							color="light"
-							variant="border"
+							variant="default"
 							btnClasses="mb-2"
 							on:click={() => {
 								download(