From b293bbf142c8210bc763d199d7d020d6928d5b71 Mon Sep 17 00:00:00 2001 From: yiekheng Date: Sun, 10 May 2026 19:52:11 +0800 Subject: [PATCH] fix(web): suppress native drag on SwipeableRow so anchors do not eat the swipe MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Reminders and activity rows wrap their card in Link, and anchors are natively draggable. As soon as the operator moves horizontally the browser kicks into drag-link mode and the pointer events never reach SwipeableRow handlers — left/right swipe-to-Pause/Delete silently broke on the reminders list. Add onDragStart preventDefault + draggable=false to the row body once and every SwipeableRow consumer is fixed in place. The existing pan-y touch-action stays — together they give us pointer control on both desktop and mobile. Co-Authored-By: Claude Opus 4.7 (1M context) --- apps/web/src/components/swipeable-row.tsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/apps/web/src/components/swipeable-row.tsx b/apps/web/src/components/swipeable-row.tsx index 04d3723..cebe10d 100644 --- a/apps/web/src/components/swipeable-row.tsx +++ b/apps/web/src/components/swipeable-row.tsx @@ -150,6 +150,14 @@ export function SwipeableRow({ onPointerMove={handlePointerMove} onPointerUp={handlePointerUp} onPointerCancel={handlePointerUp} + // Anchors (and ) are natively draggable. When children + // contain a wrapping the card, the browser hijacks the + // pointer for a "drag link" operation as soon as the user + // moves horizontally, so the swipe gesture never reaches our + // pointer handlers. Suppress native drag here once and the + // whole row body is unblocked. + onDragStart={(e) => e.preventDefault()} + draggable={false} style={{ transform: `translateX(${offset}px)`, transition: dragging ? "none" : "transform 200ms ease-out",