diff --git a/.changeset/cyan-insects-marry.md b/.changeset/cyan-insects-marry.md new file mode 100644 index 0000000000..98dc450f7e --- /dev/null +++ b/.changeset/cyan-insects-marry.md @@ -0,0 +1,5 @@ +--- +"roo-cline": patch +--- + +Add a copy button to the recent tasks diff --git a/webview-ui/src/components/chat/ChatRow.tsx b/webview-ui/src/components/chat/ChatRow.tsx index 15b2666280..8df6f596c5 100644 --- a/webview-ui/src/components/chat/ChatRow.tsx +++ b/webview-ui/src/components/chat/ChatRow.tsx @@ -2,6 +2,7 @@ import { VSCodeBadge, VSCodeButton, VSCodeProgressRing } from "@vscode/webview-u import deepEqual from "fast-deep-equal" import React, { memo, useEffect, useMemo, useRef, useState } from "react" import { useSize } from "react-use" +import { useCopyToClipboard } from "../../utils/clipboard" import { ClineApiReqInfo, ClineAskUseMcpServer, @@ -985,6 +986,7 @@ export const ProgressIndicator = () => ( const Markdown = memo(({ markdown, partial }: { markdown?: string; partial?: boolean }) => { const [isHovering, setIsHovering] = useState(false) + const { copyWithFeedback } = useCopyToClipboard(200) // shorter feedback duration for copy button flash return (
{ - navigator.clipboard.writeText(markdown) - // Flash the button background briefly to indicate success - const button = document.activeElement as HTMLElement - if (button) { - button.style.background = "var(--vscode-button-background)" - setTimeout(() => { - button.style.background = "" - }, 200) + onClick={async () => { + const success = await copyWithFeedback(markdown) + if (success) { + const button = document.activeElement as HTMLElement + if (button) { + button.style.background = "var(--vscode-button-background)" + setTimeout(() => { + button.style.background = "" + }, 200) + } } }} title="Copy as markdown"> diff --git a/webview-ui/src/components/history/HistoryPreview.tsx b/webview-ui/src/components/history/HistoryPreview.tsx index 08aca2a44d..b2898fc6a8 100644 --- a/webview-ui/src/components/history/HistoryPreview.tsx +++ b/webview-ui/src/components/history/HistoryPreview.tsx @@ -3,6 +3,7 @@ import { useExtensionState } from "../../context/ExtensionStateContext" import { vscode } from "../../utils/vscode" import { memo } from "react" import { formatLargeNumber } from "../../utils/format" +import { useCopyToClipboard } from "../../utils/clipboard" type HistoryPreviewProps = { showHistoryView: () => void @@ -10,6 +11,7 @@ type HistoryPreviewProps = { const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => { const { taskHistory } = useExtensionState() + const { showCopyFeedback, copyWithFeedback } = useCopyToClipboard() const handleHistorySelect = (id: string) => { vscode.postMessage({ type: "showTaskWithId", text: id }) } @@ -31,8 +33,30 @@ const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => { return (
+ {showCopyFeedback &&
Prompt Copied to Clipboard
} - {showCopyModal &&
Prompt Copied to Clipboard
} + {showCopyFeedback &&
Prompt Copied to Clipboard
}
{ title="Copy Prompt" className="copy-button" data-appearance="icon" - onClick={(e) => handleCopyTask(e, item.task)}> + onClick={(e) => copyWithFeedback(item.task, e)}>