Add placeholder text for long paste attachments in prompt

- Insert [pasted #N] at cursor position when pasting
- Remove placeholder when attachment chip is deleted
- Maintains cursor position after paste
- User can see where paste was inserted in text flow
This commit is contained in:
Shantur Rathore
2025-10-24 01:21:57 +01:00
parent 83fa3d2dc4
commit 00fc462c8f

View File

@@ -40,14 +40,26 @@ export default function PromptInput(props: PromptInputProps) {
const attachments = () => getAttachments(props.instanceId, props.sessionId)
function handleRemoveAttachment(attachmentId: string) {
removeAttachment(props.instanceId, props.sessionId, attachmentId)
const currentAttachments = attachments()
const attachment = currentAttachments.find((a) => a.id === attachmentId)
if (attachment && attachment.source.type === "file") {
const filename = attachment.filename
removeAttachment(props.instanceId, props.sessionId, attachmentId)
if (attachment) {
const currentPrompt = prompt()
const newPrompt = currentPrompt.replace(`@${filename}`, "").replace(/\s+/g, " ").trim()
let newPrompt = currentPrompt
if (attachment.source.type === "file") {
const filename = attachment.filename
newPrompt = currentPrompt.replace(`@${filename}`, "").replace(/\s+/g, " ").trim()
} else if (attachment.source.type === "text") {
const placeholderMatch = attachment.display.match(/pasted #(\d+)/)
if (placeholderMatch) {
const placeholder = `[pasted #${placeholderMatch[1]}]`
newPrompt = currentPrompt.replace(placeholder, "").replace(/\s+/g, " ").trim()
}
}
setPrompt(newPrompt)
if (textareaRef) {
@@ -78,6 +90,24 @@ export default function PromptInput(props: PromptInputProps) {
const attachment = createTextAttachment(pastedText, display, filename)
addAttachment(props.instanceId, props.sessionId, attachment)
const textarea = textareaRef
if (textarea) {
const start = textarea.selectionStart
const end = textarea.selectionEnd
const currentText = prompt()
const placeholder = `[pasted #${count}]`
const newText = currentText.substring(0, start) + placeholder + currentText.substring(end)
setPrompt(newText)
setTimeout(() => {
const newCursorPos = start + placeholder.length
textarea.setSelectionRange(newCursorPos, newCursorPos)
textarea.style.height = "auto"
textarea.style.height = Math.min(textarea.scrollHeight, 200) + "px"
textarea.focus()
}, 0)
}
}
}