windmill-components 1.501.24 → 1.502.2

package/package/components/copilot/chat/AIChatInput.svelte

@@ -0,0 +1,128 @@
+<script lang="ts">import Popover from '../../meltComponents/Popover.svelte';
+import AvailableContextList from './AvailableContextList.svelte';
+import ContextElementBadge from './ContextElementBadge.svelte';
+import ContextTextarea from './ContextTextarea.svelte';
+import autosize from '../../../autosize';
+import { aiChatManager } from './AIChatManager.svelte';
+let { availableContext, selectedContext = $bindable([]), disabled = false, isFirstMessage = false, placeholder = 'Ask anything', initialInstructions = '', editingMessageIndex = null, onEditEnd = () => { } } = $props();
+let contextTextareaComponent = $state();
+let instructionsTextareaComponent = $state();
+let instructions = $state(initialInstructions);
+export function focusInput() {
+    if (aiChatManager.mode === 'script') {
+        contextTextareaComponent?.focus();
+    }
+    else {
+        instructionsTextareaComponent?.focus();
+    }
+}
+function clickOutside(node) {
+    function handleClick(event) {
+        if (node && !node.contains(event.target) && editingMessageIndex !== null) {
+            onEditEnd();
+        }
+    }
+    document.addEventListener('click', handleClick, true);
+    return {
+        destroy() {
+            document.removeEventListener('click', handleClick, true);
+        }
+    };
+}
+function addContextToSelection(contextElement) {
+    if (selectedContext &&
+        availableContext &&
+        !selectedContext.find((c) => c.type === contextElement.type && c.title === contextElement.title) &&
+        availableContext.find((c) => c.type === contextElement.type && c.title === contextElement.title)) {
+        selectedContext = [...selectedContext, contextElement];
+    }
+}
+function sendRequest() {
+    if (aiChatManager.loading) {
+        return;
+    }
+    if (editingMessageIndex !== null) {
+        aiChatManager.restartGeneration(editingMessageIndex, instructions);
+        onEditEnd();
+    }
+    else {
+        aiChatManager.sendRequest({ instructions });
+        instructions = '';
+    }
+}
+$effect(() => {
+    if (editingMessageIndex !== null) {
+        focusInput();
+    }
+});
+</script>
+
+<div use:clickOutside>
+	{#if aiChatManager.mode === 'script'}
+		<div class="flex flex-row gap-1 mb-1 overflow-scroll pt-2 px-2 no-scrollbar">
+			<Popover>
+				<svelte:fragment slot="trigger">
+					<div
+						class="border rounded-md px-1 py-0.5 font-normal text-tertiary text-xs hover:bg-surface-hover"
+						>@</div
+					>
+				</svelte:fragment>
+				<svelte:fragment slot="content" let:close>
+					<AvailableContextList
+						{availableContext}
+						{selectedContext}
+						onSelect={(element) => {
+							addContextToSelection(element)
+							close()
+						}}
+					/>
+				</svelte:fragment>
+			</Popover>
+			{#each selectedContext as element}
+				<ContextElementBadge
+					contextElement={element}
+					deletable
+					on:delete={() => {
+						selectedContext = selectedContext?.filter(
+							(c) => c.type !== element.type || c.title !== element.title
+						)
+					}}
+				/>
+			{/each}
+		</div>
+		<ContextTextarea
+			bind:this={contextTextareaComponent}
+			bind:value={instructions}
+			{availableContext}
+			{selectedContext}
+			{isFirstMessage}
+			{placeholder}
+			onAddContext={(contextElement) => addContextToSelection(contextElement)}
+			onSendRequest={() => {
+				sendRequest()
+			}}
+			{disabled}
+			onEscape={onEditEnd}
+		/>
+	{:else}
+		<div class="relative w-full px-2 scroll-pb-2 pt-2">
+			<textarea
+				bind:this={instructionsTextareaComponent}
+				bind:value={instructions}
+				use:autosize
+				onkeydown={(e) => {
+					if (e.key === 'Enter' && !e.shiftKey) {
+						e.preventDefault()
+						sendRequest()
+					} else if (e.key === 'Escape') {
+						onEditEnd()
+					}
+				}}
+				rows={3}
+				{placeholder}
+				class="resize-none"
+				{disabled}
+			></textarea>
+		</div>
+	{/if}
+</div>

package/package/components/copilot/chat/AIChatInput.svelte.d.ts

@@ -0,0 +1,16 @@
+import type { ContextElement } from './context';
+interface Props {
+    availableContext: ContextElement[];
+    selectedContext: ContextElement[];
+    isFirstMessage?: boolean;
+    disabled?: boolean;
+    placeholder?: string;
+    initialInstructions?: string;
+    editingMessageIndex?: number | null;
+    onEditEnd?: () => void;
+}
+declare const AiChatInput: import("svelte").Component<Props, {
+    focusInput: () => void;
+}, "selectedContext">;
+type AiChatInput = ReturnType<typeof AiChatInput>;
+export default AiChatInput;

package/package/components/copilot/chat/AIChatManager.svelte.d.ts

@@ -53,6 +53,9 @@ declare class AIChatManager {
         withCode?: boolean;
         withDiff?: boolean;
     }) => void;
+    retryRequest: (messageIndex: number) => void;
+    private getLastUserMessage;
+    private flagLastMessageAsError;
     private chatRequest;
     sendRequest: (options?: {
         removeDiff?: boolean;
@@ -63,7 +66,7 @@ declare class AIChatManager {
         isPreprocessor?: boolean;
     }) => Promise<void>;
     cancel: () => void;
-    restartLastGeneration: (displayMessageIndex: number) => void;
+    restartGeneration: (displayMessageIndex: number, newContent?: string) => void;
     fix: () => void;
     addSelectedLinesToContext: (lines: string, startLine: number, endLine: number) => void;
     saveAndClear: () => Promise<void>;

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

@@ -175,6 +175,30 @@ class AIChatManager {
             this.scriptEditorShowDiffMode?.();
         }
     };
+    retryRequest = (messageIndex) => {
+        const message = this.displayMessages[messageIndex];
+        if (message && message.role === 'user') {
+            this.restartGeneration(messageIndex);
+            message.error = false;
+        }
+        else {
+            throw new Error('No user message found at the specified index');
+        }
+    };
+    getLastUserMessage = () => {
+        for (let i = this.displayMessages.length - 1; i >= 0; i--) {
+            const message = this.displayMessages[i];
+            if (message.role === 'user') {
+                return message;
+            }
+        }
+    };
+    flagLastMessageAsError = () => {
+        const lastUserMessage = this.getLastUserMessage();
+        if (lastUserMessage) {
+            lastUserMessage.error = true;
+        }
+    };
     chatRequest = async ({ messages, abortController, callbacks }) => {
         try {
             let completion = null;
@@ -320,7 +344,8 @@ class AIChatManager {
                     role: 'user',
                     content: this.instructions,
                     contextElements: this.mode === AIMode.SCRIPT ? oldSelectedContext : undefined,
-                    snapshot
+                    snapshot,
+                    index: this.messages.length // matching with actual messages index. not -1 because it's not yet added to the messages array
                 }
             ];
             const oldInstructions = this.instructions;
@@ -378,6 +403,7 @@ class AIChatManager {
         }
         catch (err) {
             console.error(err);
+            this.flagLastMessageAsError();
             if (err instanceof Error) {
                 sendUserToast('Failed to send request: ' + err.message, true);
             }
@@ -392,27 +418,21 @@ class AIChatManager {
     cancel = () => {
         this.abortController?.abort();
     };
-    restartLastGeneration = (displayMessageIndex) => {
+    restartGeneration = (displayMessageIndex, newContent) => {
         const userMessage = this.displayMessages[displayMessageIndex];
         if (!userMessage || userMessage.role !== 'user') {
             throw new Error('No user message found at the specified index');
         }
         // Remove all messages including and after the specified user message
         this.displayMessages = this.displayMessages.slice(0, displayMessageIndex);
-        // Find the last user message in actual messages and remove it and everything after it
-        let lastActualUserMessageIndex = -1;
-        for (let i = this.messages.length - 1; i >= 0; i--) {
-            if (this.messages[i].role === 'user') {
-                lastActualUserMessageIndex = i;
-                break;
-            }
-        }
-        if (lastActualUserMessageIndex === -1) {
+        // Find corresponding message in actual messages and remove it and everything after it
+        let actualMessageIndex = this.messages.findIndex((_, i) => i === userMessage.index);
+        if (actualMessageIndex === -1) {
             throw new Error('No actual user message found to restart from');
         }
-        this.messages = this.messages.slice(0, lastActualUserMessageIndex);
+        this.messages = this.messages.slice(0, actualMessageIndex);
         // Resend the request with the same instructions
-        this.instructions = userMessage.content;
+        this.instructions = newContent ?? userMessage.content;
         this.sendRequest();
     };
     fix = () => {

package/package/components/copilot/chat/AIChatMessage.svelte

@@ -0,0 +1,93 @@
+<script lang="ts">import { twMerge } from 'tailwind-merge';
+import ContextElementBadge from './ContextElementBadge.svelte';
+import AssistantMessage from './AssistantMessage.svelte';
+import { aiChatManager } from './AIChatManager.svelte';
+import { Button } from '../../common';
+import { RefreshCwIcon, Undo2Icon } from 'lucide-svelte';
+import AIChatInput from './AIChatInput.svelte';
+let { message, messageIndex, availableContext, selectedContext = $bindable(), editingMessageIndex = $bindable(null) } = $props();
+function editMessage() {
+    if (message.role !== 'user' || editingMessageIndex !== null || aiChatManager.loading) {
+        return;
+    }
+    editingMessageIndex = messageIndex;
+}
+</script>
+
+<div
+	class={twMerge(
+		message.role === 'user' && messageIndex > 0 && 'mt-6',
+		'mb-2',
+		message.role !== 'user' ? 'cursor-default' : 'cursor-pointer'
+	)}
+	role="button"
+	tabindex="0"
+	onclick={() => editMessage()}
+	onkeydown={() => {}}
+>
+	{#if message.role === 'user' && message.contextElements && editingMessageIndex !== messageIndex}
+		<div class="flex flex-row gap-1 mb-1 overflow-scroll no-scrollbar px-2">
+			{#each message.contextElements as element}
+				<ContextElementBadge contextElement={element} />
+			{/each}
+		</div>
+	{/if}
+	{#if message.role === 'user' && editingMessageIndex === messageIndex}
+		<AIChatInput
+			{availableContext}
+			bind:selectedContext
+			initialInstructions={message.content}
+			{editingMessageIndex}
+			onEditEnd={() => (editingMessageIndex = null)}
+		/>
+	{:else}
+		<div
+			class={twMerge(
+				'text-sm py-1 mx-2',
+				message.role === 'user' &&
+					'px-2 border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-900 rounded-lg relative group',
+				(message.role === 'assistant' || message.role === 'tool') && 'px-[1px]',
+				message.role === 'tool' && 'text-tertiary'
+			)}
+		>
+			{#if message.role === 'assistant'}
+				<AssistantMessage {message} />
+			{:else}
+				{message.content}
+			{/if}
+		</div>
+	{/if}
+	{#if message.role === 'user' && message.snapshot}
+		<div class="mx-2 text-sm text-tertiary flex flex-row items-center justify-between gap-2 mt-2">
+			Saved a flow snapshot
+			<Button
+				size="xs2"
+				variant="border"
+				color="light"
+				on:click={() => {
+					if (message.snapshot) {
+						aiChatManager.flowAiChatHelpers?.revertToSnapshot(message.snapshot)
+					}
+				}}
+				title="Revert to snapshot"
+				startIcon={{ icon: Undo2Icon }}
+			>
+				Revert
+			</Button>
+		</div>
+	{/if}
+</div>
+{#if message.role === 'user' && message.error}
+	<div class="flex justify-end px-2 -mt-1">
+		<Button
+			size="xs2"
+			variant="border"
+			title="Retry generation"
+			color="light"
+			startIcon={{ icon: RefreshCwIcon }}
+			onclick={() => aiChatManager.retryRequest(messageIndex)}
+		>
+			Retry
+		</Button>
+	</div>
+{/if}

package/package/components/copilot/chat/AIChatMessage.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { DisplayMessage } from './shared';
+import type { ContextElement } from './context';
+interface Props {
+    availableContext: ContextElement[];
+    selectedContext: ContextElement[];
+    message: DisplayMessage;
+    messageIndex: number;
+    editingMessageIndex: number | null;
+}
+declare const AiChatMessage: import("svelte").Component<Props, {}, "selectedContext" | "editingMessageIndex">;
+type AiChatMessage = ReturnType<typeof AiChatMessage>;
+export default AiChatMessage;

package/package/components/copilot/chat/ContextTextarea.svelte

@@ -1,10 +1,9 @@
 <script lang="ts">import autosize from '../../../autosize';
 import { tick } from 'svelte';
 import AvailableContextList from './AvailableContextList.svelte';
-import { aiChatManager } from './AIChatManager.svelte';
 import Portal from '../../Portal.svelte';
 import { zIndexes } from '../../../zIndexes';
-const { availableContext, selectedContext, isFirstMessage, disabled, onUpdateInstructions, onSendRequest, onAddContext } = $props();
+let { value = $bindable(''), availableContext, selectedContext, isFirstMessage, placeholder, disabled, onSendRequest, onAddContext, onEscape } = $props();
 let showContextTooltip = $state(false);
 let contextTooltipWord = $state('');
 let tooltipPosition = $state({ x: 0, y: 0 });
@@ -131,10 +130,10 @@ function addContextToSelection(contextElement) {
     onAddContext(contextElement);
 }
 function updateInstructionsWithContext(contextElement) {
-    const index = aiChatManager.instructions.lastIndexOf('@');
+    const index = value.lastIndexOf('@');
     if (index !== -1) {
-        const newInstructions = aiChatManager.instructions.substring(0, index) + `@${contextElement.title}`;
-        onUpdateInstructions(newInstructions);
+        const newInstructions = value.substring(0, index) + `@${contextElement.title}`;
+        value = newInstructions;
     }
 }
 function handleContextSelection(contextElement) {
@@ -200,7 +199,7 @@ async function updateTooltipPosition(availableContext, showContextTooltip, conte
 }
 function handleInput(e) {
     textarea = e.target;
-    const words = aiChatManager.instructions.split(/\s+/);
+    const words = value.split(/\s+/);
     const lastWord = words[words.length - 1];
     if (lastWord.startsWith('@') &&
         (!availableContext.find((c) => c.title === lastWord.slice(1)) ||
@@ -213,7 +212,6 @@ function handleInput(e) {
         contextTooltipWord = '';
         selectedSuggestionIndex = 0;
     }
-    onUpdateInstructions(aiChatManager.instructions);
 }
 function handleKeyPress(e) {
     if (e.key === 'Enter' && !e.shiftKey) {
@@ -224,8 +222,7 @@ function handleKeyPress(e) {
             if (contextElement) {
                 const isInSelectedContext = selectedContext.find((c) => c.title === contextElement.title && c.type === contextElement.type);
                 // If the context element is already in the selected context and the last word in the instructions is the same as the context element title, send request
-                if (isInSelectedContext &&
-                    aiChatManager.instructions.split(' ').pop() === '@' + contextElement.title) {
+                if (isInSelectedContext && value.split(' ').pop() === '@' + contextElement.title) {
                     onSendRequest();
                     return;
                 }
@@ -241,6 +238,9 @@ function handleKeyPress(e) {
     }
 }
 function handleKeyDown(e) {
+    if (e.key === 'Escape') {
+        onEscape();
+    }
     if (!showContextTooltip)
         return;
     const filteredContext = availableContext.filter((c) => !contextTooltipWord || c.title.toLowerCase().includes(contextTooltipWord.slice(1)));
@@ -272,14 +272,14 @@ export function focus() {
 <div class="relative w-full px-2 scroll-pb-2">
 	<div class="textarea-input absolute top-0 left-0 pointer-events-none">
 		<span class="break-words">
-			{@html getHighlightedText(aiChatManager.instructions)}
+			{@html getHighlightedText(value)}
 		</span>
 	</div>
 	<textarea
 		bind:this={textarea}
 		onkeypress={handleKeyPress}
 		onkeydown={handleKeyDown}
-		bind:value={aiChatManager.instructions}
+		bind:value
 		use:autosize
 		rows={3}
 		oninput={handleInput}
@@ -288,11 +288,9 @@ export function focus() {
 				showContextTooltip = false
 			}, 200)
 		}}
-		placeholder={isFirstMessage ? 'Ask anything' : 'Ask followup'}
+		{placeholder}
 		class="textarea-input resize-none bg-transparent caret-black dark:caret-white"
-		style={aiChatManager.instructions.length > 0
-			? 'color: transparent; -webkit-text-fill-color: transparent;'
-			: ''}
+		style={value.length > 0 ? 'color: transparent; -webkit-text-fill-color: transparent;' : ''}
 		{disabled}
 	></textarea>
 </div>

package/package/components/copilot/chat/ContextTextarea.svelte.d.ts

@@ -1,15 +1,17 @@
 import type { ContextElement } from './context';
 interface Props {
+    value: string;
     availableContext: ContextElement[];
     selectedContext: ContextElement[];
     isFirstMessage: boolean;
+    placeholder: string;
     disabled: boolean;
-    onUpdateInstructions: (value: string) => void;
     onSendRequest: () => void;
     onAddContext: (contextElement: ContextElement) => void;
+    onEscape: () => void;
 }
 declare const ContextTextarea: import("svelte").Component<Props, {
     focus: () => void;
-}, "">;
+}, "value">;
 type ContextTextarea = ReturnType<typeof ContextTextarea>;
 export default ContextTextarea;

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

@@ -93,6 +93,17 @@ const flowHelpers = {
         if (snapshot) {
             flowStore.val = snapshot;
             refreshStateStore(flowStore);
+            if ($currentEditor) {
+                const module = getModule($currentEditor.stepId, snapshot);
+                if (module) {
+                    if ($currentEditor.type === 'script' && module.value.type === 'rawscript') {
+                        $currentEditor.editor.setCode(module.value.content);
+                    }
+                    else if ($currentEditor.type === 'iterator' && module.value.type === 'forloopflow') {
+                        $currentEditor.editor.setCode(module.value.iterator.type === 'javascript' ? module.value.iterator.expr : '');
+                    }
+                }
+            }
         }
     },
     showModuleDiff(id) {

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

@@ -1,16 +1,25 @@
 import type { ChatCompletionMessageParam, ChatCompletionMessageToolCall, ChatCompletionTool } from 'openai/resources/chat/completions.mjs';
 import type { ContextElement } from './context';
 import type { ExtendedOpenFlow } from '../../flows/types';
-export type DisplayMessage = {
-    role: 'user' | 'assistant';
+type BaseDisplayMessage = {
     content: string;
     contextElements?: ContextElement[];
     snapshot?: ExtendedOpenFlow;
-} | {
+};
+export type UserDisplayMessage = BaseDisplayMessage & {
+    role: 'user';
+    index: number;
+    error?: boolean;
+};
+export type ToolDisplayMessage = {
     role: 'tool';
     tool_call_id: string;
     content: string;
 };
+export type AssistantDisplayMessage = BaseDisplayMessage & {
+    role: 'assistant';
+};
+export type DisplayMessage = UserDisplayMessage | ToolDisplayMessage | AssistantDisplayMessage;
 export declare function processToolCall<T>({ tools, toolCall, messages, helpers, toolCallbacks }: {
     tools: Tool<T>[];
     toolCall: ChatCompletionMessageToolCall;
@@ -35,3 +44,4 @@ export interface Tool<T> {
 export interface ToolCallbacks {
     setToolStatus: (id: string, content: string) => void;
 }
+export {};

package/package/components/flow_builder.d.ts

@@ -1,3 +1,12 @@
+import type { OpenFlow } from '../gen';
+import type { StateStore } from '../utils';
+import type { Writable } from 'svelte/store';
+import type { FlowState } from './flows/flowState';
+import type { FlowWithDraftAndDraftTriggers, Trigger } from './triggers/utils';
+import type { DiffDrawerI } from './diff_drawer';
+import type { FlowBuilderWhitelabelCustomUi } from './custom_ui';
+import type { ScheduleTrigger } from './triggers';
+import type { stepState } from './stepHistoryLoader.svelte';
 export type FlowBuilderProps = {
     initialPath?: string;
     pathStoreInit?: string | undefined;
@@ -8,7 +17,7 @@ export type FlowBuilderProps = {
     flowStore: StateStore<OpenFlow>;
     flowStateStore: Writable<FlowState>;
     savedFlow?: FlowWithDraftAndDraftTriggers | undefined;
-    diffDrawer?: DiffDrawer | undefined;
+    diffDrawer?: DiffDrawerI | undefined;
     customUi?: FlowBuilderWhitelabelCustomUi;
     disableAi?: boolean;
     disabledFlowInputs?: boolean;

package/package/components/graph/FlowGraphV2.svelte

@@ -207,6 +207,7 @@ async function updateStores() {
         return;
     }
     let newGraph = graph;
+    newGraph.nodes.sort((a, b) => b.id.localeCompare(a.id));
     nodes = layoutNodes(newGraph.nodes);
     edges = newGraph.edges;
     await tick();

package/package/components/search/GlobalSearchModal.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">import { onDestroy, onMount, tick, untrack } from 'svelte';
 import { AppService, FlowService, RawAppService, ScriptService } from '../../gen';
 import { clickOutside, isMac, scroll_into_view_if_needed_polyfill } from '../../utils';
-import { AlertTriangle, BoxesIcon, CalendarIcon, Code2Icon, Database, DollarSignIcon, HomeIcon, LayoutDashboardIcon, PlayIcon, Route, Search, SearchCode, Unplug } from 'lucide-svelte';
+import { AlertTriangle, BoxesIcon, CalendarIcon, Code2Icon, Database, DollarSignIcon, HomeIcon, LayoutDashboardIcon, PlayIcon, Route, Search, SearchCode, Unplug, WandSparkles } from 'lucide-svelte';
 import Portal from '../Portal.svelte';
 import { twMerge } from 'tailwind-merge';
 import ContentSearchInner from '../ContentSearchInner.svelte';
@@ -187,7 +187,7 @@ function removePrefix(str, prefix) {
 }
 let opts = {};
 let uf = new uFuzzy(opts);
-let defaultMenuItemLabels = defaultMenuItems.map((item) => item.label);
+// let defaultMenuItemLabels = defaultMenuItems.map((item) => item.label)
 let defaultMenuItemAndHiddenLabels = defaultMenuItemsWithHidden.map((item) => item.label);
 let switchModeItemLabels = switchModeItems.map((item) => item.label);
 let askAiButton = $state();
@@ -234,7 +234,7 @@ async function handleSearch() {
     }
     if (tab === 'default') {
         if (searchTerm === '')
-            itemMap['default'] = fuzzyFilter(searchTerm, defaultMenuItems, defaultMenuItemLabels);
+            itemMap['default'] = defaultMenuItems;
         else
             itemMap['default'] = fuzzyFilter(searchTerm, defaultMenuItemsWithHidden, defaultMenuItemAndHiddenLabels);
         if (combinedItems) {
@@ -299,9 +299,6 @@ async function handleKeydown(event) {
                 }
             }
         }
-        if ((itemMap[tab] ?? []).length === 0 && searchTerm.length > 0 && event.key === 'Enter') {
-            askAiButton?.onClick();
-        }
     }
 }
 //internal, should not be called outside of the handleSearch function
@@ -541,10 +538,14 @@ let indexMetadata = $state(undefined);
 				<div class="overflow-y-auto relative {maxModalHeight(tab)}">
 					{#if tab === 'default' || tab === 'switch-mode'}
 						{@const items = (itemMap[tab] ?? []).filter((e) =>
-							defaultMenuItemsWithHidden.includes(e)
+							defaultMenuItemsWithHidden.some((x) => e.search_id === x.search_id)
 						)}
 						{#if items.length > 0}
-							<div class={tab === 'switch-mode' ? 'p-2' : 'p-2 border-b'}>
+							<div
+								class={tab === 'switch-mode' || itemMap[tab].length === items.length
+									? 'p-2'
+									: 'p-2 border-b'}
+							>
 								{#each items as el}
 									<QuickMenuItem
 										onselect={(shift) => el?.action(shift)}
@@ -562,8 +563,8 @@ let indexMetadata = $state(undefined);
 					{/if}
 
 					{#if tab === 'default'}
-						<div class="p-2">
-							{#if (itemMap[tab] ?? []).filter((e) => (combinedItems ?? []).includes(e)).length > 0}
+						{#if (itemMap[tab] ?? []).filter((e) => (combinedItems ?? []).includes(e)).length > 0}
+							<div class="p-2">
 								<div class="py-2 px-1 text-xs font-semibold text-tertiary">
 									Flows/Scripts/Apps
 								</div>
@@ -582,19 +583,28 @@ let indexMetadata = $state(undefined);
 										bind:mouseMoved
 									/>
 								{/each}
-							{/if}
+							</div>
+						{/if}
 
-							{#if (itemMap[tab] ?? []).length === 0}
+						{#if (itemMap[tab] ?? []).length === 0}
+							<div class="p-2">
+								<QuickMenuItem
+									onselect={() => {
+										askAiButton?.onClick()
+									}}
+									id={'ai:no-results-ask-ai'}
+									hovered={true}
+									label={`Try asking \`${searchTerm}\` to AI`}
+									icon={WandSparkles}
+									bind:mouseMoved
+								/>
 								<div class="flex w-full justify-center items-center">
 									<div class="text-tertiary text-center">
-										<div class="text-2xl font-bold"
-											>Nothing found, ask the AI to find what you need!</div
-										>
-										<div class="text-sm">Tip: press `esc` to quickly clear the search bar</div>
+										<div class="pt-1 text-sm">Tip: press `esc` to quickly clear the search bar</div>
 									</div>
 								</div>
-							{/if}
-						</div>
+							</div>
+						{/if}
 					{:else if tab === 'content'}
 						<ContentSearchInner
 							search={removePrefix(searchTerm, '#')}

package/package/gen/core/OpenAPI.js

@@ -21,7 +21,7 @@ export const OpenAPI = {
     PASSWORD: undefined,
     TOKEN: undefined,
     USERNAME: undefined,
-    VERSION: '1.501.3',
+    VERSION: '1.502.2',
     WITH_CREDENTIALS: false,
     interceptors: {
         request: new Interceptors(),