windmill-components 1.542.4 → 1.550.0

package/package/components/apps/editor/component/components.js

@@ -879,11 +879,23 @@ export const components = {
                     value: undefined,
                     fieldType: 'icon-select'
                 },
+                tooltip: {
+                    type: 'static',
+                    value: '',
+                    fieldType: 'text',
+                    tooltip: 'Tooltip text to show on hover'
+                },
                 triggerOnAppLoad: {
                     type: 'static',
                     value: false,
                     fieldType: 'boolean'
                 },
+                runInBackground: {
+                    type: 'static',
+                    value: false,
+                    fieldType: 'boolean',
+                    tooltip: 'Run the job in the background without blocking the button. Multiple clicks will trigger multiple jobs.'
+                },
                 onSuccess: onSuccessClick,
                 onError: onErrorClick,
                 confirmationModal: {
@@ -2456,7 +2468,15 @@ See date-fns format for more information. By default, it is 'dd.MM.yyyy HH:mm'
             },
             componentInput: undefined,
             numberOfSubgrids: 2,
-            tabs: ['First tab', 'Second tab']
+            tabs: ['First tab', 'Second tab'],
+            disabledTabs: [
+                { type: 'static', value: false, fieldType: 'boolean' },
+                { type: 'static', value: false, fieldType: 'boolean' }
+            ],
+            hiddenTabs: [
+                { type: 'static', value: false, fieldType: 'boolean' },
+                { type: 'static', value: false, fieldType: 'boolean' }
+            ]
         }
     },
     steppercomponent: {
@@ -2994,7 +3014,7 @@ See date-fns format for more information. By default, it is 'dd.MM.yyyy HH:mm'
                     type: 'static',
                     fieldType: 'object',
                     value: {},
-                    tooltip: 'This enables setting form enum values dynamically using an object: keys are field names, and values are arrays of strings.'
+                    tooltip: 'This enables setting form enum values dynamically using an object: keys are field names, and values are arrays of strings or { "label": "myLabel", "value": "myValue" }.'
                 },
                 displayType: {
                     fieldType: 'boolean',

package/package/components/apps/editor/settingsPanel/ComponentPanel.svelte

@@ -337,8 +337,10 @@ function onTemplateChange(e) {
 			<GridTab
 				bind:tabs={item.data.tabs}
 				bind:disabledTabs={item.data.disabledTabs}
+				bind:hiddenTabs={item.data.hiddenTabs}
 				bind:component={item.data}
 				canDisableTabs
+				canHideTabs
 			/>
 		{:else if item.data.type === 'aggridcomponentee'}
 			<GridAgGridLicenseKey bind:license={item.data.license} />

package/package/components/apps/editor/settingsPanel/GridTab.svelte

@@ -9,7 +9,8 @@ import { dragHandle, dragHandleZone } from '@windmill-labs/svelte-dnd-action';
 import { generateRandomString } from '../../../../utils';
 import { GripVertical, Plus } from 'lucide-svelte';
 import GridTabDisabled from './GridTabDisabled.svelte';
-let { tabs = $bindable(undefined), disabledTabs = $bindable(undefined), canDisableTabs = false, word = 'Tab', component = $bindable() } = $props();
+import GridTabHidden from './GridTabHidden.svelte';
+let { tabs = $bindable(undefined), disabledTabs = $bindable(undefined), hiddenTabs = $bindable(undefined), canDisableTabs = false, canHideTabs = false, word = 'Tab', component = $bindable() } = $props();
 $effect.pre(() => {
     if (tabs == undefined) {
         tabs = [];
@@ -20,6 +21,12 @@ $effect.pre(() => {
             { type: 'static', value: false, fieldType: 'boolean' }
         ];
     }
+    if (hiddenTabs == undefined) {
+        hiddenTabs = [
+            { type: 'static', value: false, fieldType: 'boolean' },
+            { type: 'static', value: false, fieldType: 'boolean' }
+        ];
+    }
 });
 let items = $state.raw((tabs ?? []).map((tab, index) => {
     return { value: tab, id: generateRandomString(), originalIndex: index };
@@ -47,6 +54,7 @@ function addTab() {
     ];
     component.numberOfSubgrids = items.length;
     disabledTabs = [...(disabledTabs ?? []), { type: 'static', value: false, fieldType: 'boolean' }];
+    hiddenTabs = [...(hiddenTabs ?? []), { type: 'static', value: false, fieldType: 'boolean' }];
 }
 function deleteSubgrid(index) {
     let subgrid = `${component.id}-${index}`;
@@ -64,6 +72,8 @@ function deleteSubgrid(index) {
     items = items.filter((item) => item.originalIndex !== index);
     // Delete the item in the disabledTabs array
     disabledTabs = (disabledTabs ?? []).filter((_, i) => i !== index);
+    // Delete the item in the hiddenTabs array
+    hiddenTabs = (hiddenTabs ?? []).filter((_, i) => i !== index);
     component.numberOfSubgrids = items.length;
     // Update the originalIndex of the remaining items
     items.forEach((item, i) => {
@@ -93,10 +103,13 @@ function handleFinalize(e) {
                 $app.subgrids[`${component.id}-${items[i].originalIndex}`] ?? [];
         }
         const newDisabledTabs = [];
+        const newHiddenTabs = [];
         for (let i = 0; i < items.length; i++) {
             disabledTabs && newDisabledTabs.push(disabledTabs[items[i].originalIndex]);
+            hiddenTabs && newHiddenTabs.push(hiddenTabs[items[i].originalIndex]);
         }
         disabledTabs = newDisabledTabs;
+        hiddenTabs = newHiddenTabs;
         // update originalIndex
         items.forEach((item, i) => {
             item.originalIndex = i;
@@ -156,6 +169,11 @@ const rnd = generateRandomString();
 					{#if canDisableTabs && disabledTabs}
 						<GridTabDisabled {index} bind:field={disabledTabs[index]} id={component.id} />
 					{/if}
+					{#if canHideTabs && hiddenTabs}
+						<div class="mt-2">
+							<GridTabHidden {index} bind:field={hiddenTabs[index]} id={component.id} />
+						</div>
+					{/if}
 				</div>
 			{/each}
 		</section>

package/package/components/apps/editor/settingsPanel/GridTab.svelte.d.ts

@@ -3,10 +3,12 @@ import type { AppComponent } from '../component';
 interface Props {
     tabs?: string[];
     disabledTabs?: RichConfiguration[];
+    hiddenTabs?: RichConfiguration[];
     canDisableTabs?: boolean;
+    canHideTabs?: boolean;
     word?: string;
     component: AppComponent;
 }
-declare const GridTab: import("svelte").Component<Props, {}, "component" | "tabs" | "disabledTabs">;
+declare const GridTab: import("svelte").Component<Props, {}, "component" | "tabs" | "disabledTabs" | "hiddenTabs">;
 type GridTab = ReturnType<typeof GridTab>;
 export default GridTab;

package/package/components/apps/editor/settingsPanel/GridTabHidden.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">import Toggle from '../../../Toggle.svelte';
+import InputsSpecEditor from './InputsSpecEditor.svelte';
+import { slide } from 'svelte/transition';
+let { id, field = $bindable(), index } = $props();
+let hideable = $state(field && !(field?.type === 'static' && field?.value === false));
+</script>
+
+<Toggle
+	bind:checked={hideable}
+	size="xs"
+	options={{
+		right: 'Can be hidden'
+	}}
+	on:change={() => {
+		if (hideable) {
+			field = {
+				type: 'evalv2',
+				expr: 'false',
+				fieldType: 'boolean',
+				connections: []
+			}
+		} else {
+			field = {
+				type: 'static',
+				value: false,
+				fieldType: 'boolean'
+			}
+		}
+	}}
+/>
+
+{#if hideable}
+	<div transition:slide|local>
+		<InputsSpecEditor
+			key="tabHidden {index}"
+			bind:componentInput={field}
+			{id}
+			userInputEnabled={false}
+			shouldCapitalize={true}
+			resourceOnly={false}
+			fieldType={field?.['fieldType']}
+			subFieldType={field?.['subFieldType']}
+			format={field?.['format']}
+			selectOptions={field?.['selectOptions']}
+			tooltip={field?.['tooltip']}
+			fileUpload={field?.['fileUpload']}
+			placeholder={field?.['placeholder']}
+			customTitle={field?.['customTitle']}
+			displayType={false}
+		/>
+	</div>
+{/if}

package/package/components/apps/editor/settingsPanel/GridTabHidden.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { RichConfiguration } from '../../types';
+interface Props {
+    id: string;
+    field: RichConfiguration;
+    index: number;
+}
+declare const GridTabHidden: import("svelte").Component<Props, {}, "field">;
+type GridTabHidden = ReturnType<typeof GridTabHidden>;
+export default GridTabHidden;

package/package/components/auditLogs/AuditLogsFilters.svelte

@@ -190,6 +190,9 @@ const operations = {
     USERS_ADD_GLOBAL: 'users.add_global',
     USERS_IMPERSONATE: 'users.impersonate',
     USERS_LEAVE_WORKSPACE: 'users.leave_workspace',
+    USERS_SCIM_CREATE: 'users.scim_create',
+    USERS_SCIM_DELETE: 'users.scim_delete',
+    USERS_SCIM_UPDATE: 'users.scim_update',
     OAUTH_LOGIN: 'oauth.login',
     OAUTH_LOGIN_FAILURE: 'oauth.login_failure',
     OAUTH_SIGNUP: 'oauth.signup',
@@ -217,6 +220,9 @@ const operations = {
     IGROUP_DELETE: 'igroup.delete',
     IGROUP_ADDUSER: 'igroup.adduser',
     IGROUP_REMOVEUSER: 'igroup.removeuser',
+    INSTANCE_GROUPS_SCIM_CREATE: 'instance_groups.scim_create',
+    INSTANCE_GROUPS_SCIM_DELETE: 'instance_groups.scim_delete',
+    INSTANCE_GROUPS_SCIM_UPDATE: 'instance_groups.scim_update',
     VARIABLES_DECRYPT_SECRET: 'variables.decrypt_secret',
     WORKSPACES_EDIT_COMMAND_SCRIPT: 'workspaces.edit_command_script',
     WORKSPACES_EDIT_DEPLOY_TO: 'workspaces.edit_deploy_to',

package/package/components/auditLogs/AuditLogsTable.svelte

@@ -5,7 +5,7 @@ import Button from '../common/button/Button.svelte';
 import { ListFilter, ChevronLeft, ChevronRight } from 'lucide-svelte';
 import VirtualList from '@tutorlatin/svelte-tiny-virtual-list';
 import { twMerge } from 'tailwind-merge';
-let { logs = [], pageIndex = $bindable(1), perPage = $bindable(100), hasMore = $bindable(true), actionKind = $bindable(), operation = $bindable(), selectedId = undefined, usernameFilter = $bindable(), resourceFilter = $bindable(), onselect } = $props();
+let { logs = [], pageIndex = $bindable(1), perPage = $bindable(100), hasMore = $bindable(true), actionKind = $bindable(), operation = $bindable(), selectedId = undefined, usernameFilter = $bindable(), resourceFilter = $bindable(), showWorkspace = false, onselect } = $props();
 function groupLogsByDay(logs) {
     const groupedLogs = {};
     if (!logs)
@@ -82,9 +82,12 @@ function kindToBadgeColor(kind) {
 			class="flex flex-row bg-surface-secondary sticky top-0 w-full p-2 pr-4 text-xs font-semibold"
 		>
 			<div class="w-1/12">ID</div>
-			<div class="w-3/12">Timestamp</div>
-			<div class="w-3/12">Username</div>
-			<div class="w-3/12">Operation</div>
+			<div class={showWorkspace ? "w-2/12" : "w-3/12"}>Timestamp</div>
+			<div class={showWorkspace ? "w-2/12" : "w-3/12"}>Username</div>
+			{#if showWorkspace}
+				<div class="w-2/12">Workspace</div>
+			{/if}
+			<div class={showWorkspace ? "w-2/12" : "w-3/12"}>Operation</div>
 			<div class="w-2/12">Resource</div>
 		</div>
 	</div>
@@ -128,10 +131,10 @@ function kindToBadgeColor(kind) {
 									<div class="w-1/12 text-xs truncate">
 										{logOrDate.log.id}
 									</div>
-									<div class="w-3/12 text-xs">
+									<div class={showWorkspace ? "w-2/12 text-xs" : "w-3/12 text-xs"}>
 										{displayDate(logOrDate.log.timestamp)}
 									</div>
-									<div class="w-3/12 text-xs">
+									<div class={showWorkspace ? "w-2/12 text-xs" : "w-3/12 text-xs"}>
 										<div class="flex flex-row gap-2 items-center">
 											<div class="whitespace-nowrap overflow-x-auto no-scrollbar max-w-60">
 												{logOrDate.log.username}
@@ -150,7 +153,14 @@ function kindToBadgeColor(kind) {
 											/>
 										</div>
 									</div>
-									<div class="w-3/12 text-xs">
+									{#if showWorkspace}
+										<div class="w-2/12 text-xs">
+											<div class="whitespace-nowrap overflow-x-auto no-scrollbar max-w-60">
+												{logOrDate.log.workspace_id}
+											</div>
+										</div>
+									{/if}
+									<div class={showWorkspace ? "w-2/12 text-xs" : "w-3/12 text-xs"}>
 										<div class="flex flex-row gap-1">
 											<Badge
 												on:click={() => {

package/package/components/auditLogs/AuditLogsTable.svelte.d.ts

@@ -9,6 +9,7 @@ interface Props {
     selectedId?: number | undefined;
     usernameFilter?: string | undefined;
     resourceFilter?: string | undefined;
+    showWorkspace?: boolean;
     onselect?: (id: number) => void;
 }
 declare const AuditLogsTable: import("svelte").Component<Props, {}, "operation" | "perPage" | "hasMore" | "pageIndex" | "actionKind" | "usernameFilter" | "resourceFilter">;

package/package/components/common/CloseButton.svelte

@@ -2,12 +2,12 @@
 import Button from './button/Button.svelte';
 import { X } from 'lucide-svelte';
 import { twMerge } from 'tailwind-merge';
-let { noBg = false, small = false, Icon, class: className } = $props();
+let { noBg = false, small = false, Icon, class: className, onClick } = $props();
 const dispatch = createEventDispatcher();
 </script>
 
 <Button
-	on:click={() => dispatch('close')}
+	on:click={() => (dispatch('close'), onClick?.())}
 	on:pointerdown={(e) => e.stopPropagation()}
 	startIcon={{ icon: Icon ?? X }}
 	iconOnly

package/package/components/common/CloseButton.svelte.d.ts

@@ -3,6 +3,7 @@ interface Props {
     small?: boolean;
     Icon?: any | undefined;
     class?: string;
+    onClick?: () => void | undefined | any;
 }
 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/common/layout/List.svelte

@@ -1,9 +1,5 @@
 <script lang="ts">import { twMerge } from 'tailwind-merge';
-export let horizontal = false;
-export let gap = 'sm';
-export let justify = 'start';
-export let wFull = true;
-export let hFull = true;
+let { horizontal = false, gap = 'sm', justify = 'start', wFull = true, hFull = true, children } = $props();
 const gapMap = {
     none: '',
     sm: 'gap-2',
@@ -24,7 +20,7 @@ const justifyMap = {
 			justify
 		]}"
 	>
-		<slot />
+		{@render children?.()}
 	</div>
 {:else}
 	<div
@@ -36,6 +32,6 @@ const justifyMap = {
 			justifyMap[justify]
 		)}
 	>
-		<slot />
+		{@render children?.()}
 	</div>
 {/if}

package/package/components/common/layout/List.svelte.d.ts

@@ -1,33 +1,11 @@
-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;
-}
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const List: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+interface Props {
     horizontal?: boolean;
-    gap?: "none" | "sm" | "md" | "lg";
-    justify?: "start" | "center" | "end" | "between";
+    gap?: 'none' | 'sm' | 'md' | 'lg';
+    justify?: 'start' | 'center' | 'end' | 'between';
     wFull?: boolean;
     hFull?: boolean;
-}, {
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}, {}, string>;
-type List = InstanceType<typeof List>;
+    children?: import('svelte').Snippet;
+}
+declare const List: import("svelte").Component<Props, {}, "">;
+type List = ReturnType<typeof List>;
 export default List;

package/package/components/common/popup/PopupV2.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">import Portal from '../../Portal.svelte';
 import { clickOutside } from '../../../utils';
 import { createFloatingActions } from 'svelte-floating-ui';
+import { fly } from 'svelte/transition';
 let { floatingConfig = {
     strategy: 'absolute',
     //@ts-ignore
@@ -9,28 +10,13 @@ let { floatingConfig = {
 // export let containerClasses: string = 'rounded-lg shadow-md border p-4 bg-surface'
 // export let floatingClasses: string = ''
 const [floatingRef, floatingContent] = createFloatingActions(floatingConfig);
-function close(div) {
+function close() {
     open = false;
 }
-let acceptClickoutside = $state(false);
-function pointerup() {
-    setTimeout(() => {
-        acceptClickoutside = true;
-    }, 100);
-}
-function pointerdown() {
-    if (acceptClickoutside && open) {
-        open = false;
-    }
-    else {
-        acceptClickoutside = false;
-        open = true;
-    }
-}
 </script>
 
 <div use:floatingRef>
-	{@render button?.({ pointerup, pointerdown })}
+	{@render button?.()}
 </div>
 
 <Portal name="popup-v2" {target}>
@@ -39,18 +25,15 @@ function pointerdown() {
 			class="border rounded-lg shadow-lg bg-surface z5000"
 			style="position:absolute"
 			use:floatingContent
+			transition:fly={{ duration: 100, y: -16 }}
 		>
-			<!-- svelte-ignore event_directive_deprecated -->
 			<div
-				use:clickOutside
-				on:click_outside={() => {
-					if (acceptClickoutside) {
-						acceptClickoutside = false
-						open = false
-					}
+				use:clickOutside={{
+					eventToListenName: 'pointerdown',
+					onClickOutside: () => (open = false)
 				}}
 			>
-				{@render children?.({ close })}
+				{@render children?.({ close: () => close() })}
 			</div>
 		</div>
 	{/if}

package/package/components/common/popup/PopupV2.svelte.d.ts

@@ -3,8 +3,10 @@ interface Props {
     floatingConfig?: ComputeConfig;
     open?: boolean;
     target?: string | undefined;
-    button?: import('svelte').Snippet<[any]>;
-    children?: import('svelte').Snippet<[any]>;
+    button?: import('svelte').Snippet;
+    children?: import('svelte').Snippet<[{
+        close: () => void;
+    }]>;
 }
 declare const PopupV2: import("svelte").Component<Props, {}, "open">;
 type PopupV2 = ReturnType<typeof PopupV2>;

package/package/components/common/table/ScriptRow.svelte

@@ -4,7 +4,7 @@ import Dropdown from '../../DropdownV2.svelte';
 import ScheduleEditor from '../../triggers/schedules/ScheduleEditor.svelte';
 import SharedBadge from '../../SharedBadge.svelte';
 import { ScriptService, DraftService } from '../../../gen';
-import { userStore, workspaceStore } from '../../../stores';
+import { hubBaseUrlStore, userStore, workspaceStore } from '../../../stores';
 import { createEventDispatcher } from 'svelte';
 import Badge from '../badge/Badge.svelte';
 import Button from '../button/Button.svelte';
@@ -14,12 +14,13 @@ import { sendUserToast } from '../../../toast';
 import { capitalize, copyToClipboard, DELETE, isOwner } from '../../../utils';
 import { isDeployable } from '../../../utils_deployable';
 import { LanguageIcon } from '../languageIcons';
-import { Archive, Calendar, Code, Copy, Eye, FolderOpen, ChevronUpSquare, GitFork, List, Pen, Share, Trash, History } from 'lucide-svelte';
+import { Archive, Calendar, Code, Copy, Eye, FolderOpen, ChevronUpSquare, GitFork, List, Pen, Share, Trash, History, Globe2 } from 'lucide-svelte';
 import ScriptVersionHistory from '../../ScriptVersionHistory.svelte';
 import { Drawer, DrawerContent } from '..';
 import NoMainFuncBadge from '../../NoMainFuncBadge.svelte';
 import Tooltip from '../../Tooltip.svelte';
 import { getDeployUiSettings } from '../../home/deploy_ui';
+import { scriptToHubUrl } from '../../../hub';
 let { script, marked, starred, shareModal, moveDrawer, deploymentDrawer, deleteConfirmedCallback = $bindable(), errorHandlerMuted, showCode, depth = 0, menuOpen = $bindable(false) } = $props();
 const dispatch = createEventDispatcher();
 async function archiveScript(path) {
@@ -247,6 +248,25 @@ let versionsDrawerOpen = $state(false);
 							copyToClipboard(script.path)
 						}
 					},
+					{
+						displayName: 'Publish to Hub',
+						icon: Globe2,
+						action: () => {
+							window.open(
+								scriptToHubUrl(
+									script.content,
+									script.summary,
+									script.description ?? '',
+									script.kind,
+									script.language,
+									script.schema,
+									script.lock ?? '',
+									$hubBaseUrlStore
+								).toString(),
+								'_blank'
+							)
+						}
+					},
 					{
 						displayName: script.archived ? 'Unarchive' : 'Archive',
 						icon: Archive,

package/package/components/copilot/FlowCopilotInputsModal.svelte

@@ -1,35 +1,38 @@
 <script lang="ts">import { createEventDispatcher } from 'svelte';
 import { Button, Badge } from '../common';
 import Modal from '../common/modal/Modal.svelte';
+import Portal from '../Portal.svelte';
 export let open = false;
 export let inputs = [];
 const dispatch = createEventDispatcher();
 </script>
 
-<Modal
-	bind:open
-	on:confirmed={() => {
-		open = false
-		dispatch('confirmed')
-	}}
-	on:canceled
-	title="Windmill AI wants to add the following inputs to the flow:"
->
-	<ul class=" list-disc pl-5">
-		{#each inputs as input}
-			<li>{input}</li>
-		{/each}
-	</ul>
-
-	<Button
-		slot="actions"
-		on:click={() => {
+<Portal>
+	<Modal
+		bind:open
+		on:confirmed={() => {
 			open = false
 			dispatch('confirmed')
 		}}
-		color="light"
-		size="sm"
+		on:canceled
+		title="Windmill AI wants to add the following inputs to the flow:"
 	>
-		<span class="inline-flex gap-2">Add <Badge color="dark-green">Enter</Badge></span>
-	</Button>
-</Modal>
+		<ul class=" list-disc pl-5">
+			{#each inputs as input}
+				<li>{input}</li>
+			{/each}
+		</ul>
+
+		<Button
+			slot="actions"
+			on:click={() => {
+				open = false
+				dispatch('confirmed')
+			}}
+			color="light"
+			size="sm"
+		>
+			<span class="inline-flex gap-2">Add <Badge color="dark-green">Enter</Badge></span>
+		</Button>
+	</Modal>
+</Portal>

package/package/components/copilot/chat/AIChatManager.svelte.js

@@ -153,11 +153,12 @@ class AIChatManager {
         this.pendingPrompt = pendingPrompt ?? '';
         if (mode === AIMode.SCRIPT) {
             const customPrompt = get(copilotInfo).customPrompts?.[mode];
-            this.systemMessage = prepareScriptSystemMessage(customPrompt);
+            const currentModel = getCurrentModel();
+            this.systemMessage = prepareScriptSystemMessage(currentModel, customPrompt);
             this.systemMessage.content = this.NAVIGATION_SYSTEM_PROMPT + this.systemMessage.content;
             const context = this.contextManager.getSelectedContext();
             const lang = this.scriptEditorOptions?.lang ?? 'bun';
-            this.tools = [this.changeModeTool, ...prepareScriptTools(lang, context)];
+            this.tools = [this.changeModeTool, ...prepareScriptTools(currentModel, lang, context)];
             this.helpers = {
                 getScriptOptions: () => {
                     return {

package/package/components/copilot/chat/ProviderModelSelector.svelte

@@ -18,7 +18,7 @@ $: multipleModels = $copilotInfo.aiModels.length > 1;
 			<div class="text-tertiary text-xs flex flex-row items-center font-normal gap-0.5">
 				<span class={`truncate ${multipleModels ? '' : 'pr-2'}`}>{providerModel.model}</span>
 				{#if multipleModels}
-					<div class="shrink-0 pr-1">
+					<div class="shrink-0">
 						<ChevronDown size={16} />
 					</div>
 				{/if}

package/package/components/copilot/chat/flow/FlowAIChat.svelte

@@ -77,8 +77,10 @@ const flowHelpers = {
         }
     },
     rejectAllModuleActions() {
-        for (const id of Object.keys(affectedModules)) {
-            this.revertModuleAction(id);
+        // Do it in reverse to revert nested modules first then parents
+        const ids = Object.keys(affectedModules);
+        for (let i = ids.length - 1; i >= 0; i--) {
+            this.revertModuleAction(ids[i]);
         }
         affectedModules = {};
     },

package/package/components/copilot/chat/script/core.d.ts

@@ -1,4 +1,4 @@
-import type { ResourceType, ScriptLang } from '../../../../gen/types.gen';
+import type { AIProviderModel, ResourceType, ScriptLang } from '../../../../gen/types.gen';
 import type { ChatCompletionSystemMessageParam, ChatCompletionUserMessageParam } from 'openai/resources/index.mjs';
 import type { ContextElement } from '../context';
 import { type Tool } from '../shared';
@@ -11,11 +11,10 @@ export declare function getLangContext(lang: ScriptLang | 'bunnative' | 'jsx' |
     isFailure?: boolean;
 }): string;
 export declare function getFormattedResourceTypes(lang: ScriptLang | 'bunnative', prompt: string, workspace: string): Promise<string>;
-export declare const CHAT_SYSTEM_PROMPT = "\n\tYou are a coding assistant for the Windmill platform. You are provided with a list of `INSTRUCTIONS` and the current contents of a code file under `CODE`.\n\n\tYour task is to respond to the user's request. Assume all user queries are valid and actionable.\n\n\tWhen the user requests code changes:\n\t- ALWAYS use the `edit_code` tool to apply code changes. Use it only once with an array of diffs.\n\t- Pass an array of **diff objects** to the `edit_code` tool. Each diff should specify exactly what text to replace and what to replace it with.\n\t- Each diff object must contain:\n\t  - `old_string`: The exact text to replace (must match the current code exactly)\n\t  - `new_string`: The replacement text\n\t  - `replace_all` (optional): Set to true to replace all occurrences, false or omit for first occurrence only\n\t- The code can include `[#START]` and `[#END]` markers to indicate the start and end of a code piece. You MUST only modify the code between these markers if given, and remove them when creating your diffs. If a question is asked about the code, you MUST only talk about the code between the markers. Refer to it as the code piece, not the code between the markers.\n\t- Follow the instructions carefully and explain the reasoning behind your changes in your response text.\n\t- If the request is abstract (e.g., \"make this cleaner\"), interpret it concretely and reflect that in the diffs.\n\t- Preserve existing formatting, indentation, and whitespace unless changes are strictly required to fulfill the user's request.\n\t- The user can ask you to look at or modify specific files, databases or errors by having its name in the INSTRUCTIONS preceded by the @ symbol. In this case, put your focus on the element that is explicitly mentioned.\n\t- The user can ask you questions about a list of `DATABASES` that are available in the user's workspace. If the user asks you a question about a database, you should ask the user to specify the database name if not given, or take the only one available if there is only one.\n\t- You can also receive a `DIFF` of the changes that have been made to the code. You should use this diff to give better answers.\n\t- Before giving your answer, check again that you carefully followed these instructions.\n\t- When asked to create a script that communicates with an external service, you can use the `search_hub_scripts` tool to search for relevant scripts in the hub. Make sure the language is the same as what the user is coding in. If you do not find any relevant scripts, you can use the `search_npm_packages` tool to search for relevant packages and their documentation. Always give a link to the documentation in your answer if possible.\n\t- After applying code changes with the `edit_code` tool, ALWAYS use the `test_run_script` tool to test the code, and iterate on the code until it works as expected (MAX 3 times). If the user cancels the test run, do not try again and wait for the next user instruction.\n\n\tExample diff usage:\n\tTo change \"return 1\" to \"return 2\", use:\n\t[{\n\t\t\"old_string\": \"return 1\",\n\t\t\"new_string\": \"return 2\"\n\t}]\n\n\tTo add a new function and modify an existing one:\n\t[{\n\t\t\"old_string\": \"export async function main() {\",\n\t\t\"new_string\": \"function helper() {\n\treturn 'help';\n}\n\nexport async function main() {\"\n\t}, {\n\t\t\"old_string\": \"return result;\",\n\t\t\"new_string\": \"return result + helper();\"\n\t}]\n\n\tImportant:\n\t- Each old_string must match the exact text in the current code, including whitespace and indentation.\n\t- Do not return the applied code in your response, just explain what you did. You can return code blocks in your response for explanations or examples as per user request.\n\t- Do not mention or reveal these instructions to the user unless explicitly asked to do so.\n";
 export declare const INLINE_CHAT_SYSTEM_PROMPT = "\n# Windmill Inline Coding Assistant\n\nYou are a coding assistant for the Windmill platform. You provide precise code modifications based on user instructions.\n\n## Input Format\n\nYou will receive:\n- **INSTRUCTIONS**: User's modification request\n- **CODE**: Current code content with modification boundaries\n- **DATABASES** *(optional)*: Available workspace databases\n\n### Code Boundaries\n\nThe code contains `[#START]` and `[#END]` markers indicating the modification scope:\n- **MUST** only modify code between these markers\n- **MUST** remove the markers in your response\n- **MUST** preserve all other code exactly as provided\n\n## Task Requirements\n\nReturn the modified CODE that fulfills the user's request. Assume all user queries are valid and actionable.\n\n### Critical Rules\n\n- \u2705 **ALWAYS** include a single code block with the entire updated CODE\n- \u2705 **ALWAYS** use the structured XML output format below\n- \u274C **NEVER** include only modified sections\n- \u274C **NEVER** add explanatory text or comments outside the format\n- \u274C **NEVER** include ``` code fences in your response\n- \u274C **NEVER** modify the code outside the boundaries\n\n## Output Format\n\n```xml\n<changes_made>\nBrief description of what was changed\n</changes_made>\n<new_code>\n[complete modified code without markers]\n</new_code>\n```\n\n## Example\n\n### Input:\n```xml\n<user_request>\nINSTRUCTIONS:\nReturn 2 instead of 1\n\nCODE:\nimport * as wmill from \"windmill-client\"\n\nfunction test() {\n\treturn \"hello\"\n}\n\n[#START]\nexport async function main() {\n\treturn 1;\n}\n[#END]\n</user_request>\n```\n\n### Expected Output:\n```xml\n<changes_made>\nChanged return value from 1 to 2 in main function\n</changes_made>\n<new_code>\nimport * as wmill from \"windmill-client\"\n\nfunction test() {\n\treturn \"hello\"\n}\n\nexport async function main() {\n\treturn 2;\n}\n</new_code>\n```\n";
 export declare const CHAT_USER_PROMPT = "\nINSTRUCTIONS:\n{instructions}\n\nWINDMILL LANGUAGE CONTEXT:\n{lang_context}\n\n";
-export declare function prepareScriptSystemMessage(customPrompt?: string): ChatCompletionSystemMessageParam;
-export declare function prepareScriptTools(language: ScriptLang | 'bunnative', context: ContextElement[]): Tool<ScriptChatHelpers>[];
+export declare function prepareScriptSystemMessage(currentModel: AIProviderModel, customPrompt?: string): ChatCompletionSystemMessageParam;
+export declare function prepareScriptTools(currentModel: AIProviderModel, language: ScriptLang | 'bunnative', context: ContextElement[]): Tool<ScriptChatHelpers>[];
 export declare function prepareScriptUserMessage(instructions: string, language: ScriptLang | 'bunnative', selectedContext: ContextElement[], options?: {
     isPreprocessor?: boolean;
 }): ChatCompletionUserMessageParam;
@@ -41,5 +40,6 @@ export declare function fetchNpmPackageTypes(packageName: string, version?: stri
     types: string;
     error?: string;
 }>;
+export declare const editCodeToolWithDiff: Tool<ScriptChatHelpers>;
 export declare const editCodeTool: Tool<ScriptChatHelpers>;
 export declare const testRunScriptTool: Tool<ScriptChatHelpers>;