fix: copy task button retrieves content from backend

This change modifies the copy button in task history to retrieve the task content from the backend storage using getHistoryItem before copying it to the clipboard. This ensures the most up-to-date content is copied.

Fixes: #3648
Signed-off-by: Eric Wheeler <[email protected]>

Author: Eric Wheeler

src/core/webview/ClineProvider.ts

@@ -1176,6 +1176,19 @@ export class ClineProvider
 		await downloadTask(historyItem.ts, apiConversationHistory)
 	}
 
+	async copyTaskToClipboard(id: string) {
+		try {
+			const historyItem = await getHistoryItem(id)
+			if (historyItem) {
+				await vscode.env.clipboard.writeText(historyItem.task)
+				vscode.window.showInformationMessage(t("common:info.clipboard_copy"))
+			}
+		} catch (error) {
+			this.log(`Error copying task: ${error}`)
+			vscode.window.showErrorMessage(t("common:errors.copy_task_failed"))
+		}
+	}
+
 	/* Condenses a task's message history to use fewer tokens. */
 	async condenseTaskContext(taskId: string) {
 		let task: Task | undefined

src/core/webview/webviewMessageHandler.ts

@@ -441,6 +441,11 @@ export const webviewMessageHandler = async (
 		case "showTaskWithId":
 			provider.showTaskWithId(message.text!)
 			break
+		case "copyTask":
+			if (message.text) {
+				provider.copyTaskToClipboard(message.text)
+			}
+			break
 		case "condenseTaskContextRequest":
 			provider.condenseTaskContext(message.text!)
 			break

src/shared/WebviewMessage.ts

@@ -59,6 +59,8 @@ export interface WebviewMessage {
 		| "shareCurrentTask"
 		| "showTaskWithId"
 		| "deleteTaskWithId"
+		| "taskDeletedConfirmation"
+		| "copyTask"
 		| "exportTaskWithId"
 		| "importSettings"
 		| "exportSettings"

webview-ui/src/components/history/CopyButton.tsx

@@ -1,27 +1,29 @@
-import { useCallback } from "react"
+import { useCallback, useState } from "react"
 
-import { useClipboard } from "@/components/ui/hooks"
 import { Button, StandardTooltip } from "@/components/ui"
 import { useAppTranslation } from "@/i18n/TranslationContext"
 import { cn } from "@/lib/utils"
+import { vscode } from "@/utils/vscode"
 
 type CopyButtonProps = {
-	itemTask: string
+	itemId: string
 }
 
-export const CopyButton = ({ itemTask }: CopyButtonProps) => {
-	const { isCopied, copy } = useClipboard()
+export const CopyButton = ({ itemId }: CopyButtonProps) => {
+	const [isCopied, setIsCopied] = useState(false)
 	const { t } = useAppTranslation()
 
 	const onCopy = useCallback(
 		(e: React.MouseEvent) => {
 			e.stopPropagation()
 
 			if (!isCopied) {
-				copy(itemTask)
+				vscode.postMessage({ type: "copyTask", text: itemId })
+				setIsCopied(true)
+				setTimeout(() => setIsCopied(false), 2000)
 			}
 		},
-		[isCopied, copy, itemTask],
+		[isCopied, itemId],
 	)
 
 	return (

webview-ui/src/components/history/TaskItemFooter.tsx

@@ -52,7 +52,7 @@ const TaskItemFooter: React.FC<TaskItemFooterProps> = ({ item, variant, isSelect
 			{/* Action Buttons for non-compact view */}
 			{!isSelectionMode && (
 				<div className="flex flex-row gap-0 items-center opacity-50 hover:opacity-100">
-					<CopyButton itemTask={item.task} />
+					<CopyButton itemId={item.id} />
 					{variant === "full" && <ExportButton itemId={item.id} />}
 				</div>
 			)}

webview-ui/src/components/history/__tests__/CopyButton.spec.tsx

@@ -1,33 +1,33 @@
 import { render, screen, fireEvent } from "@/utils/test-utils"
-
-import { useClipboard } from "@/components/ui/hooks"
-
 import { CopyButton } from "../CopyButton"
+import { vscode } from "@/utils/vscode"
+
+vi.mock("@/utils/vscode", () => ({
+	vscode: {
+		postMessage: vi.fn(),
+	},
+}))
 
-vi.mock("@/components/ui/hooks")
 vi.mock("@src/i18n/TranslationContext", () => ({
 	useAppTranslation: () => ({
 		t: (key: string) => key,
 	}),
 }))
 
 describe("CopyButton", () => {
-	const mockCopy = vi.fn()
-
 	beforeEach(() => {
 		vi.clearAllMocks()
-		;(useClipboard as any).mockReturnValue({
-			isCopied: false,
-			copy: mockCopy,
-		})
 	})
 
-	it("copies task content when clicked", () => {
-		render(<CopyButton itemTask="Test task content" />)
+	it("sends copy message with task ID when clicked", () => {
+		render(<CopyButton itemId="test-task-id" />)
 
 		const copyButton = screen.getByRole("button")
 		fireEvent.click(copyButton)
 
-		expect(mockCopy).toHaveBeenCalledWith("Test task content")
+		expect(vscode.postMessage).toHaveBeenCalledWith({
+			type: "copyTask",
+			text: "test-task-id",
+		})
 	})
 })