Merge pull request #16076 from Budibase/fix/clicking-input-removes-prompt

Fix issue where clicking icon was clearing ai prompt

packages/builder/src/components/common/CodeEditor/AIGen.svelte

@@ -10,8 +10,8 @@
   export let bindings: EnrichedBinding[] = []
   export let value: string | null = ""
   export let expandedOnly: boolean = false
-
   export let parentWidth: number | null = null
+
   const dispatch = createEventDispatcher<{
     update: { code: string }
     accept: void
@@ -26,11 +26,11 @@
 
   const thresholdExpansionWidth = 350
 
-  $: expanded =
+  $: shouldAlwaysBeExpanded =
     expandedOnly ||
     (parentWidth !== null && parentWidth > thresholdExpansionWidth)
-      ? true
-      : expanded
+
+  $: expanded = shouldAlwaysBeExpanded || expanded
 
   async function generateJs(prompt: string) {
     promptText = ""
@@ -108,7 +108,7 @@
     bind:expanded
     bind:value={inputValue}
     readonly={!!suggestedCode}
-    {expandedOnly}
+    expandedOnly={shouldAlwaysBeExpanded}
   />
 </div>
 

packages/builder/src/components/common/ai/AIInput.svelte

@@ -13,7 +13,6 @@
   export let value: string = ""
   export const submit = onPromptSubmit
 
-  $: expanded = expandedOnly || expanded
   const dispatch = createEventDispatcher()
 
   let promptInput: HTMLInputElement
@@ -22,6 +21,7 @@
   let switchOnAIModal: Modal
   let addCreditsModal: Modal
 
+  $: expanded = expandedOnly || expanded
   $: accountPortalAccess = $auth?.user?.accountPortalAccess
   $: accountPortal = $admin.accountPortalUrl
   $: aiEnabled = $auth?.user?.llm
@@ -92,9 +92,12 @@
       class="ai-icon"
       class:loading={promptLoading}
       class:disabled={expanded && disabled}
+      class:no-toggle={expandedOnly}
       on:click={e => {
-        e.stopPropagation()
-        toggleExpand()
+        if (!expandedOnly) {
+          e.stopPropagation()
+          toggleExpand()
+        }
       }}
     />
     {#if expanded}
@@ -290,6 +293,10 @@
     z-index: 2;
   }
 
+  .ai-icon.no-toggle {
+    cursor: default;
+  }
+
   .ai-gen-text {
     white-space: nowrap;
     overflow: hidden;