feat(home): fill textarea on suggested prompt click instead of sending

Clicking a prompt action in the Suggested Actions panel now populates
the Mothership user-input textarea (via applyAutoMentions) and focuses
it with the caret at end, rather than immediately submitting. The user
can review, edit, and send manually.

Author: emir-karabeg

apps/sim/app/workspace/[workspaceId]/home/components/index.ts

@@ -9,4 +9,4 @@ export { MothershipChat } from './mothership-chat'
 export { MothershipView } from './mothership-view'
 export { QueuedMessages } from './queued-messages'
 export { SuggestedActions } from './suggested-actions'
-export { UserInput } from './user-input'
+export { UserInput, type UserInputHandle } from './user-input'

apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx

@@ -139,6 +139,10 @@ interface UserInputProps {
 
 export interface UserInputHandle {
   loadQueuedMessage: (msg: QueuedMessage) => void
+  /** Populates the textarea with `text` (running it through auto-mention
+   * chipification), focuses the input, and places the caret at the end.
+   * Does NOT submit. Safe to call with the same text twice in a row. */
+  populatePrompt: (text: string) => void
 }
 
 export const UserInput = forwardRef<UserInputHandle, UserInputProps>(function UserInput(
@@ -459,6 +463,17 @@ export const UserInput = forwardRef<UserInputHandle, UserInputProps>(function Us
           textarea.setSelectionRange(end, end)
         })
       },
+      populatePrompt: (text: string) => {
+        const converted = applyAutoMentions(text)
+        setValue(converted)
+        requestAnimationFrame(() => {
+          const textarea = textareaRef.current
+          if (!textarea) return
+          textarea.focus()
+          const end = textarea.value.length
+          textarea.setSelectionRange(end, end)
+        })
+      },
     }),
     [
       files.restoreAttachedFiles,

apps/sim/app/workspace/[workspaceId]/home/home.tsx

@@ -28,6 +28,7 @@ import {
   MothershipView,
   SuggestedActions,
   UserInput,
+  type UserInputHandle,
 } from './components'
 import { getMothershipUseChatOptions, useChat, useMothershipResize } from './hooks'
 import type { FileAttachmentForApi, MothershipResource, MothershipResourceType } from './types'
@@ -52,6 +53,7 @@ export function Home({ chatId, userName, userId, initialResourceId = null }: Hom
   const [initialPrompt, setInitialPrompt] = useState('')
   const hasCheckedLandingStorageRef = useRef(false)
   const initialViewInputRef = useRef<HTMLDivElement>(null)
+  const initialViewUserInputRef = useRef<UserInputHandle>(null)
 
   const [isInputEntering, setIsInputEntering] = useState(false)
 
@@ -312,6 +314,7 @@ export function Home({ chatId, userName, userId, initialResourceId = null }: Hom
           </h1>
           <div ref={initialViewInputRef} className='w-full'>
             <UserInput
+              ref={initialViewUserInputRef}
               defaultValue={initialPrompt}
               draftScopeKey={draftScopeKey}
               onSubmit={handleSubmit}
@@ -321,7 +324,9 @@ export function Home({ chatId, userName, userId, initialResourceId = null }: Hom
               onContextAdd={handleContextAdd}
               onContextRemove={handleInitialContextRemove}
             />
-            <SuggestedActions onSelectPrompt={(prompt) => handleSubmit(prompt)} />
+            <SuggestedActions
+              onSelectPrompt={(prompt) => initialViewUserInputRef.current?.populatePrompt(prompt)}
+            />
           </div>
         </div>
       </div>