From 09f6bf2379d6db268e757c3afc1d77cd1a740499 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 17 Apr 2025 13:42:26 +0200
Subject: [PATCH] Tweak generation

---
 .../components/common/CodeEditor/AIGen.svelte    |  1 +
 .../src/components/common/ai/AIInput.svelte      | 16 ++++++++++------
 .../data/_components/AITableGeneration.svelte    | 12 ++++++++++--
 3 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/packages/builder/src/components/common/CodeEditor/AIGen.svelte b/packages/builder/src/components/common/CodeEditor/AIGen.svelte
index 92d05f2583..c7e3a0f1ce 100644
--- a/packages/builder/src/components/common/CodeEditor/AIGen.svelte
+++ b/packages/builder/src/components/common/CodeEditor/AIGen.svelte
@@ -105,6 +105,7 @@
     bind:expanded
     on:collapse={rejectSuggestion}
     readonly={!!suggestedCode}
+    {expandedOnly}
   />
 </div>
 
diff --git a/packages/builder/src/components/common/ai/AIInput.svelte b/packages/builder/src/components/common/ai/AIInput.svelte
index 2c5bb756ba..5a7992e2ec 100644
--- a/packages/builder/src/components/common/ai/AIInput.svelte
+++ b/packages/builder/src/components/common/ai/AIInput.svelte
@@ -8,14 +8,18 @@
   export let onSubmit: (_prompt: string) => Promise<void>
   export let placeholder: string = ""
   export let expanded: boolean = false
+  export let expandedOnly: boolean = false
   export let readonly: boolean = false
+  export let value: string = ""
+  export const submit = onPromptSubmit
+
+  $: expanded = expandedOnly || expanded
 
   const dispatch = createEventDispatcher()
 
   let promptInput: HTMLInputElement
   let buttonElement: HTMLButtonElement
   let promptLoading = false
-  let promptText = ""
   let switchOnAIModal: Modal
   let addCreditsModal: Modal
 
@@ -24,13 +28,13 @@
   $: aiEnabled = $auth?.user?.llm
 
   $: creditsExceeded = $licensing.aiCreditsExceeded
-  $: disabled = !aiEnabled || creditsExceeded || readonly
+  $: disabled = !aiEnabled || creditsExceeded || readonly || promptLoading
   $: animateBorder = !disabled && expanded
 
   function collapse() {
     dispatch("collapse")
-    expanded = false
-    promptText = ""
+    expanded = expandedOnly
+    value = ""
     animateBorder = false
   }
 
@@ -63,7 +67,7 @@
     }
     promptLoading = true
     try {
-      await onSubmit(promptText)
+      await onSubmit(value)
     } finally {
       promptLoading = false
     }
@@ -95,7 +99,7 @@
       <input
         type="text"
         bind:this={promptInput}
-        bind:value={promptText}
+        bind:value
         class="prompt-input"
         {placeholder}
         on:keydown={handleKeyPress}
diff --git a/packages/builder/src/pages/builder/app/[application]/data/_components/AITableGeneration.svelte b/packages/builder/src/pages/builder/app/[application]/data/_components/AITableGeneration.svelte
index dcbf2ad9b7..5a6f5741df 100644
--- a/packages/builder/src/pages/builder/app/[application]/data/_components/AITableGeneration.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/data/_components/AITableGeneration.svelte
@@ -4,6 +4,9 @@
   import { auth, licensing } from "@/stores/portal"
   import { ActionButton } from "@budibase/bbui"
 
+  let promptText = ""
+  let aiInput: AiInput
+
   $: isEnabled = $auth?.user?.llm && !$licensing.aiCreditsExceeded
 
   async function submitPrompt(message: string) {
@@ -14,6 +17,8 @@
 <div class="ai-generation">
   <div class="ai-generation-prompt">
     <AiInput
+      bind:this={aiInput}
+      bind:value={promptText}
       placeholder="Generate data using AI..."
       onSubmit={submitPrompt}
       expandedOnly
@@ -22,8 +27,11 @@
   <div class="ai-generation-examples">
     {#if isEnabled}
       {#each ["Create a table called tickets with title, description, status fields", "Create a table called students with name and address fields"] as prompt}
-        <ActionButton on:click={() => submitPrompt(prompt)}
-          >{prompt}</ActionButton
+        <ActionButton
+          on:click={async () => {
+            promptText = prompt
+            await aiInput.submit()
+          }}>{prompt}</ActionButton
         >
       {/each}
     {/if}