From 20ef1e9ec4b6178ba396f1efe7f7ee3b09467e2c Mon Sep 17 00:00:00 2001
From: Jeff Emmett <jeffemmett@gmail.com>
Date: Mon, 2 Mar 2026 21:10:31 -0800
Subject: [PATCH] fix: single-click opens editor on rFunds flow nodes

Previously only double-click opened the editor/modal. Now single click
(without dragging) opens the side editor panel. Double-click still
opens rich modals for outcome/source nodes. Added drag threshold (5px)
so clicks don't accidentally start dragging.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 modules/rfunds/components/folk-funds-app.ts | 27 ++++++++++++++++++---
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/modules/rfunds/components/folk-funds-app.ts b/modules/rfunds/components/folk-funds-app.ts
index de74c26..955de5a 100644
--- a/modules/rfunds/components/folk-funds-app.ts
+++ b/modules/rfunds/components/folk-funds-app.ts
@@ -699,6 +699,9 @@ class FolkFundsApp extends HTMLElement {
 		});
 
 		// Global pointer move/up (for both panning and node drag)
+		let nodeDragStarted = false;
+		const DRAG_THRESHOLD = 5;
+
 		this._boundPointerMove = (e: PointerEvent) => {
 			if (this.wiringActive && this.wiringDragging) {
 				this.wiringPointerX = e.clientX;
@@ -713,8 +716,16 @@ class FolkFundsApp extends HTMLElement {
 				return;
 			}
 			if (this.draggingNodeId) {
-				const dx = (e.clientX - this.dragStartX) / this.canvasZoom;
-				const dy = (e.clientY - this.dragStartY) / this.canvasZoom;
+				const rawDx = e.clientX - this.dragStartX;
+				const rawDy = e.clientY - this.dragStartY;
+				// Only start visual drag after exceeding threshold
+				if (!nodeDragStarted) {
+					if (Math.abs(rawDx) < DRAG_THRESHOLD && Math.abs(rawDy) < DRAG_THRESHOLD) return;
+					nodeDragStarted = true;
+					svg.classList.add("dragging");
+				}
+				const dx = rawDx / this.canvasZoom;
+				const dy = rawDy / this.canvasZoom;
 				const node = this.nodes.find((n) => n.id === this.draggingNodeId);
 				if (node) {
 					node.position.x = this.dragNodeStartX + dx;
@@ -744,8 +755,16 @@ class FolkFundsApp extends HTMLElement {
 				svg.classList.remove("panning");
 			}
 			if (this.draggingNodeId) {
+				const clickedNodeId = this.draggingNodeId;
+				const wasDragged = nodeDragStarted;
 				this.draggingNodeId = null;
+				nodeDragStarted = false;
 				svg.classList.remove("dragging");
+
+				// If it was a click (no drag), open the editor
+				if (!wasDragged) {
+					this.openEditor(clickedNodeId);
+				}
 			}
 		};
 		svg.addEventListener("pointermove", this._boundPointerMove);
@@ -803,13 +822,13 @@ class FolkFundsApp extends HTMLElement {
 				this.selectedNodeId = nodeId;
 				this.updateSelectionHighlight();
 
-				// Start drag
+				// Prepare drag (but don't start until threshold exceeded)
+				nodeDragStarted = false;
 				this.draggingNodeId = nodeId;
 				this.dragStartX = e.clientX;
 				this.dragStartY = e.clientY;
 				this.dragNodeStartX = node.position.x;
 				this.dragNodeStartY = node.position.y;
-				svg.classList.add("dragging");
 				svg.setPointerCapture(e.pointerId);
 			});