fix: persist edit warning dialog preference during session

This change fixes the issue where the edit warning dialog appears on every edit, even after the user has already seen it once. The solution:

1. Uses a React ref to store the preference in memory during the session
2. Bypasses the dialog if the user has already seen it
3. Adds double-click functionality to user messages for quick editing

The preference is reset when the VS Code window is reloaded, ensuring users are reminded of the warning after a restart.

Fixes: #6058

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

Author: Eric Wheeler

webview-ui/src/App.tsx

@@ -91,6 +91,9 @@ const App = () => {
 		messageTs: 0,
 	})
 
+	// Track if the user has seen the edit warning - using ref to persist across renders
+	const hasSeenEditWarningRef = useRef<boolean>(false)
+
 	const [editMessageDialogState, setEditMessageDialogState] = useState<EditMessageDialogState>({
 		isOpen: false,
 		messageTs: 0,
@@ -158,12 +161,23 @@ const App = () => {
 			}
 
 			if (message.type === "showEditMessageDialog" && message.messageTs && message.text) {
-				setEditMessageDialogState({
-					isOpen: true,
-					messageTs: message.messageTs,
-					text: message.text,
-					images: message.images || [],
-				})
+				// If the user has already seen the warning, skip the dialog and directly edit
+				if (hasSeenEditWarningRef.current) {
+					vscode.postMessage({
+						type: "editMessageConfirm",
+						messageTs: message.messageTs,
+						text: message.text,
+						images: message.images || [],
+					})
+				} else {
+					// Show the warning dialog for the first time
+					setEditMessageDialogState({
+						isOpen: true,
+						messageTs: message.messageTs,
+						text: message.text,
+						images: message.images || [],
+					})
+				}
 			}
 
 			if (message.type === "acceptInput") {
@@ -267,6 +281,8 @@ const App = () => {
 				open={editMessageDialogState.isOpen}
 				onOpenChange={(open) => setEditMessageDialogState((prev) => ({ ...prev, isOpen: open }))}
 				onConfirm={() => {
+					// Mark that the user has seen the edit warning
+					hasSeenEditWarningRef.current = true
 					vscode.postMessage({
 						type: "editMessageConfirm",
 						messageTs: editMessageDialogState.messageTs,

webview-ui/src/components/chat/ChatRow.tsx

@@ -1082,7 +1082,12 @@ export const ChatRowContent = ({
 								</div>
 							) : (
 								<div className="flex justify-between">
-									<div className="flex-grow px-2 py-1 wrap-anywhere">
+									<div
+										className="flex-grow px-2 py-1 wrap-anywhere"
+										onDoubleClick={(e) => {
+											e.stopPropagation()
+											handleEditClick()
+										}}>
 										<Mention text={message.text} withShadow />
 									</div>
 									<div className="flex">