From 960604ece1a7ff5f3e86058aa69b4b83965b7a48 Mon Sep 17 00:00:00 2001
From: Michael Suchacz <203725896+ibetitsmike@users.noreply.github.com>
Date: Mon, 1 Dec 2025 14:59:58 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=96=20fix:=20enable=20image=20paste/dr?=
 =?UTF-8?q?op=20for=20first=20prompt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The paste/drop handlers and ImageAttachments display were only wired up
for the workspace variant, preventing users from pasting images in the
first prompt (creation variant).

- Enable onPaste, onDragOver, onDrop handlers for both variants
- Show ImageAttachments component for both variants
- Update useCreationWorkspace to accept and pass imageParts to sendMessage
- Clear image attachments on successful workspace creation

_Generated with `mux`_
---
 src/browser/components/ChatInput/index.tsx     | 18 ++++++++++--------
 .../ChatInput/useCreationWorkspace.ts          |  6 ++++--
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/browser/components/ChatInput/index.tsx b/src/browser/components/ChatInput/index.tsx
index 3f124cbfc7..aa9a0f24ce 100644
--- a/src/browser/components/ChatInput/index.tsx
+++ b/src/browser/components/ChatInput/index.tsx
@@ -563,9 +563,13 @@ export const ChatInput: React.FC<ChatInputProps> = (props) => {
     // Handle standard message sending based on variant
     if (variant === "creation") {
       setIsSending(true);
-      const ok = await creationState.handleSend(messageText);
+      const ok = await creationState.handleSend(
+        messageText,
+        imageParts.length > 0 ? imageParts : undefined
+      );
       if (ok) {
         setInput("");
+        setImageAttachments([]);
         if (inputRef.current) {
           inputRef.current.style.height = "36px";
         }
@@ -882,9 +886,9 @@ export const ChatInput: React.FC<ChatInputProps> = (props) => {
               mode={mode}
               onChange={setInput}
               onKeyDown={handleKeyDown}
-              onPaste={variant === "workspace" ? handlePaste : undefined}
-              onDragOver={variant === "workspace" ? handleDragOver : undefined}
-              onDrop={variant === "workspace" ? handleDrop : undefined}
+              onPaste={handlePaste}
+              onDragOver={handleDragOver}
+              onDrop={handleDrop}
               suppressKeys={showCommandSuggestions ? COMMAND_SUGGESTION_KEYS : undefined}
               placeholder={placeholder}
               disabled={!editingMessage && (disabled || isSending)}
@@ -897,10 +901,8 @@ export const ChatInput: React.FC<ChatInputProps> = (props) => {
             />
           </div>
 
-          {/* Image attachments - workspace only */}
-          {variant === "workspace" && (
-            <ImageAttachments images={imageAttachments} onRemove={handleRemoveImage} />
-          )}
+          {/* Image attachments */}
+          <ImageAttachments images={imageAttachments} onRemove={handleRemoveImage} />
 
           <div className="flex flex-col gap-1" data-component="ChatModeToggles">
             {/* Editing indicator - workspace only */}
diff --git a/src/browser/components/ChatInput/useCreationWorkspace.ts b/src/browser/components/ChatInput/useCreationWorkspace.ts
index 6af1bfe8b5..57f587577a 100644
--- a/src/browser/components/ChatInput/useCreationWorkspace.ts
+++ b/src/browser/components/ChatInput/useCreationWorkspace.ts
@@ -16,6 +16,7 @@ import {
 } from "@/common/constants/storage";
 import type { Toast } from "@/browser/components/ChatInputToast";
 import { createErrorToast } from "@/browser/components/ChatInputToasts";
+import type { ImagePart } from "@/common/types/ipc";
 
 interface UseCreationWorkspaceOptions {
   projectPath: string;
@@ -49,7 +50,7 @@ interface UseCreationWorkspaceReturn {
   toast: Toast | null;
   setToast: (toast: Toast | null) => void;
   isSending: boolean;
-  handleSend: (message: string) => Promise<boolean>;
+  handleSend: (message: string, imageParts?: ImagePart[]) => Promise<boolean>;
 }
 
 /**
@@ -95,7 +96,7 @@ export function useCreationWorkspace({
   }, [projectPath]);
 
   const handleSend = useCallback(
-    async (message: string): Promise<boolean> => {
+    async (message: string, imageParts?: ImagePart[]): Promise<boolean> => {
       if (!message.trim() || isSending) return false;
 
       setIsSending(true);
@@ -114,6 +115,7 @@ export function useCreationWorkspace({
           runtimeConfig,
           projectPath, // Pass projectPath when workspaceId is null
           trunkBranch: settings.trunkBranch, // Pass selected trunk branch from settings
+          imageParts: imageParts && imageParts.length > 0 ? imageParts : undefined,
         });
 
         if (!result.success) {