windmill-components 1.532.0 → 1.537.1

package/package/components/copilot/chat/flow/useUiIntent.js

@@ -0,0 +1,12 @@
+import { uiIntentStore } from './uiIntents';
+import { onDestroy } from 'svelte';
+export function useUiIntent(componentId, handlers) {
+    const unsub = uiIntentStore.subscribe((intent) => {
+        if (!intent || intent.componentId !== componentId)
+            return;
+        if (intent.kind === 'open_module_tab')
+            handlers.openTab?.(intent.tab);
+        uiIntentStore.set(null);
+    });
+    onDestroy(() => unsub());
+}

package/package/components/copilot/chat/monaco-adapter.d.ts

@@ -15,18 +15,36 @@ export declare class AIChatEditorHandler {
         changes: VisualChangeWithDiffIndex[];
         groupIndex: number;
     }[];
+    private reviewState;
     constructor(editor: meditor.IStandaloneCodeEditor);
     clear(): void;
     preventWriting(): void;
     allowWriting(): void;
-    finish(): Promise<void>;
-    acceptAll(): Promise<void>;
-    rejectAll(): Promise<void>;
+    finish(opts?: {
+        disableReviewCallback?: boolean;
+    }): Promise<void>;
+    getReviewMode(): 'apply' | 'revert' | null;
+    acceptAll(opts?: {
+        disableReviewCallback?: boolean;
+    }): Promise<void>;
+    rejectAll(opts?: {
+        disableReviewCallback?: boolean;
+    }): Promise<void>;
+    keepAll(opts?: {
+        disableReviewCallback?: boolean;
+    }): Promise<void>;
+    revertAll(opts?: {
+        disableReviewCallback?: boolean;
+    }): Promise<void>;
     applyGroup(group: {
         changes: VisualChangeWithDiffIndex[];
         groupIndex: number;
     }): void;
     private calculateVisualChanges;
-    reviewAndApply(newCode: string, applyAll?: boolean): Promise<void>;
+    reviewChanges(targetCode: string, opts?: {
+        applyAll?: boolean;
+        mode?: 'apply' | 'revert';
+        onFinishedReview?: () => void;
+    }): Promise<void>;
 }
 export {};

package/package/components/copilot/chat/monaco-adapter.js

@@ -10,6 +10,8 @@ export class AIChatEditorHandler {
     readOnlyDisposable = undefined;
     reviewingChanges = writable(false);
     groupChanges = [];
+    // Track review decisions
+    reviewState = null;
     constructor(editor) {
         this.editor = editor;
     }
@@ -48,7 +50,14 @@ export class AIChatEditorHandler {
             this.readOnlyDisposable.dispose();
         }
     }
-    async finish() {
+    async finish(opts) {
+        // expose mode getter relies on reviewState
+        // Call completion callback if we're tracking review state
+        if (this.reviewState?.onFinishedReview && !opts?.disableReviewCallback) {
+            this.reviewState.onFinishedReview();
+        }
+        // Reset review state
+        this.reviewState = null;
         this.clear();
         this.allowWriting();
         this.reviewingChanges.set(false);
@@ -56,15 +65,26 @@ export class AIChatEditorHandler {
             scrollBeyondLastLine: false
         });
     }
-    async acceptAll() {
+    getReviewMode() {
+        return this.reviewState?.mode ?? null;
+    }
+    async acceptAll(opts) {
         this.groupChanges.reverse();
         for (const group of this.groupChanges) {
             this.applyGroup(group);
         }
-        this.finish();
+        this.finish(opts);
+    }
+    async rejectAll(opts) {
+        this.finish(opts);
+    }
+    // Keep all changes, used in revert mode
+    async keepAll(opts) {
+        this.finish(opts);
     }
-    async rejectAll() {
-        this.finish();
+    // Revert all changes, used in revert mode
+    async revertAll(opts) {
+        this.acceptAll(opts);
     }
     applyGroup(group) {
         // maximum of 2 changes per group with the deletion first
@@ -147,23 +167,30 @@ export class AIChatEditorHandler {
         }
         return changedLines;
     }
-    async reviewAndApply(newCode, applyAll = false) {
-        if (aiChatManager.pendingNewCode === newCode) {
+    async reviewChanges(targetCode, opts) {
+        if (aiChatManager.pendingNewCode === targetCode && opts?.mode === 'apply') {
             this.acceptAll();
             return;
         }
         else if (aiChatManager.pendingNewCode) {
             this.clear();
         }
-        aiChatManager.pendingNewCode = newCode;
-        const changedLines = await this.calculateVisualChanges(newCode);
+        aiChatManager.pendingNewCode = targetCode;
+        const changedLines = await this.calculateVisualChanges(targetCode);
         if (changedLines.length === 0)
             return;
+        // Initialize review state for tracking
+        this.reviewState = {
+            mode: opts?.mode ?? 'apply',
+            onFinishedReview: opts?.onFinishedReview
+        };
         let indicesOfRejectedLineChanges = [];
         for (const [groupIndex, group] of this.groupChanges.entries()) {
             let collection = undefined;
             let ids = [];
-            const acceptFn = () => {
+            const isRevert = opts?.mode === 'revert';
+            // Apply this group and continue with remaining changes
+            const onApply = () => {
                 this.applyGroup(group);
                 this.clear();
                 let newCodeWithRejects = '';
@@ -178,9 +205,11 @@ export class AIChatEditorHandler {
                         newCodeWithRejects += change.value;
                     }
                 }
-                this.reviewAndApply(newCodeWithRejects);
+                this.reviewChanges(newCodeWithRejects, opts);
             };
-            const rejectFn = () => {
+            // Discard this group and continue with remaining changes
+            const onDiscard = () => {
+                // This group was not applied (not reverted in revert mode)
                 indicesOfRejectedLineChanges.push(...group.changes.map((c) => c.diffIndex));
                 collection?.clear();
                 this.editor.changeViewZones((acc) => {
@@ -193,25 +222,35 @@ export class AIChatEditorHandler {
                     this.finish();
                 }
             };
+            // In revert mode: Accept = keep current code, Reject = revert to targetCode
+            // In apply mode: Accept = apply changes, Reject = discard changes
+            const acceptFn = isRevert ? onDiscard : onApply;
+            const rejectFn = isRevert ? onApply : onDiscard;
             const changes = group.changes.map((c, i) => {
                 if (i === group.changes.length - 1) {
                     return {
                         ...c,
-                        options: { ...(c.options ?? {}), review: { acceptFn, rejectFn } }
+                        options: {
+                            ...(c.options ?? {}),
+                            review: {
+                                acceptFn,
+                                rejectFn
+                            }
+                        }
                     };
                 }
                 else {
                     return c;
                 }
             });
-            if (!applyAll) {
+            if (!opts?.applyAll) {
                 ;
-                ({ collection, ids } = await displayVisualChanges('editor-windmill-chat-style', this.editor, changes));
+                ({ collection, ids } = await displayVisualChanges('editor-windmill-chat-style', this.editor, changes, isRevert));
                 this.decorationsCollections.push(collection);
                 this.viewZoneIds.push(...ids);
             }
         }
-        if (applyAll) {
+        if (opts?.applyAll) {
             this.acceptAll();
         }
     }

package/package/components/copilot/chat/script/core.js

@@ -2,7 +2,7 @@ import { ResourceService, JobService } from '../../../../gen/services.gen';
 import { capitalize, isObject, toCamel } from '../../../../utils';
 import { get } from 'svelte/store';
 import { compile, phpCompile, pythonCompile } from '../../utils';
-import { copilotSessionModel, dbSchemas } from '../../../../stores';
+import { dbSchemas, getCurrentModel } from '../../../../stores';
 import { getDbSchemas } from '../../../apps/components/display/dbtable/utils';
 import { PYTHON_PREPROCESSOR_MODULE_CODE, TS_PREPROCESSOR_MODULE_CODE } from '../../../../script_helpers';
 import { createSearchHubScriptsTool, executeTestRun, buildTestRunArgs, buildContextString } from '../shared';
@@ -522,7 +522,8 @@ export async function searchExternalIntegrationResources(args) {
         const result = await fetch(`https://registry.npmjs.org/-/v1/search?text=${args.query}&size=2`);
         const data = await result.json();
         const filtered = data.objects.filter((r) => r.searchScore >= SCORE_THRESHOLD);
-        const modelContextWindow = getModelContextWindow(get(copilotSessionModel)?.model ?? '');
+        const model = getCurrentModel();
+        const modelContextWindow = getModelContextWindow(model.model);
         const results = await Promise.all(filtered.map(async (r) => {
             let documentation = '';
             let types = '';

package/package/components/copilot/chat/shared.d.ts

@@ -1,5 +1,5 @@
 import type { ChatCompletionMessageParam, ChatCompletionMessageToolCall, ChatCompletionTool } from 'openai/resources/chat/completions.mjs';
-import type { CodePieceElement, ContextElement } from './context';
+import type { ContextElement, FlowModuleCodePieceElement } from './context';
 import type { ExtendedOpenFlow } from '../../flows/types';
 import type { FunctionParameters } from 'openai/resources/shared.mjs';
 import { z } from 'zod';
@@ -12,8 +12,9 @@ export interface ContextStringResult {
     hasDiff: boolean;
     hasFlowModule: boolean;
 }
+export declare const extractAllModules: (modules: FlowModule[]) => FlowModule[];
 export declare const findModuleById: (modules: FlowModule[], moduleId: string) => FlowModule | undefined;
-export declare function applyCodePiecesToFlowModules(codePieces: CodePieceElement[], flowModules: FlowModule[]): string;
+export declare function applyCodePiecesToFlowModules(codePieces: FlowModuleCodePieceElement[], flowModules: FlowModule[]): string;
 export declare function buildContextString(selectedContext: ContextElement[]): string;
 type BaseDisplayMessage = {
     content: string;

package/package/components/copilot/chat/shared.js

@@ -1,10 +1,27 @@
 import { get } from 'svelte/store';
-import { copilotSessionModel, workspaceStore } from '../../../stores';
+import { workspaceStore, getCurrentModel } from '../../../stores';
 import { zodToJsonSchema } from 'zod-to-json-schema';
 import { z } from 'zod';
 import { ScriptService, JobService } from '../../../gen';
 import { scriptLangToEditorLang } from '../../../scripts';
 import YAML from 'yaml';
+export const extractAllModules = (modules) => {
+    return modules.flatMap((m) => {
+        if (m.value.type === 'forloopflow' || m.value.type === 'whileloopflow') {
+            return [m, ...extractAllModules(m.value.modules)];
+        }
+        if (m.value.type === 'branchall') {
+            return [m, ...extractAllModules(m.value.branches.flatMap((b) => b.modules))];
+        }
+        if (m.value.type === 'branchone') {
+            return [
+                m,
+                ...extractAllModules([...m.value.branches.flatMap((b) => b.modules), ...m.value.default])
+            ];
+        }
+        return [m];
+    });
+};
 export const findModuleById = (modules, moduleId) => {
     for (const module of modules) {
         if (module.id === moduleId) {
@@ -48,18 +65,13 @@ const applyCodePieceToCodeContext = (codePieces, codeContext) => {
     return code.join('\n');
 };
 export function applyCodePiecesToFlowModules(codePieces, flowModules) {
-    // Parse code piece titles to extract module IDs
-    // Format: "[id] L3-L5"
     const moduleCodePieces = new Map();
     for (const codePiece of codePieces) {
-        const match = codePiece.title.match(/\[([^\]]+)\]\s+L\d+-L\d+/);
-        if (match) {
-            const moduleId = match[1];
-            if (!moduleCodePieces.has(moduleId)) {
-                moduleCodePieces.set(moduleId, []);
-            }
-            moduleCodePieces.get(moduleId).push(codePiece);
+        const moduleId = codePiece.id;
+        if (!moduleCodePieces.has(moduleId)) {
+            moduleCodePieces.set(moduleId, []);
         }
+        moduleCodePieces.get(moduleId).push(codePiece);
     }
     // Clone modules to avoid mutation
     const modifiedModules = JSON.parse(JSON.stringify(flowModules));
@@ -296,8 +308,8 @@ export async function buildSchemaForTool(toolDef, schemaBuilder) {
         }
         toolDef.function.parameters = { ...schema, additionalProperties: false };
         // OPEN AI models don't support strict mode well with schema with complex properties, so we disable it
-        const model = get(copilotSessionModel)?.provider;
-        if (model === 'openai' || model === 'azure_openai') {
+        const model = getCurrentModel();
+        if (model.provider === 'openai' || model.provider === 'azure_openai') {
             toolDef.function.strict = false;
         }
         return true;

package/package/components/copilot/lib.js

@@ -1,4 +1,4 @@
-import { copilotInfo, copilotSessionModel, workspaceStore } from '../../stores';
+import { getCurrentModel, workspaceStore } from '../../stores';
 import { buildClientSchema, printSchema } from 'graphql';
 import { OpenAI } from 'openai';
 import { get } from 'svelte/store';
@@ -7,7 +7,16 @@ import { EDIT_CONFIG, FIX_CONFIG, GEN_CONFIG } from './prompts';
 import { formatResourceTypes } from './utils';
 import { z } from 'zod';
 export const SUPPORTED_LANGUAGES = new Set(Object.keys(GEN_CONFIG.prompts));
-const OPENAI_MODELS = ['gpt-5', 'gpt-5-mini', 'gpt-5-nano', 'gpt-4o', 'gpt-4o-mini', 'o4-mini', 'o3', 'o3-mini'];
+const OPENAI_MODELS = [
+    'gpt-5',
+    'gpt-5-mini',
+    'gpt-5-nano',
+    'gpt-4o',
+    'gpt-4o-mini',
+    'o4-mini',
+    'o3',
+    'o3-mini'
+];
 // need at least one model for each provider except customai
 export const AI_DEFAULT_MODELS = {
     openai: OPENAI_MODELS,
@@ -331,11 +340,7 @@ const PROMPTS_CONFIGS = {
     gen: GEN_CONFIG
 };
 function getProviderAndCompletionConfig({ messages, stream, tools, forceModelProvider }) {
-    let info = get(copilotInfo);
-    const modelProvider = forceModelProvider ?? get(copilotSessionModel) ?? info.defaultModel ?? info.aiModels[0];
-    if (!modelProvider) {
-        throw new Error('No model selected');
-    }
+    const modelProvider = forceModelProvider ?? getCurrentModel();
     const providerConfig = PROVIDER_COMPLETION_CONFIG_MAP[modelProvider.provider];
     const processedMessages = prepareMessages(modelProvider.provider, messages);
     return {

package/package/components/copilot/shared.d.ts

@@ -41,7 +41,7 @@ export type VisualChange = {
 };
 export declare function setGlobalCSS(id: string, cssCode: string): void;
 export declare let VISUAL_CHANGES_CSS: string;
-export declare function displayVisualChanges(cssId: string, editor: meditor.IStandaloneCodeEditor, visualChanges: VisualChange[]): Promise<{
+export declare function displayVisualChanges(cssId: string, editor: meditor.IStandaloneCodeEditor, visualChanges: VisualChange[], revertMode?: boolean): Promise<{
     collection: meditor.IEditorDecorationsCollection;
     ids: string[];
 }>;

package/package/components/copilot/shared.js

@@ -1,6 +1,6 @@
 import { createLongHash } from '../../editorLangUtils';
 import {} from 'monaco-editor';
-function applyMonacoStyles(targetEl, greenHighlight) {
+function applyMonacoStyles(targetEl, greenHighlight, revertMode) {
     const computedStyles = window.getComputedStyle(document.querySelector('.monaco-editor .view-lines'));
     Object.assign(targetEl.style, {
         fontFamily: computedStyles.fontFamily,
@@ -10,7 +10,9 @@ function applyMonacoStyles(targetEl, greenHighlight) {
         whiteSpace: 'pre'
     });
     if (greenHighlight) {
-        targetEl.style.backgroundColor = 'var(--vscode-diffEditor-insertedTextBackground)';
+        targetEl.style.backgroundColor = revertMode
+            ? 'var(--vscode-diffEditor-removedTextBackground)'
+            : 'var(--vscode-diffEditor-insertedTextBackground)';
     }
 }
 export function setGlobalCSS(id, cssCode) {
@@ -22,7 +24,7 @@ export function setGlobalCSS(id, cssCode) {
     }
     styleTag.textContent = cssCode;
 }
-function addInlineGhostText(change) {
+function addInlineGhostText(change, revertMode) {
     const cssId = createLongHash();
     const decoration = {
         range: {
@@ -32,7 +34,11 @@ function addInlineGhostText(change) {
             endColumn: change.position.column + change.value.length
         },
         options: {
-            beforeContentClassName: `editor-ghost-text editor-ghost-text-content-${cssId} ${change.options?.greenHighlight ? 'editor-ghost-text-green' : ''}`
+            beforeContentClassName: `editor-ghost-text editor-ghost-text-content-${cssId} ${change.options?.greenHighlight
+                ? revertMode
+                    ? 'editor-ghost-text-removed'
+                    : 'editor-ghost-text-green'
+                : ''}`
         }
     };
     const safeContent = change.value.replaceAll('"', '\\"');
@@ -90,14 +96,14 @@ function getReviewButtons(editor, acceptFn, rejectFn) {
     reviewButtons.append(rejectButton);
     return reviewButtons;
 }
-async function addMultilineGhostText(editor, text, afterLineNumber, heightInLines, options) {
+async function addMultilineGhostText(editor, text, afterLineNumber, heightInLines, options, revertMode) {
     const el = document.createElement('div');
     el.textContent = text;
     if (options?.review) {
         const reviewButtons = getReviewButtons(editor, options.review.acceptFn, options.review.rejectFn);
         el.append(reviewButtons);
     }
-    applyMonacoStyles(el, options?.greenHighlight);
+    applyMonacoStyles(el, options?.greenHighlight, revertMode);
     const addZonePromise = new Promise((resolve, reject) => {
         editor?.changeViewZones((acc) => {
             const id = acc.addZone({
@@ -112,13 +118,13 @@ async function addMultilineGhostText(editor, text, afterLineNumber, heightInLine
     return addZonePromise;
 }
 export let VISUAL_CHANGES_CSS = `.editor-ghost-text-green { background-color: var(--vscode-diffEditor-insertedTextBackground) !important; }\n.editor-ghost-text-removed { background-color: var(--vscode-diffEditor-removedTextBackground); }\n\n.editor-ghost-text { display: inline-block; background-color: var(--vscode-editor-background); color: gray;}`;
-export async function displayVisualChanges(cssId, editor, visualChanges) {
+export async function displayVisualChanges(cssId, editor, visualChanges, revertMode) {
     let decorations = [];
     let css = '';
     let ids = [];
     for (const change of visualChanges) {
         if (change.type === 'added_inline') {
-            const { css: newCss, decoration } = addInlineGhostText(change);
+            const { css: newCss, decoration } = addInlineGhostText(change, revertMode);
             decorations.push(decoration);
             css += newCss;
         }
@@ -131,7 +137,7 @@ export async function displayVisualChanges(cssId, editor, visualChanges) {
                     endColumn: change.range.endColumn
                 },
                 options: {
-                    className: 'editor-ghost-text-removed',
+                    className: revertMode ? 'editor-ghost-text-green' : 'editor-ghost-text-removed',
                     isWholeLine: change.options?.isWholeLine
                 }
             };
@@ -157,7 +163,7 @@ export async function displayVisualChanges(cssId, editor, visualChanges) {
         }
         else if (change.type === 'added_block') {
             const id = await addMultilineGhostText(editor, change.value, change.position.afterLineNumber, change.value.split('\n').length, // we know it won't end by \n
-            change.options);
+            change.options, revertMode);
             ids.push(id);
         }
     }

package/package/components/flows/FlowEditor.svelte

@@ -8,8 +8,9 @@ import { writable } from 'svelte/store';
 import FlowAIChat from '../copilot/chat/flow/FlowAIChat.svelte';
 import { aiChatManager, AIMode } from '../copilot/chat/AIChatManager.svelte';
 import { triggerableByAI } from '../../actions/triggerableByAI.svelte';
+import { extractAllModules } from '../copilot/chat/shared';
 const { flowStore } = getContext('FlowEditorContext');
-let { loading, disableStaticInputs = false, disableTutorials = false, disableAi = false, disableSettings = false, disabledFlowInputs = false, smallErrorHandler = false, showJobStatus = false, newFlow = false, savedFlow = undefined, onDeployTrigger = () => { }, onTestUpTo = undefined, onEditInput = undefined, forceTestTab, highlightArg, localModuleStates = {}, testModuleStates = undefined, aiChatOpen, showFlowAiButton, toggleAiChat, isOwner, onTestFlow, isRunning, onCancelTestFlow, onOpenPreview, onHideJobStatus, individualStepTests = false, job, suspendStatus, onDelete, flowHasChanged } = $props();
+let { loading, disableStaticInputs = false, disableTutorials = false, disableAi = false, disableSettings = false, disabledFlowInputs = false, smallErrorHandler = false, showJobStatus = false, newFlow = false, savedFlow = undefined, onDeployTrigger = () => { }, onTestUpTo = undefined, onEditInput = undefined, forceTestTab, highlightArg, localModuleStates = {}, testModuleStates = undefined, aiChatOpen, showFlowAiButton, toggleAiChat, isOwner, onTestFlow, isRunning, onCancelTestFlow, onOpenPreview, onHideJobStatus, individualStepTests = false, job, suspendStatus, onDelete, flowHasChanged, previewOpen } = $props();
 let flowModuleSchemaMap = $state();
 export function isNodeVisible(nodeId) {
     return flowModuleSchemaMap?.isNodeVisible(nodeId) ?? false;
@@ -24,7 +25,7 @@ $effect(() => {
         lastDeployedFlow: savedFlow,
         lastSavedFlow: savedFlow?.draft,
         path: savedFlow?.path,
-        modules: flowStore.val.value.modules
+        modules: extractAllModules(flowStore.val.value.modules)
     };
     aiChatManager.flowOptions = options;
 });
@@ -117,6 +118,7 @@ onDestroy(() => {
 					{isOwner}
 					{suspendStatus}
 					onOpenDetails={onOpenPreview}
+					{previewOpen}
 				/>
 			{/if}
 		</Pane>

package/package/components/flows/FlowEditor.svelte.d.ts

@@ -40,6 +40,7 @@ interface Props {
     }>>;
     onDelete?: (id: string) => void;
     flowHasChanged?: boolean;
+    previewOpen: 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> & {

package/package/components/flows/FlowModuleIcon.svelte

@@ -9,19 +9,19 @@ const iconHeight = height || size;
 </script>
 
 {#if module.value.type === 'aiagent'}
-	<Bot size={16} />
+	<Bot size={16} class="text-violet-800 dark:text-violet-400" />
 {:else if module.value.type === 'rawscript'}
 	<LanguageIcon lang={module.value.language} width={iconWidth} height={iconHeight} />
 {:else if module.summary === 'Terminate flow'}
-	<Square size={size} />
+	<Square {size} />
 {:else if module.value.type === 'identity'}
-	<ArrowDown size={size} />
+	<ArrowDown {size} />
 {:else if module.value.type === 'flow'}
-	<BarsStaggered size={size} />
+	<BarsStaggered {size} />
 {:else if module.value.type === 'forloopflow' || module.value.type === 'whileloopflow'}
-	<Repeat size={size} />
+	<Repeat {size} />
 {:else if module.value.type === 'branchone' || module.value.type === 'branchall'}
-	<GitBranch size={size} />
+	<GitBranch {size} />
 {:else if module.value.type === 'script'}
 	{#if module.value.path.startsWith('hub/')}
 		<IconedResourceType
@@ -31,9 +31,9 @@ const iconHeight = height || size;
 			silent={true}
 		/>
 	{:else}
-		<Building size={size} />
+		<Building {size} />
 	{/if}
 {:else}
 	<!-- Fallback icon for unknown module types -->
-	<BarsStaggered size={size} />
+	<BarsStaggered {size} />
 {/if}

package/package/components/flows/common/FlowCardHeader.svelte

@@ -47,7 +47,7 @@ $effect.pre(() => {
 </script>
 
 <div
-	class="overflow-x-auto scrollbar-hidden flex items-center justify-between px-4 py-1 flex-nowrap"
+	class="overflow-x-auto scrollbar-hidden flex items-center justify-between px-4 pt-1 pb-4 flex-nowrap"
 >
 	{#if flowModuleValue}
 		<span class="text-sm w-full mr-4">
@@ -129,6 +129,9 @@ $effect.pre(() => {
 				{:else if flowModuleValue.type === 'flow'}
 					<Badge color="indigo" capitalize>flow</Badge>
 					<input bind:value={summary} placeholder="Summary" class="w-full grow" />
+				{:else if flowModuleValue.type === 'aiagent'}
+					<Badge color="indigo">AI Agent</Badge>
+					<input bind:value={summary} placeholder="Summary" class="w-full grow" />
 				{/if}
 			</div>
 		</span>

package/package/components/flows/content/FlowBranchesAllWrapper.svelte

@@ -12,12 +12,18 @@ import FlowModuleDeleteAfterUse from './FlowModuleDeleteAfterUse.svelte';
 import { enterpriseLicense } from '../../../stores';
 import FlowModuleSkip from './FlowModuleSkip.svelte';
 import TabsV2 from '../../common/tabs/TabsV2.svelte';
+import { useUiIntent } from '../../copilot/chat/flow/useUiIntent';
 let { noEditor, flowModule = $bindable(), previousModule, parentModule } = $props();
 let value = $state(flowModule.value);
 $effect(() => {
     value = flowModule.value;
 });
 let selected = $state('early-stop');
+useUiIntent(`branchall-${flowModule.id}`, {
+    openTab: (tab) => {
+        selected = tab;
+    }
+});
 </script>
 
 <div class="h-full flex flex-col w-full" id="flow-editor-branch-all-wrapper">

package/package/components/flows/content/FlowBranchesOneWrapper.svelte

@@ -12,12 +12,18 @@ import SplitPanesWrapper from '../../splitPanes/SplitPanesWrapper.svelte';
 import FlowModuleMock from './FlowModuleMock.svelte';
 import { enterpriseLicense } from '../../../stores';
 import FlowModuleSkip from './FlowModuleSkip.svelte';
+import { useUiIntent } from '../../copilot/chat/flow/useUiIntent';
 let { flowModule = $bindable(), previousModule, parentModule, noEditor, enableAi = false } = $props();
 let value = $state(flowModule.value);
 $effect(() => {
     value = flowModule.value;
 });
 let selected = $state('early-stop');
+useUiIntent(`branchone-${flowModule.id}`, {
+    openTab: (tab) => {
+        selected = tab;
+    }
+});
 </script>
 
 <div class="h-full" id="flow-editor-branch-one-wrapper">

package/package/components/flows/content/FlowEditorPanel.svelte

@@ -10,7 +10,7 @@ import TriggersEditor from '../../triggers/TriggersEditor.svelte';
 import { handleSelectTriggerFromKind } from '../../triggers/utils';
 import { computeMissingInputWarnings } from '../missingInputWarnings';
 import FlowResult from './FlowResult.svelte';
-let { noEditor = false, enableAi = false, newFlow = false, disabledFlowInputs = false, savedFlow = undefined, onDeployTrigger = () => { }, forceTestTab, highlightArg, onTestFlow, job, isOwner, suspendStatus, onOpenDetails } = $props();
+let { noEditor = false, enableAi = false, newFlow = false, disabledFlowInputs = false, savedFlow = undefined, onDeployTrigger = () => { }, forceTestTab, highlightArg, onTestFlow, job, isOwner, suspendStatus, onOpenDetails, previewOpen = false } = $props();
 const { selectedId, flowStore, flowStateStore, flowInputsStore, pathStore, initialPathStore, fakeInitialPath, previewArgs, flowInputEditorState } = getContext('FlowEditorContext');
 const { showCaptureHint, triggersState, triggersCount } = getContext('TriggerContext');
 function checkDup(modules) {
@@ -41,6 +41,7 @@ $effect(() => {
 		}}
 		on:applyArgs
 		{onTestFlow}
+		{previewOpen}
 	/>
 {:else if $selectedId === 'Result'}
 	<FlowResult {noEditor} {job} {isOwner} {suspendStatus} {onOpenDetails} />

package/package/components/flows/content/FlowEditorPanel.svelte.d.ts

@@ -20,6 +20,7 @@ interface Props {
         nb: number;
     }>>;
     onOpenDetails?: () => void;
+    previewOpen?: 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> & {