windmill-components 1.504.6 → 1.510.1

package/package/components/Dev.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">import SchemaForm from './SchemaForm.svelte';
-import TestJobLoader from './TestJobLoader.svelte';
+import JobLoader from './JobLoader.svelte';
 import { Button } from './common';
 import { WindmillIcon } from './icons';
 import LogPanel from './scriptEditor/LogPanel.svelte';
 import { JobService, OpenAPI, WorkspaceService } from '../gen';
 import { inferArgs } from '../infer';
 import { setCopilotInfo, userStore, workspaceStore } from '../stores';
-import { emptySchema, sendUserToast } from '../utils';
+import { emptySchema, readFieldsRecursively, sendUserToast } from '../utils';
 import { Pane, Splitpanes } from 'svelte-splitpanes';
 import { onDestroy, onMount, setContext, untrack } from 'svelte';
 import DarkModeToggle from './sidebar/DarkModeToggle.svelte';
@@ -66,7 +66,7 @@ function initializeMode() {
     modeInitialized = true;
     darkModeToggle?.toggle();
 }
-let testJobLoader = $state();
+let jobLoader = $state();
 let socket = undefined;
 // Test args input
 let args = $state({});
@@ -78,7 +78,8 @@ let pastPreviews = $state([]);
 let validCode = $state(true);
 // Flow preview
 let flowPreviewButtons = $state();
-const job = $derived(flowPreviewButtons?.getJob());
+const flowPreviewContent = $derived(flowPreviewButtons?.getFlowPreviewContent());
+const job = $derived(flowPreviewContent?.getJob());
 let showJobStatus = $state(false);
 let testModuleId = $state(undefined);
 let currentScript = $state(undefined);
@@ -113,7 +114,11 @@ const el = (event) => {
     }
     else if (event.data.type == 'testPreviewBundle') {
         if (event.data.id == lastCommandId && currentScript) {
-            testJobLoader?.runPreview(currentScript.path, event.data.file, currentScript.language, args, currentScript.tag, useLock ? currentScript.lock : undefined);
+            jobLoader?.runPreview(currentScript.path, event.data.file, currentScript.language, args, currentScript.tag, useLock ? currentScript.lock : undefined, undefined, {
+                done(x) {
+                    loadPastTests();
+                }
+            });
         }
         else {
             sendUserToast(`Bundle received ${lastCommandId} was obsolete, ignoring`, true);
@@ -164,7 +169,7 @@ onMount(() => {
     window.parent?.postMessage({ type: 'refresh' }, '*');
 });
 async function testBundle(file, isTar) {
-    testJobLoader?.abstractRun(async () => {
+    jobLoader?.abstractRun(async () => {
         try {
             const form = new FormData();
             form.append('preview', JSON.stringify({
@@ -205,6 +210,10 @@ async function testBundle(file, isTar) {
             sendUserToast(`Failed to send bundle ${e}`, true);
             throw Error(e);
         }
+    }, {
+        done(x) {
+            loadPastTests();
+        }
     });
     loadingCodebaseButton = false;
 }
@@ -273,7 +282,7 @@ function runTest() {
             }
             else {
                 //@ts-ignore
-                testJobLoader.runPreview(currentScript.path, currentScript.content, currentScript.language, args, currentScript.tag, useLock ? currentScript.lock : undefined);
+                jobLoader.runPreview(currentScript.path, currentScript.content, currentScript.language, args, currentScript.tag, useLock ? currentScript.lock : undefined);
             }
         }
     }
@@ -419,8 +428,8 @@ function updateFlow(flow) {
         return;
     }
     if (!deepEqual(flow, lastSent)) {
-        lastSent = JSON.parse(JSON.stringify(flow));
-        window?.parent.postMessage({ type: 'flow', flow, uriPath: lastUriPath }, '*');
+        lastSent = $state.snapshot(flow);
+        window?.parent.postMessage({ type: 'flow', flow: lastSent, uriPath: lastUriPath }, '*');
     }
 }
 let reload = $state(0);
@@ -429,7 +438,7 @@ async function inferModuleArgs(selectedIdStore) {
         return;
     }
     //@ts-ignore
-    dfs(flowStore.value.modules, async (mod) => {
+    dfs(flowStore.val.value.modules, async (mod) => {
         if (mod.id == selectedIdStore) {
             if (mod.value.type == 'rawscript' ||
                 mod.value.type === 'script' ||
@@ -481,14 +490,15 @@ $effect(() => {
         untrack(() => initializeMode());
 });
 $effect(() => {
+    readFieldsRecursively(flowStore.val);
     flowStore.val && untrack(() => updateFlow(flowStore.val));
 });
 $effect(() => {
     $selectedIdStore && untrack(() => inferModuleArgs($selectedIdStore));
 });
-const localModuleStates = $derived(flowPreviewButtons?.getLocalModuleStates() ?? writable({}));
-const localDurationStatuses = $derived(flowPreviewButtons?.getLocalDurationStatuses() ?? writable({}));
-const suspendStatus = $derived(flowPreviewButtons?.getSuspendStatus() ?? writable({}));
+const localModuleStates = $derived(flowPreviewContent?.getLocalModuleStates() ?? writable({}));
+const localDurationStatuses = $derived(flowPreviewContent?.getLocalDurationStatuses() ?? writable({}));
+const suspendStatus = $derived(flowPreviewContent?.getSuspendStatus() ?? writable({}));
 // Create a derived store that only shows the module states when showModuleStatus is true
 // this store can also be updated
 let derivedModuleStates = writable({});
@@ -533,16 +543,12 @@ function resetModulesStates() {
     showJobStatus = false;
 }
 const individualStepTests = $derived(!(showJobStatus && job) && Object.keys($derivedModuleStates).length > 0);
+const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 </script>
 
 <svelte:window onkeydown={onKeyDown} />
 
-<TestJobLoader
-	on:done={loadPastTests}
-	bind:this={testJobLoader}
-	bind:isLoading={testIsLoading}
-	bind:job={testJob}
-/>
+<JobLoader noCode={true} bind:this={jobLoader} bind:isLoading={testIsLoading} bind:job={testJob} />
 
 <main class="h-screen w-full">
 	{#if mode == 'script'}
@@ -603,7 +609,7 @@ const individualStepTests = $derived(!(showJobStatus && job) && Object.keys($der
 			{/if}
 			<div class="flex justify-center pt-1">
 				{#if testIsLoading}
-					<Button on:click={testJobLoader?.cancelJob} btnClasses="w-full" color="red" size="xs">
+					<Button on:click={jobLoader?.cancelJob} btnClasses="w-full" color="red" size="xs">
 						<WindmillIcon
 							white={true}
 							class="mr-2 text-white"
@@ -692,10 +698,10 @@ const individualStepTests = $derived(!(showJobStatus && job) && Object.keys($der
 								disableStaticInputs
 								localModuleStates={derivedModuleStates}
 								onTestUpTo={flowPreviewButtons?.testUpTo}
-								isOwner={flowPreviewButtons?.getIsOwner()}
+								isOwner={flowPreviewContent?.getIsOwner?.()}
 								onTestFlow={flowPreviewButtons?.runPreview}
-								isRunning={flowPreviewButtons?.getIsRunning()}
-								onCancelTestFlow={flowPreviewButtons?.cancelTest}
+								isRunning={flowPreviewContent?.getIsRunning?.()}
+								onCancelTestFlow={flowPreviewContent?.cancelTest}
 								onOpenPreview={flowPreviewButtons?.openPreview}
 								onHideJobStatus={resetModulesStates}
 								{individualStepTests}
@@ -704,6 +710,7 @@ const individualStepTests = $derived(!(showJobStatus && job) && Object.keys($der
 								onDelete={(id) => {
 									delete $derivedModuleStates[id]
 								}}
+								{flowHasChanged}
 							/>
 						{:else}
 							<div class="text-red-400 mt-20">Missing flow modules</div>
@@ -725,7 +732,7 @@ const individualStepTests = $derived(!(showJobStatus && job) && Object.keys($der
 								}}
 								onTestFlow={flowPreviewButtons?.runPreview}
 								{job}
-								isOwner={flowPreviewButtons?.getIsOwner()}
+								isOwner={flowPreviewContent?.getIsOwner()}
 								{localDurationStatuses}
 								{suspendStatus}
 								onOpenDetails={flowPreviewButtons?.openPreview}

package/package/components/DisplayResult.svelte

@@ -24,6 +24,7 @@ import Tooltip from './Tooltip.svelte';
 import HighlightTheme from './HighlightTheme.svelte';
 import { getContext, hasContext, createEventDispatcher, onDestroy } from 'svelte';
 import { toJsonStr } from '../utils';
+import { userStore } from '../stores';
 const IMG_MAX_SIZE = 10000000;
 const TABLE_MAX_SIZE = 5000000;
 const DISPLAY_MAX_SIZE = 100000;
@@ -183,6 +184,28 @@ function inferResultKind(result) {
                 else if (isTableCol(result, keys)) {
                     return 'table-col';
                 }
+                else if (keys.length < 1000 && keys.includes('wm_renderer')) {
+                    const renderer = result['wm_renderer'];
+                    if (typeof renderer === 'string') {
+                        if ([
+                            'json',
+                            'html',
+                            'png',
+                            'file',
+                            'jpeg',
+                            'gif',
+                            'svg',
+                            'filename',
+                            's3object',
+                            'plain',
+                            'markdown',
+                            'map',
+                            'pdf'
+                        ].includes(renderer)) {
+                            return renderer;
+                        }
+                    }
+                }
             }
         }
         catch (err) { }
@@ -624,34 +647,38 @@ $effect(() => {
 									language={json}
 									code={toJsonStr(result).replace(/\\n/g, '\n')}
 								/>
-								<button
-									class="text-secondary underline text-2xs whitespace-nowrap"
-									onclick={() => {
-										s3FileViewer?.open?.(result)
-									}}
-									><span class="flex items-center gap-1"
-										><PanelRightOpen size={12} />object store explorer<Tooltip
-											>Require admin privilege or "S3 resource details and content can be accessed
-											by all users of this workspace" of S3 Storage to be set in the workspace
-											settings</Tooltip
-										></span
-									>
-								</button>
+								{#if $userStore}
+									<button
+										class="text-secondary underline text-2xs whitespace-nowrap"
+										onclick={() => {
+											s3FileViewer?.open?.(result)
+										}}
+										><span class="flex items-center gap-1"
+											><PanelRightOpen size={12} />object store explorer<Tooltip
+												>Require admin privilege or "S3 resource details and content can be accessed
+												by all users of this workspace" of S3 Storage to be set in the workspace
+												settings</Tooltip
+											></span
+										>
+									</button>
+								{/if}
 							{:else if !result?.disable_download}
 								<FileDownload {workspaceId} s3object={result} {appPath} />
-								<button
-									class="text-secondary underline text-2xs whitespace-nowrap"
-									onclick={() => {
-										s3FileViewer?.open?.(result)
-									}}
-									><span class="flex items-center gap-1"
-										><PanelRightOpen size={12} />object store explorer<Tooltip
-											>Require admin privilege or "S3 resource details and content can be accessed
-											by all users of this workspace" of S3 Storage to be set in the workspace
-											settings</Tooltip
-										></span
-									>
-								</button>
+								{#if $userStore}
+									<button
+										class="text-secondary underline text-2xs whitespace-nowrap"
+										onclick={() => {
+											s3FileViewer?.open?.(result)
+										}}
+										><span class="flex items-center gap-1"
+											><PanelRightOpen size={12} />object store explorer<Tooltip
+												>Require admin privilege or "S3 resource details and content can be accessed
+												by all users of this workspace" of S3 Storage to be set in the workspace
+												settings</Tooltip
+											></span
+										>
+									</button>
+								{/if}
 							{/if}
 						</div>
 						{#if typeof result?.s3 === 'string'}

package/package/components/DisplayResult.svelte.d.ts

@@ -40,6 +40,6 @@ declare const DisplayResult: $$__sveltets_2_IsomorphicComponent<Props, {
 }, {}, {
     openDrawer: () => void;
     getToolbarLocation: () => "external" | "self" | undefined;
-}, "forceJson" | "drawerOpen">;
+}, "drawerOpen" | "forceJson">;
 type DisplayResult = InstanceType<typeof DisplayResult>;
 export default DisplayResult;

package/package/components/DynSelect.svelte

@@ -16,7 +16,7 @@ function validSelectObject(x) {
 
 <script lang="ts">import { usePromise } from '../svelte5Utils.svelte';
 import { deepEqual } from 'fast-equals';
-import ResultJobLoader from './ResultJobLoader.svelte';
+import JobLoader from './JobLoader.svelte';
 import Select from './select/Select.svelte';
 import Tooltip from './Tooltip.svelte';
 import { Loader2 } from 'lucide-svelte';
@@ -54,7 +54,7 @@ async function getItemsFromOptions() {
             error: (err) => reject(err)
         };
         helperScript?.type == 'inline'
-            ? resultJobLoader?.runPreview(helperScript?.path ?? 'NO_PATH', helperScript.code, helperScript.lang, { ...args, filterText, _ENTRYPOINT_OVERRIDE: entrypoint }, undefined, cb)
+            ? resultJobLoader?.runPreview(helperScript?.path ?? 'NO_PATH', helperScript.code, helperScript.lang, { ...args, filterText, _ENTRYPOINT_OVERRIDE: entrypoint }, undefined, undefined, undefined, cb)
             : resultJobLoader?.runScriptByHash(helperScript?.hash ?? 'NO_HASH', { ...args, filterText, _ENTRYPOINT_OVERRIDE: entrypoint }, cb);
     });
 }
@@ -71,7 +71,7 @@ let open = $state(false);
 </script>
 
 {#if helperScript}
-	<ResultJobLoader bind:this={resultJobLoader} />
+	<JobLoader bind:this={resultJobLoader} />
 
 	<div class="w-full flex-col flex">
 		<Select

package/package/components/Editor.svelte

@@ -1074,11 +1074,14 @@ async function loadMonaco() {
     });
     editor?.onDidFocusEditorText(() => {
         dispatch('focus');
-        editor?.addCommand(KeyCode.Escape, function () {
-            if (showInlineAIChat) {
-                closeAIInlineWidget();
+        // for escape we use onkeydown instead of addCommand because addCommand on escape specifically prevents default behavior (like autocomplete cancellation)
+        editor?.onKeyDown((e) => {
+            if (e.keyCode === KeyCode.Escape) {
+                if (showInlineAIChat) {
+                    closeAIInlineWidget();
+                }
+                aiChatEditorHandler?.rejectAll();
             }
-            aiChatEditorHandler?.rejectAll();
         });
         editor?.addCommand(KeyMod.CtrlCmd | KeyCode.DownArrow, function () {
             if (aiChatManager.pendingNewCode) {

package/package/components/EditorBar.svelte

@@ -500,10 +500,10 @@ JsonNode ${windmillPathToCamelCaseName(path)} = JsonNode.Parse(await client.GetS
 			let t = { postgresql: 'postgres', mysql: 'mysql', bigquery: 'bigquery' }[resType]
 			if (!t) {
 				sendUserToast(`Resource type ${resType} is not supported in DuckDB`, true)
-				editor.insertAtCursor(`'$res:${path}'`)
+				editor.insertAtCursor(`'res://${path}'`)
 				return
 			} else {
-				editor.insertAtCursor(`ATTACH '$res:${path}' AS db (TYPE ${t});`)
+				editor.insertAtCursor(`ATTACH 'res://${path}' AS db (TYPE ${t});`)
 			}
 		}
 

package/package/components/ErrorOrRecoveryHandler.svelte

@@ -18,24 +18,15 @@ const slackSuccessHandler = hubPaths.slackSuccessHandler;
 const teamsRecoveryHandler = hubPaths.teamsRecoveryHandler;
 const teamsHandlerScriptPath = hubPaths.teamsErrorHandler;
 const teamsSuccessHandler = hubPaths.teamsSuccessHandler;
-export let errorOrRecovery;
-export let isEditable;
-export let toggleText = 'Enable';
-export let showScriptHelpText = false;
-export let handlerSelected;
-export let handlerPath;
-export let handlerExtraArgs;
-export let customInitialScriptPath;
-export let customScriptTemplate;
-export let customHandlerKind = 'script';
-let customHandlerSchema;
-let slackHandlerSchema;
-let isFetching = false;
-let teams_channels = [];
-let teams_team_name = undefined;
-let workspaceConnectedToSlack = undefined;
-let workspaceConnectedToTeams = undefined;
-let connectionTestJob;
+let { errorOrRecovery, isEditable, toggleText = 'Enable', showScriptHelpText = false, handlerSelected = $bindable(), handlerPath = $bindable(), handlerExtraArgs = $bindable(), customScriptTemplate, customHandlerKind = $bindable('script'), customTabTooltip } = $props();
+let customHandlerSchema = $state();
+let slackHandlerSchema = $state();
+let isFetching = $state(false);
+let teams_channels = $state([]);
+let teams_team_name = $state(undefined);
+let workspaceConnectedToSlack = $state(undefined);
+let workspaceConnectedToTeams = $state(undefined);
+let connectionTestJob = $state();
 async function loadSlackResources() {
     const settings = await WorkspaceService.getSettings({ workspace: $workspaceStore });
     if (!emptyString(settings.slack_name) && !emptyString(settings.slack_team_id)) {
@@ -146,7 +137,7 @@ async function loadHandlerScriptArgs(p, defaultArgs = []) {
     }
 }
 function isSlackHandler(scriptPath) {
-    if (scriptPath === undefined) {
+    if (!scriptPath) {
         return false;
     }
     if (errorOrRecovery == 'error') {
@@ -161,7 +152,7 @@ function isSlackHandler(scriptPath) {
     }
 }
 function isTeamsHandler(scriptPath) {
-    if (scriptPath === undefined) {
+    if (!scriptPath) {
         return false;
     }
     if (errorOrRecovery == 'error') {
@@ -175,67 +166,82 @@ function isTeamsHandler(scriptPath) {
         return scriptPath.startsWith('hub/') && scriptPath.endsWith('/schedule-success-handler-teams');
     }
 }
-$: {
+$effect(() => {
     if ($workspaceStore) {
         loadSlackResources();
         loadTeamsResources();
     }
-}
-let lastHandlerSelected = undefined;
-let channelCache = {
+});
+$effect(() => {
+    if (handlerSelected === 'slack' && isSlackHandler(handlerPath)) {
+        handlerExtraArgs['slack'] = '$res:f/slack_bot/bot_token';
+    }
+    else {
+        handlerExtraArgs['slack'] = undefined;
+    }
+});
+let lastHandlerSelected = $state(undefined);
+let channelCache = $state({
     slack: undefined,
     teams: undefined
-};
-$: {
+});
+$effect(() => {
     if (lastHandlerSelected !== handlerSelected && lastHandlerSelected !== undefined) {
         if (lastHandlerSelected === 'teams' || lastHandlerSelected === 'slack') {
             channelCache[lastHandlerSelected] = handlerExtraArgs['channel'];
         }
         if (handlerSelected === 'custom') {
             handlerExtraArgs['channel'] = '';
+            handlerPath = undefined;
         }
         else {
             handlerExtraArgs['channel'] = channelCache[handlerSelected] ?? '';
         }
     }
     lastHandlerSelected = handlerSelected;
-}
-$: handlerPath &&
-    !isSlackHandler(handlerPath) &&
-    !isTeamsHandler(handlerPath) &&
-    loadHandlerScriptArgs(handlerPath, [
-        'path',
-        'workspace_id',
-        'job_id',
-        'is_flow',
-        'schedule_path',
-        'error',
-        'error_started_at',
-        'failed_times',
-        'started_at',
-        'success_times',
-        'success_result',
-        'success_started_at',
-        'email'
-    ]).then((schema) => (customHandlerSchema = schema));
-$: handlerPath &&
-    isSlackHandler(handlerPath) &&
-    loadHandlerScriptArgs(handlerPath, [
-        'path',
-        'workspace_id',
-        'job_id',
-        'is_flow',
-        'schedule_path',
-        'error',
-        'error_started_at',
-        'failed_times',
-        'started_at',
-        'success_times',
-        'success_result',
-        'success_started_at',
-        'email',
-        'slack'
-    ]).then((schema) => (slackHandlerSchema = schema));
+});
+$effect(() => {
+    handlerPath &&
+        !isSlackHandler(handlerPath) &&
+        !isTeamsHandler(handlerPath) &&
+        loadHandlerScriptArgs(handlerPath, [
+            'path',
+            'workspace_id',
+            'job_id',
+            'is_flow',
+            'schedule_path',
+            'error',
+            'error_started_at',
+            'failed_times',
+            'started_at',
+            'success_times',
+            'success_result',
+            'success_started_at',
+            'email',
+            'trigger_path'
+        ]).then((schema) => (customHandlerSchema = schema));
+});
+$effect(() => {
+    handlerPath &&
+        isSlackHandler(handlerPath) &&
+        loadHandlerScriptArgs(handlerPath, [
+            'path',
+            'workspace_id',
+            'job_id',
+            'is_flow',
+            'schedule_path',
+            'error',
+            'error_started_at',
+            'failed_times',
+            'started_at',
+            'success_times',
+            'success_result',
+            'success_started_at',
+            'email',
+            'trigger_path',
+            'slack'
+        ]).then((schema) => (slackHandlerSchema = schema));
+});
 </script>
 
 <div>
@@ -244,7 +250,7 @@ $: handlerPath &&
 		<Tab value="teams" disabled={!isEditable}>Teams</Tab>
 		<Tab value="custom" disabled={!isEditable}>
 			Custom
-			<slot name="custom-tab-tooltip" />
+			{@render customTabTooltip?.()}
 		</Tab>
 	</Tabs>
 </div>
@@ -253,15 +259,15 @@ $: handlerPath &&
 	<div class="flex flex-row mb-2">
 		<ScriptPicker
 			disabled={!isEditable || !$enterpriseLicense}
-			initialPath={customInitialScriptPath}
 			kinds={['script', 'failure']}
 			allowFlow={true}
 			bind:scriptPath={handlerPath}
 			bind:itemKind={customHandlerKind}
 			allowRefresh={isEditable}
+			clearable
 		/>
 
-		{#if handlerPath === undefined}
+		{#if !handlerPath}
 			<Button
 				btnClasses="ml-4 mt-2"
 				color="dark"
@@ -427,7 +433,7 @@ $: handlerPath &&
 				/>
 				<div class="flex-shrink-0">
 					<button
-						on:click={loadTeamsResources}
+						onclick={loadTeamsResources}
 						class="flex items-center gap-1 p-1.5 rounded hover:bg-surface-hover focus:bg-surface-hover"
 					>
 						<RefreshCcw size={16} class={isFetching ? 'animate-spin' : ''} />

package/package/components/ErrorOrRecoveryHandler.svelte.d.ts

@@ -1,31 +1,15 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ErrorOrRecoveryHandler: $$__sveltets_2_IsomorphicComponent<{
-    errorOrRecovery: "error" | "recovery" | "success";
+interface Props {
+    errorOrRecovery: 'error' | 'recovery' | 'success';
     isEditable: boolean;
     toggleText?: string;
     showScriptHelpText?: boolean;
-    handlerSelected: "custom" | "slack" | "teams";
+    handlerSelected: 'custom' | 'slack' | 'teams';
     handlerPath: string | undefined;
     handlerExtraArgs: Record<string, any>;
-    customInitialScriptPath: string | undefined;
     customScriptTemplate: string;
-    customHandlerKind?: "flow" | "script";
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    'custom-tab-tooltip': {};
-}, {}, string>;
-type ErrorOrRecoveryHandler = InstanceType<typeof ErrorOrRecoveryHandler>;
+    customHandlerKind?: 'flow' | 'script';
+    customTabTooltip?: import('svelte').Snippet;
+}
+declare const ErrorOrRecoveryHandler: import("svelte").Component<Props, {}, "handlerSelected" | "handlerPath" | "handlerExtraArgs" | "customHandlerKind">;
+type ErrorOrRecoveryHandler = ReturnType<typeof ErrorOrRecoveryHandler>;
 export default ErrorOrRecoveryHandler;

package/package/components/FlowBuilder.svelte

@@ -37,6 +37,7 @@ import { TestSteps } from './flows/testSteps.svelte';
 import { aiChatManager } from './copilot/chat/AIChatManager.svelte';
 import { setStepHistoryLoaderContext, StepHistoryLoader } from './stepHistoryLoader.svelte';
 import { ModulesTestStates } from './modulesTest.svelte';
+import FlowAssetsHandler, { initFlowGraphAssetsCtx } from './flows/FlowAssetsHandler.svelte';
 let { initialPath = $bindable(''), pathStoreInit = undefined, newFlow, selectedId, initialArgs = {}, loading = false, flowStore, flowStateStore, savedFlow = $bindable(undefined), diffDrawer = undefined, customUi = {}, disableAi = false, disabledFlowInputs = false, savedPrimarySchedule = undefined, version = undefined, setSavedraftCb = undefined, draftTriggersFromUrl = undefined, selectedTriggerIndexFromUrl = undefined, children, loadedFromHistoryFromUrl, noInitial = false, onSaveInitial, onSaveDraft, onDeploy, onDeployError, onDetails, onSaveDraftError, onSaveDraftOnlyAtNewPath, onHistoryRestore } = $props();
 let initialPathStore = writable(initialPath);
 // used for new flows for captures
@@ -475,6 +476,7 @@ setContext('FlowEditorContext', {
     modulesTestStates,
     outputPickerOpenFns
 });
+setContext('FlowGraphAssetContext', initFlowGraphAssetsCtx({ getModules: () => flowStore.val.value.modules }));
 // Add triggers context store
 const triggersState = $state(new Triggers([
     { type: 'webhook', path: '', isDraft: false },
@@ -784,9 +786,9 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 						redoProps={{ disabled: $history.index === $history.history.length - 1 }}
 						on:undo={() => {
 							const currentModules = flowStore.val?.value?.modules
-							console.log('undo before', flowStore.val, JSON.stringify(flowStore.val, null, 2))
+							// console.log('undo before', flowStore.val, JSON.stringify(flowStore.val, null, 2))
 							flowStore.val = undo(history, flowStore.val)
-							console.log('undo after', flowStore.val, JSON.stringify(flowStore.val, null, 2))
+							// console.log('undo after', flowStore.val, JSON.stringify(flowStore.val, null, 2))
 
 							const newModules = flowStore.val?.value?.modules
 							const restoredModules = newModules?.filter(
@@ -1030,3 +1032,10 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 		renderCount += 1
 	}}
 />
+
+<FlowAssetsHandler
+	modules={flowStore.val.value.modules}
+	enableParser
+	enableDbExplore
+	enablePathScriptAndFlowAssets
+/>