windmill-components 1.642.0 → 1.655.0

package/package/components/flows/map/MapItem.svelte

@@ -9,8 +9,8 @@ import { isTriggerStep } from '../../graph/graphBuilder.svelte';
 import { checkIfParentLoop } from '../utils.svelte';
 import { twMerge } from 'tailwind-merge';
 import { getGraphContext } from '../../graph/graphContext';
-let { onSelectedIteration, moduleId, mod = $bindable(), insertable, moduleAction = undefined, annotation = undefined, nodeState, moving = undefined, duration_ms = undefined, retries = undefined, flowJobs, editMode = false, onSelect, onTestUpTo, onUpdateMock, onEditInput, flowJob, isOwner = false, maximizeSubflow } = $props();
-const { selectionManager } = getGraphContext();
+let { onSelectedIteration, moduleId, mod = $bindable(), insertable, moduleAction = undefined, annotation = undefined, nodeState, duration_ms = undefined, retries = undefined, flowJobs, editMode = false, onSelect, onTestUpTo, onUpdateMock, onEditInput, flowJob, isOwner = false, maximizeSubflow, menuItems = undefined } = $props();
+const { selectionManager, moveManager } = getGraphContext();
 const flowEditorContext = getContext('FlowEditorContext');
 const { flowStore } = flowEditorContext || {};
 const dispatch = createEventDispatcher();
@@ -32,15 +32,25 @@ function handlePointerDown(e) {
         onSelect(mod.id);
     }
 }
+/** Whether this module should be faded because it or its parent subflow is being moved/dragged */
+let isPartOfMovingSubflow = $derived(moveManager?.draggedNodeIds?.has(mod.id) ?? false);
+let fadedClass = $derived(isPartOfMovingSubflow
+    ? moveManager?.movingModuleId
+        ? 'opacity-50'
+        : moveManager?.dragging
+            ? 'opacity-30'
+            : ''
+    : '');
 </script>
 
 {#if mod}
 	<div class="relative">
-		{#if moving == mod.id}
-			<div class="absolute z-10 right-20 top-0.5 center-center">
-				<Button variant="accent" on:click={() => dispatch('move')} size="xs" destructive
-					>Cancel move</Button
-				>
+		{#if moveManager?.movingModuleId == mod.id && !moveManager?.movingIds?.includes(mod.id)}
+			<div class="absolute z-10 inset-0 flex items-center justify-center">
+				<Button variant="accent" on:click={() => dispatch('move')} size="xs" destructive>
+					Cancel move
+					<kbd class="ml-1 text-2xs opacity-60 font-mono">Esc</kbd>
+				</Button>
 			</div>
 		{/if}
 
@@ -78,12 +88,13 @@ function handlePointerDown(e) {
 			</div>
 		{/if}
 
-		<div class={moving == mod.id ? 'opacity-50' : ''}>
+		<div class={fadedClass}>
 			{#if mod.value.type === 'forloopflow' || mod.value.type === 'whileloopflow'}
 				<FlowModuleSchemaItem
 					deletable={insertable}
 					{editMode}
 					{moduleAction}
+					{menuItems}
 					label={`${
 						mod.summary || (mod.value.type == 'forloopflow' ? 'For loop' : 'While loop')
 					}  ${mod.value.parallel ? '(parallel)' : ''} ${
@@ -118,6 +129,7 @@ function handlePointerDown(e) {
 					deletable={insertable}
 					{editMode}
 					{moduleAction}
+					{menuItems}
 					on:changeId
 					on:delete
 					on:move
@@ -137,6 +149,7 @@ function handlePointerDown(e) {
 					deletable={insertable}
 					{editMode}
 					{moduleAction}
+					{menuItems}
 					on:changeId
 					on:delete
 					on:move
@@ -156,6 +169,7 @@ function handlePointerDown(e) {
 					{retries}
 					{editMode}
 					{moduleAction}
+					{menuItems}
 					on:changeId
 					on:pointerdown={handlePointerDown}
 					on:delete
@@ -169,7 +183,6 @@ function handlePointerDown(e) {
 					deletable={insertable}
 					id={mod.id}
 					{...itemProps}
-					modType={mod.value.type}
 					{nodeState}
 					label={mod.summary ||
 						(mod.value.type === 'aiagent' ? 'AI Agent' : undefined) ||

package/package/components/flows/map/MapItem.svelte.d.ts

@@ -1,5 +1,6 @@
 import type { FlowModule, Job } from '../../../gen';
-import { type onSelectedIteration } from '../../graph/graphBuilder.svelte';
+import { type Item } from '../../../utils';
+import { type OnSelectedIteration } from '../../graph/graphBuilder.svelte';
 import type { FlowNodeState } from '../../graph';
 import type { ModuleActionInfo } from '../flowDiff';
 interface Props {
@@ -9,7 +10,6 @@ interface Props {
     moduleAction: ModuleActionInfo | undefined;
     annotation?: string | undefined;
     nodeState?: FlowNodeState;
-    moving?: string | undefined;
     duration_ms?: number | undefined;
     retries?: number | undefined;
     flowJobs: {
@@ -19,7 +19,7 @@ interface Props {
         selectedManually: boolean | undefined;
     } | undefined;
     editMode?: boolean;
-    onSelectedIteration: onSelectedIteration;
+    onSelectedIteration: OnSelectedIteration;
     onSelect: (id: string | FlowModule) => void;
     onTestUpTo?: ((id: string) => void) | undefined;
     onUpdateMock?: (detail: {
@@ -33,6 +33,7 @@ interface Props {
     flowJob?: Job | undefined;
     isOwner?: boolean;
     maximizeSubflow?: () => void;
+    menuItems?: Item[];
 }
 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> & {

package/package/components/flows/map/VirtualItem.svelte

@@ -7,7 +7,10 @@ import { fade } from 'svelte/transition';
 import { Database, Square } from 'lucide-svelte';
 import FlowGraphPreviewButton from './FlowGraphPreviewButton.svelte';
 import { getNodeColorClasses, aiActionToNodeState } from '../../graph';
+import { getGraphContext } from '../../graph/graphContext';
 let { label = undefined, selected, selectable, id = undefined, center = true, hideId = false, preLabel = undefined, inputJson = undefined, prefix = '', nodeKind, cache = false, earlyStop = false, editMode = false, action = undefined, icon, onUpdateMock, onEditInput, onTestFlow, isRunning, onCancelTestFlow, onOpenPreview, onHideJobStatus, individualStepTests = false, job, showJobStatus = false, flowHasChanged = false } = $props();
+const flowGraphContext = getGraphContext();
+let isMultiSelected = $derived((flowGraphContext?.selectionManager?.selectedIds?.length ?? 0) > 1);
 const outputPickerVisible = $derived((nodeKind || (inputJson && Object.keys(inputJson).length > 0)) && editMode);
 let hoverButton = $state(false);
 const outputType = $derived(showJobStatus
@@ -58,7 +61,7 @@ let colorClasses = $derived(getNodeColorClasses(effectiveState, selected));
 					</div>
 				{/if}
 			</div>
-			{#if outputPickerVisible}
+			{#if outputPickerVisible && !isMultiSelected}
 				<OutputPicker
 					{selected}
 					{hover}
@@ -134,7 +137,7 @@ let colorClasses = $derived(getNodeColorClasses(effectiveState, selected));
 					hoverButton = false
 				}}
 			>
-				{#if outputPickerVisible}
+				{#if outputPickerVisible && !isMultiSelected}
 					<div transition:fade={{ duration: 100 }}>
 						<FlowGraphPreviewButton
 							{isRunning}

package/package/components/flows/multiSelectUtils.d.ts

@@ -0,0 +1,26 @@
+import type { FlowModule } from '../../gen';
+/**
+ * Filter raw selected node IDs down to the minimal set of top-level module IDs:
+ * 1. Filter out virtual graph nodes (Input, Result, Trigger, -start, -end, -branch-*, subflow:*, preprocessor, failure)
+ * 2. Verify each ID exists as a real module in the flow module tree
+ * 3. Deduplicate nested: if a container (loop/branch) AND its children are both selected, keep only the container
+ */
+export declare function resolveSelectedModuleIds(rawIds: string[], modules: FlowModule[]): string[];
+export type ModuleLocation = {
+    id: string;
+    parentArray: FlowModule[];
+    index: number;
+};
+/**
+ * For each ID, find its parent array (reference) and index using DFS.
+ */
+export declare function locateModules(ids: string[], modules: FlowModule[]): ModuleLocation[];
+/**
+ * Group locations that share the same parent array, sorted by index within each group.
+ */
+export declare function groupByParent(locations: ModuleLocation[]): ModuleLocation[][];
+/**
+ * True if all locations share the same parent array and have consecutive indices.
+ * Required for move to be valid.
+ */
+export declare function areContiguousSiblings(locations: ModuleLocation[]): boolean;

package/package/components/flows/multiSelectUtils.js

@@ -0,0 +1,122 @@
+import { dfs } from './dfs';
+/** Virtual/non-module node IDs that should be filtered out of multi-select operations */
+const VIRTUAL_ID_PREFIXES = ['Input', 'Result', 'Trigger', 'preprocessor', 'failure'];
+function isVirtualId(id) {
+    if (VIRTUAL_ID_PREFIXES.includes(id))
+        return true;
+    if (id.endsWith('-start') ||
+        id.endsWith('-end') ||
+        id.includes('-branch-') ||
+        id.startsWith('subflow:')) {
+        return true;
+    }
+    return false;
+}
+/**
+ * Single DFS pass to build a map of moduleId → set of ancestor module IDs.
+ * Used to deduplicate nested selections (keep container, drop children).
+ */
+function buildAncestorMap(modules) {
+    const ancestors = new Map();
+    function walk(mods, parentAncestors) {
+        for (const mod of mods) {
+            ancestors.set(mod.id, parentAncestors);
+            const childAncestors = new Set([...parentAncestors, mod.id]);
+            const val = mod.value;
+            if (val.type === 'forloopflow' || val.type === 'whileloopflow') {
+                walk(val.modules, childAncestors);
+            }
+            else if (val.type === 'branchall') {
+                for (const branch of val.branches)
+                    walk(branch.modules, childAncestors);
+            }
+            else if (val.type === 'branchone') {
+                for (const branch of val.branches)
+                    walk(branch.modules, childAncestors);
+                walk(val.default, childAncestors);
+            }
+        }
+    }
+    walk(modules, new Set());
+    return ancestors;
+}
+/**
+ * Filter raw selected node IDs down to the minimal set of top-level module IDs:
+ * 1. Filter out virtual graph nodes (Input, Result, Trigger, -start, -end, -branch-*, subflow:*, preprocessor, failure)
+ * 2. Verify each ID exists as a real module in the flow module tree
+ * 3. Deduplicate nested: if a container (loop/branch) AND its children are both selected, keep only the container
+ */
+export function resolveSelectedModuleIds(rawIds, modules) {
+    // Step 1: Filter out virtual IDs
+    const candidateIds = rawIds.filter((id) => !isVirtualId(id));
+    // Step 2+3: Single DFS to build ancestor map (also verifies existence)
+    const ancestorMap = buildAncestorMap(modules);
+    const verifiedIds = candidateIds.filter((id) => ancestorMap.has(id));
+    // If any ancestor of this module is also selected, it's a nested child — drop it
+    const selectedSet = new Set(verifiedIds);
+    return verifiedIds.filter((id) => {
+        const ancestors = ancestorMap.get(id);
+        for (const ancestor of ancestors) {
+            if (selectedSet.has(ancestor))
+                return false;
+        }
+        return true;
+    });
+}
+/**
+ * For each ID, find its parent array (reference) and index using DFS.
+ */
+export function locateModules(ids, modules) {
+    const idSet = new Set(ids);
+    const locations = [];
+    dfs(modules, (mod, parentModules) => {
+        if (idSet.has(mod.id)) {
+            const index = parentModules.findIndex((m) => m.id === mod.id);
+            if (index !== -1) {
+                locations.push({ id: mod.id, parentArray: parentModules, index });
+            }
+        }
+    });
+    return locations;
+}
+/**
+ * Group locations that share the same parent array, sorted by index within each group.
+ */
+export function groupByParent(locations) {
+    const groups = new Map();
+    for (const loc of locations) {
+        const existing = groups.get(loc.parentArray);
+        if (existing) {
+            existing.push(loc);
+        }
+        else {
+            groups.set(loc.parentArray, [loc]);
+        }
+    }
+    // Sort each group by index
+    for (const group of groups.values()) {
+        group.sort((a, b) => a.index - b.index);
+    }
+    return Array.from(groups.values());
+}
+/**
+ * True if all locations share the same parent array and have consecutive indices.
+ * Required for move to be valid.
+ */
+export function areContiguousSiblings(locations) {
+    if (locations.length === 0)
+        return false;
+    if (locations.length === 1)
+        return true;
+    // All must share the same parent
+    const parent = locations[0].parentArray;
+    if (!locations.every((loc) => loc.parentArray === parent))
+        return false;
+    // Sort by index and check contiguity
+    const sorted = [...locations].sort((a, b) => a.index - b.index);
+    for (let i = 1; i < sorted.length; i++) {
+        if (sorted[i].index !== sorted[i - 1].index + 1)
+            return false;
+    }
+    return true;
+}

package/package/components/flows/pickers/FlowScriptPicker.svelte

@@ -21,6 +21,9 @@ const enterpriseLangs = ['bigquery', 'snowflake', 'mssql', 'oracledb'];
 				<LanguageIcon {lang} />
 			{/if}
 			<span class="text-xs">{label}</span>
+			{#if lang === 'claudesandbox'}
+				<span class="text-primary !text-xs">(new)</span>
+			{/if}
 		</div>
 	</Button>
 	{#snippet text()}

package/package/components/flows/pickers/FlowScriptPicker.svelte.d.ts

@@ -2,7 +2,7 @@ import type { SupportedLanguage } from '../../../common';
 interface Props {
     disabled?: boolean;
     label: string;
-    lang?: SupportedLanguage | 'docker' | 'javascript' | undefined;
+    lang?: SupportedLanguage | 'docker' | 'javascript' | 'claudesandbox' | undefined;
     id?: string | undefined;
 }
 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> {

package/package/components/flows/pickers/FlowScriptPickerQuick.svelte

@@ -2,11 +2,7 @@
 import LanguageIcon from '../../common/languageIcons/LanguageIcon.svelte';
 import { sendUserToast } from '../../../toast';
 import { createEventDispatcher } from 'svelte';
-export let label;
-export let lang = undefined;
-export let selected = false;
-export let eeRestricted;
-export let enterpriseLangs = [];
+let { label, lang = undefined, selected = false, eeRestricted, enterpriseLangs = [] } = $props();
 const dispatch = createEventDispatcher();
 function handleKeydown(event) {
     if (selected && event.key === 'Enter') {
@@ -22,7 +18,7 @@ function click() {
 }
 </script>
 
-<svelte:window on:keydown={handleKeydown} />
+<svelte:window onkeydown={handleKeydown} />
 
 <Button
 	id={`flow-editor-new-${lang}`}
@@ -38,6 +34,9 @@ function click() {
 	{/if}
 	<span class="grow truncate text-left {eeRestricted ? 'text-disabled' : ''}">
 		{label}{#if eeRestricted}&nbsp;(EE){/if}
+		{#if lang === 'claudesandbox'}
+			<span class="text-primary !text-xs">(new)</span>
+		{/if}
 	</span>
 	{#if selected}
 		<kbd class="!text-xs">&crarr;</kbd>

package/package/components/flows/pickers/FlowScriptPickerQuick.svelte.d.ts

@@ -1,4 +1,11 @@
 import type { SupportedLanguage } from '../../../common';
+interface Props {
+    label: string;
+    lang?: SupportedLanguage | 'docker' | 'javascript' | 'claudesandbox' | undefined;
+    selected?: boolean;
+    eeRestricted: boolean;
+    enterpriseLangs?: string[];
+}
 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;
@@ -12,16 +19,10 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const FlowScriptPickerQuick: $$__sveltets_2_IsomorphicComponent<{
-    label: string;
-    lang?: SupportedLanguage | "docker" | "javascript" | undefined;
-    selected?: boolean;
-    eeRestricted: boolean;
-    enterpriseLangs?: string[];
-}, {
+declare const FlowScriptPickerQuick: $$__sveltets_2_IsomorphicComponent<Props, {
     click: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type FlowScriptPickerQuick = InstanceType<typeof FlowScriptPickerQuick>;
 export default FlowScriptPickerQuick;

package/package/components/flows/pickers/FlowToplevelNode.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">import { createEventDispatcher } from 'svelte';
 import TopLevelNode from './TopLevelNode.svelte';
-export let label;
-export let selected = false;
+let { label, selected = false } = $props();
 const dispatch = createEventDispatcher();
 function handleKeydown(event) {
     if (selected && event.key === 'Enter') {
@@ -14,6 +13,6 @@ function click() {
 }
 </script>
 
-<svelte:window on:keydown={handleKeydown} />
+<svelte:window onkeydown={handleKeydown} />
 
 <TopLevelNode {label} {selected} returnIcon onSelect={click} />

package/package/components/flows/pickers/FlowToplevelNode.svelte.d.ts

@@ -1,3 +1,7 @@
+interface Props {
+    label: string;
+    selected?: boolean;
+}
 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;
@@ -11,13 +15,10 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const FlowToplevelNode: $$__sveltets_2_IsomorphicComponent<{
-    label: string;
-    selected?: boolean;
-}, {
+declare const FlowToplevelNode: $$__sveltets_2_IsomorphicComponent<Props, {
     click: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type FlowToplevelNode = InstanceType<typeof FlowToplevelNode>;
 export default FlowToplevelNode;

package/package/components/flows/pickers/PickHubApp.svelte

@@ -6,6 +6,8 @@ import NoItemFound from '../../home/NoItemFound.svelte';
 import RowIcon from '../../common/table/RowIcon.svelte';
 import { loadHubApps } from '../../../hub';
 import TextInput from '../../text_input/TextInput.svelte';
+import { Alert } from '../../common';
+import { disableHubStore } from '../../../stores';
 let { filter = $bindable(''), syncQuery = false, children, size = 'md' } = $props();
 let hubApps = $state(undefined);
 let filteredItems = $state([]);
@@ -13,11 +15,23 @@ let appFilter = $state(undefined);
 const prefilteredItems = $derived(appFilter ? (hubApps ?? []).filter((i) => i.apps.includes(appFilter)) : (hubApps ?? []));
 const apps = $derived(Array.from(new Set(filteredItems?.flatMap((x) => x.apps) ?? [])).sort());
 const dispatch = createEventDispatcher();
+let hubNotAvailable = $state(false);
 onMount(async () => {
-    hubApps = await loadHubApps();
+    if ($disableHubStore)
+        return;
+    const result = await loadHubApps();
+    if (result === undefined) {
+        hubNotAvailable = true;
+    }
+    else {
+        hubApps = result;
+    }
 });
 </script>
 
+{#if $disableHubStore}
+	<!-- Hub disabled, show nothing -->
+{:else}
 <SearchItems
 	{filter}
 	items={prefilteredItems}
@@ -37,7 +51,11 @@ onMount(async () => {
 </div>
 <ListFilters {syncQuery} filters={apps} bind:selectedFilter={appFilter} resourceType />
 
-{#if hubApps}
+{#if hubNotAvailable}
+	<Alert type="warning" title="Hub not available">
+		Could not connect to the Windmill Hub. If you are in a closed environment, you can disable the Hub in the <a href="/#superadmin-settings?tab=private_hub">instance settings</a>.
+	</Alert>
+{:else if hubApps}
 	{#if filteredItems.length == 0}
 		<NoItemFound />
 	{:else}
@@ -76,3 +94,4 @@ onMount(async () => {
 		<Skeleton layout={[[4], 0.5]} />
 	{/each}
 {/if}
+{/if}

package/package/components/flows/pickers/PickHubFlow.svelte

@@ -6,6 +6,8 @@ import NoItemFound from '../../home/NoItemFound.svelte';
 import RowIcon from '../../common/table/RowIcon.svelte';
 import { loadHubFlows } from '../../../hub';
 import TextInput from '../../text_input/TextInput.svelte';
+import { Alert } from '../../common';
+import { disableHubStore } from '../../../stores';
 let { filter = $bindable(''), syncQuery = false, children, size = 'md' } = $props();
 let hubFlows = $state(undefined);
 let filteredItems = $state([]);
@@ -13,11 +15,23 @@ let appFilter = $state(undefined);
 const prefilteredItems = $derived(appFilter ? (hubFlows ?? []).filter((i) => i.apps.includes(appFilter)) : (hubFlows ?? []));
 const apps = $derived(Array.from(new Set(filteredItems?.flatMap((x) => x.apps) ?? [])).sort());
 const dispatch = createEventDispatcher();
+let hubNotAvailable = $state(false);
 onMount(async () => {
-    hubFlows = await loadHubFlows();
+    if ($disableHubStore)
+        return;
+    const result = await loadHubFlows();
+    if (result === undefined) {
+        hubNotAvailable = true;
+    }
+    else {
+        hubFlows = result;
+    }
 });
 </script>
 
+{#if $disableHubStore}
+	<!-- Hub disabled, show nothing -->
+{:else}
 <SearchItems
 	{filter}
 	items={prefilteredItems}
@@ -37,7 +51,11 @@ onMount(async () => {
 </div>
 <ListFilters {syncQuery} filters={apps} bind:selectedFilter={appFilter} resourceType />
 
-{#if hubFlows}
+{#if hubNotAvailable}
+	<Alert type="warning" title="Hub not available">
+		Could not connect to the Windmill Hub. If you are in a closed environment, you can disable the Hub in the <a href="/#superadmin-settings?tab=private_hub">instance settings</a>.
+	</Alert>
+{:else if hubFlows}
 	{#if filteredItems.length == 0}
 		<NoItemFound />
 	{:else}
@@ -78,3 +96,4 @@ onMount(async () => {
 		<Skeleton layout={[[4], 0.5]} />
 	{/each}
 {/if}
+{/if}

package/package/components/flows/pickers/PickHubScript.svelte

@@ -7,6 +7,7 @@ import ListFilters from '../../home/ListFilters.svelte';
 import { IntegrationService, ScriptService } from '../../../gen';
 import { Loader2 } from 'lucide-svelte';
 import TextInput from '../../text_input/TextInput.svelte';
+import { disableHubStore } from '../../../stores';
 let { kind = 'script', filter = $bindable(''), syncQuery = false, children, size = 'md' } = $props();
 let loading = $state(false);
 let hubNotAvailable = $state(false);
@@ -16,6 +17,8 @@ let items = $state([]);
 let allApps = $state([]);
 let apps = $derived.by(() => filter.length > 0 ? Array.from(new Set(items?.map((x) => x.app) ?? [])).sort() : allApps);
 async function getAllApps(filterKind) {
+    if ($disableHubStore)
+        return;
     try {
         hubNotAvailable = false;
         allApps = (await IntegrationService.listHubIntegrations({
@@ -30,6 +33,8 @@ async function getAllApps(filterKind) {
 }
 let startTs = 0;
 async function applyFilter(filter, filterKind, appFilter) {
+    if ($disableHubStore)
+        return;
     try {
         loading = true;
         hubNotAvailable = false;
@@ -90,6 +95,9 @@ $effect(() => {
 });
 </script>
 
+{#if $disableHubStore}
+	<!-- Hub disabled, show nothing -->
+{:else}
 <div class="w-full flex items-center gap-2">
 	{@render children?.()}
 	<div class="relative w-full">
@@ -108,7 +116,9 @@ $effect(() => {
 </div>
 
 {#if hubNotAvailable}
-	<Alert type="error" title="Hub not available" />
+	<Alert type="warning" title="Hub not available">
+		Could not connect to the Windmill Hub. If you are in a closed environment, you can disable the Hub in the <a href="/#superadmin-settings?tab=private_hub">instance settings</a>.
+	</Alert>
 {:else if (items.length > 0 && apps.length > 0) || !loading}
 	<ListFilters {syncQuery} filters={apps} bind:selectedFilter={appFilter} resourceType />
 	{#if items.length == 0}
@@ -156,3 +166,4 @@ $effect(() => {
 		<Skeleton layout={[0.5, [4]]} />
 	{/each}
 {/if}
+{/if}

package/package/components/flows/pickers/PickHubScriptQuick.svelte

@@ -10,7 +10,7 @@ let listHubScriptsCached = createCache(async ({ filter, kind, appFilter }) => {
             : undefined;
     }
     catch (err) {
-        sendUserToast('Failed to fetch hub scripts: ' + err, 'error');
+        console.error('Failed to fetch hub scripts:', err);
         return undefined;
     }
 }, {
@@ -27,9 +27,10 @@ import { IntegrationService, ScriptService } from '../../../gen';
 import { Circle, ExternalLink } from 'lucide-svelte';
 import Popover from '../../Popover.svelte';
 import { usePromise } from '../../../svelte5Utils.svelte';
-import { hubBaseUrlStore, userStore } from '../../../stores';
+import { disableHubStore, hubBaseUrlStore, userStore } from '../../../stores';
 import { get } from 'svelte/store';
 import Button from '../../common/button/Button.svelte';
+import { Alert } from '../../common';
 let hubNotAvailable = $state(false);
 const dispatch = createEventDispatcher();
 let { kind = 'script', filter = $bindable(''), loading = $bindable(false), selected = undefined, appFilter = undefined, items = $bindable([]), displayPath = false, apps = $bindable([]), refreshCount = 0 } = $props();
@@ -43,12 +44,14 @@ $effect(() => {
     }
 });
 async function getAllApps(filterKind) {
+    if ($disableHubStore)
+        return;
     try {
         hubNotAvailable = false;
         allApps = (await listHubIntegrationsCached({ kind: filterKind, refreshCount })).map((x) => x.name);
     }
     catch (err) {
-        sendUserToast('Failed to fetch hub integrations: ' + err, 'error');
+        console.error('Failed to fetch hub integrations:', err);
         allApps = [];
         hubNotAvailable = true;
     }
@@ -57,7 +60,9 @@ let hubScriptsFilteredPromise = usePromise(() => listHubScriptsCached({ appFilte
 $effect(() => {
     ;
     [filter, kind, appFilter, refreshCount];
-    hubScriptsFilteredPromise.refresh();
+    if (!$disableHubStore) {
+        hubScriptsFilteredPromise.refresh();
+    }
 });
 $effect(() => {
     loading = hubScriptsFilteredPromise.status === 'loading';
@@ -108,9 +113,13 @@ $effect(() => {
 </script>
 
 <svelte:window onkeydown={onKeyDown} />
-{#if hubNotAvailable}
-	<div class="text-2xs text-red-400 font-normal text-center py-2 px-3 items-center">
-		Hub not available
+{#if $disableHubStore}
+	<!-- Hub disabled, show nothing -->
+{:else if hubNotAvailable}
+	<div class="px-3 py-2 mt-2">
+		<Alert type="warning" title="Hub not available" size="xs">
+			Could not connect to the Windmill Hub. If you are in a closed environment, you can disable the Hub in the <a href="/#superadmin-settings?tab=private_hub">instance settings</a>.
+		</Alert>
 	</div>
 {:else if loading}
 	{#each Array(15).fill(0) as _}

package/package/components/flows/pickers/TopLevelNode.svelte

@@ -13,6 +13,8 @@ const iconMap = {
     'Branch to one': { icon: GitBranch },
     'Branch to all': { icon: GitBranch },
     'AI Agent': { icon: BotIcon, iconClass: 'text-ai' },
+    'AI Sandbox': { icon: BotIcon, showChevron: true, iconClass: 'text-ai' },
+    'Claude Code': { icon: BotIcon, iconClass: 'text-ai' },
     MCP: { icon: Plug, showChevron: true },
     'Web Search': { icon: Globe }
 };

package/package/components/flows/previousResults.d.ts

@@ -21,7 +21,7 @@ export declare function getFailureStepPropPicker(flowState: FlowState, flow: Ope
         previousId: undefined;
         hasResume: boolean;
         flow_env: {
-            [key: string]: string;
+            [key: string]: unknown;
         } | undefined;
     };
     extraLib: string;