windmill-components 1.613.5 → 1.623.1

package/package/components/flows/content/FlowModuleEarlyStop.svelte

@@ -24,8 +24,8 @@ function checkIfBreakableParent(flowStoreValue) {
     }
     return null;
 }
-let raise_error_message_stop_after_all_if = $state(flowModule.stop_after_all_iters_if?.error_message != undefined);
-let raise_error_message_stop_after_if = $state(flowModule.stop_after_if?.error_message != undefined);
+let raise_error_message_stop_after_all_if = $state(flowModule.stop_after_all_iters_if?.error_message !== undefined);
+let raise_error_message_stop_after_if = $state(flowModule.stop_after_if?.error_message !== undefined);
 let { isLoop, isParallelLoop } = $derived(flowModule.value.type === 'forloopflow' || flowModule.value.type === 'whileloopflow'
     ? { isLoop: true, isParallelLoop: flowModule.value.parallel ?? false }
     : { isLoop: false, isParallelLoop: false });
@@ -134,7 +134,8 @@ let breakableParent = $derived(checkIfBreakableParent(flowStore.val));
 						<PropPickerWrapper
 							noPadding
 							notSelectable
-							pickableProperties={stepPropPicker.pickableProperties}
+							flow_input={stepPropPicker.pickableProperties.flow_input}
+							pickableProperties={undefined}
 							result={earlyStopResult}
 							extraResults={isLoop ? { all_iters: result } : undefined}
 							on:select={({ detail }) => {
@@ -147,8 +148,8 @@ let breakableParent = $derived(checkIfBreakableParent(flowStore.val));
 								lang="javascript"
 								bind:code={flowModule.stop_after_if.expr}
 								class="h-full"
-								extraLib={`declare const result = ${JSON.stringify(earlyStopResult)};\n` +
-									stepPropPicker.extraLib +
+								extraLib={`declare const result = ${JSON.stringify(earlyStopResult)};` +
+									`\n declare const flow_input = ${JSON.stringify(stepPropPicker.pickableProperties.flow_input)};` +
 									(isLoop ? `\ndeclare const all_iters = ${JSON.stringify(result)};` : '')}
 							/>
 						</PropPickerWrapper>
@@ -270,7 +271,8 @@ let breakableParent = $derived(checkIfBreakableParent(flowStore.val));
 						<PropPickerWrapper
 							notSelectable
 							noPadding
-							pickableProperties={stepPropPicker.pickableProperties}
+							flow_input={stepPropPicker.pickableProperties.flow_input}
+							pickableProperties={undefined}
 							{result}
 							on:select={({ detail }) => {
 								editor?.insertAtCursor(detail)
@@ -282,8 +284,8 @@ let breakableParent = $derived(checkIfBreakableParent(flowStore.val));
 								lang="javascript"
 								bind:code={flowModule.stop_after_all_iters_if.expr}
 								class="h-full"
-								extraLib={`declare const result = ${JSON.stringify(result)};\n` +
-									stepPropPicker.extraLib}
+								extraLib={`declare const result = ${JSON.stringify(result)};` +
+									`\ndeclare const flow_input = ${JSON.stringify(stepPropPicker.pickableProperties.flow_input)};`}
 							/>
 						</PropPickerWrapper>
 					</div>

package/package/components/flows/content/FlowModuleHeader.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">import Button from '../../common/button/Button.svelte';
 import {} from '../../../gen';
 import { createEventDispatcher, getContext } from 'svelte';
-import { Bed, Database, Gauge, GitFork, Pen, PhoneIncoming, RefreshCcw, Repeat, Square, Pin, Save } from 'lucide-svelte';
+import { Bed, Database, ExternalLink, Gauge, GitFork, Pen, PhoneIncoming, RefreshCcw, Repeat, Square, Pin, Save } from 'lucide-svelte';
 import Popover from '../../Popover.svelte';
 import { sendUserToast } from '../../../utils';
 import { getLatestHashForScript } from '../../../scripts';
 import FlowModuleWorkerTagSelect from './FlowModuleWorkerTagSelect.svelte';
 let { module, tag } = $props();
-const { scriptEditorDrawer, flowEditorDrawer } = getContext('FlowEditorContext');
+const { scriptEditorDrawer } = getContext('FlowEditorContext');
 const dispatch = createEventDispatcher();
 let customUi = getContext('customUi');
 let popoverClasses = 'center-center rounded p-2 bg-blue-100 text-blue-800 border border-blue-300 hover:bg-blue-200 dark:bg-frost-700 dark:text-frost-100 dark:border-frost-600';
@@ -128,16 +128,13 @@ let popoverClasses = 'center-center rounded p-2 bg-blue-100 text-blue-800 border
 			variant="subtle"
 			on:click={async () => {
 				if (module.value.type == 'flow') {
-					$flowEditorDrawer?.openDrawer(module.value.path, () => {
-						dispatch('reload')
-						sendUserToast('Flow has been updated')
-					})
+					window.open(`/flows/edit/${module.value.path}`, '_blank', 'noopener,noreferrer')
 				}
 			}}
 			startIcon={{ icon: Pen }}
 			iconOnly={false}
 		>
-			Edit
+			Edit <ExternalLink size={12} />
 		</Button>
 		<Button
 			unifiedSize="sm"

package/package/components/flows/content/FlowModuleWorkerTagSelect.svelte

@@ -8,7 +8,7 @@ const dispatch = createEventDispatcher();
 loadWorkerGroups();
 async function loadWorkerGroups() {
     if (!$workerTags) {
-        $workerTags = await WorkerService.getCustomTagsForWorkspace({ workspace: $workspaceStore });
+        $workerTags = await WorkerService.getCustomTags({ workspace: $workspaceStore });
     }
 }
 </script>

package/package/components/flows/content/McpToolEditor.svelte

@@ -7,7 +7,8 @@ let loadToolsCached = createCache(({ workspace, path }) => workspace && path &&
     : undefined, {
     initial: { workspace: get(workspaceStore), path: undefined, refreshCount: 0 },
     invalidateMs: 1000 * 60
-});
+} // Cache for 60 seconds
+);
 </script>
 
 <script lang="ts">import Section from '../../Section.svelte';
@@ -20,25 +21,24 @@ import ResourcePicker from '../../ResourcePicker.svelte';
 import { usePromise } from '../../../svelte5Utils.svelte';
 import { untrack } from 'svelte';
 import Alert from '../../common/alert/Alert.svelte';
-import McpOAuthConnect from './McpOAuthConnect.svelte';
 let { tool = $bindable() } = $props();
-let showOAuthForm = $state(false);
 let refreshCount = $state(0);
-let resourcePicker = $state();
 let tools = usePromise(async () => await loadToolsCached({
     workspace: $workspaceStore,
     path: tool.value.resource_path,
     refreshCount
 }), { loadInit: false, clearValueOnRefresh: false });
+// Options for the multiselect
 let toolOptions = $derived(safeSelectItems((tools.value ?? []).map((t) => t.name)));
-let resourcePath = $derived(tool.value.resource_path);
-let error = $derived(tools.error?.body?.message || tools.error?.message);
+// Watch for resource_path changes and refresh tools
 $effect(() => {
-    resourcePath;
+    // Track reactive dependencies
+    tool.value.resource_path;
     $workspaceStore;
     refreshCount;
+    // Trigger refresh when resource_path or workspace changes
     untrack(() => {
-        if (resourcePath?.length > 0) {
+        if (tool.value.resource_path?.length > 0) {
             tools.refresh();
         }
     });
@@ -52,19 +52,14 @@ $effect(() => {
     }
 });
 $effect(() => {
-    if (resourcePath?.length > 0 && tool.summary?.length === 0) {
+    if (tool.value.resource_path?.length > 0 && tool.summary?.length === 0) {
         tool.summary = `MCP: ${tool.value.resource_path}`;
     }
 });
-async function handleOAuthConnected(resourcePath, resourceName) {
-    await resourcePicker?.refreshResources();
-    tool.value.resource_path = resourcePath;
-    tool.summary = `MCP: ${resourceName}`;
-    showOAuthForm = false;
-}
 </script>
 
 <div class="flex flex-col gap-4 p-4">
+	<!-- Explanatory Section -->
 	<Alert type="info" title="MCP Client Configuration">
 		{#snippet children()}
 			<p class="mb-2 text-sm">
@@ -79,26 +74,15 @@ async function handleOAuthConnected(resourcePath, resourceName) {
 		{/snippet}
 	</Alert>
 
+	<!-- Resource Path Section -->
 	<div class="w-full">
 		<Label label="MCP Resource">
-			<ResourcePicker bind:this={resourcePicker} resourceType="mcp" bind:value={tool.value.resource_path} />
+			<ResourcePicker resourceType="mcp" bind:value={tool.value.resource_path} />
 		</Label>
 	</div>
 
-	{#if !resourcePath}
-		{#if !showOAuthForm}
-			<Button size="xs" color="light" onClick={() => (showOAuthForm = true)}>
-				Connect with OAuth
-			</Button>
-		{:else}
-			<McpOAuthConnect
-				onConnected={handleOAuthConnected}
-				onCancel={() => (showOAuthForm = false)}
-			/>
-		{/if}
-	{/if}
-
-	{#if resourcePath?.length > 0}
+	{#if tool.value.resource_path?.length > 0}
+		<!-- Summary Section -->
 		<div class="w-full">
 			<Label label="Summary">
 				<input
@@ -110,12 +94,13 @@ async function handleOAuthConnected(resourcePath, resourceName) {
 			</Label>
 		</div>
 
+		<!-- Available Tools Section -->
 		<Section label="Available Tools">
 			{#snippet action()}
 				<Button
 					size="xs"
 					color="light"
-					onClick={() => (refreshCount += 1)}
+					on:click={() => (refreshCount += 1)}
 					startIcon={{ icon: RefreshCw }}
 					disabled={tools.status === 'loading'}
 				>
@@ -123,37 +108,39 @@ async function handleOAuthConnected(resourcePath, resourceName) {
 				</Button>
 			{/snippet}
 			<div class="w-full flex flex-col gap-2">
-				{#if error}
-					<div class="text-xs text-red-600 dark:text-red-400 mb-4"
-						>{`Failed to load tools from MCP server: ${error}`}</div
-					>
-				{:else if tools.status === 'loading'}
-					<div class="max-h-48 overflow-y-auto border rounded p-2 bg-surface-secondary">
-						<div class="text-xs text-secondary italic">Loading tools...</div>
+				{#if tools.error}
+					<div class="text-xs text-red-600 p-2 border border-red-300 rounded bg-red-50">
+						{tools.error?.body?.message ||
+							tools.error?.message ||
+							'Failed to load tools from MCP server'}
 					</div>
-				{:else if (tools.value ?? []).length === 0 && !error}
-					<div class="max-h-48 overflow-y-auto border rounded p-2 bg-surface-secondary">
+				{/if}
+				<div class="max-h-48 overflow-y-auto border rounded p-2 bg-surface-secondary">
+					{#if tools.status === 'loading'}
+						<div class="text-xs text-secondary italic">Loading tools...</div>
+					{:else if (tools.value ?? []).length === 0}
 						<div class="text-xs text-secondary italic">
-							No tools loaded yet. Click "Refresh Tools" to fetch tools from the MCP server.
+							{tools.error
+								? 'Failed to load tools. Please check the resource path and try again.'
+								: 'No tools loaded yet. Click "Refresh Tools" to fetch tools from the MCP server.'}
 						</div>
-					</div>
-				{:else if (tools.value ?? []).length > 0}
-					<div class="max-h-48 overflow-y-auto border rounded p-2 bg-surface-secondary">
+					{:else}
 						<div class="flex flex-col gap-1">
-							{#each tools.value ?? [] as mcpTool}
+							{#each tools.value ?? [] as tool}
 								<div class="text-xs">
-									<span class="font-semibold">{mcpTool.name}</span>
-									{#if mcpTool.description}
-										<span class="text-secondary">— {mcpTool.description}</span>
+									<span class="font-semibold">{tool.name}</span>
+									{#if tool.description}
+										<span class="text-secondary">— {tool.description}</span>
 									{/if}
 								</div>
 							{/each}
 						</div>
-					</div>
-				{/if}
+					{/if}
+				</div>
 			</div>
 		</Section>
 
+		<!-- Tool Filtering Section -->
 		{#if tool.value.include_tools && tool.value.exclude_tools}
 			<Section label="Tool Filtering">
 				<div class="w-full flex flex-col gap-3">

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

@@ -1,6 +1,7 @@
 import type { McpTool } from '../agentToolUtils';
 interface Props {
     tool: McpTool;
+    noEditor: boolean;
 }
 declare const McpToolEditor: import("svelte").Component<Props, {}, "tool">;
 type McpToolEditor = ReturnType<typeof McpToolEditor>;

package/package/components/flows/conversations/FlowChat.svelte

@@ -3,7 +3,7 @@ import { createFlowChatManager } from './FlowChatManager.svelte';
 import FlowConversationsSidebar from './FlowConversationsSidebar.svelte';
 import FlowChatInterface from './FlowChatInterface.svelte';
 import { untrack } from 'svelte';
-let { onRunFlow, deploymentInProgress = false, useStreaming = false, path, hideSidebar = false, inputSchema = undefined, } = $props();
+let { onRunFlow, deploymentInProgress = false, useStreaming = false, path, hideSidebar = false } = $props();
 const manager = createFlowChatManager();
 // Initialize manager when component mounts
 $effect(() => {
@@ -22,25 +22,11 @@ $effect(() => {
         });
     }
 });
-// Derive additional inputs schema (excluding user_message) for chat mode
-const additionalInputsSchema = $derived.by(() => {
-    const props = inputSchema?.properties ?? {};
-    const filtered = Object.fromEntries(Object.entries(props).filter(([k]) => k !== 'user_message'));
-    if (Object.keys(filtered).length === 0)
-        return undefined;
-    const required = inputSchema?.required;
-    const requiredArray = Array.isArray(required) ? required : [];
-    return {
-        ...inputSchema,
-        properties: filtered,
-        required: requiredArray.filter((k) => k !== 'user_message')
-    };
-});
 </script>
 
 <div class="flex border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden flex-1">
 	{#if !hideSidebar}
 		<FlowConversationsSidebar {manager} />
 	{/if}
-	<FlowChatInterface {manager} {deploymentInProgress} {additionalInputsSchema} {path} />
+	<FlowChatInterface {manager} {deploymentInProgress} />
 </div>

package/package/components/flows/conversations/FlowChat.svelte.d.ts

@@ -1,10 +1,9 @@
 interface Props {
-    onRunFlow: (userMessage: string, conversationId: string, additionalInputs?: Record<string, any>) => Promise<string | undefined>;
+    onRunFlow: (userMessage: string, conversationId: string) => Promise<string | undefined>;
     useStreaming?: boolean;
     deploymentInProgress?: boolean;
     path: string;
     hideSidebar?: boolean;
-    inputSchema?: Record<string, any>;
 }
 declare const FlowChat: import("svelte").Component<Props, {}, "">;
 type FlowChat = ReturnType<typeof FlowChat>;

package/package/components/flows/conversations/FlowChatInterface.svelte

@@ -1,85 +1,11 @@
-<script lang="ts">import { Alert, Button } from '../../common';
-import { MessageCircle, Loader2, Settings2 } from 'lucide-svelte';
+<script lang="ts">import { Alert } from '../../common';
+import { MessageCircle, Loader2 } from 'lucide-svelte';
 import ChatMessage from '../../chat/ChatMessage.svelte';
 import ChatInput from '../../chat/ChatInput.svelte';
 import { FlowChatManager } from './FlowChatManager.svelte';
-import Modal from '../../common/modal/Modal.svelte';
-import SchemaForm from '../../SchemaForm.svelte';
-import {} from '../../../utils';
-let { manager, deploymentInProgress = false, additionalInputsSchema, path } = $props();
-// Derive helperScript for dynamic inputs from schema
-const dynamicInputHelperScript = $derived.by(() => {
-    const dynCode = additionalInputsSchema?.['x-windmill-dyn-select-code'];
-    const dynLang = additionalInputsSchema?.['x-windmill-dyn-select-lang'];
-    if (dynCode && dynLang) {
-        return { source: 'inline', code: dynCode, lang: dynLang };
-    }
-    return undefined;
-});
-// LocalStorage helpers
-const STORAGE_KEY_PREFIX = 'windmill_flow_chat_inputs_';
-// State for additional inputs modal
-let showInputsModal = $state(false);
-let additionalInputsValues = $state(loadInputsFromStorage() ?? undefined);
-function getStorageKey() {
-    return `${STORAGE_KEY_PREFIX}${path}`;
-}
-function loadInputsFromStorage() {
-    try {
-        const stored = localStorage.getItem(getStorageKey());
-        return stored ? JSON.parse(stored) : null;
-    }
-    catch (e) {
-        console.error('Failed to load inputs from localStorage:', e);
-        return null;
-    }
-}
-function saveInputsToStorage(values) {
-    try {
-        localStorage.setItem(getStorageKey(), JSON.stringify(values));
-    }
-    catch (e) {
-        console.error('Failed to save inputs to localStorage:', e);
-    }
-}
-function handleModalConfirm() {
-    saveInputsToStorage(additionalInputsValues ?? {});
-    showInputsModal = false;
-}
-function handleSendMessage() {
-    const inputs = additionalInputsSchema
-        ? (loadInputsFromStorage() ?? additionalInputsValues)
-        : undefined;
-    manager.sendMessage(inputs);
-}
-function openInputsModal() {
-    const stored = loadInputsFromStorage();
-    if (stored)
-        additionalInputsValues = stored;
-    showInputsModal = true;
-}
-const hasMissingRequired = $derived.by(() => {
-    if (!additionalInputsSchema?.required?.length)
-        return false;
-    const values = additionalInputsValues ?? {};
-    return additionalInputsSchema.required.some((field) => values[field] === undefined || values[field] === '' || values[field] === null);
-});
+let { manager, deploymentInProgress = false } = $props();
 </script>
 
-<!-- Additional Inputs Modal -->
-{#if additionalInputsSchema}
-	<Modal title="Configure inputs" bind:open={showInputsModal}>
-		<SchemaForm
-			schema={additionalInputsSchema}
-			bind:args={additionalInputsValues}
-			helperScript={dynamicInputHelperScript}
-		/>
-		{#snippet actions()}
-			<Button onClick={handleModalConfirm} variant="accent">Save</Button>
-		{/snippet}
-	</Modal>
-{/if}
-
 <div class="flex flex-col h-full flex-1 min-w-0">
 	<!-- Messages Container -->
 	<div
@@ -122,37 +48,14 @@ const hasMissingRequired = $derived.by(() => {
 	</div>
 
 	<!-- Chat Input -->
-	<div class="flex flex-col items-center p-2 xl:max-w-7xl mx-auto w-full gap-2">
-		{#if additionalInputsSchema}
-			<div class="flex items-center justify-end w-full">
-				<div class="relative">
-					<Button
-						size="xs"
-						variant="default"
-						startIcon={{ icon: Settings2 }}
-						title="Inputs"
-						onClick={openInputsModal}
-					>
-						Inputs
-					</Button>
-					{#if hasMissingRequired}
-						<span class="absolute -top-1 -right-1 w-2 h-2 bg-yellow-500 rounded-full"></span>
-					{/if}
-				</div>
-			</div>
-		{/if}
+	<div class="flex flex-row justify-center py-2 xl:max-w-7xl mx-auto w-full">
 		<div class="w-full" class:opacity-50={deploymentInProgress}>
 			<ChatInput
 				bind:value={manager.inputMessage}
 				bind:bindTextarea={manager.inputElement}
 				disabled={manager.isLoading || deploymentInProgress}
-				onSend={handleSendMessage}
-				onKeydown={(e) => {
-					if (e.key === 'Enter' && !e.shiftKey && !e.isComposing) {
-						e.preventDefault()
-						handleSendMessage()
-					}
-				}}
+				onSend={() => manager.sendMessage()}
+				onKeydown={manager.handleKeyDown}
 				showCancelButton={manager.isWaitingForResponse || manager.isLoading}
 				onCancel={() => manager.cancelCurrentJob()}
 				sendTitle={deploymentInProgress ? 'Deployment in progress' : 'Send message (Enter)'}

package/package/components/flows/conversations/FlowChatInterface.svelte.d.ts

@@ -2,8 +2,6 @@ import { FlowChatManager } from './FlowChatManager.svelte';
 interface Props {
     manager: FlowChatManager;
     deploymentInProgress?: boolean;
-    additionalInputsSchema?: Record<string, any>;
-    path: string;
 }
 declare const FlowChatInterface: import("svelte").Component<Props, {}, "">;
 type FlowChatInterface = ReturnType<typeof FlowChatInterface>;

package/package/components/flows/conversations/FlowChatManager.svelte.js

@@ -278,16 +278,14 @@ export class FlowChatManager {
             // Do a final poll to get all messages from database
             try {
                 if (this.selectedConversationId) {
-                    await this.pollConversationMessages(this.selectedConversationId, {
-                        removeTempMessages: true
-                    });
+                    await this.pollConversationMessages(this.selectedConversationId);
                 }
             }
             catch { }
             this.cleanup();
         }
     }
-    async pollConversationMessages(conversationId, options) {
+    async pollConversationMessages(conversationId, isNewConversation) {
         if (!get(workspaceStore))
             return;
         try {
@@ -299,7 +297,7 @@ export class FlowChatManager {
                 perPage: 50,
                 afterId: lastId
             });
-            if (options?.isNewConversation) {
+            if (isNewConversation) {
                 await this.refreshConversations();
             }
             const filteredResponse = response.filter((msg) => msg.message_type !== 'user');
@@ -309,11 +307,8 @@ export class FlowChatManager {
                     this.messages = [...this.messages, msg];
                 }
             }
-            // Only remove temporary messages when explicitly requested (e.g., after job completion)
-            // During streaming, we keep temp messages to avoid them disappearing due to race conditions
-            if (options?.removeTempMessages) {
-                this.messages = this.messages.filter((msg) => !msg.id.startsWith('temp-'));
-            }
+            // Remove temporary messages
+            this.messages = this.messages.filter((msg) => !msg.id.startsWith('temp-'));
         }
         catch (error) {
             console.error('Polling error:', error);
@@ -323,7 +318,7 @@ export class FlowChatManager {
         if (this.pollingInterval)
             return;
         this.pollingInterval = setInterval(() => {
-            this.pollConversationMessages(conversationId, { isNewConversation });
+            this.pollConversationMessages(conversationId, isNewConversation);
         }, 500); // Poll every 0.5 seconds
         setTimeout(() => {
             this.stopPolling();
@@ -336,7 +331,7 @@ export class FlowChatManager {
         }
     }
     // Message sending
-    async sendMessage(additionalInputs) {
+    async sendMessage() {
         if (!this.inputMessage.trim() || this.isLoading)
             return;
         const isNewConversation = this.messages.length === 0;
@@ -370,10 +365,10 @@ export class FlowChatManager {
             await tick();
             this.scrollToUserMessage(userMessage.id);
             if (this.#useStreaming && this.#path) {
-                await this.handleStreamingMessage(messageContent, currentConversationId, isNewConversation, additionalInputs);
+                await this.handleStreamingMessage(messageContent, currentConversationId, isNewConversation);
             }
             else {
-                await this.handlePollingMessage(messageContent, currentConversationId, isNewConversation, additionalInputs);
+                await this.handlePollingMessage(messageContent, currentConversationId, isNewConversation);
             }
         }
         catch (error) {
@@ -388,7 +383,7 @@ export class FlowChatManager {
         await tick();
         this.focusInput();
     }
-    async handleStreamingMessage(messageContent, currentConversationId, isNewConversation, additionalInputs) {
+    async handleStreamingMessage(messageContent, currentConversationId, isNewConversation) {
         // Close any existing EventSource
         if (this.currentEventSource) {
             this.currentEventSource.close();
@@ -398,7 +393,7 @@ export class FlowChatManager {
         let assistantMessageId = '';
         let isCompleted = false;
         try {
-            const jobId = await this.#onRunFlow?.(messageContent, currentConversationId, additionalInputs);
+            const jobId = await this.#onRunFlow?.(messageContent, currentConversationId);
             if (!jobId) {
                 console.error('No jobId returned from onRunFlow');
                 return;
@@ -417,38 +412,7 @@ export class FlowChatManager {
             eventSource.onmessage = async (event) => {
                 try {
                     const data = JSON.parse(event.data);
-                    const type = data.type;
-                    // Handle timeout - reconnect to SSE
-                    if (type === 'timeout') {
-                        eventSource.close();
-                        this.currentEventSource = undefined;
-                        // Reconnect
-                        this.handleStreamingMessage(messageContent, currentConversationId, isNewConversation, additionalInputs);
-                        return;
-                    }
-                    // Handle ping - just ignore
-                    if (type === 'ping') {
-                        return;
-                    }
-                    // Handle error
-                    if (type === 'error') {
-                        eventSource.close();
-                        this.currentEventSource = undefined;
-                        console.error('SSE error:', data);
-                        sendUserToast('Stream error: ' + (data.error || 'Unknown error'), true);
-                        this.cleanup();
-                        return;
-                    }
-                    // Handle not found
-                    if (type === 'not_found') {
-                        eventSource.close();
-                        this.currentEventSource = undefined;
-                        console.error('Job not found');
-                        sendUserToast('Job not found', true);
-                        this.cleanup();
-                        return;
-                    }
-                    if (type === 'update') {
+                    if (data.type === 'update') {
                         if (data.flow_stream_job_id) {
                             this.currentJobId = data.flow_stream_job_id;
                         }
@@ -511,9 +475,7 @@ export class FlowChatManager {
                             isCompleted = true;
                             // Do a final poll to get all messages from database
                             if (this.selectedConversationId) {
-                                await this.pollConversationMessages(this.selectedConversationId, {
-                                    removeTempMessages: true
-                                });
+                                await this.pollConversationMessages(this.selectedConversationId);
                             }
                             this.cleanup();
                         }
@@ -537,8 +499,8 @@ export class FlowChatManager {
             this.cleanup();
         }
     }
-    async handlePollingMessage(messageContent, currentConversationId, isNewConversation, additionalInputs) {
-        const jobId = await this.#onRunFlow?.(messageContent, currentConversationId, additionalInputs);
+    async handlePollingMessage(messageContent, currentConversationId, isNewConversation) {
+        const jobId = await this.#onRunFlow?.(messageContent, currentConversationId);
         if (!jobId) {
             console.error('No jobId returned from onRunFlow');
             return;
@@ -552,5 +514,11 @@ export class FlowChatManager {
         this.startPolling(currentConversationId);
         this.pollJobResult(jobId);
     }
+    handleKeyDown = (event) => {
+        if (event.key === 'Enter' && !event.shiftKey) {
+            event.preventDefault();
+            this.sendMessage();
+        }
+    };
 }
 export const createFlowChatManager = () => new FlowChatManager();

package/package/components/flows/header/FlowImportExportMenu.svelte

@@ -11,7 +11,7 @@ let flow = $derived(flowStore.val);
 <Drawer bind:this={drawer} size="800px">
 	<DrawerContent title="OpenFlow" on:close={() => drawer?.toggleDrawer()}>
 		{#if flow}
-			<FlowViewer flow={cleanFlow(flow)} initTab="raw" />
+			<FlowViewer flow={cleanFlow(flow)} tab="raw" />
 		{/if}
 	</DrawerContent>
 </Drawer>

package/package/components/flows/propPicker/PropPickerWrapper.svelte

@@ -82,7 +82,7 @@ let rightPaneHeight = $state(0);
 						: 'transparent'}
 					animationDuration="4s"
 				>
-					{#if result != undefined && !pickableProperties}
+					{#if result != undefined}
 						<PropPickerResult
 							{result}
 							{extraResults}
@@ -97,8 +97,6 @@ let rightPaneHeight = $state(0);
 						/>
 					{:else if pickableProperties}
 						<PropPicker
-							{result}
-							{extraResults}
 							{displayContext}
 							{error}
 							{flow_env}