scriptoriumadmin/Roo-Code
1
0
Fork 0
mirror of https://github.com/RooVetGit/Roo-Code.git synced 2026-09-07 08:26:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update HistoryPreview.tsx

Browse source 
Added a copy button to the history preview view
This commit is contained in:
Hannes Rudolph 2025-02-07 15:50:28 -07:00 • committed by GitHub
parent 14d7691ded
commit 30cf0d5319
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 44 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
webview-ui/src/components/history/HistoryPreview.tsx
View file

@ -1,7 +1,7 @@
import { VSCodeButton } from "@vscode/webview-ui-toolkit/react"
import { useExtensionState } from "../../context/ExtensionStateContext"
import { vscode } from "../../utils/vscode"
import { memo } from "react"
import { memo, useState } from "react"
import { formatLargeNumber } from "../../utils/format"
type HistoryPreviewProps = {
@ -10,6 +10,18 @@ type HistoryPreviewProps = {
const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => {
const { taskHistory } = useExtensionState()
const [showCopyModal, setShowCopyModal] = useState(false)
const handleCopyTask = async (e: React.MouseEvent, task: string) => {
e.stopPropagation()
try {
await navigator.clipboard.writeText(task)
setShowCopyModal(true)
setTimeout(() => setShowCopyModal(false), 2000)
} catch (error) {
console.error("Failed to copy to clipboard:", error)
}
}
const handleHistorySelect = (id: string) => {
vscode.postMessage({ type: "showTaskWithId", text: id })
}
@ -31,8 +43,30 @@ const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => {
return (
<div style={{ flexShrink: 0 }}>
{showCopyModal && <div className="copy-modal">Prompt Copied to Clipboard</div>}
<style>
{`
.copy-modal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: var(--vscode-notifications-background);
color: var(--vscode-notifications-foreground);
padding: 12px 20px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
transition: opacity 0.2s ease-in-out;
}
.copy-button {
opacity: 0;
pointer-events: none;
}
.history-preview-item:hover .copy-button {
opacity: 1;
pointer-events: auto;
}
.history-preview-item {
background-color: color-mix(in srgb, var(--vscode-toolbar-hoverBackground) 65%, transparent);
border-radius: 4px;
@ -79,8 +113,8 @@ const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => {
key={item.id}
className="history-preview-item"
onClick={() => handleHistorySelect(item.id)}>
<div style={{ padding: "12px" }}>
<div style={{ marginBottom: "8px" }}>
<div style={{ padding: "12px", position: "relative" }}>
<div style={{ marginBottom: "8px", display: "flex", justifyContent: "space-between", alignItems: "center" }}>
<span
style={{
color: "var(--vscode-descriptionForeground)",
@ -90,6 +124,13 @@ const HistoryPreview = ({ showHistoryView }: HistoryPreviewProps) => {
}}>
{formatDate(item.ts)}
</span>
<button
title="Copy Prompt"
className="copy-button"
data-appearance="icon"
onClick={(e) => handleCopyTask(e, item.task)}>
<span className="codicon codicon-copy"></span>
</button>
</div>
<div
style={{