feat(ui): handle image paste

Theodore Li · Theodore Li · commit 474c1fd3ed81 · 2026-03-28T11:33:32.000-07:00
diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/user-input/user-input.tsx
@@ -522,6 +522,31 @@ export function UserInput({
     [isInitialView]
   )
 
+  const handlePaste = useCallback(
+    (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
+      const items = e.clipboardData?.items
+      if (!items) return
+
+      const imageFiles: File[] = []
+      for (const item of Array.from(items)) {
+        if (item.kind === 'file' && item.type.startsWith('image/')) {
+          const file = item.getAsFile()
+          if (file) imageFiles.push(file)
+        }
+      }
+
+      if (imageFiles.length === 0) return
+
+      e.preventDefault()
+      const dt = new DataTransfer()
+      for (const file of imageFiles) {
+        dt.items.add(file)
+      }
+      filesRef.current.processFiles(dt.files)
+    },
+    []
+  )
+
   const handleScroll = useCallback((e: React.UIEvent<HTMLTextAreaElement>) => {
     if (overlayRef.current) {
       overlayRef.current.scrollTop = e.currentTarget.scrollTop
@@ -661,6 +686,7 @@ export function UserInput({
           onChange={handleInputChange}
           onKeyDown={handleKeyDown}
           onInput={handleInput}
+          onPaste={handlePaste}
           onCut={mentionTokensWithContext.handleCut}
           onSelect={handleSelectAdjust}
           onMouseUp={handleSelectAdjust}
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/user-input/hooks/use-file-attachments.ts b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/user-input/hooks/use-file-attachments.ts
@@ -320,5 +320,6 @@ export function useFileAttachments(props: UseFileAttachmentsProps) {
     handleDragOver,
     handleDrop,
     clearAttachedFiles,
+    processFiles,
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -320,5 +320,6 @@ export function useFileAttachments(props: UseFileAttachmentsProps) {`
`320`	`320`	`handleDragOver,`
`321`	`321`	`handleDrop,`
`322`	`322`	`clearAttachedFiles,`
	`323`	`+ processFiles,`
`323`	`324`	`}`
`324`	`325`	`}`