From 1887e3a3866adc3523efd80f344c1eef97d131c1 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Mon, 3 Aug 2026 10:41:44 -0700
Subject: [PATCH 01/30] feat(web): swipe session rows to archive or delete on
 touch
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add a configurable horizontal swipe gesture on left-panel session rows for
touch devices. Each direction (left/right) maps to an action — archive,
delete, or none — persisted per-device and set from Settings → Appearance.

Swipe→archive reuses the kebab's stop-then-archive handler; swipe→delete
opens the same confirm dialog the kebab uses, so delete is never immediate.
The gesture locks by axis and yields to dnd-kit's long-press drag, leaving
drag-to-file-into-project unaffected.

The whole row — link, session-state badge, and pin/kebab controls — lives on
one translating surface, so trailing icons travel with the text instead of
the text sliding out from under them. Swipe-only markup and the opaque
row background are gated on an in-progress swipe, so a row at rest renders
exactly as it did before the gesture existed.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/lib/swipeActionPreferences.test.ts | 148 ++++++
 web/src/lib/swipeActionPreferences.ts      | 124 +++++
 web/src/pages/SettingsPage.tsx             |  79 +++
 web/src/shell/Sidebar.rowActions.test.tsx  | 261 ++++++++-
 web/src/shell/Sidebar.tsx                  | 588 ++++++++++++++++-----
 5 files changed, 1054 insertions(+), 146 deletions(-)
 create mode 100644 web/src/lib/swipeActionPreferences.test.ts
 create mode 100644 web/src/lib/swipeActionPreferences.ts

diff --git a/web/src/lib/swipeActionPreferences.test.ts b/web/src/lib/swipeActionPreferences.test.ts
new file mode 100644
index 0000000000..625c9176da
--- /dev/null
+++ b/web/src/lib/swipeActionPreferences.test.ts
@@ -0,0 +1,148 @@
+import { act, cleanup, renderHook } from "@testing-library/react";
+import { afterEach, describe, expect, it } from "vitest";
+import {
+  DEFAULT_SWIPE_ACTIONS,
+  isSwipeAction,
+  normalizeSwipeActions,
+  readSwipeActions,
+  useSwipeActions,
+  writeSwipeActions,
+} from "./swipeActionPreferences";
+
+const STORAGE_KEY = "omnigent:swipe-actions";
+
+afterEach(() => {
+  cleanup();
+  localStorage.clear();
+});
+
+describe("swipeActionPreferences — read/write", () => {
+  it("returns the defaults when nothing is stored", () => {
+    expect(readSwipeActions()).toEqual(DEFAULT_SWIPE_ACTIONS);
+    expect(localStorage.getItem(STORAGE_KEY)).toBeNull();
+  });
+
+  it("round-trips a written preference", () => {
+    writeSwipeActions({ left: "delete", right: "archive" });
+    expect(readSwipeActions()).toEqual({ left: "delete", right: "archive" });
+    expect(JSON.parse(localStorage.getItem(STORAGE_KEY)!)).toEqual({
+      left: "delete",
+      right: "archive",
+    });
+  });
+
+  it("allows both directions to map to the same action", () => {
+    writeSwipeActions({ left: "archive", right: "archive" });
+    expect(readSwipeActions()).toEqual({ left: "archive", right: "archive" });
+  });
+
+  it("persists a 'none' direction", () => {
+    writeSwipeActions({ left: "none", right: "delete" });
+    expect(readSwipeActions()).toEqual({ left: "none", right: "delete" });
+  });
+});
+
+describe("isSwipeAction", () => {
+  it("accepts the known actions and rejects everything else", () => {
+    expect(isSwipeAction("archive")).toBe(true);
+    expect(isSwipeAction("delete")).toBe(true);
+    expect(isSwipeAction("none")).toBe(true);
+    expect(isSwipeAction("bogus")).toBe(false);
+    expect(isSwipeAction(null)).toBe(false);
+    expect(isSwipeAction(undefined)).toBe(false);
+    expect(isSwipeAction(42)).toBe(false);
+  });
+});
+
+describe("normalizeSwipeActions", () => {
+  it("passes through a valid object", () => {
+    expect(normalizeSwipeActions({ left: "delete", right: "none" })).toEqual({
+      left: "delete",
+      right: "none",
+    });
+  });
+
+  it("fills missing/unknown directions from the defaults", () => {
+    expect(normalizeSwipeActions({ left: "delete" })).toEqual({
+      left: "delete",
+      right: DEFAULT_SWIPE_ACTIONS.right,
+    });
+    expect(normalizeSwipeActions({ left: "bogus", right: "archive" })).toEqual({
+      left: DEFAULT_SWIPE_ACTIONS.left,
+      right: "archive",
+    });
+  });
+
+  it("maps null, arrays, and primitives to the defaults", () => {
+    expect(normalizeSwipeActions(null)).toEqual(DEFAULT_SWIPE_ACTIONS);
+    expect(normalizeSwipeActions("nope")).toEqual(DEFAULT_SWIPE_ACTIONS);
+    expect(normalizeSwipeActions(123)).toEqual(DEFAULT_SWIPE_ACTIONS);
+    expect(normalizeSwipeActions([])).toEqual(DEFAULT_SWIPE_ACTIONS);
+  });
+});
+
+describe("readSwipeActions — corrupt storage", () => {
+  it("falls back to the defaults on unparseable JSON", () => {
+    localStorage.setItem(STORAGE_KEY, "{not json");
+    expect(readSwipeActions()).toEqual(DEFAULT_SWIPE_ACTIONS);
+  });
+
+  it("normalizes a partially-valid stored object", () => {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ left: "delete", right: "bogus" }));
+    expect(readSwipeActions()).toEqual({ left: "delete", right: DEFAULT_SWIPE_ACTIONS.right });
+  });
+});
+
+describe("useSwipeActions — live updates", () => {
+  it("starts at the current stored value", () => {
+    writeSwipeActions({ left: "delete", right: "archive" });
+    const { result } = renderHook(() => useSwipeActions());
+    expect(result.current).toEqual({ left: "delete", right: "archive" });
+  });
+
+  it("re-renders on a same-tab write (Settings change updates mounted rows)", () => {
+    const { result } = renderHook(() => useSwipeActions());
+    expect(result.current).toEqual(DEFAULT_SWIPE_ACTIONS);
+
+    act(() => {
+      writeSwipeActions({ left: "delete", right: "delete" });
+    });
+    expect(result.current).toEqual({ left: "delete", right: "delete" });
+  });
+
+  it("re-renders on a cross-tab storage event", () => {
+    const { result } = renderHook(() => useSwipeActions());
+
+    // Another tab wrote the new value; simulate the DOM `storage` broadcast.
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ left: "none", right: "archive" }));
+    act(() => {
+      window.dispatchEvent(new StorageEvent("storage", { key: STORAGE_KEY }));
+    });
+    expect(result.current).toEqual({ left: "none", right: "archive" });
+  });
+
+  it("ignores storage events for unrelated keys", () => {
+    const { result } = renderHook(() => useSwipeActions());
+    const before = result.current;
+
+    localStorage.setItem("some:other:key", "x");
+    act(() => {
+      window.dispatchEvent(new StorageEvent("storage", { key: "some:other:key" }));
+    });
+    // Same reference — no spurious re-render/value change.
+    expect(result.current).toBe(before);
+  });
+
+  it("keeps a stable snapshot reference when the value is unchanged", () => {
+    writeSwipeActions({ left: "archive", right: "delete" });
+    const { result } = renderHook(() => useSwipeActions());
+    const first = result.current;
+
+    // A write of the identical value still pings subscribers; the value must
+    // stay referentially stable so consumers don't needlessly re-run effects.
+    act(() => {
+      writeSwipeActions({ left: "archive", right: "delete" });
+    });
+    expect(result.current).toBe(first);
+  });
+});
diff --git a/web/src/lib/swipeActionPreferences.ts b/web/src/lib/swipeActionPreferences.ts
new file mode 100644
index 0000000000..35eb2f2a54
--- /dev/null
+++ b/web/src/lib/swipeActionPreferences.ts
@@ -0,0 +1,124 @@
+// Persisted, per-device preference for what a horizontal swipe on a session
+// row does on touch devices. Two independent directions — swipe-left and
+// swipe-right — each map to an action. Modeled after the other `*Preferences`
+// helpers: a localStorage-backed value, SSR-safe reads, and writes that swallow
+// quota/access errors so a corrupt entry can't break app boot.
+//
+// Unlike the simpler helpers this one also exposes a live subscription
+// (useSwipeActions): Settings and every mounted session row read one source, so
+// changing the preference updates open rows in the same session without a
+// reload. writeSwipeActions notifies same-tab subscribers; a `storage` listener
+// covers other tabs.
+//
+// Defaults mirror a phone mail app: swipe-left archives (the common tidy-away
+// gesture), swipe-right is inert. Both directions may map to the SAME action —
+// nothing prevents e.g. archiving on either side.
+
+import { useSyncExternalStore } from "react";
+
+const STORAGE_KEY = "omnigent:swipe-actions";
+// Same-tab change signal. The DOM `storage` event only fires in OTHER tabs, so
+// writeSwipeActions dispatches this to refresh subscribers in the writing tab.
+const SWIPE_ACTIONS_EVENT = "omnigent:swipe-actions-changed";
+
+export const swipeActions = ["archive", "delete", "none"] as const;
+export type SwipeAction = (typeof swipeActions)[number];
+
+export type SwipeDirection = "left" | "right";
+
+export interface SwipeActionPreferences {
+  left: SwipeAction;
+  right: SwipeAction;
+}
+
+/** Default: swipe-left archives, swipe-right does nothing. */
+export const DEFAULT_SWIPE_ACTIONS: SwipeActionPreferences = {
+  left: "archive",
+  right: "none",
+};
+
+/** Return whether a string is one of the selectable swipe actions. */
+export function isSwipeAction(value: unknown): value is SwipeAction {
+  return value === "archive" || value === "delete" || value === "none";
+}
+
+/**
+ * Normalize an arbitrary parsed value to a valid preferences object, filling
+ * each missing/unknown direction from {@link DEFAULT_SWIPE_ACTIONS}. Used both
+ * on read (localStorage drift / manual edits) and to sanitize writes.
+ */
+export function normalizeSwipeActions(value: unknown): SwipeActionPreferences {
+  const obj = typeof value === "object" && value !== null ? (value as Record<string, unknown>) : {};
+  return {
+    left: isSwipeAction(obj.left) ? obj.left : DEFAULT_SWIPE_ACTIONS.left,
+    right: isSwipeAction(obj.right) ? obj.right : DEFAULT_SWIPE_ACTIONS.right,
+  };
+}
+
+/**
+ * Read the persisted swipe actions. Returns the defaults when nothing is
+ * stored, on a server render (no `window`), or when the stored value is
+ * missing/malformed — never throws, so a corrupt entry can't break app boot.
+ */
+export function readSwipeActions(): SwipeActionPreferences {
+  if (typeof window === "undefined") return { ...DEFAULT_SWIPE_ACTIONS };
+  try {
+    const raw = window.localStorage.getItem(STORAGE_KEY);
+    if (!raw) return { ...DEFAULT_SWIPE_ACTIONS };
+    return normalizeSwipeActions(JSON.parse(raw));
+  } catch {
+    return { ...DEFAULT_SWIPE_ACTIONS };
+  }
+}
+
+/**
+ * Persist the swipe actions. Normalizes first so only valid values land in
+ * storage. Swallows quota/access errors so a failed write can't break the app.
+ */
+export function writeSwipeActions(value: SwipeActionPreferences): void {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(STORAGE_KEY, JSON.stringify(normalizeSwipeActions(value)));
+  } catch {
+    // localStorage quota or access errors shouldn't break the app.
+  }
+  // Refresh same-tab subscribers (the `storage` event only fires in other tabs).
+  window.dispatchEvent(new Event(SWIPE_ACTIONS_EVENT));
+}
+
+// Cached snapshot so useSyncExternalStore's getSnapshot returns a stable
+// reference between changes — a fresh object every call would loop it. Kept
+// current by getSnapshot (re-reads and swaps only on a real change), so it's
+// never stale even after a write that had no active subscriber.
+let snapshot: SwipeActionPreferences = readSwipeActions();
+
+function getSnapshot(): SwipeActionPreferences {
+  const next = readSwipeActions();
+  if (next.left !== snapshot.left || next.right !== snapshot.right) snapshot = next;
+  return snapshot;
+}
+
+function subscribe(onChange: () => void): () => void {
+  if (typeof window === "undefined") return () => {};
+  const handler = (e: Event) => {
+    // Ignore unrelated `storage` events; refresh on our key or the same-tab ping.
+    if (e instanceof StorageEvent && e.key !== null && e.key !== STORAGE_KEY) return;
+    onChange();
+  };
+  window.addEventListener("storage", handler);
+  window.addEventListener(SWIPE_ACTIONS_EVENT, handler);
+  return () => {
+    window.removeEventListener("storage", handler);
+    window.removeEventListener(SWIPE_ACTIONS_EVENT, handler);
+  };
+}
+
+/**
+ * Subscribe to the live swipe-action preference. Returns the current value and
+ * re-renders on same-tab writes (via writeSwipeActions) and cross-tab `storage`
+ * events, so Settings and every mounted session row share one source of truth.
+ * SSR-safe: renders the defaults on the server.
+ */
+export function useSwipeActions(): SwipeActionPreferences {
+  return useSyncExternalStore(subscribe, getSnapshot, () => DEFAULT_SWIPE_ACTIONS);
+}
diff --git a/web/src/pages/SettingsPage.tsx b/web/src/pages/SettingsPage.tsx
index 1289576409..0ec13fdcd1 100644
--- a/web/src/pages/SettingsPage.tsx
+++ b/web/src/pages/SettingsPage.tsx
@@ -143,6 +143,14 @@ import {
   readHideUnconfiguredHarnesses,
   writeHideUnconfiguredHarnesses,
 } from "@/lib/harnessVisibilityPreferences";
+import {
+  isSwipeAction,
+  type SwipeAction,
+  swipeActions as swipeActionOptions,
+  type SwipeDirection,
+  useSwipeActions,
+  writeSwipeActions,
+} from "@/lib/swipeActionPreferences";
 import {
   applyThemePalette,
   DEFAULT_PALETTE,
@@ -823,6 +831,75 @@ function HideUnconfiguredHarnessesControl() {
   );
 }
 
+const SWIPE_ACTION_LABELS: Record<SwipeAction, string> = {
+  archive: "Archive",
+  delete: "Delete",
+  none: "None",
+};
+
+/**
+ * Per-device swipe-action preference for session rows on touch devices. Two
+ * selects — one per direction — each mapping a horizontal swipe to Archive,
+ * Delete, or None. Both directions may map to the same action. Delete stays
+ * behind the row's confirm dialog; None makes that direction inert.
+ */
+function SwipeActionsControl() {
+  // Live subscription so the selects reflect writes from anywhere (other tabs,
+  // and the shared source every session row reads). writeSwipeActions notifies.
+  const actions = useSwipeActions();
+  const labelId = useId();
+
+  const choose = useCallback(
+    (direction: SwipeDirection, next: SwipeAction) => {
+      writeSwipeActions({ ...actions, [direction]: next });
+    },
+    [actions],
+  );
+
+  return (
+    <ThemeSubsection
+      labelId={labelId}
+      title="Swipe actions"
+      helper="On touch devices, swipe a session row horizontally to run an action. Delete still asks to confirm."
+    >
+      <div className="flex flex-col gap-3">
+        {(["left", "right"] as const).map((direction) => (
+          <div key={direction} className="flex items-center justify-between gap-4">
+            <span className="text-sm">
+              Swipe {direction} <span aria-hidden>→</span>
+            </span>
+            <Select
+              value={actions[direction]}
+              onValueChange={(next: string) => {
+                if (isSwipeAction(next)) choose(direction, next);
+              }}
+            >
+              <SelectTrigger
+                aria-label={`Swipe ${direction} action`}
+                data-testid={`swipe-action-${direction}`}
+                className="w-40"
+              >
+                <SelectValue>{SWIPE_ACTION_LABELS[actions[direction]]}</SelectValue>
+              </SelectTrigger>
+              <SelectContent>
+                {swipeActionOptions.map((action) => (
+                  <SelectItem
+                    key={action}
+                    value={action}
+                    data-testid={`swipe-action-${direction}-${action}`}
+                  >
+                    {SWIPE_ACTION_LABELS[action]}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+        ))}
+      </div>
+    </ThemeSubsection>
+  );
+}
+
 function AppearanceSection() {
   // Embedded: the host owns light/dark, so the Mode and Color theme pickers
   // would be no-ops — hide them and say so (matching ThemeModeMenu). Terminal
@@ -914,6 +991,8 @@ function AppearanceSection() {
 
         <HideUnconfiguredHarnessesControl />
 
+        <SwipeActionsControl />
+
         <UiFontSizeControl />
 
         <UiFontFamilyControl />
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index c16aa3c77e..61aa6d6be6 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -6,9 +6,17 @@
 //      `onDoubleClick`), gated on edit permission.
 // See ConversationRow / ConversationEditRow in Sidebar.tsx.
 
-import { useSyncExternalStore } from "react";
+import { type PointerEvent as ReactPointerEvent, useSyncExternalStore } from "react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { cleanup, fireEvent, render, screen, within } from "@testing-library/react";
+import {
+  act,
+  cleanup,
+  fireEvent,
+  render,
+  renderHook,
+  screen,
+  within,
+} from "@testing-library/react";
 import { MemoryRouter, Route, Routes } from "react-router-dom";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { TooltipProvider } from "@/components/ui/tooltip";
@@ -52,6 +60,13 @@ const mocks = vi.hoisted(() => {
     moveToProject: { mutate: vi.fn() },
     conversations: [] as unknown[],
     pinnedStore,
+    // Archive + stop mutations, so the swipe tests can assert the swipe→archive
+    // path drives the same stop→archive handler the kebab uses.
+    archive: { mutate: vi.fn() },
+    stopSession: { mutate: vi.fn() },
+    // Stop-and-delete, so the swipe→delete test can assert the row deletes only
+    // after the confirm dialog is accepted.
+    del: { mutate: vi.fn(), reset: vi.fn() },
   };
 });
 
@@ -66,8 +81,8 @@ vi.mock("@/hooks/useConversations", () => ({
   useConversations: vi.fn(),
   useConnectedConversations: () => [],
   useStopAndDeleteConversation: () => ({
-    mutate: vi.fn(),
-    reset: vi.fn(),
+    mutate: mocks.del.mutate,
+    reset: mocks.del.reset,
     isPending: false,
     isError: false,
     variables: undefined,
@@ -92,11 +107,11 @@ vi.mock("@/hooks/useConversations", () => ({
   setConversationPinned: vi.fn(() => Promise.resolve({})),
   PINNED_CONVERSATIONS_KEY: ["pinned-conversations"],
   useRenameConversation: () => mocks.rename,
-  useArchiveConversation: () => ({ mutate: vi.fn() }),
+  useArchiveConversation: () => mocks.archive,
   useBulkArchiveConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
   useBulkDeleteConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
   useBulkStopSessions: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
-  useStopSession: () => ({ mutate: vi.fn() }),
+  useStopSession: () => mocks.stopSession,
   useProjects: () => ({ data: mocks.projects.map((name: string) => ({ id: `p_${name}`, name })) }),
   // A non-empty `useProjects` renders a project folder, which queries its
   // sessions — return the collapsed (disabled) shape so the folder is inert
@@ -132,7 +147,8 @@ vi.mock("@/lib/serverOrigin", () => ({ isCurrentServerLocal: () => false }));
 
 import { type Conversation, useConversations } from "@/hooks/useConversations";
 import { resetReadStateForTests, seedReadState } from "@/hooks/useUnseenConversations";
-import { Sidebar } from "./Sidebar";
+import { writeSwipeActions } from "@/lib/swipeActionPreferences";
+import { Sidebar, useRowSwipe } from "./Sidebar";
 
 const useConvMock = vi.mocked(useConversations);
 
@@ -234,6 +250,24 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
 beforeEach(() => {
   mocks.rename.mutate.mockReset();
   mocks.moveToProject.mutate.mockReset();
+  // Resolve archive callbacks synchronously so the transient "Archiving…"
+  // status row settles back to the interactive row within the test.
+  mocks.archive.mutate.mockReset();
+  mocks.archive.mutate.mockImplementation(
+    (_args: unknown, opts?: { onSuccess?: () => void; onSettled?: () => void }) => {
+      opts?.onSuccess?.();
+      opts?.onSettled?.();
+    },
+  );
+  // The stop that precedes archiving (runArchive) fires its `onSettled` once
+  // the runner stop resolves; invoke it synchronously so the follow-on
+  // archive.mutate runs in tests.
+  mocks.stopSession.mutate.mockReset();
+  mocks.stopSession.mutate.mockImplementation((_id: string, opts?: { onSettled?: () => void }) => {
+    opts?.onSettled?.();
+  });
+  mocks.del.mutate.mockReset();
+  mocks.del.reset.mockReset();
   mocks.projects = [];
   // Default every test to the desktop viewport; the mobile flyout test opts in.
   mocks.isMobile = false;
@@ -908,6 +942,219 @@ describe("right-click context menu", () => {
   });
 });
 
+describe("touch swipe actions", () => {
+  // jsdom has no real touch, so drive the gesture with pointer events. The row
+  // handlers gate on a primary, non-mouse pointer (see useRowSwipe); default
+  // jsdom PointerEvents omit those, so set them explicitly. A swipe is a
+  // down → horizontal move past the commit threshold → up on the row's <li>.
+  const POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
+
+  function swipeRow(dx: number) {
+    const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
+    fireEvent.pointerDown(li, { ...POINTER, clientX: 100, clientY: 100 });
+    // First move locks the axis; the second carries it past the commit point.
+    fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + Math.sign(dx) * 20, clientY: 100 });
+    fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
+    fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
+  }
+
+  it("runs the archive path when swiping the archive-configured direction", () => {
+    // Default: swipe-left → archive. Swipe left past the commit threshold.
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(-90);
+
+    // runArchive stops the runner first, then flips the archive flag — the same
+    // stop→archive handler the kebab's Archive item uses.
+    expect(mocks.stopSession.mutate).toHaveBeenCalledWith("conv_1", expect.anything());
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+    // Archive never routes through delete.
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+  });
+
+  it("opens the delete confirm dialog (no immediate delete) when swiping the delete direction", () => {
+    // Map swipe-right → delete, then swipe right.
+    writeSwipeActions({ left: "archive", right: "delete" });
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(90);
+
+    // The confirm dialog opens — delete stays behind it, so no mutation yet.
+    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+
+    // Confirming in the dialog fires the same delete the kebab flow uses.
+    fireEvent.click(screen.getByRole("button", { name: "Delete" }));
+    expect(mocks.del.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", deleteBranch: false },
+      expect.anything(),
+    );
+  });
+
+  it("does nothing when swiping a direction mapped to none", () => {
+    // Default: swipe-right → none. Swipe right; nothing should fire.
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(90);
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByText("Delete conversation?")).toBeNull();
+  });
+
+  it("supports both directions mapped to the same action", () => {
+    // Both directions archive — a swipe either way runs the archive path.
+    writeSwipeActions({ left: "archive", right: "archive" });
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(90);
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+
+    mocks.archive.mutate.mockClear();
+    swipeRow(-90);
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+  });
+
+  it("does not fire the action for a short swipe below the commit threshold", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    // Past the activation lock (20px) but short of the commit distance (72px).
+    swipeRow(-40);
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+  });
+
+  it("ignores swipes on desktop (non-touch viewport)", () => {
+    // Desktop (default isMobile=false) leaves the gesture disabled entirely.
+    renderSidebar();
+
+    swipeRow(-90);
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+  });
+
+  it("ignores non-touch pointers (pen/stylus/mouse) on mobile", () => {
+    // The gesture is touch-only; a pen swipe past the threshold must not fire.
+    mocks.isMobile = true;
+    renderSidebar();
+
+    const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
+    const pen = { pointerId: 1, isPrimary: true, pointerType: "pen" as const };
+    fireEvent.pointerDown(li, { ...pen, clientX: 100, clientY: 100 });
+    fireEvent.pointerMove(li, { ...pen, clientX: 120, clientY: 100 });
+    fireEvent.pointerMove(li, { ...pen, clientX: 190, clientY: 100 });
+    fireEvent.pointerUp(li, { ...pen, clientX: 190, clientY: 100 });
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+  });
+
+  it("yields a primarily-vertical drag to scroll (no action)", () => {
+    // A mostly-vertical move is scroll intent — the gesture bails and never
+    // fires, even though it travels well past the commit distance horizontally.
+    mocks.isMobile = true;
+    renderSidebar();
+
+    const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
+    fireEvent.pointerDown(li, { ...POINTER, clientX: 100, clientY: 100 });
+    // First move is dominated by the vertical axis → decided="other".
+    fireEvent.pointerMove(li, { ...POINTER, clientX: 105, clientY: 140 });
+    fireEvent.pointerMove(li, { ...POINTER, clientX: 10, clientY: 180 });
+    fireEvent.pointerUp(li, { ...POINTER, clientX: 10, clientY: 180 });
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+  });
+});
+
+describe("useRowSwipe — dnd coexistence", () => {
+  // Focused hook tests: driving real dnd-kit dragging in jsdom is unreliable,
+  // so control `isDragging` directly to prove the swipe yields to the drag.
+  const ACTIONS = { left: "archive", right: "none" } as const;
+
+  function makePointer(over: { pointerId: number; clientX: number; clientY: number }) {
+    // Minimal ReactPointerEvent stand-in — only the fields useRowSwipe reads,
+    // plus pointer-capture no-ops (jsdom's are stubbed in test-setup).
+    return {
+      pointerType: "touch",
+      isPrimary: true,
+      preventDefault: () => {},
+      currentTarget: {
+        setPointerCapture: () => {},
+        releasePointerCapture: () => {},
+        hasPointerCapture: () => false,
+      },
+      ...over,
+    } as unknown as ReactPointerEvent;
+  }
+
+  it("(a) yields a primarily-vertical move: decided=other, no translate, no action", () => {
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    act(() => {
+      // Vertical dominates → the gesture hands off to scroll/drag.
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 105, clientY: 140 }));
+    });
+    // No translate offset accumulated.
+    expect(result.current.dx).toBe(0);
+
+    act(() => {
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 105, clientY: 140 }));
+    });
+    expect(onAction).not.toHaveBeenCalled();
+  });
+
+  it("(b) bails once a dnd-kit drag begins mid-gesture: dx resets, no action on release", () => {
+    const onAction = vi.fn();
+    let isDragging = false;
+    const { result, rerender } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    act(() => {
+      // A real horizontal swipe left (the archive-configured direction) locks
+      // in and translates the row.
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 70, clientY: 100 }));
+    });
+    expect(result.current.dx).not.toBe(0);
+
+    // dnd-kit's long-press drag activates; re-render with isDragging=true.
+    isDragging = true;
+    rerender();
+    act(() => {
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 20, clientY: 100 }));
+    });
+    // The swipe bailed: translate snaps back to rest.
+    expect(result.current.dx).toBe(0);
+
+    act(() => {
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 20, clientY: 100 }));
+    });
+    expect(onAction).not.toHaveBeenCalled();
+  });
+});
+
 describe("sharing kill switch", () => {
   it("disables the row's Share item for a manager when sharing_mode is off", () => {
     // CONV is owner-level (permission_level null → canManage), yet a server
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 2c9890aedf..6cb1210582 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3,6 +3,7 @@ import {
   type CSSProperties,
   type KeyboardEvent,
   type MouseEvent,
+  type PointerEvent as ReactPointerEvent,
   type ReactNode,
   type RefObject,
   createContext,
@@ -149,6 +150,12 @@ import {
   useUnseenTick,
 } from "@/hooks/useUnseenConversations";
 import { cn } from "@/lib/utils";
+import {
+  type SwipeAction,
+  type SwipeActionPreferences,
+  useSwipeActions,
+} from "@/lib/swipeActionPreferences";
+import { useCoarsePointer } from "@/hooks/useCoarsePointer";
 import { useIsMobileViewport } from "@/hooks/useIsMobileViewport";
 import { useResizableSidebar } from "@/hooks/useResizableSidebar";
 import { useSessionSwitchHotkey } from "@/hooks/useSessionSwitchHotkey";
@@ -179,6 +186,190 @@ import { SIDEBAR_ROW } from "./sidebarStyles";
 const SESSION_STATE_SLOT_CLASS =
   "-translate-y-1/2 pointer-events-none absolute top-1/2 right-[4.5rem] flex h-5 items-center transition-opacity md:right-1 md:group-hover:opacity-0 md:group-has-[:focus-visible]:opacity-0 md:group-has-[[aria-expanded=true]]:opacity-0";
 
+// Horizontal-swipe thresholds for the mobile row gesture (see useRowSwipe).
+// ACTIVATE locks the gesture to a swipe once horizontal travel dominates;
+// COMMIT is how far the row must be dragged to fire the action on release.
+const SWIPE_ACTIVATE_PX = 12;
+const SWIPE_COMMIT_PX = 72;
+// Cap the visual translate a little past the commit point so the row can't be
+// dragged clear across the panel.
+const SWIPE_MAX_PX = 96;
+// Past the commit point the row only keeps a third of further travel, so the
+// gesture resists instead of dragging the title out of the panel — the action is
+// already armed there, so extra movement carries no meaning.
+const SWIPE_RESIST = 1 / 3;
+
+/**
+ * Map raw finger travel to the row's visual offset: 1:1 up to the commit point,
+ * then damped and hard-capped at {@link SWIPE_MAX_PX}. Keeps the title inside
+ * the panel while still acknowledging a longer drag.
+ */
+function swipeOffset(deltaX: number): number {
+  const dir = Math.sign(deltaX);
+  const travel = Math.abs(deltaX);
+  if (travel <= SWIPE_COMMIT_PX) return deltaX;
+  const damped = SWIPE_COMMIT_PX + (travel - SWIPE_COMMIT_PX) * SWIPE_RESIST;
+  return dir * Math.min(damped, SWIPE_MAX_PX);
+}
+
+/** The configured action for a horizontal offset's direction (0 → "none"). */
+function actionFor(deltaX: number, actions: SwipeActionPreferences): SwipeAction {
+  if (deltaX === 0) return "none";
+  return deltaX < 0 ? actions.left : actions.right;
+}
+
+/**
+ * Touch swipe gesture for a session row. Tracks a horizontal drag and, on
+ * release past {@link SWIPE_COMMIT_PX}, invokes the action configured for that
+ * direction (see swipeActionPreferences). Disambiguates from dnd-kit's
+ * drag-to-project by axis (vertical movement yields to scroll/drag) and by
+ * bailing once a dnd-kit drag is active. A direction mapped to "none" is inert.
+ *
+ * Returns the live translate offset (for the row transform + reveal hint) and
+ * pointer/click handlers to spread on the row element. The click-capture
+ * handler swallows the click some browsers still synthesize after the drag, so
+ * a swipe never also navigates into the session.
+ */
+export function useRowSwipe({
+  enabled,
+  actions,
+  isDragging,
+  onAction,
+}: {
+  enabled: boolean;
+  actions: SwipeActionPreferences;
+  isDragging: boolean;
+  onAction: (action: Exclude<SwipeAction, "none">) => void;
+}) {
+  const [dx, setDx] = useState(0);
+  // `decided` is null until the first qualifying move locks the gesture to a
+  // horizontal swipe ("swipe") or hands it back to scroll/drag ("other").
+  // `target` holds the element we called setPointerCapture on, so reset() can
+  // release it (capture lives on the translating row surface; a leak would
+  // interfere with adjacent rows and the dnd-kit handoff).
+  // `offset` mirrors the rendered `dx` but updates synchronously, so release
+  // commits on where the finger actually ended rather than on whatever render
+  // last landed — a fast flick can otherwise lift before React commits the
+  // final move, and the action would be decided from a stale offset.
+  const state = useRef<{
+    pointerId: number;
+    startX: number;
+    startY: number;
+    decided: "swipe" | "other" | null;
+    target: Element | null;
+    offset: number;
+  } | null>(null);
+  // True for the tick after a beyond-slop swipe released, so the click-capture
+  // handler can swallow the trailing click (pointer-capture + preventDefault
+  // behavior varies across mobile browsers — don't rely on it).
+  const justSwipedRef = useRef(false);
+
+  const reset = useCallback(() => {
+    const s = state.current;
+    // Release pointer capture if we took it — guarded so it's safe when we
+    // never captured (vertical/none gestures) or the element is already gone.
+    if (s?.target && s.target.hasPointerCapture(s.pointerId)) {
+      s.target.releasePointerCapture(s.pointerId);
+    }
+    state.current = null;
+    setDx(0);
+  }, []);
+
+  const onPointerDown = useCallback(
+    (e: ReactPointerEvent) => {
+      // Touch-only: pen/stylus/mouse never trigger a swipe.
+      if (!enabled || e.pointerType !== "touch" || !e.isPrimary) return;
+      // The row's dialogs/menus are React children but render into portals, and
+      // React bubbles portal events up the component tree — so a drag inside the
+      // open delete dialog would otherwise start a swipe on the row behind it.
+      // Portal content is not a DOM descendant, so containment rejects it.
+      const target = e.target;
+      if (target instanceof Node && !e.currentTarget.contains(target)) return;
+      state.current = {
+        pointerId: e.pointerId,
+        startX: e.clientX,
+        startY: e.clientY,
+        decided: null,
+        target: null,
+        offset: 0,
+      };
+    },
+    [enabled],
+  );
+
+  const onPointerMove = useCallback(
+    (e: ReactPointerEvent) => {
+      const s = state.current;
+      if (!s || s.pointerId !== e.pointerId) return;
+      // Once dnd-kit takes over (long-press drag), the swipe yields entirely.
+      if (isDragging) {
+        s.decided = "other";
+        s.offset = 0;
+        setDx(0);
+        return;
+      }
+      if (s.decided === "other") return;
+      const deltaX = e.clientX - s.startX;
+      const deltaY = e.clientY - s.startY;
+      if (s.decided === null) {
+        // Vertical intent → let the list scroll; horizontal → lock to a swipe.
+        if (Math.abs(deltaY) > Math.abs(deltaX) && Math.abs(deltaY) > SWIPE_ACTIVATE_PX) {
+          s.decided = "other";
+          return;
+        }
+        if (Math.abs(deltaX) < SWIPE_ACTIVATE_PX || Math.abs(deltaX) <= Math.abs(deltaY)) return;
+        // A direction mapped to "none" is inert — hand back to scroll/drag.
+        if (actionFor(deltaX, actions) === "none") {
+          s.decided = "other";
+          return;
+        }
+        s.decided = "swipe";
+        s.target = e.currentTarget;
+        e.currentTarget.setPointerCapture(e.pointerId);
+      }
+      e.preventDefault();
+      // A reversal into a direction mapped to "none" rests at 0 instead of
+      // sliding the row over bare canvas with no hint behind it.
+      const offset = actionFor(deltaX, actions) === "none" ? 0 : swipeOffset(deltaX);
+      s.offset = offset;
+      setDx(offset);
+    },
+    [actions, isDragging],
+  );
+
+  const onPointerUp = useCallback(
+    (e: ReactPointerEvent) => {
+      const s = state.current;
+      if (!s || s.pointerId !== e.pointerId) return;
+      // Commit off the synchronous offset, not the rendered `dx`.
+      const offset = s.offset;
+      const committed = s.decided === "swipe" && Math.abs(offset) >= SWIPE_COMMIT_PX;
+      const action = actionFor(offset, actions);
+      if (s.decided === "swipe") {
+        justSwipedRef.current = true;
+        setTimeout(() => {
+          justSwipedRef.current = false;
+        }, 0);
+      }
+      reset();
+      if (committed && action !== "none") onAction(action);
+    },
+    [actions, onAction, reset],
+  );
+
+  const onClickCapture = useCallback((e: MouseEvent) => {
+    if (!justSwipedRef.current) return;
+    // Only the trailing click on the row itself — clicks bubbling out of the
+    // row's portalled dialogs/menus are not descendants and pass through.
+    const target = e.target;
+    if (target instanceof Node && !e.currentTarget.contains(target)) return;
+    e.preventDefault();
+    e.stopPropagation();
+  }, []);
+
+  return { dx, onPointerDown, onPointerMove, onPointerUp, onPointerCancel: reset, onClickCapture };
+}
+
 // Match the Settings sidebar's ghost-button hover treatment across every home
 // sidebar row.
 const SIDEBAR_HOVER_HIGHLIGHT = "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50";
@@ -2909,6 +3100,7 @@ function ConversationRow({
   // project flyout's HoverCard and leave it lingering over the chat. Gate the
   // flyout off below the `md` breakpoint (see `projectFlyoutName`).
   const isMobile = useIsMobileViewport();
+  const hasCoarsePointer = useCoarsePointer();
   // Track the *live* active conversation id. Delete is fire-and-forget,
   // so the user can navigate to another conversation before the mutation
   // resolves — the onSuccess redirect must key off where they are now,
@@ -3089,6 +3281,33 @@ function ConversationRow({
   // and only a row that saw both clicks may enter rename.
   const recentClickTimesRef = useRef<number[]>([]);
 
+  // Touch swipe → archive/delete. `useSwipeActions` is a live subscription, so
+  // changing the Settings selects updates open rows in the same session (no
+  // remount needed). Gated to a coarse pointer and to editable, non-selection
+  // rows so it can't fight bulk-select. Swipe→archive reuses
+  // runArchive; swipe→delete opens the same confirm dialog the kebab uses
+  // (never an immediate delete).
+  const swipeActions = useSwipeActions();
+  // useRowSwipe accepts only touch pointers, so a touchscreen laptop's mouse
+  // path stays untouched. With both directions mapped to "none" the gesture is
+  // fully disarmed — no handlers fire and the touch-action override below is
+  // dropped, so the browser keeps its horizontal gestures.
+  const swipeEnabled =
+    hasCoarsePointer &&
+    !selectionMode &&
+    isOwner &&
+    !isEditing &&
+    (swipeActions.left !== "none" || swipeActions.right !== "none");
+  const swipe = useRowSwipe({
+    enabled: swipeEnabled,
+    actions: swipeActions,
+    isDragging,
+    onAction: (action) => {
+      if (action === "archive") runArchive();
+      else setDeleteOpen(true);
+    },
+  });
+
   if (isEditing) {
     return (
       <li>
@@ -3287,15 +3506,105 @@ function ConversationRow({
     </Link>
   );
 
+  // The action revealed behind the row for the direction currently being
+  // swiped, and whether the drag has passed the commit point (drives the hint's
+  // icon and tint). `isSwiping` gates every bit of swipe-only markup/styling, so
+  // a row at rest renders exactly as it did before the gesture existed.
+  const swipingAction: SwipeAction = actionFor(swipe.dx, swipeActions);
+  const isSwiping = swipe.dx !== 0 && swipingAction !== "none";
+  const swipeCommitted = Math.abs(swipe.dx) >= SWIPE_COMMIT_PX;
+
   return (
     // Drag props on the <li> so the whole row is grabbable; `isDragging` dims
     // it. `setRowRef` merges the drag node ref with the scroll-into-view ref.
     <li
       ref={setRowRef}
       {...dragListeners}
-      className={cn("group relative", isDragging && "opacity-40")}
+      onPointerDown={swipe.onPointerDown}
+      onPointerMove={swipe.onPointerMove}
+      onPointerUp={swipe.onPointerUp}
+      onPointerCancel={swipe.onPointerCancel}
+      onClickCapture={swipe.onClickCapture}
+      className={cn(
+        "group relative",
+        isDragging && "opacity-40",
+        // Keep vertical scrolling native while claiming the horizontal axis for
+        // the swipe: without this the browser can take the horizontal pan (or
+        // back-navigation gesture) and cancel the gesture mid-drag. Only where
+        // a swipe can actually fire, so rows without one keep default behavior.
+        swipeEnabled && "touch-pan-y",
+      )}
     >
-      {/* Right-click anywhere on the row opens the same actions as the kebab.
+      {/* Swipe reveal hint: sits behind the moving surface, showing the
+          configured action's icon on the side being revealed. Inert (no pointer
+          events) and only rendered mid-swipe, so at rest the row markup is
+          exactly what it was before the gesture existed.
+          Archive uses the accent pair (blue in both modes) rather than
+          `--primary`, which is near-black in light mode and reads as a flat grey
+          button instead of a revealed surface. Passing the commit threshold
+          deepens the tint and scales the glyph, so "will fire on release" isn't
+          carried by color alone. */}
+      {isSwiping && (
+        <div
+          aria-hidden
+          className={cn(
+            "pointer-events-none absolute inset-0 flex items-center rounded-[var(--radius-otto-sm)] px-4",
+            swipe.dx > 0 ? "justify-start" : "justify-end",
+            "transition-colors",
+            swipingAction === "delete"
+              ? swipeCommitted
+                ? "bg-destructive/20 text-destructive"
+                : "bg-destructive/10 text-destructive/70"
+              : swipeCommitted
+                ? "bg-accent text-accent-foreground"
+                : "bg-accent/50 text-accent-foreground/70",
+          )}
+        >
+          <span
+            className={cn(
+              "flex items-center transition-transform",
+              swipeCommitted ? "scale-110" : "scale-100",
+            )}
+          >
+            {swipingAction === "delete" ? (
+              <Trash2Icon className="size-4" />
+            ) : isArchived ? (
+              // Archiving toggles, so on an archived row the gesture restores —
+              // mirror the kebab's Unarchive glyph rather than promising a re-archive.
+              <ArchiveRestoreIcon className="size-4" />
+            ) : (
+              <ArchiveIcon className="size-4" />
+            )}
+          </span>
+        </div>
+      )}
+      {/* Moving surface: the WHOLE row — link, session-state badge, and the
+          pin/kebab controls — moves together, so the trailing icons travel with
+          the text instead of the text sliding out from under them.
+          It INSETS from the swiped edge rather than translating: a translate
+          would push the title past the panel boundary and cut it mid-word (the
+          hint needs ~48px of gap, but the title only has ~18px of slack). An
+          inset re-truncates the title with its existing ellipsis instead, and
+          keeps every row control inside the panel.
+          `bg-sidebar` only while mid-swipe: an unconditional background would
+          plate every row and cover the sidebar canvas. */}
+      <div
+        className={cn(
+          "relative",
+          isSwiping && "rounded-[var(--radius-otto-sm)] bg-sidebar",
+          // Transition only at rest, so the row eases back when the gesture
+          // ends but tracks the finger 1:1 while swiping.
+          swipe.dx === 0 && "transition-[margin] duration-200",
+        )}
+        style={
+          swipe.dx !== 0
+            ? swipe.dx < 0
+              ? { marginRight: -swipe.dx }
+              : { marginLeft: swipe.dx }
+            : undefined
+        }
+      >
+        {/* Right-click anywhere on the row opens the same actions as the kebab.
           Suppressed in selection mode (bulk-select owns the row), where the
           bare link is rendered instead. ContextMenuTrigger preventDefaults the
           native contextmenu event, so right-click never navigates; asChild
@@ -3304,10 +3613,38 @@ function ConversationRow({
           hovering surfaces the project flyout — the trigger sits innermost so
           both the context menu and the hover card keep their handlers/refs on
           the Link. */}
-      {selectionMode ? (
-        projectFlyoutName ? (
+        {selectionMode ? (
+          projectFlyoutName ? (
+            <HoverCard openDelay={150} closeDelay={0}>
+              <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
+              <PinnedProjectFlyoutContent
+                title={conversation.title ?? conversation.id}
+                projectName={projectFlyoutName}
+                gitBranch={gitBranch}
+              />
+            </HoverCard>
+          ) : isMobile ? (
+            rowLink
+          ) : (
+            <Tooltip>
+              <TooltipTrigger asChild>{rowLink}</TooltipTrigger>
+              <SessionTooltipContent conversation={conversation} hostsById={hostsById} />
+            </Tooltip>
+          )
+        ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
+            <ContextMenu>
+              <ContextMenuTrigger asChild>
+                <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
+              </ContextMenuTrigger>
+              <ContextMenuContent className="min-w-44">
+                <ConversationMenuItems
+                  components={contextBundle}
+                  setMenuOpen={() => {}}
+                  {...menuItemProps}
+                />
+              </ContextMenuContent>
+            </ContextMenu>
             <PinnedProjectFlyoutContent
               title={conversation.title ?? conversation.id}
               projectName={projectFlyoutName}
@@ -3315,19 +3652,8 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          rowLink
-        ) : (
-          <Tooltip>
-            <TooltipTrigger asChild>{rowLink}</TooltipTrigger>
-            <SessionTooltipContent conversation={conversation} hostsById={hostsById} />
-          </Tooltip>
-        )
-      ) : projectFlyoutName ? (
-        <HoverCard openDelay={150} closeDelay={0}>
           <ContextMenu>
-            <ContextMenuTrigger asChild>
-              <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
-            </ContextMenuTrigger>
+            <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
                 components={contextBundle}
@@ -3336,141 +3662,125 @@ function ConversationRow({
               />
             </ContextMenuContent>
           </ContextMenu>
-          <PinnedProjectFlyoutContent
-            title={conversation.title ?? conversation.id}
-            projectName={projectFlyoutName}
-            gitBranch={gitBranch}
-          />
-        </HoverCard>
-      ) : isMobile ? (
-        <ContextMenu>
-          <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
-          <ContextMenuContent className="min-w-44">
-            <ConversationMenuItems
-              components={contextBundle}
-              setMenuOpen={() => {}}
-              {...menuItemProps}
-            />
-          </ContextMenuContent>
-        </ContextMenu>
-      ) : (
-        <Tooltip>
-          <ContextMenu>
-            <ContextMenuTrigger asChild>
-              <div className="w-full">
-                <TooltipTrigger asChild>{rowLink}</TooltipTrigger>
-              </div>
-            </ContextMenuTrigger>
-            <ContextMenuContent className="min-w-44">
-              <ConversationMenuItems
-                components={contextBundle}
-                setMenuOpen={() => {}}
-                {...menuItemProps}
-              />
-            </ContextMenuContent>
-          </ContextMenu>
-          <SessionTooltipContent conversation={conversation} hostsById={hostsById} />
-        </Tooltip>
-      )}
-      {selectionMode ? (
-        <span className="-translate-y-1/2 pointer-events-none absolute top-1/2 left-2 flex items-center">
-          {isSelected ? (
-            <SquareCheckIcon className="size-4 text-primary" />
-          ) : (
-            <SquareIcon className="size-4 text-muted-foreground" />
-          )}
-        </span>
-      ) : sessionState !== null ? (
-        <span className={SESSION_STATE_SLOT_CLASS}>
-          <SessionStateBadge state={sessionState} />
-        </span>
-      ) : null}
-      {/* Trailing controls (pin + kebab) share one absolutely-positioned flex
-          row, so their spacing is defined once (gap-0.5) and stays aligned
-          with the project-folder header actions, which use the same pattern.
-          The kebab is the rightmost child (pinned to right-1); the pin sits a
-          gap to its left. Hidden entirely while selecting (bulk mode owns the
-          row controls). */}
-      {!selectionMode && (
-        <div className="-translate-y-1/2 absolute top-1/2 right-1 flex items-center gap-0.5">
-          {/* Archived rows omit the pin entirely: pinning is meaningless there
-              (archive outranks pin), so there's no pin action even on hover. */}
-          {!isArchived && (
-            <Button
-              type="button"
-              variant="ghost"
-              size="icon-xs"
-              aria-label={isPinned ? "Unpin conversation" : "Pin conversation"}
-              data-testid="quick-pin-conversation"
-              className={cn(
-                // Desktop-only quick affordance: hidden on mobile (the kebab's
-                // Pin item below covers that), hover/focus-revealed from `md`
-                // up. Pinned rows no longer keep a persistent pin marker, since
-                // the "Pinned" section header (and pinned-first ordering inside
-                // a project) already conveys the pinned state. Revealed glyph:
-                // unpin if pinned, pin otherwise.
-                //
-                // `md:inline-flex` (not `md:block`): the Button base is
-                // `inline-flex` and relies on it for `items-center
-                // justify-center` to center the icon. `md:block` would override
-                // that display and collapse the centering, leaving the glyph
-                // pinned to the top-left of the button — so keep the flex
-                // display when revealing it.
-                "text-muted-foreground transition-opacity",
-                "hidden md:inline-flex",
-                "md:opacity-0 md:group-hover:opacity-100",
-                "md:group-has-[:focus-visible]:opacity-100 md:group-has-[[aria-expanded=true]]:opacity-100",
-              )}
-              onClick={(e) => {
-                // Keep the toggle click off the surrounding Link (no navigation).
-                e.preventDefault();
-                e.stopPropagation();
-                onTogglePinned(conversation.id);
-              }}
-            >
-              {isPinned ? (
-                <PinOffIcon className="size-3.5" data-icon-size="14" />
-              ) : (
-                <PinIcon className="size-3.5" data-icon-size="14" />
-              )}
-            </Button>
-          )}
-          <DropdownMenu open={menuOpen} onOpenChange={setMenuOpen}>
-            <DropdownMenuTrigger asChild>
+        ) : (
+          <Tooltip>
+            <ContextMenu>
+              <ContextMenuTrigger asChild>
+                <div className="w-full">
+                  <TooltipTrigger asChild>{rowLink}</TooltipTrigger>
+                </div>
+              </ContextMenuTrigger>
+              <ContextMenuContent className="min-w-44">
+                <ConversationMenuItems
+                  components={contextBundle}
+                  setMenuOpen={() => {}}
+                  {...menuItemProps}
+                />
+              </ContextMenuContent>
+            </ContextMenu>
+            <SessionTooltipContent conversation={conversation} hostsById={hostsById} />
+          </Tooltip>
+        )}
+        {selectionMode ? (
+          <span className="-translate-y-1/2 pointer-events-none absolute top-1/2 left-2 flex items-center">
+            {isSelected ? (
+              <SquareCheckIcon className="size-4 text-primary" />
+            ) : (
+              <SquareIcon className="size-4 text-muted-foreground" />
+            )}
+          </span>
+        ) : sessionState !== null ? (
+          <span className={SESSION_STATE_SLOT_CLASS}>
+            <SessionStateBadge state={sessionState} />
+          </span>
+        ) : null}
+        {/* Trailing controls (pin + kebab) share one absolutely-positioned flex
+            row, so their spacing is defined once (gap-0.5) and stays aligned
+            with the project-folder header actions, which use the same pattern.
+            The kebab is the rightmost child (pinned to right-1); the pin sits a
+            gap to its left. Hidden entirely while selecting (bulk mode owns the
+            row controls). */}
+        {!selectionMode && (
+          <div className="-translate-y-1/2 absolute top-1/2 right-1 flex items-center gap-0.5">
+            {/* Archived rows omit the pin entirely: pinning is meaningless there
+                (archive outranks pin), so there's no pin action even on hover. */}
+            {!isArchived && (
               <Button
                 type="button"
                 variant="ghost"
                 size="icon-xs"
-                aria-label="Conversation actions"
-                data-testid="conversation-actions"
-                // On mobile (no hover state) it's always visible. On desktop it
-                // stays hidden until hover / keyboard focus, with `aria-expanded`
-                // keeping it surfaced while the menu is open so the trigger
-                // doesn't vanish under the cursor.
+                aria-label={isPinned ? "Unpin conversation" : "Pin conversation"}
+                data-testid="quick-pin-conversation"
                 className={cn(
+                  // Desktop-only quick affordance: hidden on mobile (the kebab's
+                  // Pin item below covers that), hover/focus-revealed from `md`
+                  // up. Pinned rows no longer keep a persistent pin marker, since
+                  // the "Pinned" section header (and pinned-first ordering inside
+                  // a project) already conveys the pinned state. Revealed glyph:
+                  // unpin if pinned, pin otherwise.
+                  //
+                  // `md:inline-flex` (not `md:block`): the Button base is
+                  // `inline-flex` and relies on it for `items-center
+                  // justify-center` to center the icon. `md:block` would override
+                  // that display and collapse the centering, leaving the glyph
+                  // pinned to the top-left of the button — so keep the flex
+                  // display when revealing it.
                   "text-muted-foreground transition-opacity",
-                  "md:opacity-0 md:group-hover:opacity-100 md:group-has-[:focus-visible]:opacity-100",
-                  "md:aria-expanded:opacity-100",
+                  "hidden md:inline-flex",
+                  "md:opacity-0 md:group-hover:opacity-100",
+                  "md:group-has-[:focus-visible]:opacity-100 md:group-has-[[aria-expanded=true]]:opacity-100",
                 )}
                 onClick={(e) => {
-                  // Keep the trigger click from bubbling into the Link.
+                  // Keep the toggle click off the surrounding Link (no navigation).
                   e.preventDefault();
                   e.stopPropagation();
+                  onTogglePinned(conversation.id);
                 }}
               >
-                <MoreHorizontalIcon className="size-3.5" data-icon-size="14" />
+                {isPinned ? (
+                  <PinOffIcon className="size-3.5" data-icon-size="14" />
+                ) : (
+                  <PinIcon className="size-3.5" data-icon-size="14" />
+                )}
               </Button>
-            </DropdownMenuTrigger>
-            <DropdownMenuContent align="end" className="min-w-44">
-              <ConversationMenuItems
-                components={dropdownBundle}
-                setMenuOpen={setMenuOpen}
-                {...menuItemProps}
-              />
-            </DropdownMenuContent>
-          </DropdownMenu>
-        </div>
-      )}
+            )}
+            <DropdownMenu open={menuOpen} onOpenChange={setMenuOpen}>
+              <DropdownMenuTrigger asChild>
+                <Button
+                  type="button"
+                  variant="ghost"
+                  size="icon-xs"
+                  aria-label="Conversation actions"
+                  data-testid="conversation-actions"
+                  // On mobile (no hover state) it's always visible. On desktop it
+                  // stays hidden until hover / keyboard focus, with `aria-expanded`
+                  // keeping it surfaced while the menu is open so the trigger
+                  // doesn't vanish under the cursor.
+                  className={cn(
+                    "text-muted-foreground transition-opacity",
+                    "md:opacity-0 md:group-hover:opacity-100 md:group-has-[:focus-visible]:opacity-100",
+                    "md:aria-expanded:opacity-100",
+                  )}
+                  onClick={(e) => {
+                    // Keep the trigger click from bubbling into the Link.
+                    e.preventDefault();
+                    e.stopPropagation();
+                  }}
+                >
+                  <MoreHorizontalIcon className="size-3.5" data-icon-size="14" />
+                </Button>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent align="end" className="min-w-44">
+                <ConversationMenuItems
+                  components={dropdownBundle}
+                  setMenuOpen={setMenuOpen}
+                  {...menuItemProps}
+                />
+              </DropdownMenuContent>
+            </DropdownMenu>
+          </div>
+        )}
+      </div>
       <PermissionsModal
         sessionId={conversation.id}
         open={shareOpen}

From e4dc44f56f86ca8a120a8af2126c719fb9fe5221 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Mon, 3 Aug 2026 10:55:47 -0700
Subject: [PATCH 02/30] fix(web): harden the row swipe gesture
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Follow-ups from review of the swipe gesture:

- Commit off a synchronously-tracked offset instead of the rendered `dx`. A
  fast flick can lift the finger before React commits the render for the final
  pointermove, so the action was decided from a stale offset — a swipe past the
  threshold could fail to fire, and one that snapped back could fire anyway.
- Claim the horizontal axis with `touch-pan-y` where a swipe can fire, so the
  browser can't take the pan (or a back-navigation gesture) and cancel the
  drag mid-swipe. Vertical scrolling stays native.
- Ignore pointerdowns that bubbled out of a portal. The row's dialogs are React
  children rendered in portals, so a drag inside the open delete dialog would
  otherwise start a swipe on the row behind it.
- Reset the swipe preference with "Reset appearance", which promises to clear
  every appearance choice.
- Transition the row transform only at rest, so it tracks the finger 1:1 while
  swiping instead of easing behind it.
- Scale the hint glyph past the commit point so the "will fire on release"
  state isn't carried by color alone.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/pages/SettingsPage.tsx            |   4 +
 web/src/shell/Sidebar.rowActions.test.tsx | 101 ++++++++++++++++++++--
 2 files changed, 97 insertions(+), 8 deletions(-)

diff --git a/web/src/pages/SettingsPage.tsx b/web/src/pages/SettingsPage.tsx
index 0ec13fdcd1..fb02bee2c8 100644
--- a/web/src/pages/SettingsPage.tsx
+++ b/web/src/pages/SettingsPage.tsx
@@ -144,6 +144,7 @@ import {
   writeHideUnconfiguredHarnesses,
 } from "@/lib/harnessVisibilityPreferences";
 import {
+  DEFAULT_SWIPE_ACTIONS,
   isSwipeAction,
   type SwipeAction,
   swipeActions as swipeActionOptions,
@@ -925,6 +926,8 @@ function AppearanceSection() {
 
     writeHideUnconfiguredHarnesses(DEFAULT_HIDE_UNCONFIGURED_HARNESSES);
 
+    writeSwipeActions(DEFAULT_SWIPE_ACTIONS);
+
     applyDesktopUiFontSize(UI_FONT_SIZE_DEFAULT);
     applyUiFontFamily(UI_FONT_FAMILY_DEFAULT);
 
@@ -947,6 +950,7 @@ function AppearanceSection() {
           "omnigent:custom-theme",
           "omnigent:default-workspace-panel",
           "omnigent:hide-unconfigured-harnesses",
+          "omnigent:swipe-actions",
         ]) {
           window.localStorage.removeItem(key);
         }
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 61aa6d6be6..8c34f72a50 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1084,18 +1084,30 @@ describe("useRowSwipe — dnd coexistence", () => {
   // so control `isDragging` directly to prove the swipe yields to the drag.
   const ACTIONS = { left: "archive", right: "none" } as const;
 
-  function makePointer(over: { pointerId: number; clientX: number; clientY: number }) {
-    // Minimal ReactPointerEvent stand-in — only the fields useRowSwipe reads,
-    // plus pointer-capture no-ops (jsdom's are stubbed in test-setup).
+  // Row stand-in: pointer-capture no-ops (jsdom's are stubbed in test-setup)
+  // plus `contains`, which the hook uses to reject events bubbling out of a
+  // portal. Defaults to containing everything (the normal in-row case).
+  const PORTAL_ROW = {
+    setPointerCapture: () => {},
+    releasePointerCapture: () => {},
+    hasPointerCapture: () => false,
+    contains: () => true,
+  };
+
+  function makePointer(over: {
+    pointerId: number;
+    clientX: number;
+    clientY: number;
+    target?: unknown;
+    currentTarget?: unknown;
+  }) {
+    // Minimal ReactPointerEvent stand-in — only the fields useRowSwipe reads.
     return {
       pointerType: "touch",
       isPrimary: true,
       preventDefault: () => {},
-      currentTarget: {
-        setPointerCapture: () => {},
-        releasePointerCapture: () => {},
-        hasPointerCapture: () => false,
-      },
+      target: document.createElement("div"),
+      currentTarget: PORTAL_ROW,
       ...over,
     } as unknown as ReactPointerEvent;
   }
@@ -1153,6 +1165,79 @@ describe("useRowSwipe — dnd coexistence", () => {
     });
     expect(onAction).not.toHaveBeenCalled();
   });
+
+  it("(c) commits a fast flick that releases before the last move renders", () => {
+    // A quick flick can lift the finger before React commits the render for the
+    // final pointermove. Release must decide on where the finger actually ended,
+    // so the move + up are dispatched inside ONE act() — no render in between.
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 200, clientY: 100 }));
+      // Lock the gesture, then travel well past the 72px commit threshold and
+      // release — all before the hook re-renders with the final offset.
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 180, clientY: 100 }));
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+
+    // -100px past the threshold in the archive-configured direction.
+    expect(onAction).toHaveBeenCalledWith("archive");
+    expect(result.current.dx).toBe(0);
+  });
+
+  it("(d) does not commit a flick that snaps back under the threshold before release", () => {
+    // The mirror case: travel past the threshold, then return under it and
+    // release, again with no render between the moves. Nothing should fire.
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 200, clientY: 100 }));
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+      // Back to only -10px: under the commit threshold at the moment of release.
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 190, clientY: 100 }));
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 190, clientY: 100 }));
+    });
+
+    expect(onAction).not.toHaveBeenCalled();
+  });
+
+  it("(e) ignores a pointerdown that bubbled out of a portal (open dialog)", () => {
+    // The row's dialogs render in portals but are React children, so their
+    // events bubble to the row's handlers. A drag inside the open delete dialog
+    // must not start a swipe on the row behind it.
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    // currentTarget is the row; target is portal content it does NOT contain.
+    const outside = document.createElement("div");
+    act(() => {
+      result.current.onPointerDown(
+        makePointer({
+          pointerId: 1,
+          clientX: 200,
+          clientY: 100,
+          target: outside,
+          currentTarget: { ...PORTAL_ROW, contains: () => false },
+        }),
+      );
+    });
+    act(() => {
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+
+    expect(result.current.dx).toBe(0);
+    expect(onAction).not.toHaveBeenCalled();
+  });
 });
 
 describe("sharing kill switch", () => {

From 5fe2ab1e51e6f2d91441f1943706b3d790ac14a6 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Mon, 3 Aug 2026 11:31:29 -0700
Subject: [PATCH 03/30] polish(web): make the swipe reveal read as a surface,
 not a button

The archive direction looked unfinished next to delete: the hint used
`bg-primary/15`, and --primary is near-black in light mode, so it rendered as
a flat grey block that read as a disabled button. It now uses the accent pair,
which is blue in both modes, and deepens its tint past the commit point.

The row also inset-slides instead of translating. A translate pushed the title
past the panel boundary, where it was cut mid-word: revealing the hint needs
~48px of gap but the title only has ~18px of slack, so clipping was inherent
to translating. Insetting from the swiped edge lets the title re-truncate with
its existing ellipsis and keeps every row control inside the panel.

Travel past the commit point is also damped to a third and hard-capped, so a
long drag resists rather than dragging the row further than the action needs.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.rowActions.test.tsx | 36 +++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 8c34f72a50..ff49355609 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1208,6 +1208,42 @@ describe("useRowSwipe — dnd coexistence", () => {
     expect(onAction).not.toHaveBeenCalled();
   });
 
+  it("(f) tracks 1:1 to the commit point, then resists so the title stays in panel", () => {
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 400, clientY: 100 }));
+    });
+    // Up to the threshold the row follows the finger exactly.
+    act(() => {
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 340, clientY: 100 }));
+    });
+    expect(result.current.dx).toBe(-60);
+
+    // Well past it, travel is damped and never exceeds the cap — so the row
+    // can't be dragged far enough to push its title out of the panel.
+    act(() => {
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    expect(Math.abs(result.current.dx)).toBeLessThanOrEqual(96);
+    expect(Math.abs(result.current.dx)).toBeGreaterThanOrEqual(72);
+
+    // A 300px drag is still capped at 96.
+    act(() => {
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    expect(result.current.dx).toBe(-96);
+
+    // Still commits — damping is visual only.
+    act(() => {
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    expect(onAction).toHaveBeenCalledWith("archive");
+  });
+
   it("(e) ignores a pointerdown that bubbled out of a portal (open dialog)", () => {
     // The row's dialogs render in portals but are React children, so their
     // events bubble to the row's handlers. A drag inside the open delete dialog

From cee23f90ff1ac036d38b3349d05237d5d619fbc7 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 06:42:02 -0700
Subject: [PATCH 04/30] test(web): match the swipe-archive test to the
 PATCH-only contract
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Archiving stopped issuing a client-side stop some time ago — the server
stops the runner once the flag commits, and a client stop would race it.
The swipe test still asserted the old stop-then-archive sequence, so it
failed against code that is behaving correctly. Assert the real
contract instead, including that no client stop fires.

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.rowActions.test.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index ff49355609..feeb849c83 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -965,13 +965,13 @@ describe("touch swipe actions", () => {
 
     swipeRow(-90);
 
-    // runArchive stops the runner first, then flips the archive flag — the same
-    // stop→archive handler the kebab's Archive item uses.
-    expect(mocks.stopSession.mutate).toHaveBeenCalledWith("conv_1", expect.anything());
+    // Archiving is a single PATCH — the server stops the runner once the flag
+    // commits, so a client-side stop would race it (see runArchive).
     expect(mocks.archive.mutate).toHaveBeenCalledWith(
       { id: "conv_1", archived: true },
       expect.anything(),
     );
+    expect(mocks.stopSession.mutate).not.toHaveBeenCalled();
     // Archive never routes through delete.
     expect(mocks.del.mutate).not.toHaveBeenCalled();
   });

From 65f6cac540c52548afa592f37a5472e370a0afa5 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 04:08:40 -0700
Subject: [PATCH 05/30] test(web): close swipe action coverage gaps

Cover the Settings direction mapping end to end, reveal/action pairing,
the exact 72px commit boundary, single dispatch, and a throwing
localStorage getter. Unrecognized stored actions now normalize to
none instead of silently arming archive.

Co-authored-by: Isaac

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/lib/swipeActionPreferences.test.ts |  30 +++-
 web/src/lib/swipeActionPreferences.ts      |  15 +-
 web/src/shell/Sidebar.rowActions.test.tsx  | 160 ++++++++++++++++++++-
 3 files changed, 193 insertions(+), 12 deletions(-)

diff --git a/web/src/lib/swipeActionPreferences.test.ts b/web/src/lib/swipeActionPreferences.test.ts
index 625c9176da..475d42c1f1 100644
--- a/web/src/lib/swipeActionPreferences.test.ts
+++ b/web/src/lib/swipeActionPreferences.test.ts
@@ -62,13 +62,16 @@ describe("normalizeSwipeActions", () => {
     });
   });
 
-  it("fills missing/unknown directions from the defaults", () => {
+  it("fills absent directions from the defaults", () => {
     expect(normalizeSwipeActions({ left: "delete" })).toEqual({
       left: "delete",
       right: DEFAULT_SWIPE_ACTIONS.right,
     });
-    expect(normalizeSwipeActions({ left: "bogus", right: "archive" })).toEqual({
-      left: DEFAULT_SWIPE_ACTIONS.left,
+  });
+
+  it("makes a present but unrecognized action inert", () => {
+    expect(normalizeSwipeActions({ left: "trash", right: "archive" })).toEqual({
+      left: "none",
       right: "archive",
     });
   });
@@ -82,6 +85,22 @@ describe("normalizeSwipeActions", () => {
 });
 
 describe("readSwipeActions — corrupt storage", () => {
+  it("returns the safe defaults when localStorage access throws", () => {
+    const descriptor = Object.getOwnPropertyDescriptor(window, "localStorage")!;
+    Object.defineProperty(window, "localStorage", {
+      configurable: true,
+      get: () => {
+        throw new DOMException("Storage is unavailable", "SecurityError");
+      },
+    });
+
+    try {
+      expect(readSwipeActions()).toEqual(DEFAULT_SWIPE_ACTIONS);
+    } finally {
+      Object.defineProperty(window, "localStorage", descriptor);
+    }
+  });
+
   it("falls back to the defaults on unparseable JSON", () => {
     localStorage.setItem(STORAGE_KEY, "{not json");
     expect(readSwipeActions()).toEqual(DEFAULT_SWIPE_ACTIONS);
@@ -91,6 +110,11 @@ describe("readSwipeActions — corrupt storage", () => {
     localStorage.setItem(STORAGE_KEY, JSON.stringify({ left: "delete", right: "bogus" }));
     expect(readSwipeActions()).toEqual({ left: "delete", right: DEFAULT_SWIPE_ACTIONS.right });
   });
+
+  it("makes an unrecognized stored action inert", () => {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ left: "trash", right: "archive" }));
+    expect(readSwipeActions()).toEqual({ left: "none", right: "archive" });
+  });
 });
 
 describe("useSwipeActions — live updates", () => {
diff --git a/web/src/lib/swipeActionPreferences.ts b/web/src/lib/swipeActionPreferences.ts
index 35eb2f2a54..6b83924c80 100644
--- a/web/src/lib/swipeActionPreferences.ts
+++ b/web/src/lib/swipeActionPreferences.ts
@@ -43,15 +43,20 @@ export function isSwipeAction(value: unknown): value is SwipeAction {
 }
 
 /**
- * Normalize an arbitrary parsed value to a valid preferences object, filling
- * each missing/unknown direction from {@link DEFAULT_SWIPE_ACTIONS}. Used both
- * on read (localStorage drift / manual edits) and to sanitize writes.
+ * Normalize an arbitrary parsed value to a valid preferences object. Missing
+ * directions use the defaults; present but unknown actions become inert.
+ * Used both on read (localStorage drift / manual edits) and to sanitize writes.
  */
 export function normalizeSwipeActions(value: unknown): SwipeActionPreferences {
   const obj = typeof value === "object" && value !== null ? (value as Record<string, unknown>) : {};
+  const normalizeDirection = (direction: SwipeDirection): SwipeAction => {
+    const action = obj[direction];
+    if (isSwipeAction(action)) return action;
+    return Object.hasOwn(obj, direction) ? "none" : DEFAULT_SWIPE_ACTIONS[direction];
+  };
   return {
-    left: isSwipeAction(obj.left) ? obj.left : DEFAULT_SWIPE_ACTIONS.left,
-    right: isSwipeAction(obj.right) ? obj.right : DEFAULT_SWIPE_ACTIONS.right,
+    left: normalizeDirection("left"),
+    right: normalizeDirection("right"),
   };
 }
 
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index feeb849c83..c6759a17d9 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -6,7 +6,11 @@
 //      `onDoubleClick`), gated on edit permission.
 // See ConversationRow / ConversationEditRow in Sidebar.tsx.
 
-import { type PointerEvent as ReactPointerEvent, useSyncExternalStore } from "react";
+import {
+  type PointerEvent as ReactPointerEvent,
+  type ReactNode,
+  useSyncExternalStore,
+} from "react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import {
   act,
@@ -145,9 +149,51 @@ vi.mock("@/components/PermissionsModal", () => ({ PermissionsModal: () => null }
 // the tabs the shared-session row actions rely on.
 vi.mock("@/lib/serverOrigin", () => ({ isCurrentServerLocal: () => false }));
 
+// Settings uses a Radix Select portal that jsdom cannot drive. Render a native
+// select so these tests can exercise the real swipe preference control.
+vi.mock("@/components/ui/select", async () => {
+  const { Children, isValidElement } = await import("react");
+  const SelectTrigger = ({ children }: { children?: ReactNode }) => children;
+  const Select = ({
+    value,
+    onValueChange,
+    children,
+  }: {
+    value: string;
+    onValueChange: (value: string) => void;
+    children: ReactNode;
+  }) => {
+    const kids = Children.toArray(children);
+    const trigger = kids.find((child) => isValidElement(child) && child.type === SelectTrigger);
+    const testId =
+      isValidElement(trigger) && trigger.props && typeof trigger.props === "object"
+        ? (trigger.props as Record<string, unknown>)["data-testid"]
+        : undefined;
+    return (
+      <select
+        data-testid={typeof testId === "string" ? testId : undefined}
+        value={value}
+        onChange={(event) => onValueChange(event.target.value)}
+      >
+        {kids.filter((child) => !(isValidElement(child) && child.type === SelectTrigger))}
+      </select>
+    );
+  };
+  return {
+    Select,
+    SelectTrigger,
+    SelectValue: () => null,
+    SelectContent: ({ children }: { children: ReactNode }) => children,
+    SelectItem: ({ value, children }: { value: string; children: ReactNode }) => (
+      <option value={value}>{typeof children === "string" ? children : value}</option>
+    ),
+  };
+});
+
 import { type Conversation, useConversations } from "@/hooks/useConversations";
 import { resetReadStateForTests, seedReadState } from "@/hooks/useUnseenConversations";
-import { writeSwipeActions } from "@/lib/swipeActionPreferences";
+import { readSwipeActions, writeSwipeActions } from "@/lib/swipeActionPreferences";
+import { SettingsPage } from "@/pages/SettingsPage";
 import { Sidebar, useRowSwipe } from "./Sidebar";
 
 const useConvMock = vi.mocked(useConversations);
@@ -247,6 +293,16 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
   return Object.assign(view, { rerenderSidebar: () => view.rerender(makeUi()) });
 }
 
+function renderAppearanceSettings() {
+  return render(
+    <TooltipProvider>
+      <MemoryRouter initialEntries={["/settings/appearance"]}>
+        <SettingsPage />
+      </MemoryRouter>
+    </TooltipProvider>,
+  );
+}
+
 beforeEach(() => {
   mocks.rename.mutate.mockReset();
   mocks.moveToProject.mutate.mockReset();
@@ -949,15 +1005,90 @@ describe("touch swipe actions", () => {
   // down → horizontal move past the commit threshold → up on the row's <li>.
   const POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
 
-  function swipeRow(dx: number) {
-    const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
+  function moveSwipeRow(dx: number) {
+    const link = screen.getByRole("link", { name: /My Session/ });
+    const li = link.closest("li")!;
     fireEvent.pointerDown(li, { ...POINTER, clientX: 100, clientY: 100 });
     // First move locks the axis; the second carries it past the commit point.
     fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + Math.sign(dx) * 20, clientY: 100 });
     fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
+    return { li, link };
+  }
+
+  function releaseSwipeRow(dx: number, row: ReturnType<typeof moveSwipeRow>) {
+    const { li, link } = row;
     fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
+    // Include the browser's trailing click so gesture and row click paths
+    // cannot double-dispatch; prevent navigation while exercising the handler.
+    link.addEventListener("click", (event) => event.preventDefault(), { once: true });
+    fireEvent.click(link);
   }
 
+  function swipeRow(dx: number) {
+    const row = moveSwipeRow(dx);
+    releaseSwipeRow(dx, row);
+  }
+
+  it("maps the Settings swipe-left selection to the row's left-swipe action", () => {
+    renderAppearanceSettings();
+    fireEvent.change(screen.getByTestId("swipe-action-left"), {
+      target: { value: "delete" },
+    });
+    expect(readSwipeActions()).toEqual({ left: "delete", right: "none" });
+
+    cleanup();
+    mocks.isMobile = true;
+    renderSidebar();
+    swipeRow(-90);
+
+    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    fireEvent.click(screen.getByRole("button", { name: "Delete" }));
+    expect(mocks.del.mutate).toHaveBeenCalledTimes(1);
+  });
+
+  it("maps the Settings swipe-right selection to the row's right-swipe action", () => {
+    renderAppearanceSettings();
+    fireEvent.change(screen.getByTestId("swipe-action-right"), {
+      target: { value: "archive" },
+    });
+    expect(readSwipeActions()).toEqual({ left: "archive", right: "archive" });
+
+    cleanup();
+    mocks.isMobile = true;
+    renderSidebar();
+    swipeRow(90);
+
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByText("Delete conversation?")).toBeNull();
+  });
+
+  it("reveals the same action that fires in both configured directions", () => {
+    writeSwipeActions({ left: "delete", right: "archive" });
+    mocks.isMobile = true;
+    renderSidebar();
+
+    const leftSwipe = moveSwipeRow(-90);
+    const leftReveal = leftSwipe.li.firstElementChild!;
+    expect(leftReveal).toHaveClass("pointer-events-none");
+    expect(leftReveal.querySelector(".lucide-trash-2")).not.toBeNull();
+    expect(leftReveal.querySelector(".lucide-archive")).toBeNull();
+    releaseSwipeRow(-90, leftSwipe);
+    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+
+    const rightSwipe = moveSwipeRow(90);
+    const rightReveal = rightSwipe.li.firstElementChild!;
+    expect(rightReveal).toHaveClass("pointer-events-none");
+    expect(rightReveal.querySelector(".lucide-archive")).not.toBeNull();
+    expect(rightReveal.querySelector(".lucide-trash-2")).toBeNull();
+    releaseSwipeRow(90, rightSwipe);
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+    expect(screen.queryByText("Delete conversation?")).toBeNull();
+  });
+
   it("runs the archive path when swiping the archive-configured direction", () => {
     // Default: swipe-left → archive. Swipe left past the commit threshold.
     mocks.isMobile = true;
@@ -971,6 +1102,7 @@ describe("touch swipe actions", () => {
       { id: "conv_1", archived: true },
       expect.anything(),
     );
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
     expect(mocks.stopSession.mutate).not.toHaveBeenCalled();
     // Archive never routes through delete.
     expect(mocks.del.mutate).not.toHaveBeenCalled();
@@ -994,6 +1126,7 @@ describe("touch swipe actions", () => {
       { id: "conv_1", deleteBranch: false },
       expect.anything(),
     );
+    expect(mocks.del.mutate).toHaveBeenCalledTimes(1);
   });
 
   it("does nothing when swiping a direction mapped to none", () => {
@@ -1037,6 +1170,24 @@ describe("touch swipe actions", () => {
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
+  it("does not fire at 71px, immediately below the commit boundary", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(-71);
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+  });
+
+  it("fires exactly once at the 72px commit boundary", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(-72);
+
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+  });
+
   it("ignores swipes on desktop (non-touch viewport)", () => {
     // Desktop (default isMobile=false) leaves the gesture disabled entirely.
     renderSidebar();
@@ -1186,6 +1337,7 @@ describe("useRowSwipe — dnd coexistence", () => {
 
     // -100px past the threshold in the archive-configured direction.
     expect(onAction).toHaveBeenCalledWith("archive");
+    expect(onAction).toHaveBeenCalledTimes(1);
     expect(result.current.dx).toBe(0);
   });
 

From 8161e3612dfc3738744efaefd5a91b49f4069039 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 05:10:01 -0700
Subject: [PATCH 06/30] refactor(web): tidy the swipe action test helpers

Fold the settings-select drive into one helper, let a held swipe release
itself instead of re-passing dx, and share the reveal icon assertions.

Co-authored-by: Isaac

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/lib/swipeActionPreferences.ts     | 11 ++-
 web/src/shell/Sidebar.rowActions.test.tsx | 88 ++++++++++++-----------
 2 files changed, 52 insertions(+), 47 deletions(-)

diff --git a/web/src/lib/swipeActionPreferences.ts b/web/src/lib/swipeActionPreferences.ts
index 6b83924c80..1784b5152c 100644
--- a/web/src/lib/swipeActionPreferences.ts
+++ b/web/src/lib/swipeActionPreferences.ts
@@ -49,15 +49,14 @@ export function isSwipeAction(value: unknown): value is SwipeAction {
  */
 export function normalizeSwipeActions(value: unknown): SwipeActionPreferences {
   const obj = typeof value === "object" && value !== null ? (value as Record<string, unknown>) : {};
-  const normalizeDirection = (direction: SwipeDirection): SwipeAction => {
+  // A direction set to something unrecognized goes inert rather than inheriting
+  // the default, which would silently arm archive on a swipe meant to be safe.
+  function actionFor(direction: SwipeDirection): SwipeAction {
     const action = obj[direction];
     if (isSwipeAction(action)) return action;
     return Object.hasOwn(obj, direction) ? "none" : DEFAULT_SWIPE_ACTIONS[direction];
-  };
-  return {
-    left: normalizeDirection("left"),
-    right: normalizeDirection("right"),
-  };
+  }
+  return { left: actionFor("left"), right: actionFor("right") };
 }
 
 /**
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index c6759a17d9..b4199fe80b 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -8,6 +8,7 @@
 
 import {
   type PointerEvent as ReactPointerEvent,
+  type ReactElement,
   type ReactNode,
   useSyncExternalStore,
 } from "react";
@@ -154,6 +155,10 @@ vi.mock("@/lib/serverOrigin", () => ({ isCurrentServerLocal: () => false }));
 vi.mock("@/components/ui/select", async () => {
   const { Children, isValidElement } = await import("react");
   const SelectTrigger = ({ children }: { children?: ReactNode }) => children;
+  // The trigger carries the data-testid the tests query for; lift it onto the
+  // native <select> and keep the trigger itself out of the option list.
+  const isTrigger = (child: ReactNode): child is ReactElement<{ "data-testid"?: string }> =>
+    isValidElement(child) && child.type === SelectTrigger;
   const Select = ({
     value,
     onValueChange,
@@ -164,18 +169,13 @@ vi.mock("@/components/ui/select", async () => {
     children: ReactNode;
   }) => {
     const kids = Children.toArray(children);
-    const trigger = kids.find((child) => isValidElement(child) && child.type === SelectTrigger);
-    const testId =
-      isValidElement(trigger) && trigger.props && typeof trigger.props === "object"
-        ? (trigger.props as Record<string, unknown>)["data-testid"]
-        : undefined;
     return (
       <select
-        data-testid={typeof testId === "string" ? testId : undefined}
+        data-testid={kids.find(isTrigger)?.props["data-testid"]}
         value={value}
         onChange={(event) => onValueChange(event.target.value)}
       >
-        {kids.filter((child) => !(isValidElement(child) && child.type === SelectTrigger))}
+        {kids.filter((child) => !isTrigger(child))}
       </select>
     );
   };
@@ -192,7 +192,12 @@ vi.mock("@/components/ui/select", async () => {
 
 import { type Conversation, useConversations } from "@/hooks/useConversations";
 import { resetReadStateForTests, seedReadState } from "@/hooks/useUnseenConversations";
-import { readSwipeActions, writeSwipeActions } from "@/lib/swipeActionPreferences";
+import {
+  readSwipeActions,
+  type SwipeAction,
+  type SwipeDirection,
+  writeSwipeActions,
+} from "@/lib/swipeActionPreferences";
 import { SettingsPage } from "@/pages/SettingsPage";
 import { Sidebar, useRowSwipe } from "./Sidebar";
 
@@ -293,14 +298,19 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
   return Object.assign(view, { rerenderSidebar: () => view.rerender(makeUi()) });
 }
 
-function renderAppearanceSettings() {
-  return render(
+// Pick an action for one direction through the real Appearance settings control
+// (the Radix Select is mocked to a native <select> above), then unmount so the
+// sidebar can render against the preference the page just wrote.
+function chooseSwipeActionInSettings(direction: SwipeDirection, action: SwipeAction) {
+  render(
     <TooltipProvider>
       <MemoryRouter initialEntries={["/settings/appearance"]}>
         <SettingsPage />
       </MemoryRouter>
     </TooltipProvider>,
   );
+  fireEvent.change(screen.getByTestId(`swipe-action-${direction}`), { target: { value: action } });
+  cleanup();
 }
 
 beforeEach(() => {
@@ -1005,6 +1015,8 @@ describe("touch swipe actions", () => {
   // down → horizontal move past the commit threshold → up on the row's <li>.
   const POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
 
+  // Drag the row and hold at `dx`, so a test can inspect the reveal mid-gesture.
+  // `release` finishes it, carrying the same dx the drag ended on.
   function moveSwipeRow(dx: number) {
     const link = screen.getByRole("link", { name: /My Session/ });
     const li = link.closest("li")!;
@@ -1012,31 +1024,35 @@ describe("touch swipe actions", () => {
     // First move locks the axis; the second carries it past the commit point.
     fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + Math.sign(dx) * 20, clientY: 100 });
     fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
-    return { li, link };
+    return {
+      li,
+      release() {
+        fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
+        // Include the browser's trailing click so gesture and row click paths
+        // cannot double-dispatch; prevent navigation while exercising the handler.
+        link.addEventListener("click", (event) => event.preventDefault(), { once: true });
+        fireEvent.click(link);
+      },
+    };
   }
 
-  function releaseSwipeRow(dx: number, row: ReturnType<typeof moveSwipeRow>) {
-    const { li, link } = row;
-    fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
-    // Include the browser's trailing click so gesture and row click paths
-    // cannot double-dispatch; prevent navigation while exercising the handler.
-    link.addEventListener("click", (event) => event.preventDefault(), { once: true });
-    fireEvent.click(link);
+  function swipeRow(dx: number) {
+    moveSwipeRow(dx).release();
   }
 
-  function swipeRow(dx: number) {
-    const row = moveSwipeRow(dx);
-    releaseSwipeRow(dx, row);
+  // The reveal sitting behind the row is inert and shows only the icon for the
+  // action that direction commits to.
+  function expectRevealIcons(li: Element, icons: { shows: string; hides: string }) {
+    const reveal = li.firstElementChild!;
+    expect(reveal).toHaveClass("pointer-events-none");
+    expect(reveal.querySelector(icons.shows)).not.toBeNull();
+    expect(reveal.querySelector(icons.hides)).toBeNull();
   }
 
   it("maps the Settings swipe-left selection to the row's left-swipe action", () => {
-    renderAppearanceSettings();
-    fireEvent.change(screen.getByTestId("swipe-action-left"), {
-      target: { value: "delete" },
-    });
+    chooseSwipeActionInSettings("left", "delete");
     expect(readSwipeActions()).toEqual({ left: "delete", right: "none" });
 
-    cleanup();
     mocks.isMobile = true;
     renderSidebar();
     swipeRow(-90);
@@ -1048,13 +1064,9 @@ describe("touch swipe actions", () => {
   });
 
   it("maps the Settings swipe-right selection to the row's right-swipe action", () => {
-    renderAppearanceSettings();
-    fireEvent.change(screen.getByTestId("swipe-action-right"), {
-      target: { value: "archive" },
-    });
+    chooseSwipeActionInSettings("right", "archive");
     expect(readSwipeActions()).toEqual({ left: "archive", right: "archive" });
 
-    cleanup();
     mocks.isMobile = true;
     renderSidebar();
     swipeRow(90);
@@ -1070,21 +1082,15 @@ describe("touch swipe actions", () => {
     renderSidebar();
 
     const leftSwipe = moveSwipeRow(-90);
-    const leftReveal = leftSwipe.li.firstElementChild!;
-    expect(leftReveal).toHaveClass("pointer-events-none");
-    expect(leftReveal.querySelector(".lucide-trash-2")).not.toBeNull();
-    expect(leftReveal.querySelector(".lucide-archive")).toBeNull();
-    releaseSwipeRow(-90, leftSwipe);
+    expectRevealIcons(leftSwipe.li, { shows: ".lucide-trash-2", hides: ".lucide-archive" });
+    leftSwipe.release();
     expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
     fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
 
     const rightSwipe = moveSwipeRow(90);
-    const rightReveal = rightSwipe.li.firstElementChild!;
-    expect(rightReveal).toHaveClass("pointer-events-none");
-    expect(rightReveal.querySelector(".lucide-archive")).not.toBeNull();
-    expect(rightReveal.querySelector(".lucide-trash-2")).toBeNull();
-    releaseSwipeRow(90, rightSwipe);
+    expectRevealIcons(rightSwipe.li, { shows: ".lucide-archive", hides: ".lucide-trash-2" });
+    rightSwipe.release();
     expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
     expect(screen.queryByText("Delete conversation?")).toBeNull();
   });

From 0af58cfe97a92d9a6f9e1d440875269e2b2643fc Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 09:44:40 -0700
Subject: [PATCH 07/30] fix(web): gate row swipes on pointer capability, not
 viewport width

An unfolded foldable or tablet is wider than the md breakpoint, so the
width gate turned swipe-to-archive/delete off on a touch device. The
gate now asks whether a coarse pointer exists (any-pointer: coarse);
useRowSwipe still accepts only touch pointers, so mouse paths are
untouched at any width.

Co-authored-by: Isaac

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useCoarsePointer.ts         | 19 +++++++
 web/src/shell/Sidebar.rowActions.test.tsx | 60 +++++++++++++----------
 2 files changed, 52 insertions(+), 27 deletions(-)
 create mode 100644 web/src/hooks/useCoarsePointer.ts

diff --git a/web/src/hooks/useCoarsePointer.ts b/web/src/hooks/useCoarsePointer.ts
new file mode 100644
index 0000000000..cb68423529
--- /dev/null
+++ b/web/src/hooks/useCoarsePointer.ts
@@ -0,0 +1,19 @@
+import { useSyncExternalStore } from "react";
+
+const COARSE_POINTER_QUERY = "(any-pointer: coarse)";
+
+function subscribe(callback: () => void): () => void {
+  if (typeof window === "undefined" || !window.matchMedia) return () => {};
+  const mql = window.matchMedia(COARSE_POINTER_QUERY);
+  mql.addEventListener("change", callback);
+  return () => mql.removeEventListener("change", callback);
+}
+
+function getSnapshot(): boolean {
+  if (typeof window === "undefined" || !window.matchMedia) return false;
+  return window.matchMedia(COARSE_POINTER_QUERY).matches;
+}
+
+export function useCoarsePointer(): boolean {
+  return useSyncExternalStore(subscribe, getSnapshot, () => false);
+}
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index b4199fe80b..1a032b6563 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -28,11 +28,8 @@ import { TooltipProvider } from "@/components/ui/tooltip";
 import type { ServerInfo } from "@/lib/capabilities";
 import { CapabilitiesProvider } from "@/lib/CapabilitiesContext";
 
-// Controllable rename mutation so the double-click test can assert the
-// committed title was forwarded to the PATCH. `isMobile` toggles the mocked
-// `useIsMobileViewport` so a test can render the row on a mobile viewport (the
-// project flyout is disabled there). Declared via vi.hoisted so the vi.mock
-// factories (hoisted above imports) can reference them.
+// Hoisted controls drive row mutations, viewport layout, and coarse-pointer
+// capability independently inside mock factories.
 const mocks = vi.hoisted(() => {
   // Tiny reactive store for the server-authoritative pinned set, so a quick-pin
   // click re-renders the sidebar (mirrors the real query's refetch). Holds ids;
@@ -59,6 +56,7 @@ const mocks = vi.hoisted(() => {
   return {
     rename: { mutate: vi.fn() },
     isMobile: false,
+    hasCoarsePointer: false,
     // Projects surfaced by the picker + the move-to-project mutation, so the
     // mobile in-place project view test can assert both the list and the pick.
     projects: [] as string[],
@@ -82,6 +80,10 @@ vi.mock("@/hooks/useIsMobileViewport", () => ({
   useIsMobileViewport: () => mocks.isMobile,
 }));
 
+vi.mock("@/hooks/useCoarsePointer", () => ({
+  useCoarsePointer: () => mocks.hasCoarsePointer,
+}));
+
 vi.mock("@/hooks/useConversations", () => ({
   useConversations: vi.fn(),
   useConnectedConversations: () => [],
@@ -335,8 +337,9 @@ beforeEach(() => {
   mocks.del.mutate.mockReset();
   mocks.del.reset.mockReset();
   mocks.projects = [];
-  // Default every test to the desktop viewport; the mobile flyout test opts in.
+  // Default to a desktop viewport with no coarse pointer; cases opt in independently.
   mocks.isMobile = false;
+  mocks.hasCoarsePointer = false;
   useConvMock.mockReset();
   localStorage.clear();
   // Reset the server pinned set between tests.
@@ -1015,6 +1018,10 @@ describe("touch swipe actions", () => {
   // down → horizontal move past the commit threshold → up on the row's <li>.
   const POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
 
+  beforeEach(() => {
+    mocks.hasCoarsePointer = true;
+  });
+
   // Drag the row and hold at `dx`, so a test can inspect the reveal mid-gesture.
   // `release` finishes it, carrying the same dx the drag ended on.
   function moveSwipeRow(dx: number) {
@@ -1053,7 +1060,6 @@ describe("touch swipe actions", () => {
     chooseSwipeActionInSettings("left", "delete");
     expect(readSwipeActions()).toEqual({ left: "delete", right: "none" });
 
-    mocks.isMobile = true;
     renderSidebar();
     swipeRow(-90);
 
@@ -1067,7 +1073,6 @@ describe("touch swipe actions", () => {
     chooseSwipeActionInSettings("right", "archive");
     expect(readSwipeActions()).toEqual({ left: "archive", right: "archive" });
 
-    mocks.isMobile = true;
     renderSidebar();
     swipeRow(90);
 
@@ -1078,7 +1083,6 @@ describe("touch swipe actions", () => {
 
   it("reveals the same action that fires in both configured directions", () => {
     writeSwipeActions({ left: "delete", right: "archive" });
-    mocks.isMobile = true;
     renderSidebar();
 
     const leftSwipe = moveSwipeRow(-90);
@@ -1097,7 +1101,6 @@ describe("touch swipe actions", () => {
 
   it("runs the archive path when swiping the archive-configured direction", () => {
     // Default: swipe-left → archive. Swipe left past the commit threshold.
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(-90);
@@ -1117,7 +1120,6 @@ describe("touch swipe actions", () => {
   it("opens the delete confirm dialog (no immediate delete) when swiping the delete direction", () => {
     // Map swipe-right → delete, then swipe right.
     writeSwipeActions({ left: "archive", right: "delete" });
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(90);
@@ -1137,7 +1139,6 @@ describe("touch swipe actions", () => {
 
   it("does nothing when swiping a direction mapped to none", () => {
     // Default: swipe-right → none. Swipe right; nothing should fire.
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(90);
@@ -1150,7 +1151,6 @@ describe("touch swipe actions", () => {
   it("supports both directions mapped to the same action", () => {
     // Both directions archive — a swipe either way runs the archive path.
     writeSwipeActions({ left: "archive", right: "archive" });
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(90);
@@ -1168,7 +1168,6 @@ describe("touch swipe actions", () => {
   });
 
   it("does not fire the action for a short swipe below the commit threshold", () => {
-    mocks.isMobile = true;
     renderSidebar();
 
     // Past the activation lock (20px) but short of the commit distance (72px).
@@ -1177,7 +1176,6 @@ describe("touch swipe actions", () => {
   });
 
   it("does not fire at 71px, immediately below the commit boundary", () => {
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(-71);
@@ -1186,7 +1184,6 @@ describe("touch swipe actions", () => {
   });
 
   it("fires exactly once at the 72px commit boundary", () => {
-    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(-72);
@@ -1194,25 +1191,35 @@ describe("touch swipe actions", () => {
     expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
   });
 
-  it("ignores swipes on desktop (non-touch viewport)", () => {
-    // Desktop (default isMobile=false) leaves the gesture disabled entirely.
+  it("commits the configured action on a wide viewport with a coarse pointer", () => {
+    expect(mocks.isMobile).toBe(false);
+    expect(mocks.hasCoarsePointer).toBe(true);
+    renderSidebar();
+
+    swipeRow(-90);
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+  });
+
+  it("ignores touch swipes when only fine pointers are available", () => {
+    mocks.hasCoarsePointer = false;
     renderSidebar();
 
     swipeRow(-90);
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("ignores non-touch pointers (pen/stylus/mouse) on mobile", () => {
-    // The gesture is touch-only; a pen swipe past the threshold must not fire.
-    mocks.isMobile = true;
+  it("ignores non-touch pointers when a coarse pointer also exists", () => {
+    // A touchscreen laptop's pen and mouse paths remain inert.
     renderSidebar();
 
     const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
-    const pen = { pointerId: 1, isPrimary: true, pointerType: "pen" as const };
-    fireEvent.pointerDown(li, { ...pen, clientX: 100, clientY: 100 });
-    fireEvent.pointerMove(li, { ...pen, clientX: 120, clientY: 100 });
-    fireEvent.pointerMove(li, { ...pen, clientX: 190, clientY: 100 });
-    fireEvent.pointerUp(li, { ...pen, clientX: 190, clientY: 100 });
+    for (const [pointerId, pointerType] of ["pen", "mouse"].entries()) {
+      const pointer = { pointerId, isPrimary: true, pointerType };
+      fireEvent.pointerDown(li, { ...pointer, clientX: 100, clientY: 100 });
+      fireEvent.pointerMove(li, { ...pointer, clientX: 120, clientY: 100 });
+      fireEvent.pointerMove(li, { ...pointer, clientX: 190, clientY: 100 });
+      fireEvent.pointerUp(li, { ...pointer, clientX: 190, clientY: 100 });
+    }
 
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
     expect(mocks.del.mutate).not.toHaveBeenCalled();
@@ -1221,7 +1228,6 @@ describe("touch swipe actions", () => {
   it("yields a primarily-vertical drag to scroll (no action)", () => {
     // A mostly-vertical move is scroll intent — the gesture bails and never
     // fires, even though it travels well past the commit distance horizontally.
-    mocks.isMobile = true;
     renderSidebar();
 
     const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;

From 021c496c22c1965aeb7dd14b730f8c1e8695f0f5 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 17:16:46 -0700
Subject: [PATCH 08/30] fix(web): harden row swipes from code review

- Suppress the trailing click after any beyond-slop swipe so a committed
  swipe can never also navigate into the session (pointer-capture +
  preventDefault behavior varies across mobile browsers). Scoped to the
  row itself so portalled dialog/menu clicks pass through.
- Mirror the row state in the swipe reveal: an archived row shows the
  unarchive glyph, since the gesture restores rather than re-archives.
- Clamp the drag offset to rest when a locked swipe reverses into a
  direction mapped to none, instead of sliding the row over bare canvas.
- Disarm the gesture (and drop the touch-pan-y override) when both
  directions are mapped to none, so the browser keeps horizontal gestures.
- Extract a shared useMediaQuery store (one native change listener per
  query) and reimplement useCoarsePointer/useIsMobileViewport on it.
- Cache the swipe-preference snapshot; refresh it on the change events
  instead of re-reading and re-parsing localStorage on every row render.
- Drop the swipeActionRef indirection: useRowSwipe already tracks
  onAction in its handler deps, so the callback is passed directly.

Tests cover the new behaviors: trailing-click suppression (asserted via
the router location, not test-side preventDefault), the archived-row
hint, the none-direction clamp, and the touch-action gating.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useCoarsePointer.ts         |  22 ++---
 web/src/hooks/useIsMobileViewport.ts      |  16 +--
 web/src/hooks/useMediaQuery.ts            |  57 +++++++++++
 web/src/lib/swipeActionPreferences.ts     |  19 +++-
 web/src/shell/Sidebar.rowActions.test.tsx | 115 +++++++++++++++++++++-
 5 files changed, 192 insertions(+), 37 deletions(-)
 create mode 100644 web/src/hooks/useMediaQuery.ts

diff --git a/web/src/hooks/useCoarsePointer.ts b/web/src/hooks/useCoarsePointer.ts
index cb68423529..542ac34c80 100644
--- a/web/src/hooks/useCoarsePointer.ts
+++ b/web/src/hooks/useCoarsePointer.ts
@@ -1,19 +1,13 @@
-import { useSyncExternalStore } from "react";
+import { useMediaQuery } from "./useMediaQuery";
 
+// `any-pointer` (not `pointer`): a touchscreen laptop's PRIMARY pointer is the
+// trackpad, but its touch digitizer should still enable touch-only affordances.
 const COARSE_POINTER_QUERY = "(any-pointer: coarse)";
 
-function subscribe(callback: () => void): () => void {
-  if (typeof window === "undefined" || !window.matchMedia) return () => {};
-  const mql = window.matchMedia(COARSE_POINTER_QUERY);
-  mql.addEventListener("change", callback);
-  return () => mql.removeEventListener("change", callback);
-}
-
-function getSnapshot(): boolean {
-  if (typeof window === "undefined" || !window.matchMedia) return false;
-  return window.matchMedia(COARSE_POINTER_QUERY).matches;
-}
-
+/**
+ * True when the device has at least one coarse (touch) pointer. Reactive and
+ * SSR-safe (`false` on the server).
+ */
 export function useCoarsePointer(): boolean {
-  return useSyncExternalStore(subscribe, getSnapshot, () => false);
+  return useMediaQuery(COARSE_POINTER_QUERY);
 }
diff --git a/web/src/hooks/useIsMobileViewport.ts b/web/src/hooks/useIsMobileViewport.ts
index 70dcbd3166..236f98442a 100644
--- a/web/src/hooks/useIsMobileViewport.ts
+++ b/web/src/hooks/useIsMobileViewport.ts
@@ -6,24 +6,12 @@
 // `max-md` side of that line to component logic that can't be expressed in
 // CSS alone (e.g. swapping a hover flyout for an in-place page on touch).
 
-import { useSyncExternalStore } from "react";
+import { useMediaQuery } from "./useMediaQuery";
 
 // Mirror Tailwind's `max-md` variant exactly so this hook stays in lockstep
 // with the `max-md:` / `md:` classes already used across the shell.
 const MOBILE_QUERY = "(max-width: 767.98px)";
 
-function subscribe(callback: () => void): () => void {
-  if (typeof window === "undefined" || !window.matchMedia) return () => {};
-  const mql = window.matchMedia(MOBILE_QUERY);
-  mql.addEventListener("change", callback);
-  return () => mql.removeEventListener("change", callback);
-}
-
-function getSnapshot(): boolean {
-  if (typeof window === "undefined" || !window.matchMedia) return false;
-  return window.matchMedia(MOBILE_QUERY).matches;
-}
-
 /**
  * True when the viewport is narrower than Tailwind's `md` breakpoint (768px)
  * — i.e. the "mobile" layout the shell's `max-md:` classes target. Reactive:
@@ -31,5 +19,5 @@ function getSnapshot(): boolean {
  * (returns `false` on the server, matching `initialSidebarOpen`).
  */
 export function useIsMobileViewport(): boolean {
-  return useSyncExternalStore(subscribe, getSnapshot, () => false);
+  return useMediaQuery(MOBILE_QUERY);
 }
diff --git a/web/src/hooks/useMediaQuery.ts b/web/src/hooks/useMediaQuery.ts
new file mode 100644
index 0000000000..1a6aa6ee5f
--- /dev/null
+++ b/web/src/hooks/useMediaQuery.ts
@@ -0,0 +1,57 @@
+// Shared reactive media-query subscription. Each distinct query string gets
+// ONE module-level MediaQueryList and one native "change" listener fanning out
+// to a shared listener set — so many subscribers (e.g. every sidebar row) cost
+// a single matchMedia registration instead of one each.
+
+import { useSyncExternalStore } from "react";
+
+interface MediaQueryStore {
+  subscribe: (onChange: () => void) => () => void;
+  getSnapshot: () => boolean;
+}
+
+const stores = new Map<string, MediaQueryStore>();
+
+function createStore(query: string): MediaQueryStore {
+  const listeners = new Set<() => void>();
+  // The native registration is created lazily (SSR-safe import) and kept for
+  // the app's lifetime; queries are static, so this never accumulates.
+  let registered = false;
+  return {
+    subscribe(onChange) {
+      if (!registered && typeof window !== "undefined" && window.matchMedia) {
+        registered = true;
+        window.matchMedia(query).addEventListener("change", () => {
+          for (const listener of listeners) listener();
+        });
+      }
+      listeners.add(onChange);
+      return () => listeners.delete(onChange);
+    },
+    getSnapshot() {
+      // Read fresh rather than off a cached MediaQueryList: `matches` is a
+      // cheap live getter, and tests stub window.matchMedia per case.
+      if (typeof window === "undefined" || !window.matchMedia) return false;
+      return window.matchMedia(query).matches;
+    },
+  };
+}
+
+function storeFor(query: string): MediaQueryStore {
+  let store = stores.get(query);
+  if (store === undefined) {
+    store = createStore(query);
+    stores.set(query, store);
+  }
+  return store;
+}
+
+/**
+ * True while `query` matches. Reactive (re-renders on change) and SSR-safe
+ * (returns `false` on the server). Subscriptions for the same query share one
+ * MediaQueryList and one native listener.
+ */
+export function useMediaQuery(query: string): boolean {
+  const store = storeFor(query);
+  return useSyncExternalStore(store.subscribe, store.getSnapshot, () => false);
+}
diff --git a/web/src/lib/swipeActionPreferences.ts b/web/src/lib/swipeActionPreferences.ts
index 1784b5152c..2cd00b6405 100644
--- a/web/src/lib/swipeActionPreferences.ts
+++ b/web/src/lib/swipeActionPreferences.ts
@@ -90,15 +90,20 @@ export function writeSwipeActions(value: SwipeActionPreferences): void {
   window.dispatchEvent(new Event(SWIPE_ACTIONS_EVENT));
 }
 
-// Cached snapshot so useSyncExternalStore's getSnapshot returns a stable
-// reference between changes — a fresh object every call would loop it. Kept
-// current by getSnapshot (re-reads and swaps only on a real change), so it's
-// never stale even after a write that had no active subscriber.
+// Cached snapshot so useSyncExternalStore's getSnapshot is a cheap identity
+// read on every render — a fresh object every call would loop it, and a
+// re-parse every call would tax every row render. Refreshed on the change
+// events and when a subscriber attaches (covering writes that happened while
+// nothing was mounted); swapped only on a real change so the reference is
+// stable between changes.
 let snapshot: SwipeActionPreferences = readSwipeActions();
 
-function getSnapshot(): SwipeActionPreferences {
+function refreshSnapshot(): void {
   const next = readSwipeActions();
   if (next.left !== snapshot.left || next.right !== snapshot.right) snapshot = next;
+}
+
+function getSnapshot(): SwipeActionPreferences {
   return snapshot;
 }
 
@@ -107,8 +112,12 @@ function subscribe(onChange: () => void): () => void {
   const handler = (e: Event) => {
     // Ignore unrelated `storage` events; refresh on our key or the same-tab ping.
     if (e instanceof StorageEvent && e.key !== null && e.key !== STORAGE_KEY) return;
+    refreshSnapshot();
     onChange();
   };
+  // Catch up on writes made while no subscriber was mounted (React re-checks
+  // the snapshot right after subscribing, so a change here still renders).
+  refreshSnapshot();
   window.addEventListener("storage", handler);
   window.addEventListener(SWIPE_ACTIONS_EVENT, handler);
   return () => {
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 1a032b6563..8eb1f73088 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -22,7 +22,7 @@ import {
   screen,
   within,
 } from "@testing-library/react";
-import { MemoryRouter, Route, Routes } from "react-router-dom";
+import { MemoryRouter, Route, Routes, useLocation } from "react-router-dom";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import type { ServerInfo } from "@/lib/capabilities";
@@ -264,6 +264,12 @@ function serverInfo(overrides: Partial<ServerInfo> = {}): ServerInfo {
   };
 }
 
+// Exposes the router's current pathname so tests can assert whether a click on
+// a row link actually navigated (e.g. the swipe suite's trailing-click guard).
+function LocationProbe() {
+  return <div data-testid="location-probe">{useLocation().pathname}</div>;
+}
+
 // `activeId` mounts the sidebar at `/c/:conversationId` (via a matching
 // Route so `useParams` populates), making that row the active one — the
 // rest of the suite renders at `/` where no row is active. `info` pins the
@@ -286,6 +292,7 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
             ) : (
               sidebar
             )}
+            <LocationProbe />
           </MemoryRouter>
         </TooltipProvider>
       </QueryClientProvider>
@@ -1035,9 +1042,8 @@ describe("touch swipe actions", () => {
       li,
       release() {
         fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
-        // Include the browser's trailing click so gesture and row click paths
-        // cannot double-dispatch; prevent navigation while exercising the handler.
-        link.addEventListener("click", (event) => event.preventDefault(), { once: true });
+        // Include the browser's trailing click, un-prevented: the row itself
+        // must suppress it (see the trailing-click tests) — never the test.
         fireEvent.click(link);
       },
     };
@@ -1137,6 +1143,77 @@ describe("touch swipe actions", () => {
     expect(mocks.del.mutate).toHaveBeenCalledTimes(1);
   });
 
+  it("suppresses the trailing click after a committed swipe so it doesn't navigate", () => {
+    // Browsers can synthesize a click on the row link after the drag; the
+    // row's click-capture guard must swallow it (no test-side preventDefault),
+    // or a swipe-to-archive would also open the session it just archived.
+    renderSidebar();
+    expect(screen.getByTestId("location-probe")).toHaveTextContent("/");
+
+    swipeRow(-90);
+
+    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+    expect(screen.getByTestId("location-probe")).toHaveTextContent(/^\/$/);
+  });
+
+  it("suppresses the trailing click after a below-threshold swipe as well", () => {
+    // Even an uncommitted (beyond-slop) swipe is a drag, not a tap — its
+    // trailing click must not navigate either.
+    renderSidebar();
+
+    swipeRow(-40);
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(screen.getByTestId("location-probe")).toHaveTextContent(/^\/$/);
+  });
+
+  it("keeps a plain tap navigating (the suppression is scoped to swipes)", () => {
+    renderSidebar();
+
+    fireEvent.click(screen.getByRole("link", { name: /My Session/ }));
+
+    expect(screen.getByTestId("location-probe")).toHaveTextContent("/c/conv_1");
+  });
+
+  it("shows the unarchive glyph when swiping an archived row", () => {
+    // runArchive toggles, so on an archived row the gesture restores the
+    // session — the reveal must mirror the kebab's Unarchive affordance, not
+    // promise a re-archive.
+    mockConversations([{ ...CONV, archived: true }]);
+    renderSidebar();
+    fireEvent.pointerDown(screen.getByTestId("session-filter"), {
+      button: 0,
+      ctrlKey: false,
+      pointerType: "mouse",
+    });
+    fireEvent.click(screen.getByTestId("session-filter-archived"));
+
+    const swipe = moveSwipeRow(-90);
+    expectRevealIcons(swipe.li, {
+      shows: ".lucide-archive-restore",
+      hides: ".lucide-archive",
+    });
+    swipe.release();
+
+    // Releasing runs the same toggle the kebab's Unarchive item uses.
+    expect(mocks.archive.mutate).toHaveBeenCalledWith({ id: "conv_1", archived: false });
+  });
+
+  it("claims the horizontal touch axis only while a swipe action is configured", () => {
+    // With an action armed, the row must override touch-action so the browser
+    // doesn't take the horizontal pan mid-gesture...
+    const { unmount } = renderSidebar();
+    const li = () => screen.getByRole("link", { name: /My Session/ }).closest("li")!;
+    expect(li()).toHaveClass("touch-pan-y");
+    unmount();
+
+    // ...but with BOTH directions inert there is no gesture to protect, so the
+    // override is dropped and the browser keeps its own horizontal gestures.
+    writeSwipeActions({ left: "none", right: "none" });
+    renderSidebar();
+    expect(li()).not.toHaveClass("touch-pan-y");
+  });
+
   it("does nothing when swiping a direction mapped to none", () => {
     // Default: swipe-right → none. Swipe right; nothing should fire.
     renderSidebar();
@@ -1408,6 +1485,36 @@ describe("useRowSwipe — dnd coexistence", () => {
     expect(onAction).toHaveBeenCalledWith("archive");
   });
 
+  it("(g) rests at 0 when a locked swipe reverses into a direction mapped to none", () => {
+    // ACTIONS maps right to "none": a swipe locked going left that overshoots
+    // back past its origin must clamp at rest, not slide the row rightward over
+    // bare canvas with no hint behind it (release there already no-ops).
+    const onAction = vi.fn();
+    const { result } = renderHook(() =>
+      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
+    });
+    act(() => {
+      // Lock the gesture leftward (the archive direction).
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 70, clientY: 100 }));
+    });
+    expect(result.current.dx).toBe(-30);
+
+    act(() => {
+      // Reverse well past the origin into the inert right direction.
+      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 150, clientY: 100 }));
+    });
+    expect(result.current.dx).toBe(0);
+
+    act(() => {
+      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 150, clientY: 100 }));
+    });
+    expect(onAction).not.toHaveBeenCalled();
+  });
+
   it("(e) ignores a pointerdown that bubbled out of a portal (open dialog)", () => {
     // The row's dialogs render in portals but are React children, so their
     // events bubble to the row's handlers. A drag inside the open delete dialog

From c3894a3e459a98cdec229ad30026d1ff56ad2a40 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 17:37:25 -0700
Subject: [PATCH 09/30] refactor(web): share swipe-store fan-out and direction
 mapping

One module-level listener pair feeds all swipe-preference subscribers
(the useMediaQuery shape) instead of two window listeners per row, and
actionFor() centralizes the offset-direction -> configured-action map
that was spelled out in four places. Collapse a duplicated damping-test
step to a single hard-cap assertion.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/lib/swipeActionPreferences.ts     | 35 +++++++++++++++--------
 web/src/shell/Sidebar.rowActions.test.tsx | 11 ++-----
 2 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/web/src/lib/swipeActionPreferences.ts b/web/src/lib/swipeActionPreferences.ts
index 2cd00b6405..13a4c139df 100644
--- a/web/src/lib/swipeActionPreferences.ts
+++ b/web/src/lib/swipeActionPreferences.ts
@@ -107,22 +107,33 @@ function getSnapshot(): SwipeActionPreferences {
   return snapshot;
 }
 
+// One module-level window listener pair fanning out to a shared set (the
+// useMediaQuery shape): N mounted rows cost one registration, not 2N.
+const listeners = new Set<() => void>();
+
+function handleChange(e: Event): void {
+  // Ignore unrelated `storage` events; refresh on our key or the same-tab ping.
+  if (e instanceof StorageEvent && e.key !== null && e.key !== STORAGE_KEY) return;
+  refreshSnapshot();
+  for (const listener of listeners) listener();
+}
+
 function subscribe(onChange: () => void): () => void {
   if (typeof window === "undefined") return () => {};
-  const handler = (e: Event) => {
-    // Ignore unrelated `storage` events; refresh on our key or the same-tab ping.
-    if (e instanceof StorageEvent && e.key !== null && e.key !== STORAGE_KEY) return;
+  if (listeners.size === 0) {
+    window.addEventListener("storage", handleChange);
+    window.addEventListener(SWIPE_ACTIONS_EVENT, handleChange);
+    // Catch up on writes made while no subscriber was mounted (React re-checks
+    // the snapshot right after subscribing, so a change here still renders).
     refreshSnapshot();
-    onChange();
-  };
-  // Catch up on writes made while no subscriber was mounted (React re-checks
-  // the snapshot right after subscribing, so a change here still renders).
-  refreshSnapshot();
-  window.addEventListener("storage", handler);
-  window.addEventListener(SWIPE_ACTIONS_EVENT, handler);
+  }
+  listeners.add(onChange);
   return () => {
-    window.removeEventListener("storage", handler);
-    window.removeEventListener(SWIPE_ACTIONS_EVENT, handler);
+    listeners.delete(onChange);
+    if (listeners.size === 0) {
+      window.removeEventListener("storage", handleChange);
+      window.removeEventListener(SWIPE_ACTIONS_EVENT, handleChange);
+    }
   };
 }
 
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 8eb1f73088..12bb767d0c 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1464,15 +1464,8 @@ describe("useRowSwipe — dnd coexistence", () => {
     });
     expect(result.current.dx).toBe(-60);
 
-    // Well past it, travel is damped and never exceeds the cap — so the row
-    // can't be dragged far enough to push its title out of the panel.
-    act(() => {
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    expect(Math.abs(result.current.dx)).toBeLessThanOrEqual(96);
-    expect(Math.abs(result.current.dx)).toBeGreaterThanOrEqual(72);
-
-    // A 300px drag is still capped at 96.
+    // A 300px drag is damped and hard-capped — the row can't be dragged far
+    // enough to push its title out of the panel.
     act(() => {
       result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
     });

From 34080c03d6a4f646b6ee114bd1c6e4056aa15a6f Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 11:13:25 -0700
Subject: [PATCH 10/30] fix(web): suppress session menu during touch drag

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../sessions/test_sidebar_session_gestures.py | 222 ++++++++++++++++++
 web/src/shell/Sidebar.rowActions.test.tsx     |  43 ++++
 web/src/shell/Sidebar.tsx                     |  32 ++-
 3 files changed, 294 insertions(+), 3 deletions(-)
 create mode 100644 tests/e2e_ui/sessions/test_sidebar_session_gestures.py

diff --git a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
new file mode 100644
index 0000000000..bce9dbb8ec
--- /dev/null
+++ b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
@@ -0,0 +1,222 @@
+"""Browser e2e coverage for touch gestures on draggable session rows.
+
+The sidebar uses dnd-kit for touch dragging and Radix for its context menu.
+These tests drive Chromium through CDP so the page receives a genuine touch
+sequence; synthetic pointer events do not arm dnd-kit's ``TouchSensor``.
+"""
+
+from __future__ import annotations
+
+import re
+import uuid
+
+import httpx
+from playwright.sync_api import Browser, Locator, Page, expect
+
+
+_MOBILE_VIEWPORT = {"width": 390, "height": 844}
+
+
+def _set_title(base_url: str, session_id: str, title: str) -> None:
+    """Give the test session a unique, visible sidebar label."""
+    response = httpx.patch(
+        f"{base_url}/v1/sessions/{session_id}",
+        json={"title": title},
+        timeout=10.0,
+    )
+    response.raise_for_status()
+
+
+def _create_project(base_url: str, name: str) -> None:
+    """Create an empty project for a drag target."""
+    response = httpx.post(f"{base_url}/v1/projects", json={"name": name}, timeout=10.0)
+    response.raise_for_status()
+
+
+def _row_link(page: Page, session_id: str) -> Locator:
+    """Locate the sidebar link for ``session_id``."""
+    return page.locator(f'a[href="/c/{session_id}"]')
+
+
+def _section(page: Page, title: str) -> Locator:
+    """Locate the sidebar section headed by ``title``."""
+    return page.locator("section").filter(
+        has=page.get_by_role("button", name=title, exact=True)
+    )
+
+
+def test_touch_drag_does_not_open_session_context_menu(
+    browser: Browser,
+    seeded_session: tuple[str, str],
+) -> None:
+    """A still touch activates drag without opening Radix's menu over it."""
+    base_url, session_id = seeded_session
+    title = f"e2e-touch-drag-{uuid.uuid4().hex[:8]}"
+    _set_title(base_url, session_id, title)
+
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
+    try:
+        page = context.new_page()
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
+        link = _row_link(page, session_id)
+        expect(link).to_be_visible()
+        row = link.locator("xpath=ancestor::li[1]")
+        box = link.bounding_box()
+        assert box is not None, "session row has no touchable bounding box"
+        x = box["x"] + box["width"] / 2
+        y = box["y"] + box["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
+            )
+
+            # dnd-kit's unchanged 250ms delay must activate the row first.
+            expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
+
+            # Hold past Radix's ~700ms timer while the drag remains active.
+            page.wait_for_timeout(550)
+            expect(row).to_have_class(re.compile(r"\bopacity-40\b"))
+            expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+        finally:
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+            cdp.detach()
+    finally:
+        context.close()
+
+
+def test_vertical_touch_scroll_still_works_on_session_row(
+    browser: Browser,
+    seeded_session: tuple[str, str],
+) -> None:
+    """Moving before the hold delay scrolls the sidebar instead of dragging."""
+    base_url, session_id = seeded_session
+    _set_title(base_url, session_id, f"e2e-touch-scroll-{uuid.uuid4().hex[:8]}")
+
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
+    try:
+        page = context.new_page()
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
+        link = _row_link(page, session_id)
+        expect(link).to_be_visible()
+        row = link.locator("xpath=ancestor::li[1]")
+        scroll_area = page.locator("aside nav")
+        conversation_list = page.get_by_test_id("sidebar-conversation-list")
+
+        # One seeded row does not naturally overflow. Extend the real list's
+        # layout so Chromium has native scroll range without adding fake rows.
+        conversation_list.evaluate("element => { element.style.minHeight = '1800px'; }")
+        scroll_area.evaluate("element => { element.scrollTop = 0; }")
+        assert scroll_area.evaluate("element => element.scrollHeight > element.clientHeight")
+
+        box = link.bounding_box()
+        assert box is not None, "session row has no touchable bounding box"
+        x = box["x"] + box["width"] / 2
+        y = box["y"] + box["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
+            )
+            for offset in (20, 45, 70, 95, 120):
+                cdp.send(
+                    "Input.dispatchTouchEvent",
+                    {"type": "touchMove", "touchPoints": [{"x": x, "y": y - offset}]},
+                )
+                page.wait_for_timeout(20)
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+        finally:
+            cdp.detach()
+
+        page.wait_for_function(
+            "element => element.scrollTop > 20",
+            arg=scroll_area.element_handle(),
+        )
+        assert "opacity-40" not in (row.get_attribute("class") or "")
+        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+    finally:
+        context.close()
+
+
+def test_touch_drag_moves_session_into_project(
+    browser: Browser,
+    seeded_session: tuple[str, str],
+) -> None:
+    """A touch drag still drops the session into a project folder."""
+    base_url, session_id = seeded_session
+    _set_title(base_url, session_id, f"e2e-touch-drop-{uuid.uuid4().hex[:8]}")
+    project = f"Project {uuid.uuid4().hex[:6]}"
+    _create_project(base_url, project)
+
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
+    try:
+        page = context.new_page()
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
+        link = _row_link(page, session_id)
+        header = page.get_by_role("button", name=project, exact=True)
+        expect(link).to_be_visible()
+        expect(header).to_be_visible()
+        row = link.locator("xpath=ancestor::li[1]")
+
+        source = link.bounding_box()
+        target = header.bounding_box()
+        assert source is not None, "session row has no touchable bounding box"
+        assert target is not None, "project header has no droppable bounding box"
+        start_x = source["x"] + source["width"] / 2
+        start_y = source["y"] + source["height"] / 2
+        end_x = target["x"] + target["width"] / 2
+        end_y = target["y"] + target["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {
+                    "type": "touchStart",
+                    "touchPoints": [{"x": start_x, "y": start_y}],
+                },
+            )
+            expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
+
+            for step in range(1, 6):
+                progress = step / 5
+                cdp.send(
+                    "Input.dispatchTouchEvent",
+                    {
+                        "type": "touchMove",
+                        "touchPoints": [
+                            {
+                                "x": start_x + (end_x - start_x) * progress,
+                                "y": start_y + (end_y - start_y) * progress,
+                            }
+                        ],
+                    },
+                )
+                page.wait_for_timeout(20)
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+        finally:
+            cdp.detach()
+
+        expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
+        expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
+    finally:
+        context.close()
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 12bb767d0c..78c5121077 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -12,6 +12,7 @@ import {
   type ReactNode,
   useSyncExternalStore,
 } from "react";
+import type * as DndKitCore from "@dnd-kit/core";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import {
   act,
@@ -62,6 +63,7 @@ const mocks = vi.hoisted(() => {
     projects: [] as string[],
     moveToProject: { mutate: vi.fn() },
     conversations: [] as unknown[],
+    isDragging: false,
     pinnedStore,
     // Archive + stop mutations, so the swipe tests can assert the swipe→archive
     // path drives the same stop→archive handler the kebab uses.
@@ -73,6 +75,17 @@ const mocks = vi.hoisted(() => {
   };
 });
 
+vi.mock("@dnd-kit/core", async (importOriginal) => {
+  const actual = await importOriginal<typeof DndKitCore>();
+  return {
+    ...actual,
+    useDraggable: (args: Parameters<typeof actual.useDraggable>[0]) => ({
+      ...actual.useDraggable(args),
+      isDragging: mocks.isDragging,
+    }),
+  };
+});
+
 // Mock the mobile-viewport hook — jsdom doesn't evaluate media queries, so
 // drive it explicitly. Defaults to desktop (false); the mobile flyout test
 // flips `mocks.isMobile` for the duration of that case.
@@ -344,6 +357,7 @@ beforeEach(() => {
   mocks.del.mutate.mockReset();
   mocks.del.reset.mockReset();
   mocks.projects = [];
+  mocks.isDragging = false;
   // Default to a desktop viewport with no coarse pointer; cases opt in independently.
   mocks.isMobile = false;
   mocks.hasCoarsePointer = false;
@@ -874,6 +888,35 @@ describe("mark as unread", () => {
 });
 
 describe("right-click context menu", () => {
+  it("suppresses an open request only while the session row is dragging", () => {
+    mocks.isMobile = true;
+    mocks.isDragging = true;
+    const view = renderSidebar();
+
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+
+    // Live drag state clears with the gesture; no suppression flag survives to
+    // swallow the next legitimate right-click.
+    mocks.isDragging = false;
+    view.rerenderSidebar();
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+  });
+
+  it("opens the context menu from the keyboard after a drag ends", () => {
+    mocks.isMobile = true;
+    mocks.isDragging = true;
+    const view = renderSidebar();
+
+    mocks.isDragging = false;
+    view.rerenderSidebar();
+
+    // Shift+F10 / Menu key emit contextmenu with no preceding pointerdown.
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+  });
+
   it("opens the same action items as the kebab and drives the same handlers", () => {
     renderSidebar();
 
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 6cb1210582..7cdce0d099 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3251,6 +3251,32 @@ function ConversationRow({
     data: { type: "session", label, project: currentProject, isPinned },
     disabled: !isOwner || selectionMode || isArchived || isEditing,
   });
+  // Radix and dnd-kit run independent long-press timers. Once this row's
+  // touch drag is active, reject Radix's later open request for that gesture.
+  const [contextMenuOpen, setContextMenuOpen] = useState(false);
+  const handleContextMenuOpenChange = useCallback(
+    (open: boolean) => {
+      if (open && isDragging) return;
+      setContextMenuOpen(open);
+    },
+    [isDragging],
+  );
+  // The menu render branches below are mutually exclusive; switching branches
+  // remounts the ContextMenu, and a stale open=true would reopen the fresh
+  // menu anchored at the viewport corner. Reset during render (not in an
+  // effect) so the remounted menu never paints open.
+  const menuBranch = selectionMode
+    ? "none"
+    : projectFlyoutName
+      ? "flyout"
+      : isMobile
+        ? "mobile"
+        : "desktop";
+  const [prevMenuBranch, setPrevMenuBranch] = useState(menuBranch);
+  if (prevMenuBranch !== menuBranch) {
+    setPrevMenuBranch(menuBranch);
+    if (contextMenuOpen) setContextMenuOpen(false);
+  }
   // A drag ends with a synthetic click on the row's <Link> (mousedown + mouseup
   // on the same anchor still fires a click); swallow that one click so a drag
   // doesn't also navigate into the session. Flagged when a drag finishes,
@@ -3633,7 +3659,7 @@ function ConversationRow({
           )
         ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <ContextMenu>
+            <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
               </ContextMenuTrigger>
@@ -3652,7 +3678,7 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          <ContextMenu>
+          <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
             <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
@@ -3664,7 +3690,7 @@ function ConversationRow({
           </ContextMenu>
         ) : (
           <Tooltip>
-            <ContextMenu>
+            <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <div className="w-full">
                   <TooltipTrigger asChild>{rowLink}</TooltipTrigger>

From 3c5b53b527577342b8ec95012a98b0abb7be5ddf Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 11:55:42 -0700
Subject: [PATCH 11/30] test(web): strengthen session gesture coverage

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../sessions/test_sidebar_session_gestures.py | 26 +++++++++++++++----
 1 file changed, 21 insertions(+), 5 deletions(-)

diff --git a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
index bce9dbb8ec..71a7a72684 100644
--- a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
+++ b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
@@ -13,7 +13,6 @@
 import httpx
 from playwright.sync_api import Browser, Locator, Page, expect
 
-
 _MOBILE_VIEWPORT = {"width": 390, "height": 844}
 
 
@@ -40,9 +39,7 @@ def _row_link(page: Page, session_id: str) -> Locator:
 
 def _section(page: Page, title: str) -> Locator:
     """Locate the sidebar section headed by ``title``."""
-    return page.locator("section").filter(
-        has=page.get_by_role("button", name=title, exact=True)
-    )
+    return page.locator("section").filter(has=page.get_by_role("button", name=title, exact=True))
 
 
 def test_touch_drag_does_not_open_session_context_menu(
@@ -145,6 +142,7 @@ def test_vertical_touch_scroll_still_works_on_session_row(
         page.wait_for_function(
             "element => element.scrollTop > 20",
             arg=scroll_area.element_handle(),
+            timeout=3_000,
         )
         assert "opacity-40" not in (row.get_attribute("class") or "")
         expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
@@ -212,11 +210,29 @@ def test_touch_drag_moves_session_into_project(
                     },
                 )
                 page.wait_for_timeout(20)
-            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+            with page.expect_response(
+                lambda response: (
+                    response.request.method == "PATCH"
+                    and response.url.endswith(f"/v1/sessions/{session_id}")
+                ),
+                timeout=5_000,
+            ) as move_response:
+                cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+            assert move_response.value.ok, "server rejected the project membership update"
         finally:
             cdp.detach()
 
         expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
         expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
+
+        # A full navigation drops the optimistic React Query state. Re-checking
+        # after reload proves the server persisted the project membership.
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+        reloaded_header = page.get_by_role("button", name=project, exact=True)
+        expect(reloaded_header).to_be_visible()
+        if reloaded_header.get_attribute("aria-expanded") != "true":
+            reloaded_header.click()
+        expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
+        expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
     finally:
         context.close()

From dbcdb9fcd7bdf03401a3a18bcb9cd8f20324488e Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Thu, 6 Aug 2026 05:22:47 -0700
Subject: [PATCH 12/30] fix(web): address review findings on session row
 gesture suppression

- Reset the shared context-menu open state when the row's render branch
  changes, so a remounted ContextMenu can't reopen anchored at (0,0)
- Drop the isDraggingRef mirror; a [isDragging]-dep callback is enough
- DRY the e2e touch tests with a touch_page fixture plus _touch/_center
  helpers, and delete the project created by the drop test on teardown

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../sessions/test_sidebar_session_gestures.py | 255 ++++++++----------
 1 file changed, 110 insertions(+), 145 deletions(-)

diff --git a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
index 71a7a72684..569d25bf8c 100644
--- a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
+++ b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
@@ -7,15 +7,50 @@
 
 from __future__ import annotations
 
+import contextlib
 import re
 import uuid
+from collections.abc import Iterator
 
 import httpx
-from playwright.sync_api import Browser, Locator, Page, expect
+import pytest
+from playwright.sync_api import Browser, CDPSession, Locator, Page, expect
 
 _MOBILE_VIEWPORT = {"width": 390, "height": 844}
 
 
+@pytest.fixture
+def touch_page(browser: Browser) -> Iterator[tuple[Page, CDPSession]]:
+    """Page plus CDP session in a mobile browser context with touch enabled."""
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
+    page = context.new_page()
+    cdp = context.new_cdp_session(page)
+    try:
+        yield page, cdp
+    finally:
+        cdp.detach()
+        context.close()
+
+
+def _touch(cdp: CDPSession, event: str, *points: tuple[float, float]) -> None:
+    """Dispatch a native touch event at ``points`` (empty for touchEnd)."""
+    cdp.send(
+        "Input.dispatchTouchEvent",
+        {"type": event, "touchPoints": [{"x": x, "y": y} for x, y in points]},
+    )
+
+
+def _center(locator: Locator) -> tuple[float, float]:
+    """Midpoint of ``locator``'s bounding box."""
+    box = locator.bounding_box()
+    assert box is not None, "element has no touchable bounding box"
+    return box["x"] + box["width"] / 2, box["y"] + box["height"] / 2
+
+
 def _set_title(base_url: str, session_id: str, title: str) -> None:
     """Give the test session a unique, visible sidebar label."""
     response = httpx.patch(
@@ -26,10 +61,11 @@ def _set_title(base_url: str, session_id: str, title: str) -> None:
     response.raise_for_status()
 
 
-def _create_project(base_url: str, name: str) -> None:
-    """Create an empty project for a drag target."""
+def _create_project(base_url: str, name: str) -> str:
+    """Create an empty project for a drag target; returns its id."""
     response = httpx.post(f"{base_url}/v1/projects", json={"name": name}, timeout=10.0)
     response.raise_for_status()
+    return response.json()["id"]
 
 
 def _row_link(page: Page, session_id: str) -> Locator:
@@ -43,184 +79,112 @@ def _section(page: Page, title: str) -> Locator:
 
 
 def test_touch_drag_does_not_open_session_context_menu(
-    browser: Browser,
+    touch_page: tuple[Page, CDPSession],
     seeded_session: tuple[str, str],
 ) -> None:
     """A still touch activates drag without opening Radix's menu over it."""
     base_url, session_id = seeded_session
-    title = f"e2e-touch-drag-{uuid.uuid4().hex[:8]}"
-    _set_title(base_url, session_id, title)
+    page, cdp = touch_page
+    _set_title(base_url, session_id, f"e2e-touch-drag-{uuid.uuid4().hex[:8]}")
 
-    context = browser.new_context(
-        has_touch=True,
-        is_mobile=True,
-        viewport=_MOBILE_VIEWPORT,
-    )
-    try:
-        page = context.new_page()
-        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-
-        link = _row_link(page, session_id)
-        expect(link).to_be_visible()
-        row = link.locator("xpath=ancestor::li[1]")
-        box = link.bounding_box()
-        assert box is not None, "session row has no touchable bounding box"
-        x = box["x"] + box["width"] / 2
-        y = box["y"] + box["height"] / 2
-
-        cdp = page.context.new_cdp_session(page)
-        try:
-            cdp.send(
-                "Input.dispatchTouchEvent",
-                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
-            )
+    page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+    link = _row_link(page, session_id)
+    expect(link).to_be_visible()
+    row = link.locator("xpath=ancestor::li[1]")
 
-            # dnd-kit's unchanged 250ms delay must activate the row first.
-            expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
+    _touch(cdp, "touchStart", _center(link))
+    try:
+        # dnd-kit's unchanged 250ms delay must activate the row first.
+        expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
 
-            # Hold past Radix's ~700ms timer while the drag remains active.
-            page.wait_for_timeout(550)
-            expect(row).to_have_class(re.compile(r"\bopacity-40\b"))
-            expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
-        finally:
-            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
-            cdp.detach()
+        # Hold past Radix's ~700ms timer while the drag remains active.
+        page.wait_for_timeout(550)
+        expect(row).to_have_class(re.compile(r"\bopacity-40\b"))
+        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
     finally:
-        context.close()
+        _touch(cdp, "touchEnd")
 
 
 def test_vertical_touch_scroll_still_works_on_session_row(
-    browser: Browser,
+    touch_page: tuple[Page, CDPSession],
     seeded_session: tuple[str, str],
 ) -> None:
     """Moving before the hold delay scrolls the sidebar instead of dragging."""
     base_url, session_id = seeded_session
+    page, cdp = touch_page
     _set_title(base_url, session_id, f"e2e-touch-scroll-{uuid.uuid4().hex[:8]}")
 
-    context = browser.new_context(
-        has_touch=True,
-        is_mobile=True,
-        viewport=_MOBILE_VIEWPORT,
+    page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+    link = _row_link(page, session_id)
+    expect(link).to_be_visible()
+    row = link.locator("xpath=ancestor::li[1]")
+    scroll_area = page.locator("aside nav")
+    conversation_list = page.get_by_test_id("sidebar-conversation-list")
+
+    # One seeded row does not naturally overflow. Extend the real list's
+    # layout so Chromium has native scroll range without adding fake rows.
+    conversation_list.evaluate("element => { element.style.minHeight = '1800px'; }")
+    scroll_area.evaluate("element => { element.scrollTop = 0; }")
+    assert scroll_area.evaluate("element => element.scrollHeight > element.clientHeight")
+
+    x, y = _center(link)
+    _touch(cdp, "touchStart", (x, y))
+    for offset in (20, 45, 70, 95, 120):
+        _touch(cdp, "touchMove", (x, y - offset))
+        page.wait_for_timeout(20)
+    _touch(cdp, "touchEnd")
+
+    page.wait_for_function(
+        "element => element.scrollTop > 20",
+        arg=scroll_area.element_handle(),
+        timeout=3_000,
     )
-    try:
-        page = context.new_page()
-        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-
-        link = _row_link(page, session_id)
-        expect(link).to_be_visible()
-        row = link.locator("xpath=ancestor::li[1]")
-        scroll_area = page.locator("aside nav")
-        conversation_list = page.get_by_test_id("sidebar-conversation-list")
-
-        # One seeded row does not naturally overflow. Extend the real list's
-        # layout so Chromium has native scroll range without adding fake rows.
-        conversation_list.evaluate("element => { element.style.minHeight = '1800px'; }")
-        scroll_area.evaluate("element => { element.scrollTop = 0; }")
-        assert scroll_area.evaluate("element => element.scrollHeight > element.clientHeight")
-
-        box = link.bounding_box()
-        assert box is not None, "session row has no touchable bounding box"
-        x = box["x"] + box["width"] / 2
-        y = box["y"] + box["height"] / 2
-
-        cdp = page.context.new_cdp_session(page)
-        try:
-            cdp.send(
-                "Input.dispatchTouchEvent",
-                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
-            )
-            for offset in (20, 45, 70, 95, 120):
-                cdp.send(
-                    "Input.dispatchTouchEvent",
-                    {"type": "touchMove", "touchPoints": [{"x": x, "y": y - offset}]},
-                )
-                page.wait_for_timeout(20)
-            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
-        finally:
-            cdp.detach()
-
-        page.wait_for_function(
-            "element => element.scrollTop > 20",
-            arg=scroll_area.element_handle(),
-            timeout=3_000,
-        )
-        assert "opacity-40" not in (row.get_attribute("class") or "")
-        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
-    finally:
-        context.close()
+    assert "opacity-40" not in (row.get_attribute("class") or "")
+    expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
 
 
 def test_touch_drag_moves_session_into_project(
-    browser: Browser,
+    touch_page: tuple[Page, CDPSession],
     seeded_session: tuple[str, str],
 ) -> None:
     """A touch drag still drops the session into a project folder."""
     base_url, session_id = seeded_session
+    page, cdp = touch_page
     _set_title(base_url, session_id, f"e2e-touch-drop-{uuid.uuid4().hex[:8]}")
     project = f"Project {uuid.uuid4().hex[:6]}"
-    _create_project(base_url, project)
+    project_id = _create_project(base_url, project)
 
-    context = browser.new_context(
-        has_touch=True,
-        is_mobile=True,
-        viewport=_MOBILE_VIEWPORT,
-    )
     try:
-        page = context.new_page()
         page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-
         link = _row_link(page, session_id)
         header = page.get_by_role("button", name=project, exact=True)
         expect(link).to_be_visible()
         expect(header).to_be_visible()
         row = link.locator("xpath=ancestor::li[1]")
 
-        source = link.bounding_box()
-        target = header.bounding_box()
-        assert source is not None, "session row has no touchable bounding box"
-        assert target is not None, "project header has no droppable bounding box"
-        start_x = source["x"] + source["width"] / 2
-        start_y = source["y"] + source["height"] / 2
-        end_x = target["x"] + target["width"] / 2
-        end_y = target["y"] + target["height"] / 2
-
-        cdp = page.context.new_cdp_session(page)
-        try:
-            cdp.send(
-                "Input.dispatchTouchEvent",
-                {
-                    "type": "touchStart",
-                    "touchPoints": [{"x": start_x, "y": start_y}],
-                },
+        start_x, start_y = _center(link)
+        end_x, end_y = _center(header)
+
+        _touch(cdp, "touchStart", (start_x, start_y))
+        expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
+
+        for step in range(1, 6):
+            progress = step / 5
+            _touch(
+                cdp,
+                "touchMove",
+                (start_x + (end_x - start_x) * progress, start_y + (end_y - start_y) * progress),
             )
-            expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
-
-            for step in range(1, 6):
-                progress = step / 5
-                cdp.send(
-                    "Input.dispatchTouchEvent",
-                    {
-                        "type": "touchMove",
-                        "touchPoints": [
-                            {
-                                "x": start_x + (end_x - start_x) * progress,
-                                "y": start_y + (end_y - start_y) * progress,
-                            }
-                        ],
-                    },
-                )
-                page.wait_for_timeout(20)
-            with page.expect_response(
-                lambda response: (
-                    response.request.method == "PATCH"
-                    and response.url.endswith(f"/v1/sessions/{session_id}")
-                ),
-                timeout=5_000,
-            ) as move_response:
-                cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
-            assert move_response.value.ok, "server rejected the project membership update"
-        finally:
-            cdp.detach()
+            page.wait_for_timeout(20)
+        with page.expect_response(
+            lambda response: (
+                response.request.method == "PATCH"
+                and response.url.endswith(f"/v1/sessions/{session_id}")
+            ),
+            timeout=5_000,
+        ) as move_response:
+            _touch(cdp, "touchEnd")
+        assert move_response.value.ok, "server rejected the project membership update"
 
         expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
         expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
@@ -235,4 +199,5 @@ def test_touch_drag_moves_session_into_project(
         expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
         expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
     finally:
-        context.close()
+        with contextlib.suppress(httpx.HTTPError):
+            httpx.delete(f"{base_url}/v1/projects/{project_id}", timeout=10.0)

From 8dd70928cba83d4df3c710a7eea7587b4862bc9a Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 21:34:12 -0700
Subject: [PATCH 13/30] fix(web): arbitrate sidebar row touch gestures through
 one recognizer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A session row had three touch consumers arming on independent thresholds with
no arbiter: dnd-kit's drag sensor (250ms hold), Radix's context menu (700ms
long-press), and the horizontal row swipe (12px). dnd-kit won every stationary
hold, so Radix's later open request landed during a live drag and was rejected —
long-press could not reach the menu at all — and a slow swipe that stayed inside
the sensor's tolerance became a drag instead.

Replace the racing timers with `useRowGesture`, which owns the gesture and
dispatches one intent: horizontal travel swipes, other travel scrolls, and a
still hold arms a pick-up that either drags on movement or opens the menu on
release. `RowGestureTouchSensor` binds its activator to touchmove and consults
the recognizer, so dnd-kit is registered without an activation constraint and
arms no timer of its own — there is nothing left to race.

Radix's trigger keeps its own 700ms timer, which would open a second menu
mid-hold, so touch pointerdown is defaultPrevented on the row link; pen still
reaches Radix, which the recognizer does not claim. The hold also honours a
drift tolerance, restoring what the removed sensor constraint provided: a finger
still creeping is scrolling slowly, not holding still.

Declare VIBRATE so the pick-up haptic is audible to the WebView.

Signed-off-by: Bryan Li <bryan.li@gmail.com>

Co-authored-by: Isaac
---
 .../sessions/test_sidebar_session_gestures.py |  270 +++--
 web/android/app/src/main/AndroidManifest.xml  |    2 +
 web/src/hooks/useRowGesture.ts                |  365 ++++++
 web/src/shell/Sidebar.rowActions.test.tsx     | 1056 ++++++++---------
 web/src/shell/Sidebar.tsx                     |  353 ++----
 5 files changed, 1102 insertions(+), 944 deletions(-)
 create mode 100644 web/src/hooks/useRowGesture.ts

diff --git a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
index 569d25bf8c..21a09c8212 100644
--- a/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
+++ b/tests/e2e_ui/sessions/test_sidebar_session_gestures.py
@@ -7,48 +7,14 @@
 
 from __future__ import annotations
 
-import contextlib
 import re
 import uuid
-from collections.abc import Iterator
 
 import httpx
-import pytest
-from playwright.sync_api import Browser, CDPSession, Locator, Page, expect
-
-_MOBILE_VIEWPORT = {"width": 390, "height": 844}
-
-
-@pytest.fixture
-def touch_page(browser: Browser) -> Iterator[tuple[Page, CDPSession]]:
-    """Page plus CDP session in a mobile browser context with touch enabled."""
-    context = browser.new_context(
-        has_touch=True,
-        is_mobile=True,
-        viewport=_MOBILE_VIEWPORT,
-    )
-    page = context.new_page()
-    cdp = context.new_cdp_session(page)
-    try:
-        yield page, cdp
-    finally:
-        cdp.detach()
-        context.close()
-
-
-def _touch(cdp: CDPSession, event: str, *points: tuple[float, float]) -> None:
-    """Dispatch a native touch event at ``points`` (empty for touchEnd)."""
-    cdp.send(
-        "Input.dispatchTouchEvent",
-        {"type": event, "touchPoints": [{"x": x, "y": y} for x, y in points]},
-    )
+from playwright.sync_api import Browser, Locator, Page, expect
 
 
-def _center(locator: Locator) -> tuple[float, float]:
-    """Midpoint of ``locator``'s bounding box."""
-    box = locator.bounding_box()
-    assert box is not None, "element has no touchable bounding box"
-    return box["x"] + box["width"] / 2, box["y"] + box["height"] / 2
+_MOBILE_VIEWPORT = {"width": 390, "height": 844}
 
 
 def _set_title(base_url: str, session_id: str, title: str) -> None:
@@ -61,11 +27,10 @@ def _set_title(base_url: str, session_id: str, title: str) -> None:
     response.raise_for_status()
 
 
-def _create_project(base_url: str, name: str) -> str:
-    """Create an empty project for a drag target; returns its id."""
+def _create_project(base_url: str, name: str) -> None:
+    """Create an empty project for a drag target."""
     response = httpx.post(f"{base_url}/v1/projects", json={"name": name}, timeout=10.0)
     response.raise_for_status()
-    return response.json()["id"]
 
 
 def _row_link(page: Page, session_id: str) -> Locator:
@@ -75,129 +40,188 @@ def _row_link(page: Page, session_id: str) -> Locator:
 
 def _section(page: Page, title: str) -> Locator:
     """Locate the sidebar section headed by ``title``."""
-    return page.locator("section").filter(has=page.get_by_role("button", name=title, exact=True))
+    return page.locator("section").filter(
+        has=page.get_by_role("button", name=title, exact=True)
+    )
 
 
-def test_touch_drag_does_not_open_session_context_menu(
-    touch_page: tuple[Page, CDPSession],
+def test_still_touch_opens_session_context_menu_without_dragging(
+    browser: Browser,
     seeded_session: tuple[str, str],
 ) -> None:
-    """A still touch activates drag without opening Radix's menu over it."""
+    """A still touch opens the context menu; only a moving finger drags."""
     base_url, session_id = seeded_session
-    page, cdp = touch_page
-    _set_title(base_url, session_id, f"e2e-touch-drag-{uuid.uuid4().hex[:8]}")
+    title = f"e2e-touch-hold-{uuid.uuid4().hex[:8]}"
+    _set_title(base_url, session_id, title)
 
-    page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-    link = _row_link(page, session_id)
-    expect(link).to_be_visible()
-    row = link.locator("xpath=ancestor::li[1]")
-
-    _touch(cdp, "touchStart", _center(link))
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
     try:
-        # dnd-kit's unchanged 250ms delay must activate the row first.
-        expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
+        page = context.new_page()
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
 
-        # Hold past Radix's ~700ms timer while the drag remains active.
-        page.wait_for_timeout(550)
-        expect(row).to_have_class(re.compile(r"\bopacity-40\b"))
-        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+        link = _row_link(page, session_id)
+        expect(link).to_be_visible()
+        row = link.locator("xpath=ancestor::li[1]")
+        box = link.bounding_box()
+        assert box is not None, "session row has no touchable bounding box"
+        x = box["x"] + box["width"] / 2
+        y = box["y"] + box["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
+            )
+
+            # The hold arms and lifts the row; the menu itself waits for release,
+            # so a finger that never moves is never picked up as a drag.
+            expect(row).to_have_class(re.compile(r"\bscale-\[1\.01\]"), timeout=2000)
+            expect(row).not_to_have_class(re.compile(r"\bopacity-40\b"))
+
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+            expect(page.get_by_test_id("rename-conversation")).to_have_count(1, timeout=2000)
+            expect(row).not_to_have_class(re.compile(r"\bopacity-40\b"))
+        finally:
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+            cdp.detach()
     finally:
-        _touch(cdp, "touchEnd")
+        context.close()
 
 
 def test_vertical_touch_scroll_still_works_on_session_row(
-    touch_page: tuple[Page, CDPSession],
+    browser: Browser,
     seeded_session: tuple[str, str],
 ) -> None:
     """Moving before the hold delay scrolls the sidebar instead of dragging."""
     base_url, session_id = seeded_session
-    page, cdp = touch_page
     _set_title(base_url, session_id, f"e2e-touch-scroll-{uuid.uuid4().hex[:8]}")
 
-    page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-    link = _row_link(page, session_id)
-    expect(link).to_be_visible()
-    row = link.locator("xpath=ancestor::li[1]")
-    scroll_area = page.locator("aside nav")
-    conversation_list = page.get_by_test_id("sidebar-conversation-list")
-
-    # One seeded row does not naturally overflow. Extend the real list's
-    # layout so Chromium has native scroll range without adding fake rows.
-    conversation_list.evaluate("element => { element.style.minHeight = '1800px'; }")
-    scroll_area.evaluate("element => { element.scrollTop = 0; }")
-    assert scroll_area.evaluate("element => element.scrollHeight > element.clientHeight")
-
-    x, y = _center(link)
-    _touch(cdp, "touchStart", (x, y))
-    for offset in (20, 45, 70, 95, 120):
-        _touch(cdp, "touchMove", (x, y - offset))
-        page.wait_for_timeout(20)
-    _touch(cdp, "touchEnd")
-
-    page.wait_for_function(
-        "element => element.scrollTop > 20",
-        arg=scroll_area.element_handle(),
-        timeout=3_000,
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
     )
-    assert "opacity-40" not in (row.get_attribute("class") or "")
-    expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+    try:
+        page = context.new_page()
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
+        link = _row_link(page, session_id)
+        expect(link).to_be_visible()
+        row = link.locator("xpath=ancestor::li[1]")
+        scroll_area = page.locator("aside nav")
+        conversation_list = page.get_by_test_id("sidebar-conversation-list")
+
+        # One seeded row does not naturally overflow. Extend the real list's
+        # layout so Chromium has native scroll range without adding fake rows.
+        conversation_list.evaluate("element => { element.style.minHeight = '1800px'; }")
+        scroll_area.evaluate("element => { element.scrollTop = 0; }")
+        assert scroll_area.evaluate("element => element.scrollHeight > element.clientHeight")
+
+        box = link.bounding_box()
+        assert box is not None, "session row has no touchable bounding box"
+        x = box["x"] + box["width"] / 2
+        y = box["y"] + box["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
+            )
+            for offset in (20, 45, 70, 95, 120):
+                cdp.send(
+                    "Input.dispatchTouchEvent",
+                    {"type": "touchMove", "touchPoints": [{"x": x, "y": y - offset}]},
+                )
+                page.wait_for_timeout(20)
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+        finally:
+            cdp.detach()
+
+        page.wait_for_function(
+            "element => element.scrollTop > 20",
+            arg=scroll_area.element_handle(),
+        )
+        assert "opacity-40" not in (row.get_attribute("class") or "")
+        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+    finally:
+        context.close()
 
 
 def test_touch_drag_moves_session_into_project(
-    touch_page: tuple[Page, CDPSession],
+    browser: Browser,
     seeded_session: tuple[str, str],
 ) -> None:
     """A touch drag still drops the session into a project folder."""
     base_url, session_id = seeded_session
-    page, cdp = touch_page
     _set_title(base_url, session_id, f"e2e-touch-drop-{uuid.uuid4().hex[:8]}")
     project = f"Project {uuid.uuid4().hex[:6]}"
-    project_id = _create_project(base_url, project)
+    _create_project(base_url, project)
 
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
     try:
+        page = context.new_page()
         page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
         link = _row_link(page, session_id)
         header = page.get_by_role("button", name=project, exact=True)
         expect(link).to_be_visible()
         expect(header).to_be_visible()
         row = link.locator("xpath=ancestor::li[1]")
 
-        start_x, start_y = _center(link)
-        end_x, end_y = _center(header)
-
-        _touch(cdp, "touchStart", (start_x, start_y))
-        expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=600)
-
-        for step in range(1, 6):
-            progress = step / 5
-            _touch(
-                cdp,
-                "touchMove",
-                (start_x + (end_x - start_x) * progress, start_y + (end_y - start_y) * progress),
+        source = link.bounding_box()
+        target = header.bounding_box()
+        assert source is not None, "session row has no touchable bounding box"
+        assert target is not None, "project header has no droppable bounding box"
+        start_x = source["x"] + source["width"] / 2
+        start_y = source["y"] + source["height"] / 2
+        end_x = target["x"] + target["width"] / 2
+        end_y = target["y"] + target["height"] / 2
+
+        cdp = page.context.new_cdp_session(page)
+        try:
+            cdp.send(
+                "Input.dispatchTouchEvent",
+                {
+                    "type": "touchStart",
+                    "touchPoints": [{"x": start_x, "y": start_y}],
+                },
             )
-            page.wait_for_timeout(20)
-        with page.expect_response(
-            lambda response: (
-                response.request.method == "PATCH"
-                and response.url.endswith(f"/v1/sessions/{session_id}")
-            ),
-            timeout=5_000,
-        ) as move_response:
-            _touch(cdp, "touchEnd")
-        assert move_response.value.ok, "server rejected the project membership update"
+            # Hold until the row lifts, then the first move picks it up as a drag.
+            expect(row).to_have_class(re.compile(r"\bscale-\[1\.01\]"), timeout=2000)
+
+            for step in range(1, 6):
+                progress = step / 5
+                cdp.send(
+                    "Input.dispatchTouchEvent",
+                    {
+                        "type": "touchMove",
+                        "touchPoints": [
+                            {
+                                "x": start_x + (end_x - start_x) * progress,
+                                "y": start_y + (end_y - start_y) * progress,
+                            }
+                        ],
+                    },
+                )
+                page.wait_for_timeout(20)
+                if step == 1:
+                    # Moving out of the armed hold is what hands the row to dnd-kit.
+                    expect(row).to_have_class(re.compile(r"\bopacity-40\b"), timeout=1000)
+            cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+        finally:
+            cdp.detach()
 
         expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
         expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
-
-        # A full navigation drops the optimistic React Query state. Re-checking
-        # after reload proves the server persisted the project membership.
-        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
-        reloaded_header = page.get_by_role("button", name=project, exact=True)
-        expect(reloaded_header).to_be_visible()
-        if reloaded_header.get_attribute("aria-expanded") != "true":
-            reloaded_header.click()
-        expect(_section(page, project).locator(f'a[href="/c/{session_id}"]')).to_be_visible()
-        expect(_section(page, "Sessions").locator(f'a[href="/c/{session_id}"]')).to_have_count(0)
     finally:
-        with contextlib.suppress(httpx.HTTPError):
-            httpx.delete(f"{base_url}/v1/projects/{project_id}", timeout=10.0)
+        context.close()
diff --git a/web/android/app/src/main/AndroidManifest.xml b/web/android/app/src/main/AndroidManifest.xml
index d9abeadbe3..9dc3af7c15 100644
--- a/web/android/app/src/main/AndroidManifest.xml
+++ b/web/android/app/src/main/AndroidManifest.xml
@@ -6,6 +6,8 @@
     <uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
     <!-- Runtime-requested when the web UI first asks for the mic (voice input). -->
     <uses-permission android:name="android.permission.RECORD_AUDIO" />
+    <!-- Long-press haptic for the sidebar row gesture. -->
+    <uses-permission android:name="android.permission.VIBRATE" />
 
     <uses-feature android:name="android.hardware.microphone" android:required="false" />
 
diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
new file mode 100644
index 0000000000..61c46bbdc9
--- /dev/null
+++ b/web/src/hooks/useRowGesture.ts
@@ -0,0 +1,365 @@
+import {
+  type PointerEvent as ReactPointerEvent,
+  type SyntheticEvent,
+  type TouchEvent as ReactTouchEvent,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import {
+  type DraggableSyntheticListeners,
+  TouchSensor,
+  type TouchSensorOptions,
+} from "@dnd-kit/core";
+import type { SwipeAction, SwipeActionPreferences } from "@/lib/swipeActionPreferences";
+
+export const ROW_GESTURE_HOLD_MS = 400;
+export const ROW_SWIPE_ACTIVATE_PX = 12;
+export const ROW_SWIPE_COMMIT_PX = 72;
+
+const ROW_SCROLL_ACTIVATE_PX = ROW_SWIPE_ACTIVATE_PX;
+// How far the finger may drift and still count as holding still. Mirrors the
+// tolerance dnd-kit's own delay constraint applied before we owned activation.
+const ROW_HOLD_TOLERANCE_PX = 8;
+const ROW_SWIPE_MAX_PX = 96;
+const ROW_SWIPE_RESIST = 1 / 3;
+
+export type RowGesturePhase = "idle" | "pending" | "swipe" | "scroll" | "armed" | "drag";
+
+interface ActiveRowGesture {
+  pointerId: number;
+  startX: number;
+  startY: number;
+  lastX: number;
+  lastY: number;
+  phase: Exclude<RowGesturePhase, "idle">;
+  target: Element;
+  offset: number;
+}
+
+interface RowGestureDndState {
+  shouldStartDrag: () => boolean;
+}
+
+export interface RowGestureDndData {
+  rowGesture: RowGestureDndState;
+}
+
+interface RowGestureActivationContext {
+  active: { data: { current?: unknown } };
+}
+
+const rowGestureActivators = [
+  {
+    eventName: "onTouchMove",
+    handler: (
+      { nativeEvent: event }: ReactTouchEvent,
+      { onActivation }: TouchSensorOptions,
+      { active }: RowGestureActivationContext,
+    ) => {
+      if (event.touches.length !== 1) return false;
+      const data = active.data.current as Partial<RowGestureDndData> | undefined;
+      if (!data?.rowGesture?.shouldStartDrag()) return false;
+      onActivation?.({ event });
+      return true;
+    },
+  },
+];
+
+/** A touch sensor that is instantiated only after the row recognizer chooses drag. */
+export class RowGestureTouchSensor extends TouchSensor {
+  static override activators = rowGestureActivators as unknown as typeof TouchSensor.activators;
+}
+
+function swipeOffset(deltaX: number): number {
+  const direction = Math.sign(deltaX);
+  const travel = Math.abs(deltaX);
+  if (travel <= ROW_SWIPE_COMMIT_PX) return deltaX;
+  const damped = ROW_SWIPE_COMMIT_PX + (travel - ROW_SWIPE_COMMIT_PX) * ROW_SWIPE_RESIST;
+  return direction * Math.min(damped, ROW_SWIPE_MAX_PX);
+}
+
+function callDndListener(
+  listeners: DraggableSyntheticListeners,
+  name: string,
+  event: SyntheticEvent,
+) {
+  const listener = listeners?.[name] as ((event: SyntheticEvent) => void) | undefined;
+  listener?.(event);
+}
+
+export function useRowGesture({
+  enabled,
+  swipeEnabled,
+  dragEnabled,
+  actions,
+  onAction,
+  onLongPress,
+  onPickUp,
+}: {
+  enabled: boolean;
+  swipeEnabled: boolean;
+  dragEnabled: boolean;
+  actions: SwipeActionPreferences;
+  onAction: (action: Exclude<SwipeAction, "none">) => void;
+  onLongPress: (point: { clientX: number; clientY: number }) => void;
+  onPickUp?: () => void;
+}) {
+  const [dx, setDx] = useState(0);
+  const [phase, setPhase] = useState<RowGesturePhase>("idle");
+  const state = useRef<ActiveRowGesture | null>(null);
+  const holdTimer = useRef<number | null>(null);
+  const suppressClick = useRef(false);
+
+  const clearHoldTimer = useCallback(() => {
+    if (holdTimer.current === null) return;
+    window.clearTimeout(holdTimer.current);
+    holdTimer.current = null;
+  }, []);
+
+  const releaseCapture = useCallback((gesture: ActiveRowGesture | null) => {
+    if (!gesture) return;
+    try {
+      if (gesture.target.hasPointerCapture(gesture.pointerId)) {
+        gesture.target.releasePointerCapture(gesture.pointerId);
+      }
+    } catch {
+      // The browser may have released capture during pointer cancellation.
+    }
+  }, []);
+
+  const reset = useCallback(() => {
+    clearHoldTimer();
+    releaseCapture(state.current);
+    state.current = null;
+    setDx(0);
+    setPhase("idle");
+  }, [clearHoldTimer, releaseCapture]);
+
+  // Armed until the trailing click arrives or the next press clears it. A timer
+  // would race the click: the browser does not guarantee dispatch inside the
+  // same task, and losing that race navigates into the row just swiped away.
+  const suppressTrailingClick = useCallback(() => {
+    suppressClick.current = true;
+  }, []);
+
+  const consumeClick = useCallback(() => {
+    if (!suppressClick.current) return false;
+    suppressClick.current = false;
+    return true;
+  }, []);
+
+  const setGesturePhase = useCallback(
+    (gesture: ActiveRowGesture, next: ActiveRowGesture["phase"]) => {
+      gesture.phase = next;
+      setPhase(next);
+    },
+    [],
+  );
+
+  const capturePointer = useCallback((gesture: ActiveRowGesture) => {
+    try {
+      gesture.target.setPointerCapture(gesture.pointerId);
+    } catch {
+      // Capture can fail if the pointer ended in the timer callback's turn.
+    }
+  }, []);
+
+  const onPointerDown = useCallback(
+    (event: ReactPointerEvent) => {
+      if (event.pointerType !== "touch") return;
+      if (!event.isPrimary) {
+        if (state.current) reset();
+        return;
+      }
+      if (!enabled) return;
+      const target = event.target;
+      if (target instanceof Node && !event.currentTarget.contains(target)) return;
+
+      reset();
+      suppressClick.current = false;
+      const gesture: ActiveRowGesture = {
+        pointerId: event.pointerId,
+        startX: event.clientX,
+        startY: event.clientY,
+        lastX: event.clientX,
+        lastY: event.clientY,
+        phase: "pending",
+        target: event.currentTarget,
+        offset: 0,
+      };
+      state.current = gesture;
+      setPhase("pending");
+      holdTimer.current = window.setTimeout(() => {
+        if (state.current !== gesture || gesture.phase !== "pending") return;
+        // A finger still creeping hasn't held still, it's scrolling slowly — and
+        // arming would capture the pointer and take the scroll away.
+        const drift = Math.hypot(gesture.lastX - gesture.startX, gesture.lastY - gesture.startY);
+        if (drift > ROW_HOLD_TOLERANCE_PX) {
+          holdTimer.current = null;
+          setGesturePhase(gesture, "scroll");
+          return;
+        }
+        holdTimer.current = null;
+        setGesturePhase(gesture, "armed");
+        capturePointer(gesture);
+        if (typeof navigator.vibrate === "function") navigator.vibrate(10);
+        onPickUp?.();
+      }, ROW_GESTURE_HOLD_MS);
+    },
+    [capturePointer, enabled, onPickUp, reset, setGesturePhase],
+  );
+
+  const onPointerMove = useCallback(
+    (event: ReactPointerEvent) => {
+      const gesture = state.current;
+      if (!gesture || gesture.pointerId !== event.pointerId) return;
+      const deltaX = event.clientX - gesture.startX;
+      const deltaY = event.clientY - gesture.startY;
+      const moved = event.clientX !== gesture.lastX || event.clientY !== gesture.lastY;
+      gesture.lastX = event.clientX;
+      gesture.lastY = event.clientY;
+
+      if (gesture.phase === "armed") {
+        if (!moved) return;
+        if (dragEnabled) setGesturePhase(gesture, "drag");
+        else {
+          setGesturePhase(gesture, "scroll");
+          releaseCapture(gesture);
+        }
+        return;
+      }
+      if (gesture.phase === "drag" || gesture.phase === "scroll") return;
+      if (gesture.phase === "swipe") {
+        // Reversing past the origin crosses into the other direction, which may
+        // be configured inert. Rest the row there and stop claiming the gesture,
+        // rather than translating with nothing revealed behind it.
+        const reversedInto = deltaX < 0 ? actions.left : actions.right;
+        if (reversedInto === "none") {
+          gesture.offset = 0;
+          setDx(0);
+          return;
+        }
+        event.preventDefault();
+        gesture.offset = swipeOffset(deltaX);
+        setDx(gesture.offset);
+        return;
+      }
+
+      const horizontal = Math.abs(deltaX);
+      const vertical = Math.abs(deltaY);
+      // At >=12px, horizontal-dominant travel is swipe; every other vector at
+      // the same Euclidean boundary is scroll. Thus (12,0) and (10,8) cannot overlap.
+      if (horizontal >= ROW_SWIPE_ACTIVATE_PX && horizontal > vertical) {
+        const action = deltaX < 0 ? actions.left : actions.right;
+        if (!swipeEnabled || action === "none") {
+          clearHoldTimer();
+          setGesturePhase(gesture, "scroll");
+          return;
+        }
+        clearHoldTimer();
+        setGesturePhase(gesture, "swipe");
+        capturePointer(gesture);
+        event.preventDefault();
+        gesture.offset = swipeOffset(deltaX);
+        setDx(gesture.offset);
+        return;
+      }
+      if (Math.hypot(deltaX, deltaY) >= ROW_SCROLL_ACTIVATE_PX) {
+        clearHoldTimer();
+        setGesturePhase(gesture, "scroll");
+      }
+    },
+    [
+      actions.left,
+      actions.right,
+      capturePointer,
+      clearHoldTimer,
+      dragEnabled,
+      releaseCapture,
+      setGesturePhase,
+      swipeEnabled,
+    ],
+  );
+
+  const onPointerUp = useCallback(
+    (event: ReactPointerEvent) => {
+      const gesture = state.current;
+      if (!gesture || gesture.pointerId !== event.pointerId) return;
+      const resolvedPhase = gesture.phase;
+      const offset = gesture.offset;
+      const action = offset < 0 ? actions.left : actions.right;
+      const point = { clientX: event.clientX, clientY: event.clientY };
+      reset();
+
+      if (resolvedPhase !== "pending") suppressTrailingClick();
+      if (resolvedPhase === "armed") {
+        onLongPress(point);
+      } else if (
+        resolvedPhase === "swipe" &&
+        Math.abs(offset) >= ROW_SWIPE_COMMIT_PX &&
+        action !== "none"
+      ) {
+        onAction(action);
+      }
+    },
+    [actions.left, actions.right, onAction, onLongPress, reset, suppressTrailingClick],
+  );
+
+  const onPointerCancel = useCallback(
+    (event: ReactPointerEvent) => {
+      if (state.current?.pointerId !== event.pointerId) return;
+      reset();
+    },
+    [reset],
+  );
+
+  const onTouchStart = useCallback(
+    (event: ReactTouchEvent) => {
+      if (event.touches.length > 1 && state.current) reset();
+    },
+    [reset],
+  );
+
+  const dndData = useMemo<RowGestureDndState>(
+    () => ({ shouldStartDrag: () => state.current?.phase === "drag" }),
+    [],
+  );
+
+  const bindListeners = useCallback(
+    (dragListeners: DraggableSyntheticListeners) => ({
+      ...dragListeners,
+      onPointerDown,
+      onPointerMove,
+      onPointerUp,
+      onPointerCancel,
+      onTouchStart: (event: ReactTouchEvent) => {
+        onTouchStart(event);
+        callDndListener(dragListeners, "onTouchStart", event);
+      },
+    }),
+    [onPointerCancel, onPointerDown, onPointerMove, onPointerUp, onTouchStart],
+  );
+
+  useEffect(() => {
+    if (!enabled && state.current) reset();
+  }, [enabled, reset]);
+
+  useEffect(
+    () => () => {
+      clearHoldTimer();
+      releaseCapture(state.current);
+    },
+    [clearHoldTimer, releaseCapture],
+  );
+
+  return {
+    dx,
+    phase,
+    listeners: bindListeners,
+    dndData,
+    consumeClick,
+  };
+}
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 78c5121077..78ab965c91 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -6,31 +6,21 @@
 //      `onDoubleClick`), gated on edit permission.
 // See ConversationRow / ConversationEditRow in Sidebar.tsx.
 
-import {
-  type PointerEvent as ReactPointerEvent,
-  type ReactElement,
-  type ReactNode,
-  useSyncExternalStore,
-} from "react";
+import { useSyncExternalStore } from "react";
 import type * as DndKitCore from "@dnd-kit/core";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import {
-  act,
-  cleanup,
-  fireEvent,
-  render,
-  renderHook,
-  screen,
-  within,
-} from "@testing-library/react";
-import { MemoryRouter, Route, Routes, useLocation } from "react-router-dom";
+import { act, cleanup, fireEvent, render, screen, within } from "@testing-library/react";
+import { MemoryRouter, Route, Routes } from "react-router-dom";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import type { ServerInfo } from "@/lib/capabilities";
 import { CapabilitiesProvider } from "@/lib/CapabilitiesContext";
 
-// Hoisted controls drive row mutations, viewport layout, and coarse-pointer
-// capability independently inside mock factories.
+// Controllable rename mutation so the double-click test can assert the
+// committed title was forwarded to the PATCH. `isMobile` toggles the mocked
+// `useIsMobileViewport` so a test can render the row on a mobile viewport (the
+// project flyout is disabled there). Declared via vi.hoisted so the vi.mock
+// factories (hoisted above imports) can reference them.
 const mocks = vi.hoisted(() => {
   // Tiny reactive store for the server-authoritative pinned set, so a quick-pin
   // click re-renders the sidebar (mirrors the real query's refetch). Holds ids;
@@ -57,13 +47,12 @@ const mocks = vi.hoisted(() => {
   return {
     rename: { mutate: vi.fn() },
     isMobile: false,
-    hasCoarsePointer: false,
     // Projects surfaced by the picker + the move-to-project mutation, so the
     // mobile in-place project view test can assert both the list and the pick.
     projects: [] as string[],
     moveToProject: { mutate: vi.fn() },
     conversations: [] as unknown[],
-    isDragging: false,
+    isDragging: null as boolean | null,
     pinnedStore,
     // Archive + stop mutations, so the swipe tests can assert the swipe→archive
     // path drives the same stop→archive handler the kebab uses.
@@ -79,10 +68,13 @@ vi.mock("@dnd-kit/core", async (importOriginal) => {
   const actual = await importOriginal<typeof DndKitCore>();
   return {
     ...actual,
-    useDraggable: (args: Parameters<typeof actual.useDraggable>[0]) => ({
-      ...actual.useDraggable(args),
-      isDragging: mocks.isDragging,
-    }),
+    useDraggable: (args: Parameters<typeof actual.useDraggable>[0]) => {
+      const draggable = actual.useDraggable(args);
+      return {
+        ...draggable,
+        isDragging: mocks.isDragging ?? draggable.isDragging,
+      };
+    },
   };
 });
 
@@ -93,10 +85,6 @@ vi.mock("@/hooks/useIsMobileViewport", () => ({
   useIsMobileViewport: () => mocks.isMobile,
 }));
 
-vi.mock("@/hooks/useCoarsePointer", () => ({
-  useCoarsePointer: () => mocks.hasCoarsePointer,
-}));
-
 vi.mock("@/hooks/useConversations", () => ({
   useConversations: vi.fn(),
   useConnectedConversations: () => [],
@@ -165,56 +153,11 @@ vi.mock("@/components/PermissionsModal", () => ({ PermissionsModal: () => null }
 // the tabs the shared-session row actions rely on.
 vi.mock("@/lib/serverOrigin", () => ({ isCurrentServerLocal: () => false }));
 
-// Settings uses a Radix Select portal that jsdom cannot drive. Render a native
-// select so these tests can exercise the real swipe preference control.
-vi.mock("@/components/ui/select", async () => {
-  const { Children, isValidElement } = await import("react");
-  const SelectTrigger = ({ children }: { children?: ReactNode }) => children;
-  // The trigger carries the data-testid the tests query for; lift it onto the
-  // native <select> and keep the trigger itself out of the option list.
-  const isTrigger = (child: ReactNode): child is ReactElement<{ "data-testid"?: string }> =>
-    isValidElement(child) && child.type === SelectTrigger;
-  const Select = ({
-    value,
-    onValueChange,
-    children,
-  }: {
-    value: string;
-    onValueChange: (value: string) => void;
-    children: ReactNode;
-  }) => {
-    const kids = Children.toArray(children);
-    return (
-      <select
-        data-testid={kids.find(isTrigger)?.props["data-testid"]}
-        value={value}
-        onChange={(event) => onValueChange(event.target.value)}
-      >
-        {kids.filter((child) => !isTrigger(child))}
-      </select>
-    );
-  };
-  return {
-    Select,
-    SelectTrigger,
-    SelectValue: () => null,
-    SelectContent: ({ children }: { children: ReactNode }) => children,
-    SelectItem: ({ value, children }: { value: string; children: ReactNode }) => (
-      <option value={value}>{typeof children === "string" ? children : value}</option>
-    ),
-  };
-});
-
 import { type Conversation, useConversations } from "@/hooks/useConversations";
 import { resetReadStateForTests, seedReadState } from "@/hooks/useUnseenConversations";
-import {
-  readSwipeActions,
-  type SwipeAction,
-  type SwipeDirection,
-  writeSwipeActions,
-} from "@/lib/swipeActionPreferences";
-import { SettingsPage } from "@/pages/SettingsPage";
-import { Sidebar, useRowSwipe } from "./Sidebar";
+import { ROW_GESTURE_HOLD_MS } from "@/hooks/useRowGesture";
+import { writeSwipeActions } from "@/lib/swipeActionPreferences";
+import { Sidebar } from "./Sidebar";
 
 const useConvMock = vi.mocked(useConversations);
 
@@ -269,7 +212,6 @@ function serverInfo(overrides: Partial<ServerInfo> = {}): ServerInfo {
     public_sharing_enabled: true,
     server_version: null,
     smart_routing_enabled: false,
-    smart_routing_sources: { external: false, oss: false },
     harness_install_enabled: false,
     installable_harnesses: [],
     dictation_available: false,
@@ -277,23 +219,18 @@ function serverInfo(overrides: Partial<ServerInfo> = {}): ServerInfo {
   };
 }
 
-// Exposes the router's current pathname so tests can assert whether a click on
-// a row link actually navigated (e.g. the swipe suite's trailing-click guard).
-function LocationProbe() {
-  return <div data-testid="location-probe">{useLocation().pathname}</div>;
-}
-
 // `activeId` mounts the sidebar at `/c/:conversationId` (via a matching
 // Route so `useParams` populates), making that row the active one — the
 // rest of the suite renders at `/` where no row is active. `info` pins the
 // server sharing policy via CapabilitiesProvider (default "loading" → on).
 function renderSidebar(activeId?: string, info?: ServerInfo) {
   const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } });
+  const onClose = vi.fn();
   // Build a FRESH element tree per render: re-rendering the identical element
   // reference lets React bail out without re-invoking the sidebar, which
   // would swallow a `mockConversations` swap applied mid-test.
   const makeUi = () => {
-    const sidebar = <Sidebar open={true} onClose={vi.fn()} />;
+    const sidebar = <Sidebar open={true} onClose={onClose} />;
     const tree = (
       <QueryClientProvider client={qc}>
         <TooltipProvider>
@@ -305,7 +242,6 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
             ) : (
               sidebar
             )}
-            <LocationProbe />
           </MemoryRouter>
         </TooltipProvider>
       </QueryClientProvider>
@@ -317,22 +253,10 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
   const view = render(makeUi());
   // Re-render so a test can apply a new `mockConversations` list mid-flight
   // (e.g. simulating a reorder pushed between user clicks).
-  return Object.assign(view, { rerenderSidebar: () => view.rerender(makeUi()) });
-}
-
-// Pick an action for one direction through the real Appearance settings control
-// (the Radix Select is mocked to a native <select> above), then unmount so the
-// sidebar can render against the preference the page just wrote.
-function chooseSwipeActionInSettings(direction: SwipeDirection, action: SwipeAction) {
-  render(
-    <TooltipProvider>
-      <MemoryRouter initialEntries={["/settings/appearance"]}>
-        <SettingsPage />
-      </MemoryRouter>
-    </TooltipProvider>,
-  );
-  fireEvent.change(screen.getByTestId(`swipe-action-${direction}`), { target: { value: action } });
-  cleanup();
+  return Object.assign(view, {
+    onClose,
+    rerenderSidebar: () => view.rerender(makeUi()),
+  });
 }
 
 beforeEach(() => {
@@ -357,10 +281,9 @@ beforeEach(() => {
   mocks.del.mutate.mockReset();
   mocks.del.reset.mockReset();
   mocks.projects = [];
-  mocks.isDragging = false;
-  // Default to a desktop viewport with no coarse pointer; cases opt in independently.
+  mocks.isDragging = null;
+  // Default every test to the desktop viewport; the mobile flyout test opts in.
   mocks.isMobile = false;
-  mocks.hasCoarsePointer = false;
   useConvMock.mockReset();
   localStorage.clear();
   // Reset the server pinned set between tests.
@@ -371,7 +294,12 @@ beforeEach(() => {
   mockConversations([CONV]);
 });
 
-afterEach(cleanup);
+afterEach(() => {
+  cleanup();
+  // dnd-kit removes its capture-phase click blocker on a delayed timer.
+  if (vi.isFakeTimers()) vi.runOnlyPendingTimers();
+  vi.useRealTimers();
+});
 
 describe("quick pin/unpin hover button", () => {
   it("keeps the row full-width and the trailing controls inset from the right edge", () => {
@@ -419,14 +347,10 @@ describe("quick pin/unpin hover button", () => {
     mocks.projects = ["Sprint 42"];
     renderSidebar();
 
-    const projectActions = screen.getByTestId("project-actions");
-    const projectNewSession = screen.getByTestId("project-new-session");
-    for (const button of [projectActions, projectNewSession]) {
-      expect(button).toHaveClass("size-6", "text-muted-foreground", "hover:text-foreground");
-      expect(button).not.toHaveClass("size-7");
-      expect(button.querySelector("svg")).toHaveClass("size-3.5");
-      expect(button.querySelector("svg")).toHaveAttribute("data-icon-size", "14");
-    }
+    expect(screen.getByTestId("project-actions")).toHaveClass("size-6");
+    expect(screen.getByTestId("project-actions")).not.toHaveClass("size-7");
+    expect(screen.getByTestId("project-new-session")).toHaveClass("size-6");
+    expect(screen.getByTestId("project-new-session")).not.toHaveClass("size-7");
     // Same compact size as the session-row kebab it aligns with.
     expect(screen.getByTestId("conversation-actions")).toHaveClass("size-6");
   });
@@ -439,13 +363,10 @@ describe("quick pin/unpin hover button", () => {
     mocks.projects = ["Sprint 42"];
     renderSidebar();
 
-    for (const button of [
-      screen.getByTestId("new-project"),
-      screen.getByTestId("project-list-actions"),
-    ]) {
-      expect(button).toHaveClass("size-6", "text-muted-foreground", "hover:text-foreground");
-      expect(button).not.toHaveClass("size-7");
-    }
+    expect(screen.getByTestId("new-project")).toHaveClass("size-6");
+    expect(screen.getByTestId("new-project")).not.toHaveClass("size-7");
+    expect(screen.getByTestId("project-list-actions")).toHaveClass("size-6");
+    expect(screen.getByTestId("project-list-actions")).not.toHaveClass("size-7");
   });
 
   it("hides the Projects list-actions kebab when there are no projects", () => {
@@ -466,13 +387,6 @@ describe("quick pin/unpin hover button", () => {
     expect(screen.queryByText("Pinned")).toBeNull();
     const pinButton = screen.getByTestId("quick-pin-conversation");
     expect(pinButton).toHaveAttribute("aria-label", "Pin conversation");
-    expect(pinButton).toHaveClass("text-muted-foreground", "hover:text-foreground");
-    expect(pinButton.querySelector("svg")).toHaveClass("size-3.5");
-    expect(pinButton.querySelector("svg")).toHaveAttribute("data-icon-size", "14");
-    const actionsButton = screen.getByTestId("conversation-actions");
-    expect(actionsButton).toHaveClass("text-muted-foreground", "hover:text-foreground");
-    expect(actionsButton.querySelector("svg")).toHaveClass("size-3.5");
-    expect(actionsButton.querySelector("svg")).toHaveAttribute("data-icon-size", "14");
 
     fireEvent.click(pinButton);
 
@@ -671,12 +585,7 @@ describe("double-click to rename", () => {
     mockConversations([{ ...CONV, owner: "other@example.com" }]);
     renderSidebar();
     // Radix Tabs triggers activate on mousedown (primary button), not click.
-    fireEvent.pointerDown(screen.getByTestId("session-filter"), {
-      button: 0,
-      ctrlKey: false,
-      pointerType: "mouse",
-    });
-    fireEvent.click(screen.getByTestId("session-filter-shared"));
+    fireEvent.mouseDown(screen.getByTestId("sidebar-tab-shared"), { button: 0 });
 
     fireEvent.dblClick(screen.getByRole("link", { name: /My Session/ }));
 
@@ -712,10 +621,11 @@ describe("pinned row project flyout", () => {
     expect(within(flyout).getByText("Moonshot")).toBeInTheDocument();
     const flyoutTitle = within(flyout).getByText("My Session");
     expect(flyoutTitle).toBeInTheDocument();
-    // The flyout title matches sidebar row names through the shared compact
-    // class, which resolves to the same text-ui step as Appearance content.
+    // The flyout title is sized to match the sidebar row name
+    // (`sidebar-compact-text`, 13px at the default), not the larger `text-sm`.
+    // Both scale with the UI font-size setting via the rem-based root.
     expect(flyoutTitle).toHaveClass("sidebar-compact-text");
-    expect(flyoutTitle).not.toHaveClass("text-ui");
+    expect(flyoutTitle).not.toHaveClass("text-sm");
     expect(within(flyout).getByTestId("pinned-project-flyout-branch")).toHaveTextContent(
       "fix/sidebar-row-height",
     );
@@ -888,33 +798,24 @@ describe("mark as unread", () => {
 });
 
 describe("right-click context menu", () => {
-  it("suppresses an open request only while the session row is dragging", () => {
-    mocks.isMobile = true;
-    mocks.isDragging = true;
-    const view = renderSidebar();
-
-    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
-    expect(screen.queryByTestId("rename-conversation")).toBeNull();
-
-    // Live drag state clears with the gesture; no suppression flag survives to
-    // swallow the next legitimate right-click.
-    mocks.isDragging = false;
-    view.rerenderSidebar();
-    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
-    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
-  });
-
-  it("opens the context menu from the keyboard after a drag ends", () => {
+  it("leaves keyboard link activation untouched after a drag ends", async () => {
     mocks.isMobile = true;
     mocks.isDragging = true;
     const view = renderSidebar();
 
     mocks.isDragging = false;
     view.rerenderSidebar();
+    await act(
+      () =>
+        new Promise<void>((resolve) => {
+          setTimeout(resolve, 0);
+        }),
+    );
 
-    // Shift+F10 / Menu key emit contextmenu with no preceding pointerdown.
-    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
-    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    // Enter/Space activation reaches a link as a click with no pointerdown.
+    // The drag guard must not require or consume a preceding pointer gesture.
+    fireEvent.click(screen.getByRole("link", { name: /My Session/ }), { detail: 0 });
+    expect(view.onClose).toHaveBeenCalledOnce();
   });
 
   it("opens the same action items as the kebab and drives the same handlers", () => {
@@ -1061,204 +962,422 @@ describe("right-click context menu", () => {
   });
 });
 
-describe("touch swipe actions", () => {
-  // jsdom has no real touch, so drive the gesture with pointer events. The row
-  // handlers gate on a primary, non-mouse pointer (see useRowSwipe); default
-  // jsdom PointerEvents omit those, so set them explicitly. A swipe is a
-  // down → horizontal move past the commit threshold → up on the row's <li>.
-  const POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
+const TOUCH_POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
 
-  beforeEach(() => {
-    mocks.hasCoarsePointer = true;
+function touchTarget() {
+  const link = screen.getByRole("link", { name: /My Session/ });
+  return { link, row: link.closest("li")! };
+}
+
+function touchPoint(target: Element, x: number, y: number, identifier = 0) {
+  return {
+    identifier,
+    target,
+    clientX: x,
+    clientY: y,
+    pageX: x,
+    pageY: y,
+    screenX: x,
+    screenY: y,
+  };
+}
+
+function startTouch(x = 100, y = 100) {
+  const { link } = touchTarget();
+  const touch = touchPoint(link, x, y);
+  fireEvent.pointerDown(link, { ...TOUCH_POINTER, clientX: x, clientY: y });
+  fireEvent.touchStart(link, { touches: [touch], changedTouches: [touch] });
+}
+
+function moveTouch(x: number, y: number, touches = 1) {
+  const { link } = touchTarget();
+  const points = Array.from({ length: touches }, (_, index) =>
+    touchPoint(link, x + index, y + index, index),
+  );
+  const allowsNativeScroll = fireEvent.pointerMove(link, {
+    ...TOUCH_POINTER,
+    clientX: x,
+    clientY: y,
   });
+  fireEvent.touchMove(link, { touches: points, changedTouches: points });
+  return allowsNativeScroll;
+}
 
-  // Drag the row and hold at `dx`, so a test can inspect the reveal mid-gesture.
-  // `release` finishes it, carrying the same dx the drag ended on.
-  function moveSwipeRow(dx: number) {
-    const link = screen.getByRole("link", { name: /My Session/ });
-    const li = link.closest("li")!;
-    fireEvent.pointerDown(li, { ...POINTER, clientX: 100, clientY: 100 });
-    // First move locks the axis; the second carries it past the commit point.
-    fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + Math.sign(dx) * 20, clientY: 100 });
-    fireEvent.pointerMove(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
-    return {
-      li,
-      release() {
-        fireEvent.pointerUp(li, { ...POINTER, clientX: 100 + dx, clientY: 100 });
-        // Include the browser's trailing click, un-prevented: the row itself
-        // must suppress it (see the trailing-click tests) — never the test.
-        fireEvent.click(link);
-      },
-    };
-  }
+function endTouch(x = 100, y = 100) {
+  const { link } = touchTarget();
+  const touch = touchPoint(link, x, y);
+  fireEvent.pointerUp(link, { ...TOUCH_POINTER, clientX: x, clientY: y });
+  fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
+}
 
-  function swipeRow(dx: number) {
-    moveSwipeRow(dx).release();
+describe("touch gesture arbitration", () => {
+  function advanceHold(ms = ROW_GESTURE_HOLD_MS) {
+    act(() => vi.advanceTimersByTime(ms));
   }
 
-  // The reveal sitting behind the row is inert and shows only the icon for the
-  // action that direction commits to.
-  function expectRevealIcons(li: Element, icons: { shows: string; hides: string }) {
-    const reveal = li.firstElementChild!;
-    expect(reveal).toHaveClass("pointer-events-none");
-    expect(reveal.querySelector(icons.shows)).not.toBeNull();
-    expect(reveal.querySelector(icons.hides)).toBeNull();
-  }
+  it("keeps a hold past Radix's own long-press from opening a second menu", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { link, row } = touchTarget();
+    const contextMenus: MouseEvent[] = [];
+    link.addEventListener("contextmenu", (event) => contextMenus.push(event));
+
+    // Radix's trigger arms its own 700ms touch long-press. Holding past it must
+    // not open a menu mid-gesture — the recognizer owns the only open path, on
+    // release — or a hold-then-drag would drag underneath an open menu.
+    startTouch(140, 220);
+    advanceHold(900);
+    expect(document.querySelectorAll('[role="menu"]')).toHaveLength(0);
+    expect(contextMenus).toHaveLength(0);
+    expect(row).toHaveClass("scale-[1.01]");
+
+    endTouch(140, 220);
+    expect(document.querySelectorAll('[role="menu"]')).toHaveLength(1);
+    expect(contextMenus).toHaveLength(1);
+  });
+
+  it("leaves a pen long-press to Radix, which the recognizer never claims", () => {
+    // The recognizer is touch-only, so suppressing Radix for pen would strip
+    // stylus users of the long-press menu they had before.
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { link } = touchTarget();
+    const pen = { pointerId: 1, isPrimary: true, pointerType: "pen" as const };
+
+    fireEvent.pointerDown(link, { ...pen, clientX: 140, clientY: 220 });
+    act(() => vi.advanceTimersByTime(900));
 
-  it("maps the Settings swipe-left selection to the row's left-swipe action", () => {
-    chooseSwipeActionInSettings("left", "delete");
-    expect(readSwipeActions()).toEqual({ left: "delete", right: "none" });
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+  });
 
+  it("opens the positioned context menu when a still hold is released without dragging", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
-    swipeRow(-90);
+    const { link, row } = touchTarget();
+    const contextMenus: MouseEvent[] = [];
+    link.addEventListener("contextmenu", (event) => contextMenus.push(event));
 
-    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
-    expect(mocks.archive.mutate).not.toHaveBeenCalled();
-    fireEvent.click(screen.getByRole("button", { name: "Delete" }));
-    expect(mocks.del.mutate).toHaveBeenCalledTimes(1);
+    startTouch(140, 220);
+    advanceHold();
+    expect(row).toHaveClass("scale-[1.01]");
+    expect(row).not.toHaveClass("opacity-40");
+
+    endTouch(140, 220);
+    expect(screen.getByTestId("archive-conversation")).toBeInTheDocument();
+    expect(row).not.toHaveClass("opacity-40");
+    expect(contextMenus.at(-1)).toMatchObject({ clientX: 140, clientY: 220 });
+
+    fireEvent.click(screen.getByTestId("archive-conversation"));
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
   });
 
-  it("maps the Settings swipe-right selection to the row's right-swipe action", () => {
-    chooseSwipeActionInSettings("right", "archive");
-    expect(readSwipeActions()).toEqual({ left: "archive", right: "archive" });
+  it("starts dnd-kit only when an armed hold moves, without opening the menu", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    expect(row).not.toHaveClass("opacity-40");
+
+    moveTouch(101, 100);
+    expect(row).toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    endTouch(101, 100);
+  });
 
+  it("does not arm a hold on a finger that is still creeping", () => {
+    // A slow scroll drifts under the 12px scroll threshold but is not holding
+    // still. Arming here would capture the pointer and hand the gesture to
+    // dnd-kit, which preventDefaults the scroll away for the rest of the touch.
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
-    swipeRow(90);
+    const { row } = touchTarget();
+
+    startTouch();
+    // 3px per 100ms: past the 8px hold tolerance by the 400ms mark, but still
+    // under the 12px that would have resolved it to scroll outright.
+    for (let step = 1; step <= 4; step += 1) {
+      advanceHold(100);
+      moveTouch(100, 100 + step * 3);
+    }
 
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
-    expect(mocks.del.mutate).not.toHaveBeenCalled();
-    expect(screen.queryByText("Delete conversation?")).toBeNull();
+    expect(row).not.toHaveClass("scale-[1.01]");
+    expect(row).not.toHaveClass("opacity-40");
+    endTouch(100, 112);
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
-  it("reveals the same action that fires in both configured directions", () => {
-    writeSwipeActions({ left: "delete", right: "archive" });
+  it("leaves a normal-speed vertical flick to the list scroller", () => {
+    // Scrolling must stay native even though the finger starts on a row: the
+    // flick clears 12px within a frame, long before the hold could arm.
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
 
-    const leftSwipe = moveSwipeRow(-90);
-    expectRevealIcons(leftSwipe.li, { shows: ".lucide-trash-2", hides: ".lucide-archive" });
-    leftSwipe.release();
-    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
-    expect(mocks.archive.mutate).not.toHaveBeenCalled();
-    fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+    startTouch();
+    advanceHold(16);
+    expect(moveTouch(100, 116)).toBe(true);
+    advanceHold(600);
 
-    const rightSwipe = moveSwipeRow(90);
-    expectRevealIcons(rightSwipe.li, { shows: ".lucide-archive", hides: ".lucide-trash-2" });
-    rightSwipe.release();
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
-    expect(screen.queryByText("Delete conversation?")).toBeNull();
+    expect(row).not.toHaveClass("scale-[1.01]");
+    expect(row).not.toHaveClass("opacity-40");
+    endTouch(100, 116);
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
-  it("runs the archive path when swiping the archive-configured direction", () => {
-    // Default: swipe-left → archive. Swipe left past the commit threshold.
+  it("keeps a slow pre-hold horizontal gesture as a swipe", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    advanceHold(260);
+    moveTouch(94, 100);
+    advanceHold(80);
+    moveTouch(80, 100);
+    expect(row).not.toHaveClass("opacity-40");
+    moveTouch(10, 100);
+    expect(row.querySelector<HTMLElement>("div.relative")?.style.marginRight).not.toBe("");
+    endTouch(10, 100);
 
-    swipeRow(-90);
-
-    // Archiving is a single PATCH — the server stops the runner once the flag
-    // commits, so a client-side stop would race it (see runArchive).
     expect(mocks.archive.mutate).toHaveBeenCalledWith(
       { id: "conv_1", archived: true },
       expect.anything(),
     );
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
-    expect(mocks.stopSession.mutate).not.toHaveBeenCalled();
-    // Archive never routes through delete.
-    expect(mocks.del.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
-  it("opens the delete confirm dialog (no immediate delete) when swiping the delete direction", () => {
-    // Map swipe-right → delete, then swipe right.
-    writeSwipeActions({ left: "archive", right: "delete" });
+  it("yields vertical travel to native scroll with no other outcome", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
 
-    swipeRow(90);
-
-    // The confirm dialog opens — delete stays behind it, so no mutation yet.
-    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
-    expect(mocks.del.mutate).not.toHaveBeenCalled();
+    startTouch();
+    expect(moveTouch(100, 120)).toBe(true);
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    endTouch(100, 120);
 
-    // Confirming in the dialog fires the same delete the kebab flow uses.
-    fireEvent.click(screen.getByRole("button", { name: "Delete" }));
-    expect(mocks.del.mutate).toHaveBeenCalledWith(
-      { id: "conv_1", deleteBranch: false },
-      expect.anything(),
-    );
-    expect(mocks.del.mutate).toHaveBeenCalledTimes(1);
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("suppresses the trailing click after a committed swipe so it doesn't navigate", () => {
-    // Browsers can synthesize a click on the row link after the drag; the
-    // row's click-capture guard must swallow it (no test-side preventDefault),
-    // or a swipe-to-archive would also open the session it just archived.
+  it("assigns vertical-dominant travel exactly at the Euclidean boundary to scroll", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
-    expect(screen.getByTestId("location-probe")).toHaveTextContent("/");
+    const { row } = touchTarget();
 
-    swipeRow(-90);
+    // Exactly 12px of travel, so it sits on the activation boundary itself
+    // rather than safely past it. Integer deltas keep it off a float edge.
+    startTouch();
+    expect(moveTouch(100, 112)).toBe(true);
 
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
-    expect(screen.getByTestId("location-probe")).toHaveTextContent(/^\/$/);
+    // Decided here, at move time — not later by the hold's drift check. Turning
+    // back onto the horizontal axis must stay inert, which it only does if the
+    // gesture already resolved to scroll.
+    moveTouch(60, 112);
+    expect(row.querySelector<HTMLElement>("div.relative")?.style.marginRight).toBe("");
+
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    endTouch(60, 112);
+
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("suppresses the trailing click after a below-threshold swipe as well", () => {
-    // Even an uncommitted (beyond-slop) swipe is a drag, not a tap — its
-    // trailing click must not navigate either.
+  it("stops tracking when a locked swipe reverses into an inert direction", () => {
+    vi.useFakeTimers();
+    // Left archives; right is inert. Locking left then dragging back past the
+    // origin crosses into "none", which must not translate the row with an
+    // empty reveal behind it.
+    writeSwipeActions({ left: "archive", right: "none" });
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
+    const surface = row.querySelector<HTMLElement>("div.relative");
 
-    swipeRow(-40);
+    startTouch();
+    moveTouch(80, 100);
+    expect(surface?.style.marginRight).toBe("20px");
 
+    moveTouch(190, 100);
+    expect(surface?.style.marginLeft).toBe("");
+    expect(surface?.style.marginRight).toBe("");
+
+    endTouch(190, 100);
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
-    expect(screen.getByTestId("location-probe")).toHaveTextContent(/^\/$/);
   });
 
-  it("keeps a plain tap navigating (the suppression is scoped to swipes)", () => {
+  it("hands travel to the swipe as soon as the horizontal axis clears 12px", () => {
+    vi.useFakeTimers();
+    writeSwipeActions({ left: "archive", right: "archive" });
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
+    const surface = row.querySelector<HTMLElement>("div.relative");
+
+    // (10,8) is 12.8px of travel but only 10px horizontally, so it is scroll,
+    // not swipe: the axis threshold governs, not the Euclidean length. Pairs
+    // with the boundary case above to pin both halves of the rule.
+    startTouch();
+    moveTouch(110, 108);
+    expect(surface?.style.marginRight).toBe("");
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    endTouch(110, 108);
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(row).not.toHaveClass("opacity-40");
+  });
+
+  it("assigns exactly 12px horizontal travel to swipe", () => {
+    vi.useFakeTimers();
+    writeSwipeActions({ left: "archive", right: "archive" });
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    moveTouch(112, 100);
+    const surface = row.querySelector<HTMLElement>("div.relative");
+    expect(surface?.style.marginLeft).toBe("12px");
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    expect(row).not.toHaveClass("opacity-40");
+    endTouch(112, 100);
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+  });
 
-    fireEvent.click(screen.getByRole("link", { name: /My Session/ }));
+  it("leaves a short still press as plain link activation", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    const view = renderSidebar();
+    const { link, row } = touchTarget();
+
+    startTouch();
+    advanceHold(ROW_GESTURE_HOLD_MS - 1);
+    endTouch();
+    fireEvent.click(link);
 
-    expect(screen.getByTestId("location-probe")).toHaveTextContent("/c/conv_1");
+    expect(view.onClose).toHaveBeenCalledOnce();
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("shows the unarchive glyph when swiping an archived row", () => {
-    // runArchive toggles, so on an archived row the gesture restores the
-    // session — the reveal must mirror the kebab's Unarchive affordance, not
-    // promise a re-archive.
-    mockConversations([{ ...CONV, archived: true }]);
+  it("fully resets when the pointer is cancelled", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
     renderSidebar();
-    fireEvent.pointerDown(screen.getByTestId("session-filter"), {
-      button: 0,
-      ctrlKey: false,
-      pointerType: "mouse",
-    });
-    fireEvent.click(screen.getByTestId("session-filter-archived"));
+    const { link, row } = touchTarget();
+
+    startTouch();
+    moveTouch(80, 100);
+    const surface = row.querySelector<HTMLElement>("div.relative");
+    expect(surface?.style.marginRight).toBe("20px");
+    fireEvent.pointerCancel(link, { ...TOUCH_POINTER, clientX: 80, clientY: 100 });
+    fireEvent.touchCancel(link, { touches: [], changedTouches: [touchPoint(link, 80, 100)] });
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+
+    expect(surface?.style.marginRight).toBe("");
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+  });
 
-    const swipe = moveSwipeRow(-90);
-    expectRevealIcons(swipe.li, {
-      shows: ".lucide-archive-restore",
-      hides: ".lucide-archive",
+  it("rejects a second touch before drag activation", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { link, row } = touchTarget();
+
+    startTouch();
+    fireEvent.pointerDown(link, {
+      pointerId: 2,
+      isPrimary: false,
+      pointerType: "touch",
+      clientX: 104,
+      clientY: 104,
     });
-    swipe.release();
+    const touches = [touchPoint(link, 100, 100), touchPoint(link, 104, 104, 1)];
+    fireEvent.touchStart(link, { touches, changedTouches: [touches[1]] });
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    moveTouch(120, 100, 2);
 
-    // Releasing runs the same toggle the kebab's Unarchive item uses.
-    expect(mocks.archive.mutate).toHaveBeenCalledWith({ id: "conv_1", archived: false });
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    fireEvent.pointerCancel(link, { ...TOUCH_POINTER, clientX: 120, clientY: 100 });
   });
+});
 
-  it("claims the horizontal touch axis only while a swipe action is configured", () => {
-    // With an action armed, the row must override touch-action so the browser
-    // doesn't take the horizontal pan mid-gesture...
-    const { unmount } = renderSidebar();
-    const li = () => screen.getByRole("link", { name: /My Session/ }).closest("li")!;
-    expect(li()).toHaveClass("touch-pan-y");
-    unmount();
-
-    // ...but with BOTH directions inert there is no gesture to protect, so the
-    // override is dropped and the browser keeps its own horizontal gestures.
-    writeSwipeActions({ left: "none", right: "none" });
+describe("touch swipe actions", () => {
+  // jsdom has no real touch, so drive the gesture with pointer events. The row
+  // recognizer gates on a primary touch pointer; pair each pointer event with
+  // its touch event so the real dnd-kit activator also sees the sequence.
+
+  function swipeRow(dx: number) {
+    startTouch();
+    // First move locks the axis; the second carries it past the commit point.
+    moveTouch(100 + Math.sign(dx) * 20, 100);
+    moveTouch(100 + dx, 100);
+    endTouch(100 + dx, 100);
+  }
+
+  it("runs the archive path when swiping the archive-configured direction", () => {
+    // Default: swipe-left → archive. Swipe left past the commit threshold.
+    mocks.isMobile = true;
     renderSidebar();
-    expect(li()).not.toHaveClass("touch-pan-y");
+
+    swipeRow(-90);
+
+    // Archiving is a single PATCH — the server stops the runner once the flag
+    // commits, so a client-side stop would race it (see runArchive).
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+    expect(mocks.stopSession.mutate).not.toHaveBeenCalled();
+    // Archive never routes through delete.
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+  });
+
+  it("opens the delete confirm dialog (no immediate delete) when swiping the delete direction", () => {
+    // Map swipe-right → delete, then swipe right.
+    writeSwipeActions({ left: "archive", right: "delete" });
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(90);
+
+    // The confirm dialog opens — delete stays behind it, so no mutation yet.
+    expect(screen.getByText("Delete conversation?")).toBeInTheDocument();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
+
+    // Confirming in the dialog fires the same delete the kebab flow uses.
+    fireEvent.click(screen.getByRole("button", { name: "Delete" }));
+    expect(mocks.del.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", deleteBranch: false },
+      expect.anything(),
+    );
   });
 
   it("does nothing when swiping a direction mapped to none", () => {
     // Default: swipe-right → none. Swipe right; nothing should fire.
+    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(90);
@@ -1271,6 +1390,7 @@ describe("touch swipe actions", () => {
   it("supports both directions mapped to the same action", () => {
     // Both directions archive — a swipe either way runs the archive path.
     writeSwipeActions({ left: "archive", right: "archive" });
+    mocks.isMobile = true;
     renderSidebar();
 
     swipeRow(90);
@@ -1287,302 +1407,152 @@ describe("touch swipe actions", () => {
     );
   });
 
-  it("does not fire the action for a short swipe below the commit threshold", () => {
+  it("commits a fast flick from the release position before React renders", () => {
+    mocks.isMobile = true;
     renderSidebar();
+    const { link } = touchTarget();
+    startTouch(200, 100);
 
-    // Past the activation lock (20px) but short of the commit distance (72px).
-    swipeRow(-40);
-    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    act(() => {
+      for (const x of [180, 100]) {
+        const touch = touchPoint(link, x, 100);
+        fireEvent.pointerMove(link, { ...TOUCH_POINTER, clientX: x, clientY: 100 });
+        fireEvent.touchMove(link, { touches: [touch], changedTouches: [touch] });
+      }
+      const touch = touchPoint(link, 100, 100);
+      fireEvent.pointerUp(link, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+      fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
+    });
+
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
   });
 
-  it("does not fire at 71px, immediately below the commit boundary", () => {
+  it("does not commit after a flick returns below the threshold before release", () => {
+    mocks.isMobile = true;
     renderSidebar();
+    const { link } = touchTarget();
+    startTouch(200, 100);
 
-    swipeRow(-71);
+    act(() => {
+      for (const x of [100, 190]) {
+        const touch = touchPoint(link, x, 100);
+        fireEvent.pointerMove(link, { ...TOUCH_POINTER, clientX: x, clientY: 100 });
+        fireEvent.touchMove(link, { touches: [touch], changedTouches: [touch] });
+      }
+      const touch = touchPoint(link, 190, 100);
+      fireEvent.pointerUp(link, { ...TOUCH_POINTER, clientX: 190, clientY: 100 });
+      fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
+    });
 
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
   });
 
-  it("fires exactly once at the 72px commit boundary", () => {
+  it("resists travel past commit and caps the row offset", () => {
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
+    const surface = row.querySelector<HTMLElement>("div.relative")!;
 
-    swipeRow(-72);
+    startTouch(400, 100);
+    moveTouch(340, 100);
+    expect(surface.style.marginRight).toBe("60px");
+    moveTouch(100, 100);
+    expect(surface.style.marginRight).toBe("96px");
+    endTouch(100, 100);
 
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
   });
 
-  it("commits the configured action on a wide viewport with a coarse pointer", () => {
-    expect(mocks.isMobile).toBe(false);
-    expect(mocks.hasCoarsePointer).toBe(true);
+  it("ignores touch gestures that bubble from a portalled dialog", () => {
+    mocks.isMobile = true;
     renderSidebar();
+    const { row } = touchTarget();
+    const surface = row.querySelector<HTMLElement>("div.relative")!;
 
-    swipeRow(-90);
-    expect(mocks.archive.mutate).toHaveBeenCalledTimes(1);
+    fireEvent.pointerDown(screen.getByTestId("conversation-actions"), { button: 0 });
+    fireEvent.click(screen.getByTestId("delete-conversation"));
+    const confirm = screen.getByRole("button", { name: "Delete" });
+    fireEvent.pointerDown(confirm, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+    fireEvent.pointerMove(confirm, { ...TOUCH_POINTER, clientX: 10, clientY: 100 });
+    fireEvent.pointerUp(confirm, { ...TOUCH_POINTER, clientX: 10, clientY: 100 });
+
+    expect(surface.style.marginLeft).toBe("");
+    expect(surface.style.marginRight).toBe("");
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(mocks.del.mutate).not.toHaveBeenCalled();
   });
 
-  it("ignores touch swipes when only fine pointers are available", () => {
-    mocks.hasCoarsePointer = false;
+  it("does not fire the action for a short swipe below the commit threshold", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    // Past the activation lock (20px) but short of the commit distance (72px).
+    swipeRow(-40);
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+  });
+
+  it("ignores swipes on desktop (non-touch viewport)", () => {
+    // Desktop (default isMobile=false) leaves the gesture disabled entirely.
     renderSidebar();
 
     swipeRow(-90);
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("ignores non-touch pointers when a coarse pointer also exists", () => {
-    // A touchscreen laptop's pen and mouse paths remain inert.
+  it("ignores non-touch pointers (pen/stylus/mouse) on mobile", () => {
+    // The gesture is touch-only. Swipe LEFT, which is configured to archive, so
+    // the direction itself can't be what makes this inert — and assert the row
+    // never moves, not just that no mutation fired.
+    vi.useFakeTimers();
+    writeSwipeActions({ left: "archive", right: "archive" });
+    mocks.isMobile = true;
     renderSidebar();
 
-    const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
-    for (const [pointerId, pointerType] of ["pen", "mouse"].entries()) {
-      const pointer = { pointerId, isPrimary: true, pointerType };
-      fireEvent.pointerDown(li, { ...pointer, clientX: 100, clientY: 100 });
-      fireEvent.pointerMove(li, { ...pointer, clientX: 120, clientY: 100 });
-      fireEvent.pointerMove(li, { ...pointer, clientX: 190, clientY: 100 });
-      fireEvent.pointerUp(li, { ...pointer, clientX: 190, clientY: 100 });
-    }
+    const link = screen.getByRole("link", { name: /My Session/ });
+    const li = link.closest("li")!;
+    const surface = li.querySelector<HTMLElement>("div.relative");
+    const pen = { pointerId: 1, isPrimary: true, pointerType: "pen" as const };
+    fireEvent.pointerDown(li, { ...pen, clientX: 100, clientY: 100 });
+    fireEvent.pointerMove(li, { ...pen, clientX: 80, clientY: 100 });
+    fireEvent.pointerMove(li, { ...pen, clientX: 10, clientY: 100 });
+
+    // No translate, and holding a pen still never arms the long-press.
+    expect(surface?.style.marginRight).toBe("");
+    act(() => vi.advanceTimersByTime(ROW_GESTURE_HOLD_MS + 1));
+    expect(li).not.toHaveClass("scale-[1.01]");
+
+    fireEvent.pointerUp(li, { ...pen, clientX: 10, clientY: 100 });
 
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
     expect(mocks.del.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
   it("yields a primarily-vertical drag to scroll (no action)", () => {
     // A mostly-vertical move is scroll intent — the gesture bails and never
     // fires, even though it travels well past the commit distance horizontally.
+    mocks.isMobile = true;
     renderSidebar();
 
     const li = screen.getByRole("link", { name: /My Session/ }).closest("li")!;
-    fireEvent.pointerDown(li, { ...POINTER, clientX: 100, clientY: 100 });
+    fireEvent.pointerDown(li, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
     // First move is dominated by the vertical axis → decided="other".
-    fireEvent.pointerMove(li, { ...POINTER, clientX: 105, clientY: 140 });
-    fireEvent.pointerMove(li, { ...POINTER, clientX: 10, clientY: 180 });
-    fireEvent.pointerUp(li, { ...POINTER, clientX: 10, clientY: 180 });
+    fireEvent.pointerMove(li, { ...TOUCH_POINTER, clientX: 105, clientY: 140 });
+    fireEvent.pointerMove(li, { ...TOUCH_POINTER, clientX: 10, clientY: 180 });
+    fireEvent.pointerUp(li, { ...TOUCH_POINTER, clientX: 10, clientY: 180 });
 
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
     expect(mocks.del.mutate).not.toHaveBeenCalled();
   });
 });
 
-describe("useRowSwipe — dnd coexistence", () => {
-  // Focused hook tests: driving real dnd-kit dragging in jsdom is unreliable,
-  // so control `isDragging` directly to prove the swipe yields to the drag.
-  const ACTIONS = { left: "archive", right: "none" } as const;
-
-  // Row stand-in: pointer-capture no-ops (jsdom's are stubbed in test-setup)
-  // plus `contains`, which the hook uses to reject events bubbling out of a
-  // portal. Defaults to containing everything (the normal in-row case).
-  const PORTAL_ROW = {
-    setPointerCapture: () => {},
-    releasePointerCapture: () => {},
-    hasPointerCapture: () => false,
-    contains: () => true,
-  };
-
-  function makePointer(over: {
-    pointerId: number;
-    clientX: number;
-    clientY: number;
-    target?: unknown;
-    currentTarget?: unknown;
-  }) {
-    // Minimal ReactPointerEvent stand-in — only the fields useRowSwipe reads.
-    return {
-      pointerType: "touch",
-      isPrimary: true,
-      preventDefault: () => {},
-      target: document.createElement("div"),
-      currentTarget: PORTAL_ROW,
-      ...over,
-    } as unknown as ReactPointerEvent;
-  }
-
-  it("(a) yields a primarily-vertical move: decided=other, no translate, no action", () => {
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    act(() => {
-      // Vertical dominates → the gesture hands off to scroll/drag.
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 105, clientY: 140 }));
-    });
-    // No translate offset accumulated.
-    expect(result.current.dx).toBe(0);
-
-    act(() => {
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 105, clientY: 140 }));
-    });
-    expect(onAction).not.toHaveBeenCalled();
-  });
-
-  it("(b) bails once a dnd-kit drag begins mid-gesture: dx resets, no action on release", () => {
-    const onAction = vi.fn();
-    let isDragging = false;
-    const { result, rerender } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    act(() => {
-      // A real horizontal swipe left (the archive-configured direction) locks
-      // in and translates the row.
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 70, clientY: 100 }));
-    });
-    expect(result.current.dx).not.toBe(0);
-
-    // dnd-kit's long-press drag activates; re-render with isDragging=true.
-    isDragging = true;
-    rerender();
-    act(() => {
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 20, clientY: 100 }));
-    });
-    // The swipe bailed: translate snaps back to rest.
-    expect(result.current.dx).toBe(0);
-
-    act(() => {
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 20, clientY: 100 }));
-    });
-    expect(onAction).not.toHaveBeenCalled();
-  });
-
-  it("(c) commits a fast flick that releases before the last move renders", () => {
-    // A quick flick can lift the finger before React commits the render for the
-    // final pointermove. Release must decide on where the finger actually ended,
-    // so the move + up are dispatched inside ONE act() — no render in between.
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 200, clientY: 100 }));
-      // Lock the gesture, then travel well past the 72px commit threshold and
-      // release — all before the hook re-renders with the final offset.
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 180, clientY: 100 }));
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-
-    // -100px past the threshold in the archive-configured direction.
-    expect(onAction).toHaveBeenCalledWith("archive");
-    expect(onAction).toHaveBeenCalledTimes(1);
-    expect(result.current.dx).toBe(0);
-  });
-
-  it("(d) does not commit a flick that snaps back under the threshold before release", () => {
-    // The mirror case: travel past the threshold, then return under it and
-    // release, again with no render between the moves. Nothing should fire.
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 200, clientY: 100 }));
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-      // Back to only -10px: under the commit threshold at the moment of release.
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 190, clientY: 100 }));
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 190, clientY: 100 }));
-    });
-
-    expect(onAction).not.toHaveBeenCalled();
-  });
-
-  it("(f) tracks 1:1 to the commit point, then resists so the title stays in panel", () => {
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 400, clientY: 100 }));
-    });
-    // Up to the threshold the row follows the finger exactly.
-    act(() => {
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 340, clientY: 100 }));
-    });
-    expect(result.current.dx).toBe(-60);
-
-    // A 300px drag is damped and hard-capped — the row can't be dragged far
-    // enough to push its title out of the panel.
-    act(() => {
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    expect(result.current.dx).toBe(-96);
-
-    // Still commits — damping is visual only.
-    act(() => {
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    expect(onAction).toHaveBeenCalledWith("archive");
-  });
-
-  it("(g) rests at 0 when a locked swipe reverses into a direction mapped to none", () => {
-    // ACTIONS maps right to "none": a swipe locked going left that overshoots
-    // back past its origin must clamp at rest, not slide the row rightward over
-    // bare canvas with no hint behind it (release there already no-ops).
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    act(() => {
-      result.current.onPointerDown(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-    act(() => {
-      // Lock the gesture leftward (the archive direction).
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 70, clientY: 100 }));
-    });
-    expect(result.current.dx).toBe(-30);
-
-    act(() => {
-      // Reverse well past the origin into the inert right direction.
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 150, clientY: 100 }));
-    });
-    expect(result.current.dx).toBe(0);
-
-    act(() => {
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 150, clientY: 100 }));
-    });
-    expect(onAction).not.toHaveBeenCalled();
-  });
-
-  it("(e) ignores a pointerdown that bubbled out of a portal (open dialog)", () => {
-    // The row's dialogs render in portals but are React children, so their
-    // events bubble to the row's handlers. A drag inside the open delete dialog
-    // must not start a swipe on the row behind it.
-    const onAction = vi.fn();
-    const { result } = renderHook(() =>
-      useRowSwipe({ enabled: true, actions: ACTIONS, isDragging: false, onAction }),
-    );
-
-    // currentTarget is the row; target is portal content it does NOT contain.
-    const outside = document.createElement("div");
-    act(() => {
-      result.current.onPointerDown(
-        makePointer({
-          pointerId: 1,
-          clientX: 200,
-          clientY: 100,
-          target: outside,
-          currentTarget: { ...PORTAL_ROW, contains: () => false },
-        }),
-      );
-    });
-    act(() => {
-      result.current.onPointerMove(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-      result.current.onPointerUp(makePointer({ pointerId: 1, clientX: 100, clientY: 100 }));
-    });
-
-    expect(result.current.dx).toBe(0);
-    expect(onAction).not.toHaveBeenCalled();
-  });
-});
-
 describe("sharing kill switch", () => {
   it("disables the row's Share item for a manager when sharing_mode is off", () => {
     // CONV is owner-level (permission_level null → canManage), yet a server
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 7cdce0d099..98c6371ce0 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3,7 +3,6 @@ import {
   type CSSProperties,
   type KeyboardEvent,
   type MouseEvent,
-  type PointerEvent as ReactPointerEvent,
   type ReactNode,
   type RefObject,
   createContext,
@@ -61,7 +60,6 @@ import {
   MeasuringStrategy,
   MouseSensor,
   pointerWithin,
-  TouchSensor,
   useDraggable,
   useDroppable,
   useSensor,
@@ -150,16 +148,12 @@ import {
   useUnseenTick,
 } from "@/hooks/useUnseenConversations";
 import { cn } from "@/lib/utils";
-import {
-  type SwipeAction,
-  type SwipeActionPreferences,
-  useSwipeActions,
-} from "@/lib/swipeActionPreferences";
-import { useCoarsePointer } from "@/hooks/useCoarsePointer";
+import { type SwipeAction, useSwipeActions } from "@/lib/swipeActionPreferences";
 import { useIsMobileViewport } from "@/hooks/useIsMobileViewport";
 import { useResizableSidebar } from "@/hooks/useResizableSidebar";
 import { useSessionSwitchHotkey } from "@/hooks/useSessionSwitchHotkey";
 import { usePinnedSessionHotkeys } from "@/hooks/usePinnedSessionHotkeys";
+import { ROW_SWIPE_COMMIT_PX, RowGestureTouchSensor, useRowGesture } from "@/hooks/useRowGesture";
 import { isCurrentServerLocal } from "@/lib/serverOrigin";
 import { NewProjectButton } from "./NewProjectButton";
 import { SettingsSidebarBody, useSettingsRoute, useTrackSettingsReturn } from "./settingsNav";
@@ -186,190 +180,6 @@ import { SIDEBAR_ROW } from "./sidebarStyles";
 const SESSION_STATE_SLOT_CLASS =
   "-translate-y-1/2 pointer-events-none absolute top-1/2 right-[4.5rem] flex h-5 items-center transition-opacity md:right-1 md:group-hover:opacity-0 md:group-has-[:focus-visible]:opacity-0 md:group-has-[[aria-expanded=true]]:opacity-0";
 
-// Horizontal-swipe thresholds for the mobile row gesture (see useRowSwipe).
-// ACTIVATE locks the gesture to a swipe once horizontal travel dominates;
-// COMMIT is how far the row must be dragged to fire the action on release.
-const SWIPE_ACTIVATE_PX = 12;
-const SWIPE_COMMIT_PX = 72;
-// Cap the visual translate a little past the commit point so the row can't be
-// dragged clear across the panel.
-const SWIPE_MAX_PX = 96;
-// Past the commit point the row only keeps a third of further travel, so the
-// gesture resists instead of dragging the title out of the panel — the action is
-// already armed there, so extra movement carries no meaning.
-const SWIPE_RESIST = 1 / 3;
-
-/**
- * Map raw finger travel to the row's visual offset: 1:1 up to the commit point,
- * then damped and hard-capped at {@link SWIPE_MAX_PX}. Keeps the title inside
- * the panel while still acknowledging a longer drag.
- */
-function swipeOffset(deltaX: number): number {
-  const dir = Math.sign(deltaX);
-  const travel = Math.abs(deltaX);
-  if (travel <= SWIPE_COMMIT_PX) return deltaX;
-  const damped = SWIPE_COMMIT_PX + (travel - SWIPE_COMMIT_PX) * SWIPE_RESIST;
-  return dir * Math.min(damped, SWIPE_MAX_PX);
-}
-
-/** The configured action for a horizontal offset's direction (0 → "none"). */
-function actionFor(deltaX: number, actions: SwipeActionPreferences): SwipeAction {
-  if (deltaX === 0) return "none";
-  return deltaX < 0 ? actions.left : actions.right;
-}
-
-/**
- * Touch swipe gesture for a session row. Tracks a horizontal drag and, on
- * release past {@link SWIPE_COMMIT_PX}, invokes the action configured for that
- * direction (see swipeActionPreferences). Disambiguates from dnd-kit's
- * drag-to-project by axis (vertical movement yields to scroll/drag) and by
- * bailing once a dnd-kit drag is active. A direction mapped to "none" is inert.
- *
- * Returns the live translate offset (for the row transform + reveal hint) and
- * pointer/click handlers to spread on the row element. The click-capture
- * handler swallows the click some browsers still synthesize after the drag, so
- * a swipe never also navigates into the session.
- */
-export function useRowSwipe({
-  enabled,
-  actions,
-  isDragging,
-  onAction,
-}: {
-  enabled: boolean;
-  actions: SwipeActionPreferences;
-  isDragging: boolean;
-  onAction: (action: Exclude<SwipeAction, "none">) => void;
-}) {
-  const [dx, setDx] = useState(0);
-  // `decided` is null until the first qualifying move locks the gesture to a
-  // horizontal swipe ("swipe") or hands it back to scroll/drag ("other").
-  // `target` holds the element we called setPointerCapture on, so reset() can
-  // release it (capture lives on the translating row surface; a leak would
-  // interfere with adjacent rows and the dnd-kit handoff).
-  // `offset` mirrors the rendered `dx` but updates synchronously, so release
-  // commits on where the finger actually ended rather than on whatever render
-  // last landed — a fast flick can otherwise lift before React commits the
-  // final move, and the action would be decided from a stale offset.
-  const state = useRef<{
-    pointerId: number;
-    startX: number;
-    startY: number;
-    decided: "swipe" | "other" | null;
-    target: Element | null;
-    offset: number;
-  } | null>(null);
-  // True for the tick after a beyond-slop swipe released, so the click-capture
-  // handler can swallow the trailing click (pointer-capture + preventDefault
-  // behavior varies across mobile browsers — don't rely on it).
-  const justSwipedRef = useRef(false);
-
-  const reset = useCallback(() => {
-    const s = state.current;
-    // Release pointer capture if we took it — guarded so it's safe when we
-    // never captured (vertical/none gestures) or the element is already gone.
-    if (s?.target && s.target.hasPointerCapture(s.pointerId)) {
-      s.target.releasePointerCapture(s.pointerId);
-    }
-    state.current = null;
-    setDx(0);
-  }, []);
-
-  const onPointerDown = useCallback(
-    (e: ReactPointerEvent) => {
-      // Touch-only: pen/stylus/mouse never trigger a swipe.
-      if (!enabled || e.pointerType !== "touch" || !e.isPrimary) return;
-      // The row's dialogs/menus are React children but render into portals, and
-      // React bubbles portal events up the component tree — so a drag inside the
-      // open delete dialog would otherwise start a swipe on the row behind it.
-      // Portal content is not a DOM descendant, so containment rejects it.
-      const target = e.target;
-      if (target instanceof Node && !e.currentTarget.contains(target)) return;
-      state.current = {
-        pointerId: e.pointerId,
-        startX: e.clientX,
-        startY: e.clientY,
-        decided: null,
-        target: null,
-        offset: 0,
-      };
-    },
-    [enabled],
-  );
-
-  const onPointerMove = useCallback(
-    (e: ReactPointerEvent) => {
-      const s = state.current;
-      if (!s || s.pointerId !== e.pointerId) return;
-      // Once dnd-kit takes over (long-press drag), the swipe yields entirely.
-      if (isDragging) {
-        s.decided = "other";
-        s.offset = 0;
-        setDx(0);
-        return;
-      }
-      if (s.decided === "other") return;
-      const deltaX = e.clientX - s.startX;
-      const deltaY = e.clientY - s.startY;
-      if (s.decided === null) {
-        // Vertical intent → let the list scroll; horizontal → lock to a swipe.
-        if (Math.abs(deltaY) > Math.abs(deltaX) && Math.abs(deltaY) > SWIPE_ACTIVATE_PX) {
-          s.decided = "other";
-          return;
-        }
-        if (Math.abs(deltaX) < SWIPE_ACTIVATE_PX || Math.abs(deltaX) <= Math.abs(deltaY)) return;
-        // A direction mapped to "none" is inert — hand back to scroll/drag.
-        if (actionFor(deltaX, actions) === "none") {
-          s.decided = "other";
-          return;
-        }
-        s.decided = "swipe";
-        s.target = e.currentTarget;
-        e.currentTarget.setPointerCapture(e.pointerId);
-      }
-      e.preventDefault();
-      // A reversal into a direction mapped to "none" rests at 0 instead of
-      // sliding the row over bare canvas with no hint behind it.
-      const offset = actionFor(deltaX, actions) === "none" ? 0 : swipeOffset(deltaX);
-      s.offset = offset;
-      setDx(offset);
-    },
-    [actions, isDragging],
-  );
-
-  const onPointerUp = useCallback(
-    (e: ReactPointerEvent) => {
-      const s = state.current;
-      if (!s || s.pointerId !== e.pointerId) return;
-      // Commit off the synchronous offset, not the rendered `dx`.
-      const offset = s.offset;
-      const committed = s.decided === "swipe" && Math.abs(offset) >= SWIPE_COMMIT_PX;
-      const action = actionFor(offset, actions);
-      if (s.decided === "swipe") {
-        justSwipedRef.current = true;
-        setTimeout(() => {
-          justSwipedRef.current = false;
-        }, 0);
-      }
-      reset();
-      if (committed && action !== "none") onAction(action);
-    },
-    [actions, onAction, reset],
-  );
-
-  const onClickCapture = useCallback((e: MouseEvent) => {
-    if (!justSwipedRef.current) return;
-    // Only the trailing click on the row itself — clicks bubbling out of the
-    // row's portalled dialogs/menus are not descendants and pass through.
-    const target = e.target;
-    if (target instanceof Node && !e.currentTarget.contains(target)) return;
-    e.preventDefault();
-    e.stopPropagation();
-  }, []);
-
-  return { dx, onPointerDown, onPointerMove, onPointerUp, onPointerCancel: reset, onClickCapture };
-}
-
 // Match the Settings sidebar's ghost-button hover treatment across every home
 // sidebar row.
 const SIDEBAR_HOVER_HIGHLIGHT = "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50";
@@ -1661,12 +1471,11 @@ function ConversationList({
     project: string | null;
     isPinned: boolean;
   } | null>(null);
-  // Mouse: a small drag threshold so a plain click still navigates / opens the
-  // kebab. Touch: a press-and-hold delay so scrolling the list isn't hijacked
-  // into a drag. Keyboard users use the kebab menu instead (no KeyboardSensor).
+  // Mouse keeps its click-safe distance. Touch is activated only after the row
+  // recognizer resolves a held-and-moved finger to drag.
   const sensors = useSensors(
     useSensor(MouseSensor, { activationConstraint: { distance: 5 } }),
-    useSensor(TouchSensor, { activationConstraint: { delay: 250, tolerance: 8 } }),
+    useSensor(RowGestureTouchSensor),
   );
   const handleDragStart = useCallback((event: DragStartEvent) => {
     const data = event.active.data.current as
@@ -3100,7 +2909,6 @@ function ConversationRow({
   // project flyout's HoverCard and leave it lingering over the chat. Gate the
   // flyout off below the `md` breakpoint (see `projectFlyoutName`).
   const isMobile = useIsMobileViewport();
-  const hasCoarsePointer = useCoarsePointer();
   // Track the *live* active conversation id. Delete is fire-and-forget,
   // so the user can navigate to another conversation before the mutation
   // resolves — the onSuccess redirect must key off where they are now,
@@ -3113,6 +2921,7 @@ function ConversationRow({
   // session navigated to via `/c/:id`), scroll it toward the center of the
   // sidebar so it's comfortably in view rather than pinned to an edge.
   const rowRef = useRef<HTMLLIElement>(null);
+  const rowLinkRef = useRef<HTMLAnchorElement>(null);
   useEffect(() => {
     if (!isActive) return;
     rowRef.current?.scrollIntoView({ behavior: "smooth", block: "center" });
@@ -3236,47 +3045,57 @@ function ConversationRow({
         ? { kind: "unseen" as const }
         : (derivedState ?? (isStartingUp ? { kind: "starting" as const } : null));
 
-  // Drag-and-drop: a row is grabbable when the viewer owns it (re-filing is
-  // owner-only, like the Move-to-project kebab item), outside selection /
-  // archive / rename modes. Dragging it onto a project folder files it there;
-  // onto "Chats" unfiles it; onto "Pinned" pins it. The list-level <DndContext>
-  // routes the drop; the row only advertises itself and its source project +
-  // pinned state via the draggable `data`.
+  // Touch swipe → archive/delete. `useSwipeActions` is a live subscription, so
+  // changing Settings updates open rows without a remount.
+  const swipeActions = useSwipeActions();
+  const swipeActionRef = useRef<(action: Exclude<SwipeAction, "none">) => void>(() => {});
+  swipeActionRef.current = (action: Exclude<SwipeAction, "none">) => {
+    if (action === "archive") runArchive();
+    else setDeleteOpen(true);
+  };
+  const onSwipeAction = useCallback((action: Exclude<SwipeAction, "none">) => {
+    swipeActionRef.current(action);
+  }, []);
+  const swipeEnabled = isMobile && !selectionMode && isOwner && !isEditing;
+  const dragEnabled = isOwner && !selectionMode && !isArchived && !isEditing;
+  const openContextMenuAt = useCallback((point: { clientX: number; clientY: number }) => {
+    rowLinkRef.current?.dispatchEvent(
+      new globalThis.MouseEvent("contextmenu", {
+        bubbles: true,
+        cancelable: true,
+        button: 2,
+        clientX: point.clientX,
+        clientY: point.clientY,
+      }),
+    );
+  }, []);
+  const gesture = useRowGesture({
+    enabled: !selectionMode && !isEditing,
+    swipeEnabled,
+    dragEnabled,
+    actions: swipeActions,
+    onAction: onSwipeAction,
+    onLongPress: openContextMenuAt,
+  });
+
+  // The recognizer state travels with this draggable, so the static touch
+  // activator can make the decision for the row that received the event.
   const {
     listeners: dragListeners,
     setNodeRef: setDragNodeRef,
     isDragging,
   } = useDraggable({
     id: conversation.id,
-    data: { type: "session", label, project: currentProject, isPinned },
-    disabled: !isOwner || selectionMode || isArchived || isEditing,
-  });
-  // Radix and dnd-kit run independent long-press timers. Once this row's
-  // touch drag is active, reject Radix's later open request for that gesture.
-  const [contextMenuOpen, setContextMenuOpen] = useState(false);
-  const handleContextMenuOpenChange = useCallback(
-    (open: boolean) => {
-      if (open && isDragging) return;
-      setContextMenuOpen(open);
+    data: {
+      type: "session",
+      label,
+      project: currentProject,
+      isPinned,
+      rowGesture: gesture.dndData,
     },
-    [isDragging],
-  );
-  // The menu render branches below are mutually exclusive; switching branches
-  // remounts the ContextMenu, and a stale open=true would reopen the fresh
-  // menu anchored at the viewport corner. Reset during render (not in an
-  // effect) so the remounted menu never paints open.
-  const menuBranch = selectionMode
-    ? "none"
-    : projectFlyoutName
-      ? "flyout"
-      : isMobile
-        ? "mobile"
-        : "desktop";
-  const [prevMenuBranch, setPrevMenuBranch] = useState(menuBranch);
-  if (prevMenuBranch !== menuBranch) {
-    setPrevMenuBranch(menuBranch);
-    if (contextMenuOpen) setContextMenuOpen(false);
-  }
+    disabled: !dragEnabled,
+  });
+  const rowGestureListeners = gesture.listeners(dragListeners);
   // A drag ends with a synthetic click on the row's <Link> (mousedown + mouseup
   // on the same anchor still fires a click); swallow that one click so a drag
   // doesn't also navigate into the session. Flagged when a drag finishes,
@@ -3307,33 +3126,6 @@ function ConversationRow({
   // and only a row that saw both clicks may enter rename.
   const recentClickTimesRef = useRef<number[]>([]);
 
-  // Touch swipe → archive/delete. `useSwipeActions` is a live subscription, so
-  // changing the Settings selects updates open rows in the same session (no
-  // remount needed). Gated to a coarse pointer and to editable, non-selection
-  // rows so it can't fight bulk-select. Swipe→archive reuses
-  // runArchive; swipe→delete opens the same confirm dialog the kebab uses
-  // (never an immediate delete).
-  const swipeActions = useSwipeActions();
-  // useRowSwipe accepts only touch pointers, so a touchscreen laptop's mouse
-  // path stays untouched. With both directions mapped to "none" the gesture is
-  // fully disarmed — no handlers fire and the touch-action override below is
-  // dropped, so the browser keeps its horizontal gestures.
-  const swipeEnabled =
-    hasCoarsePointer &&
-    !selectionMode &&
-    isOwner &&
-    !isEditing &&
-    (swipeActions.left !== "none" || swipeActions.right !== "none");
-  const swipe = useRowSwipe({
-    enabled: swipeEnabled,
-    actions: swipeActions,
-    isDragging,
-    onAction: (action) => {
-      if (action === "archive") runArchive();
-      else setDeleteOpen(true);
-    },
-  });
-
   if (isEditing) {
     return (
       <li>
@@ -3465,8 +3257,16 @@ function ConversationRow({
   // mode) or wrapped in the right-click ContextMenuTrigger below.
   const rowLink = (
     <Link
+      ref={rowLinkRef}
       to={selectionMode ? "#" : `/c/${conversation.id}`}
       componentId="sidebar.conversation_switcher"
+      // The recognizer owns touch long-press, so stop the trigger's own 700ms
+      // timer from opening a second menu mid-hold; Radix skips its handler once
+      // this event is defaultPrevented. Scoped to touch because the recognizer
+      // ignores pen, which would otherwise lose its long-press entirely.
+      onPointerDown={(e) => {
+        if (e.pointerType === "touch") e.preventDefault();
+      }}
       className={cn(
         SIDEBAR_ROW,
         "relative flex flex-col justify-center text-left text-foreground transition-colors",
@@ -3488,8 +3288,8 @@ function ConversationRow({
       )}
       onClick={(e) => {
         recentClickTimesRef.current = [...recentClickTimesRef.current.slice(-1), performance.now()];
-        // Swallow the click that trails a drag so it doesn't navigate.
-        if (justDraggedRef.current) {
+        // Swallow the click that trails a resolved touch gesture or drag.
+        if (gesture.consumeClick() || justDraggedRef.current) {
           e.preventDefault();
           return;
         }
@@ -3536,24 +3336,21 @@ function ConversationRow({
   // swiped, and whether the drag has passed the commit point (drives the hint's
   // icon and tint). `isSwiping` gates every bit of swipe-only markup/styling, so
   // a row at rest renders exactly as it did before the gesture existed.
-  const swipingAction: SwipeAction = actionFor(swipe.dx, swipeActions);
-  const isSwiping = swipe.dx !== 0 && swipingAction !== "none";
-  const swipeCommitted = Math.abs(swipe.dx) >= SWIPE_COMMIT_PX;
+  const swipingAction: SwipeAction =
+    gesture.dx < 0 ? swipeActions.left : gesture.dx > 0 ? swipeActions.right : "none";
+  const isSwiping = gesture.dx !== 0 && swipingAction !== "none";
+  const swipeCommitted = Math.abs(gesture.dx) >= ROW_SWIPE_COMMIT_PX;
 
   return (
     // Drag props on the <li> so the whole row is grabbable; `isDragging` dims
     // it. `setRowRef` merges the drag node ref with the scroll-into-view ref.
     <li
       ref={setRowRef}
-      {...dragListeners}
-      onPointerDown={swipe.onPointerDown}
-      onPointerMove={swipe.onPointerMove}
-      onPointerUp={swipe.onPointerUp}
-      onPointerCancel={swipe.onPointerCancel}
-      onClickCapture={swipe.onClickCapture}
+      {...rowGestureListeners}
       className={cn(
         "group relative",
         isDragging && "opacity-40",
+        gesture.phase === "armed" && "z-10 scale-[1.01] shadow-sm",
         // Keep vertical scrolling native while claiming the horizontal axis for
         // the swipe: without this the browser can take the horizontal pan (or
         // back-navigation gesture) and cancel the gesture mid-drag. Only where
@@ -3575,7 +3372,7 @@ function ConversationRow({
           aria-hidden
           className={cn(
             "pointer-events-none absolute inset-0 flex items-center rounded-[var(--radius-otto-sm)] px-4",
-            swipe.dx > 0 ? "justify-start" : "justify-end",
+            gesture.dx > 0 ? "justify-start" : "justify-end",
             "transition-colors",
             swipingAction === "delete"
               ? swipeCommitted
@@ -3620,13 +3417,13 @@ function ConversationRow({
           isSwiping && "rounded-[var(--radius-otto-sm)] bg-sidebar",
           // Transition only at rest, so the row eases back when the gesture
           // ends but tracks the finger 1:1 while swiping.
-          swipe.dx === 0 && "transition-[margin] duration-200",
+          gesture.dx === 0 && "transition-[margin] duration-200",
         )}
         style={
-          swipe.dx !== 0
-            ? swipe.dx < 0
-              ? { marginRight: -swipe.dx }
-              : { marginLeft: swipe.dx }
+          gesture.dx !== 0
+            ? gesture.dx < 0
+              ? { marginRight: -gesture.dx }
+              : { marginLeft: gesture.dx }
             : undefined
         }
       >
@@ -3659,7 +3456,7 @@ function ConversationRow({
           )
         ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
+            <ContextMenu>
               <ContextMenuTrigger asChild>
                 <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
               </ContextMenuTrigger>
@@ -3678,7 +3475,7 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
+          <ContextMenu>
             <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
@@ -3690,7 +3487,7 @@ function ConversationRow({
           </ContextMenu>
         ) : (
           <Tooltip>
-            <ContextMenu open={contextMenuOpen} onOpenChange={handleContextMenuOpenChange}>
+            <ContextMenu>
               <ContextMenuTrigger asChild>
                 <div className="w-full">
                   <TooltipTrigger asChild>{rowLink}</TooltipTrigger>

From 967949b1f3e81b63c2c2ae8c8b348ce6a82abd52 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 03:59:07 -0700
Subject: [PATCH 14/30] fix(sidebar): harden unified row gestures

Cancel the recognizer (and dnd-kit's drag) on any second touch anywhere,
block the native context menu while a row drag is live, clear
suppressClick on every fresh press, and follow dnd-kit's own drag
end/cancel so a viewport resize can't leave the recognizer armed.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            |  63 ++++-
 web/src/shell/Sidebar.rowActions.test.tsx | 271 +++++++++++++++++++++-
 web/src/shell/Sidebar.tsx                 |  29 ++-
 3 files changed, 341 insertions(+), 22 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 61c46bbdc9..c47be5a65b 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -36,6 +36,7 @@ interface ActiveRowGesture {
   lastY: number;
   phase: Exclude<RowGesturePhase, "idle">;
   target: Element;
+  sensorTarget: Element;
   offset: number;
 }
 
@@ -51,6 +52,31 @@ interface RowGestureActivationContext {
   active: { data: { current?: unknown } };
 }
 
+type RowGestureReset = (cancelDrag: boolean) => void;
+
+const rowGestureResets = new Set<RowGestureReset>();
+
+function handleGlobalTouchStart(event: TouchEvent) {
+  if (event.touches.length <= 1) return;
+  for (const reset of rowGestureResets) reset(true);
+}
+
+function registerRowGestureReset(reset: RowGestureReset) {
+  if (rowGestureResets.size === 0) document.addEventListener("touchstart", handleGlobalTouchStart);
+  rowGestureResets.add(reset);
+  return () => {
+    rowGestureResets.delete(reset);
+    if (rowGestureResets.size === 0) {
+      document.removeEventListener("touchstart", handleGlobalTouchStart);
+    }
+  };
+}
+
+/** Clears the recognizer after dnd-kit has ended or cancelled its drag. */
+export function finishActiveRowGesture() {
+  for (const reset of rowGestureResets) reset(false);
+}
+
 const rowGestureActivators = [
   {
     eventName: "onTouchMove",
@@ -130,13 +156,23 @@ export function useRowGesture({
     }
   }, []);
 
-  const reset = useCallback(() => {
-    clearHoldTimer();
-    releaseCapture(state.current);
-    state.current = null;
-    setDx(0);
-    setPhase("idle");
-  }, [clearHoldTimer, releaseCapture]);
+  const reset = useCallback(
+    (cancelDrag = false) => {
+      const gesture = state.current;
+      if (!gesture) return;
+      clearHoldTimer();
+      releaseCapture(gesture);
+      state.current = null;
+      setDx(0);
+      setPhase("idle");
+      if (cancelDrag && gesture?.phase === "drag") {
+        gesture.sensorTarget.dispatchEvent(
+          new Event("touchcancel", { bubbles: true, cancelable: true }),
+        );
+      }
+    },
+    [clearHoldTimer, releaseCapture],
+  );
 
   // Armed until the trailing click arrives or the next press clears it. A timer
   // would race the click: the browser does not guarantee dispatch inside the
@@ -169,9 +205,10 @@ export function useRowGesture({
 
   const onPointerDown = useCallback(
     (event: ReactPointerEvent) => {
+      suppressClick.current = false;
       if (event.pointerType !== "touch") return;
       if (!event.isPrimary) {
-        if (state.current) reset();
+        if (state.current) reset(true);
         return;
       }
       if (!enabled) return;
@@ -179,7 +216,6 @@ export function useRowGesture({
       if (target instanceof Node && !event.currentTarget.contains(target)) return;
 
       reset();
-      suppressClick.current = false;
       const gesture: ActiveRowGesture = {
         pointerId: event.pointerId,
         startX: event.clientX,
@@ -188,6 +224,7 @@ export function useRowGesture({
         lastY: event.clientY,
         phase: "pending",
         target: event.currentTarget,
+        sensorTarget: target instanceof Element ? target : event.currentTarget,
         offset: 0,
       };
       state.current = gesture;
@@ -311,14 +348,14 @@ export function useRowGesture({
   const onPointerCancel = useCallback(
     (event: ReactPointerEvent) => {
       if (state.current?.pointerId !== event.pointerId) return;
-      reset();
+      reset(true);
     },
     [reset],
   );
 
   const onTouchStart = useCallback(
     (event: ReactTouchEvent) => {
-      if (event.touches.length > 1 && state.current) reset();
+      if (event.touches.length > 1 && state.current) reset(true);
     },
     [reset],
   );
@@ -344,9 +381,11 @@ export function useRowGesture({
   );
 
   useEffect(() => {
-    if (!enabled && state.current) reset();
+    if (!enabled && state.current) reset(true);
   }, [enabled, reset]);
 
+  useEffect(() => registerRowGestureReset(reset), [reset]);
+
   useEffect(
     () => () => {
       clearHoldTimer();
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 78ab965c91..0981a9c63b 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -6,7 +6,7 @@
 //      `onDoubleClick`), gated on edit permission.
 // See ConversationRow / ConversationEditRow in Sidebar.tsx.
 
-import { useSyncExternalStore } from "react";
+import { Suspense, startTransition, useSyncExternalStore } from "react";
 import type * as DndKitCore from "@dnd-kit/core";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { act, cleanup, fireEvent, render, screen, within } from "@testing-library/react";
@@ -53,10 +53,13 @@ const mocks = vi.hoisted(() => {
     moveToProject: { mutate: vi.fn() },
     conversations: [] as unknown[],
     isDragging: null as boolean | null,
+    suspendDraggable: false,
+    suspendedRender: new Promise<never>(() => {}),
     pinnedStore,
     // Archive + stop mutations, so the swipe tests can assert the swipe→archive
     // path drives the same stop→archive handler the kebab uses.
     archive: { mutate: vi.fn() },
+    archiveOverride: null as null | { mutate: ReturnType<typeof vi.fn> },
     stopSession: { mutate: vi.fn() },
     // Stop-and-delete, so the swipe→delete test can assert the row deletes only
     // after the confirm dialog is accepted.
@@ -70,6 +73,7 @@ vi.mock("@dnd-kit/core", async (importOriginal) => {
     ...actual,
     useDraggable: (args: Parameters<typeof actual.useDraggable>[0]) => {
       const draggable = actual.useDraggable(args);
+      if (mocks.suspendDraggable) throw mocks.suspendedRender;
       return {
         ...draggable,
         isDragging: mocks.isDragging ?? draggable.isDragging,
@@ -115,7 +119,7 @@ vi.mock("@/hooks/useConversations", () => ({
   setConversationPinned: vi.fn(() => Promise.resolve({})),
   PINNED_CONVERSATIONS_KEY: ["pinned-conversations"],
   useRenameConversation: () => mocks.rename,
-  useArchiveConversation: () => mocks.archive,
+  useArchiveConversation: () => mocks.archiveOverride ?? mocks.archive,
   useBulkArchiveConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
   useBulkDeleteConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
   useBulkStopSessions: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
@@ -230,7 +234,11 @@ function renderSidebar(activeId?: string, info?: ServerInfo) {
   // reference lets React bail out without re-invoking the sidebar, which
   // would swallow a `mockConversations` swap applied mid-test.
   const makeUi = () => {
-    const sidebar = <Sidebar open={true} onClose={onClose} />;
+    const sidebar = (
+      <Suspense fallback={<div data-testid="suspended-sidebar" />}>
+        <Sidebar open={true} onClose={onClose} />
+      </Suspense>
+    );
     const tree = (
       <QueryClientProvider client={qc}>
         <TooltipProvider>
@@ -282,6 +290,8 @@ beforeEach(() => {
   mocks.del.reset.mockReset();
   mocks.projects = [];
   mocks.isDragging = null;
+  mocks.suspendDraggable = false;
+  mocks.archiveOverride = null;
   // Default every test to the desktop viewport; the mobile flyout test opts in.
   mocks.isMobile = false;
   useConvMock.mockReset();
@@ -798,6 +808,15 @@ describe("mark as unread", () => {
 });
 
 describe("right-click context menu", () => {
+  it("does not open while the row is being dragged", () => {
+    mocks.isDragging = true;
+    renderSidebar();
+
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+  });
+
   it("leaves keyboard link activation untouched after a drag ends", async () => {
     mocks.isMobile = true;
     mocks.isDragging = true;
@@ -1086,13 +1105,69 @@ describe("touch gesture arbitration", () => {
     startTouch();
     advanceHold();
     expect(row).not.toHaveClass("opacity-40");
+    expect(row).toHaveClass("touch-none");
+    expect(row).not.toHaveClass("touch-pan-y");
 
     moveTouch(101, 100);
     expect(row).toHaveClass("opacity-40");
+    expect(row).toHaveClass("touch-none");
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
     endTouch(101, 100);
   });
 
+  it("does not restart a drag after viewport resize cancels the sensor", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    moveTouch(101, 100);
+    expect(row).toHaveClass("opacity-40");
+
+    act(() => window.dispatchEvent(new Event("resize")));
+    expect(row).not.toHaveClass("opacity-40");
+
+    moveTouch(102, 100);
+    expect(row).not.toHaveClass("opacity-40");
+    endTouch(102, 100);
+  });
+
+  it("resets the recognizer when dnd-kit ends the drag", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { link, row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    moveTouch(101, 100);
+    expect(row).toHaveClass("opacity-40");
+
+    const touch = touchPoint(link, 101, 100);
+    fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
+
+    expect(row).not.toHaveClass("opacity-40");
+    expect(row).not.toHaveClass("touch-none");
+    moveTouch(102, 100);
+    expect(row).not.toHaveClass("opacity-40");
+  });
+
+  it("arms after ordinary four-pixel hold drift", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    moveTouch(104, 100);
+    advanceHold();
+
+    expect(row).toHaveClass("scale-[1.01]");
+    endTouch(104, 100);
+  });
+
   it("does not arm a hold on a finger that is still creeping", () => {
     // A slow scroll drifts under the 12px scroll threshold but is not holding
     // still. Arming here would capture the pointer and hand the gesture to
@@ -1279,6 +1354,40 @@ describe("touch gesture arbitration", () => {
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
+  it("does not swallow a mouse click after a desktop touch scroll gesture", () => {
+    vi.useFakeTimers();
+    const view = renderSidebar();
+    const { link } = touchTarget();
+
+    startTouch();
+    moveTouch(80, 100);
+    endTouch(80, 100);
+    fireEvent.pointerDown(link, {
+      pointerType: "mouse",
+      button: 0,
+      isPrimary: true,
+      pointerId: 9,
+    });
+    fireEvent.click(link);
+
+    expect(view.onClose).toHaveBeenCalledOnce();
+  });
+
+  it("selects a row on the first tap after a short swipe", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    startTouch();
+    moveTouch(80, 100);
+    endTouch(80, 100);
+    fireEvent.click(screen.getByRole("button", { name: "Select sessions" }));
+    const { link } = touchTarget();
+    fireEvent.pointerDown(link, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+    fireEvent.click(link);
+
+    expect(screen.getByText("1 selected")).toBeInTheDocument();
+  });
+
   it("fully resets when the pointer is cancelled", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
@@ -1322,6 +1431,104 @@ describe("touch gesture arbitration", () => {
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
     fireEvent.pointerCancel(link, { ...TOUCH_POINTER, clientX: 120, clientY: 100 });
   });
+
+  it("cancels the first row when a second touch starts on another row", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    mockConversations([
+      { ...CONV, id: "conv_a", title: "Session A" },
+      { ...CONV, id: "conv_b", title: "Session B" },
+    ]);
+    renderSidebar();
+    const linkA = screen.getByRole("link", { name: /Session A/ });
+    const linkB = screen.getByRole("link", { name: /Session B/ });
+    const first = touchPoint(linkA, 100, 100);
+    const second = touchPoint(linkB, 104, 104, 1);
+
+    fireEvent.pointerDown(linkA, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+    fireEvent.touchStart(linkA, { touches: [first], changedTouches: [first] });
+    fireEvent.pointerDown(linkB, {
+      pointerId: 2,
+      isPrimary: false,
+      pointerType: "touch",
+      clientX: 104,
+      clientY: 104,
+    });
+    fireEvent.touchStart(linkB, {
+      touches: [first, second],
+      changedTouches: [second],
+    });
+
+    advanceHold(ROW_GESTURE_HOLD_MS + 1);
+    expect(linkA.closest("li")).not.toHaveClass("scale-[1.01]");
+    fireEvent.pointerMove(linkA, { ...TOUCH_POINTER, clientX: 10, clientY: 100 });
+    fireEvent.pointerUp(linkA, { ...TOUCH_POINTER, clientX: 10, clientY: 100 });
+
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(linkA.closest("li")).not.toHaveClass("scale-[1.01]");
+  });
+
+  it("cancels dnd-kit when a second touch starts on another row mid-drag", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    mockConversations([
+      { ...CONV, id: "conv_a", title: "Session A" },
+      { ...CONV, id: "conv_b", title: "Session B" },
+    ]);
+    renderSidebar();
+    const linkA = screen.getByRole("link", { name: /Session A/ });
+    const linkB = screen.getByRole("link", { name: /Session B/ });
+    const rowA = linkA.closest("li")!;
+    const first = touchPoint(linkA, 100, 100);
+    const moved = touchPoint(linkA, 101, 100);
+
+    fireEvent.pointerDown(linkA, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+    fireEvent.touchStart(linkA, { touches: [first], changedTouches: [first] });
+    advanceHold();
+    fireEvent.pointerMove(linkA, { ...TOUCH_POINTER, clientX: 101, clientY: 100 });
+    fireEvent.touchMove(linkA, { touches: [moved], changedTouches: [moved] });
+    expect(rowA).toHaveClass("opacity-40");
+
+    const second = touchPoint(linkB, 104, 104, 1);
+    fireEvent.pointerDown(linkB, {
+      pointerId: 2,
+      isPrimary: false,
+      pointerType: "touch",
+      clientX: 104,
+      clientY: 104,
+    });
+    fireEvent.touchStart(linkB, {
+      touches: [moved, second],
+      changedTouches: [second],
+    });
+
+    expect(rowA).not.toHaveClass("opacity-40");
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
+
+  it("cancels dnd-kit when a second touch joins the active row", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { link, row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    moveTouch(101, 100);
+    expect(row).toHaveClass("opacity-40");
+
+    fireEvent.pointerDown(link, {
+      pointerId: 2,
+      isPrimary: false,
+      pointerType: "touch",
+      clientX: 104,
+      clientY: 104,
+    });
+
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
 });
 
 describe("touch swipe actions", () => {
@@ -1430,6 +1637,37 @@ describe("touch swipe actions", () => {
     );
   });
 
+  it("keeps the committed swipe action when a concurrent render is abandoned", () => {
+    mocks.isMobile = true;
+    const view = renderSidebar();
+    const abandonedArchive = { mutate: vi.fn() };
+    const { link } = touchTarget();
+    startTouch(200, 100);
+
+    mocks.archiveOverride = abandonedArchive;
+    mocks.suspendDraggable = true;
+    act(() => {
+      startTransition(() => view.rerenderSidebar());
+    });
+    expect(screen.queryByTestId("suspended-sidebar")).toBeNull();
+
+    for (const x of [180, 100]) {
+      const touch = touchPoint(link, x, 100);
+      fireEvent.pointerMove(link, { ...TOUCH_POINTER, clientX: x, clientY: 100 });
+      fireEvent.touchMove(link, { touches: [touch], changedTouches: [touch] });
+    }
+    const touch = touchPoint(link, 100, 100);
+    fireEvent.pointerUp(link, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+    fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
+    mocks.suspendDraggable = false;
+
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+    expect(abandonedArchive.mutate).not.toHaveBeenCalled();
+  });
+
   it("does not commit after a flick returns below the threshold before release", () => {
     mocks.isMobile = true;
     renderSidebar();
@@ -1470,6 +1708,19 @@ describe("touch swipe actions", () => {
     );
   });
 
+  it("applies one-third resistance immediately past the commit distance", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+    const surface = row.querySelector<HTMLElement>("div.relative")!;
+
+    startTouch(100, 100);
+    moveTouch(10, 100);
+
+    expect(surface.style.marginRight).toBe("78px");
+    endTouch(10, 100);
+  });
+
   it("ignores touch gestures that bubble from a portalled dialog", () => {
     mocks.isMobile = true;
     renderSidebar();
@@ -1498,6 +1749,20 @@ describe("touch swipe actions", () => {
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
+  it("commits at exactly 72px but not at 71px", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    swipeRow(-71);
+    expect(mocks.archive.mutate).not.toHaveBeenCalled();
+
+    swipeRow(-72);
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+  });
+
   it("ignores swipes on desktop (non-touch viewport)", () => {
     // Desktop (default isMobile=false) leaves the gesture disabled entirely.
     renderSidebar();
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 98c6371ce0..2a1f9724ed 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -153,7 +153,12 @@ import { useIsMobileViewport } from "@/hooks/useIsMobileViewport";
 import { useResizableSidebar } from "@/hooks/useResizableSidebar";
 import { useSessionSwitchHotkey } from "@/hooks/useSessionSwitchHotkey";
 import { usePinnedSessionHotkeys } from "@/hooks/usePinnedSessionHotkeys";
-import { ROW_SWIPE_COMMIT_PX, RowGestureTouchSensor, useRowGesture } from "@/hooks/useRowGesture";
+import {
+  finishActiveRowGesture,
+  ROW_SWIPE_COMMIT_PX,
+  RowGestureTouchSensor,
+  useRowGesture,
+} from "@/hooks/useRowGesture";
 import { isCurrentServerLocal } from "@/lib/serverOrigin";
 import { NewProjectButton } from "./NewProjectButton";
 import { SettingsSidebarBody, useSettingsRoute, useTrackSettingsReturn } from "./settingsNav";
@@ -1490,6 +1495,7 @@ function ConversationList({
   const handleDragEnd = useCallback(
     (event: DragEndEvent) => {
       const dragged = activeDrag;
+      finishActiveRowGesture();
       setActiveDrag(null);
       if (!dragged) return;
       const target = (event.over?.data.current as SidebarDropTarget | undefined) ?? null;
@@ -1717,7 +1723,10 @@ function ConversationList({
         measuring={{ droppable: { strategy: MeasuringStrategy.Always } }}
         onDragStart={handleDragStart}
         onDragEnd={handleDragEnd}
-        onDragCancel={() => setActiveDrag(null)}
+        onDragCancel={() => {
+          finishActiveRowGesture();
+          setActiveDrag(null);
+        }}
       >
         <RowEditHoldContext.Provider value={reportRowEditing}>
           <div
@@ -3049,10 +3058,12 @@ function ConversationRow({
   // changing Settings updates open rows without a remount.
   const swipeActions = useSwipeActions();
   const swipeActionRef = useRef<(action: Exclude<SwipeAction, "none">) => void>(() => {});
-  swipeActionRef.current = (action: Exclude<SwipeAction, "none">) => {
-    if (action === "archive") runArchive();
-    else setDeleteOpen(true);
-  };
+  useEffect(() => {
+    swipeActionRef.current = (action: Exclude<SwipeAction, "none">) => {
+      if (action === "archive") runArchive();
+      else setDeleteOpen(true);
+    };
+  });
   const onSwipeAction = useCallback((action: Exclude<SwipeAction, "none">) => {
     swipeActionRef.current(action);
   }, []);
@@ -3267,6 +3278,9 @@ function ConversationRow({
       onPointerDown={(e) => {
         if (e.pointerType === "touch") e.preventDefault();
       }}
+      onContextMenu={(e) => {
+        if (isDragging) e.preventDefault();
+      }}
       className={cn(
         SIDEBAR_ROW,
         "relative flex flex-col justify-center text-left text-foreground transition-colors",
@@ -3355,7 +3369,8 @@ function ConversationRow({
         // the swipe: without this the browser can take the horizontal pan (or
         // back-navigation gesture) and cancel the gesture mid-drag. Only where
         // a swipe can actually fire, so rows without one keep default behavior.
-        swipeEnabled && "touch-pan-y",
+        swipeEnabled && gesture.phase !== "armed" && gesture.phase !== "drag" && "touch-pan-y",
+        (gesture.phase === "armed" || gesture.phase === "drag") && "touch-none",
       )}
     >
       {/* Swipe reveal hint: sits behind the moving surface, showing the

From 05db126e550e653e76083066abbf21c1c12541aa Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 05:05:02 -0700
Subject: [PATCH 15/30] refactor(sidebar): dedupe row gesture phase and reset
 checks

Name the armed-or-drag touch-action check, drop the `state.current`
guards that reset() now makes redundant, and reuse a second-touch
pointer constant in the gesture tests.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            |  8 +++----
 web/src/shell/Sidebar.rowActions.test.tsx | 26 +++++------------------
 web/src/shell/Sidebar.tsx                 |  6 ++++--
 3 files changed, 13 insertions(+), 27 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index c47be5a65b..74c28cc18e 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -165,7 +165,7 @@ export function useRowGesture({
       state.current = null;
       setDx(0);
       setPhase("idle");
-      if (cancelDrag && gesture?.phase === "drag") {
+      if (cancelDrag && gesture.phase === "drag") {
         gesture.sensorTarget.dispatchEvent(
           new Event("touchcancel", { bubbles: true, cancelable: true }),
         );
@@ -208,7 +208,7 @@ export function useRowGesture({
       suppressClick.current = false;
       if (event.pointerType !== "touch") return;
       if (!event.isPrimary) {
-        if (state.current) reset(true);
+        reset(true);
         return;
       }
       if (!enabled) return;
@@ -355,7 +355,7 @@ export function useRowGesture({
 
   const onTouchStart = useCallback(
     (event: ReactTouchEvent) => {
-      if (event.touches.length > 1 && state.current) reset(true);
+      if (event.touches.length > 1) reset(true);
     },
     [reset],
   );
@@ -381,7 +381,7 @@ export function useRowGesture({
   );
 
   useEffect(() => {
-    if (!enabled && state.current) reset(true);
+    if (!enabled) reset(true);
   }, [enabled, reset]);
 
   useEffect(() => registerRowGestureReset(reset), [reset]);
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 0981a9c63b..2c3ebe20d1 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -982,6 +982,8 @@ describe("right-click context menu", () => {
 });
 
 const TOUCH_POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
+// A second finger: non-primary, so the recognizer cancels the gesture in flight.
+const SECOND_TOUCH_POINTER = { pointerId: 2, isPrimary: false, pointerType: "touch" as const };
 
 function touchTarget() {
   const link = screen.getByRole("link", { name: /My Session/ });
@@ -1447,13 +1449,7 @@ describe("touch gesture arbitration", () => {
 
     fireEvent.pointerDown(linkA, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
     fireEvent.touchStart(linkA, { touches: [first], changedTouches: [first] });
-    fireEvent.pointerDown(linkB, {
-      pointerId: 2,
-      isPrimary: false,
-      pointerType: "touch",
-      clientX: 104,
-      clientY: 104,
-    });
+    fireEvent.pointerDown(linkB, { ...SECOND_TOUCH_POINTER, clientX: 104, clientY: 104 });
     fireEvent.touchStart(linkB, {
       touches: [first, second],
       changedTouches: [second],
@@ -1491,13 +1487,7 @@ describe("touch gesture arbitration", () => {
     expect(rowA).toHaveClass("opacity-40");
 
     const second = touchPoint(linkB, 104, 104, 1);
-    fireEvent.pointerDown(linkB, {
-      pointerId: 2,
-      isPrimary: false,
-      pointerType: "touch",
-      clientX: 104,
-      clientY: 104,
-    });
+    fireEvent.pointerDown(linkB, { ...SECOND_TOUCH_POINTER, clientX: 104, clientY: 104 });
     fireEvent.touchStart(linkB, {
       touches: [moved, second],
       changedTouches: [second],
@@ -1518,13 +1508,7 @@ describe("touch gesture arbitration", () => {
     moveTouch(101, 100);
     expect(row).toHaveClass("opacity-40");
 
-    fireEvent.pointerDown(link, {
-      pointerId: 2,
-      isPrimary: false,
-      pointerType: "touch",
-      clientX: 104,
-      clientY: 104,
-    });
+    fireEvent.pointerDown(link, { ...SECOND_TOUCH_POINTER, clientX: 104, clientY: 104 });
 
     expect(row).not.toHaveClass("opacity-40");
     expect(screen.queryByRole("menu")).toBeNull();
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 2a1f9724ed..0ffa4fef1c 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3354,6 +3354,8 @@ function ConversationRow({
     gesture.dx < 0 ? swipeActions.left : gesture.dx > 0 ? swipeActions.right : "none";
   const isSwiping = gesture.dx !== 0 && swipingAction !== "none";
   const swipeCommitted = Math.abs(gesture.dx) >= ROW_SWIPE_COMMIT_PX;
+  // A held or dragging row owns the pointer outright, so no axis stays native.
+  const ownsPointer = gesture.phase === "armed" || gesture.phase === "drag";
 
   return (
     // Drag props on the <li> so the whole row is grabbable; `isDragging` dims
@@ -3369,8 +3371,8 @@ function ConversationRow({
         // the swipe: without this the browser can take the horizontal pan (or
         // back-navigation gesture) and cancel the gesture mid-drag. Only where
         // a swipe can actually fire, so rows without one keep default behavior.
-        swipeEnabled && gesture.phase !== "armed" && gesture.phase !== "drag" && "touch-pan-y",
-        (gesture.phase === "armed" || gesture.phase === "drag") && "touch-none",
+        swipeEnabled && !ownsPointer && "touch-pan-y",
+        ownsPointer && "touch-none",
       )}
     >
       {/* Swipe reveal hint: sits behind the moving surface, showing the

From c21fec9292440fdda72d188594b91a7da89c1927 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 09:47:27 -0700
Subject: [PATCH 16/30] fix(web): make press-and-hold drag survivable and gate
 gestures on touch capability

A real fingertip wobbles well past 12px during a 400ms hold, so the
pending phase demoted to scroll before the drag could arm. The explicit
scroll fallback widens to a 25px circle (native pan-y still wins
earlier) and the hold tolerance to 20px; swipe keeps its 12px
horizontal-dominant lock, and 25/sqrt(2) > 12 keeps the two regions
disjoint. Gestures now enable wherever a coarse pointer exists instead
of below the md breakpoint, so an unfolded foldable keeps swipe and
long-press drag.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            |  10 +-
 web/src/shell/Sidebar.rowActions.test.tsx | 152 ++++++++++++++++------
 web/src/shell/Sidebar.tsx                 |   9 +-
 3 files changed, 125 insertions(+), 46 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 74c28cc18e..220c919e90 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -19,10 +19,8 @@ export const ROW_GESTURE_HOLD_MS = 400;
 export const ROW_SWIPE_ACTIVATE_PX = 12;
 export const ROW_SWIPE_COMMIT_PX = 72;
 
-const ROW_SCROLL_ACTIVATE_PX = ROW_SWIPE_ACTIVATE_PX;
-// How far the finger may drift and still count as holding still. Mirrors the
-// tolerance dnd-kit's own delay constraint applied before we owned activation.
-const ROW_HOLD_TOLERANCE_PX = 8;
+const ROW_SCROLL_ACTIVATE_PX = 25;
+const ROW_HOLD_TOLERANCE_PX = 20;
 const ROW_SWIPE_MAX_PX = 96;
 const ROW_SWIPE_RESIST = 1 / 3;
 
@@ -287,8 +285,8 @@ export function useRowGesture({
 
       const horizontal = Math.abs(deltaX);
       const vertical = Math.abs(deltaY);
-      // At >=12px, horizontal-dominant travel is swipe; every other vector at
-      // the same Euclidean boundary is scroll. Thus (12,0) and (10,8) cannot overlap.
+      // Horizontal-dominant travel locks swipe at 12px; other travel waits for
+      // the 25px scroll circle. Since 25/sqrt(2) > 12, (12,0) and (15,20) cannot overlap.
       if (horizontal >= ROW_SWIPE_ACTIVATE_PX && horizontal > vertical) {
         const action = deltaX < 0 ? actions.left : actions.right;
         if (!swipeEnabled || action === "none") {
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 2c3ebe20d1..734a45218f 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -17,10 +17,9 @@ import type { ServerInfo } from "@/lib/capabilities";
 import { CapabilitiesProvider } from "@/lib/CapabilitiesContext";
 
 // Controllable rename mutation so the double-click test can assert the
-// committed title was forwarded to the PATCH. `isMobile` toggles the mocked
-// `useIsMobileViewport` so a test can render the row on a mobile viewport (the
-// project flyout is disabled there). Declared via vi.hoisted so the vi.mock
-// factories (hoisted above imports) can reference them.
+// committed title was forwarded to the PATCH. The media-query hooks use
+// separate flags so viewport layout and touch capability can vary independently.
+// Declared via vi.hoisted so their mock factories can reference them.
 const mocks = vi.hoisted(() => {
   // Tiny reactive store for the server-authoritative pinned set, so a quick-pin
   // click re-renders the sidebar (mirrors the real query's refetch). Holds ids;
@@ -47,6 +46,7 @@ const mocks = vi.hoisted(() => {
   return {
     rename: { mutate: vi.fn() },
     isMobile: false,
+    hasCoarsePointer: false,
     // Projects surfaced by the picker + the move-to-project mutation, so the
     // mobile in-place project view test can assert both the list and the pick.
     projects: [] as string[],
@@ -89,6 +89,10 @@ vi.mock("@/hooks/useIsMobileViewport", () => ({
   useIsMobileViewport: () => mocks.isMobile,
 }));
 
+vi.mock("@/hooks/useCoarsePointer", () => ({
+  useCoarsePointer: () => mocks.hasCoarsePointer,
+}));
+
 vi.mock("@/hooks/useConversations", () => ({
   useConversations: vi.fn(),
   useConnectedConversations: () => [],
@@ -294,6 +298,7 @@ beforeEach(() => {
   mocks.archiveOverride = null;
   // Default every test to the desktop viewport; the mobile flyout test opts in.
   mocks.isMobile = false;
+  mocks.hasCoarsePointer = false;
   useConvMock.mockReset();
   localStorage.clear();
   // Reset the server pinned set between tests.
@@ -1032,6 +1037,10 @@ function endTouch(x = 100, y = 100) {
 }
 
 describe("touch gesture arbitration", () => {
+  beforeEach(() => {
+    mocks.hasCoarsePointer = true;
+  });
+
   function advanceHold(ms = ROW_GESTURE_HOLD_MS) {
     act(() => vi.advanceTimersByTime(ms));
   }
@@ -1156,22 +1165,35 @@ describe("touch gesture arbitration", () => {
     expect(row).not.toHaveClass("opacity-40");
   });
 
-  it("arms after ordinary four-pixel hold drift", () => {
+  it("arms after ordinary sixteen-pixel hold drift", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
     const { row } = touchTarget();
 
     startTouch();
-    moveTouch(104, 100);
+    moveTouch(100, 116);
+    advanceHold();
+
+    expect(row).toHaveClass("scale-[1.01]");
+    endTouch(100, 116);
+  });
+
+  it("arms at exactly 20px of hold drift", () => {
+    vi.useFakeTimers();
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    moveTouch(112, 116);
     advanceHold();
 
     expect(row).toHaveClass("scale-[1.01]");
-    endTouch(104, 100);
+    endTouch(112, 116);
   });
 
-  it("does not arm a hold on a finger that is still creeping", () => {
-    // A slow scroll drifts under the 12px scroll threshold but is not holding
+  it("rejects 21px of hold drift below the scroll boundary", () => {
+    // A slow scroll drifts under the 25px scroll threshold but is not holding
     // still. Arming here would capture the pointer and hand the gesture to
     // dnd-kit, which preventDefaults the scroll away for the rest of the touch.
     vi.useFakeTimers();
@@ -1180,22 +1202,22 @@ describe("touch gesture arbitration", () => {
     const { row } = touchTarget();
 
     startTouch();
-    // 3px per 100ms: past the 8px hold tolerance by the 400ms mark, but still
-    // under the 12px that would have resolved it to scroll outright.
-    for (let step = 1; step <= 4; step += 1) {
-      advanceHold(100);
-      moveTouch(100, 100 + step * 3);
+    // Reach 21px before the timer: past hold tolerance, still short of scroll.
+    for (let step = 1; step <= 3; step += 1) {
+      advanceHold(90);
+      moveTouch(100, 100 + step * 7);
     }
+    advanceHold(130);
 
     expect(row).not.toHaveClass("scale-[1.01]");
     expect(row).not.toHaveClass("opacity-40");
-    endTouch(100, 112);
+    endTouch(100, 121);
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
   it("leaves a normal-speed vertical flick to the list scroller", () => {
     // Scrolling must stay native even though the finger starts on a row: the
-    // flick clears 12px within a frame, long before the hold could arm.
+    // flick clears 25px within a frame, long before the hold could arm.
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
@@ -1203,12 +1225,12 @@ describe("touch gesture arbitration", () => {
 
     startTouch();
     advanceHold(16);
-    expect(moveTouch(100, 116)).toBe(true);
+    expect(moveTouch(100, 125)).toBe(true);
     advanceHold(600);
 
     expect(row).not.toHaveClass("scale-[1.01]");
     expect(row).not.toHaveClass("opacity-40");
-    endTouch(100, 116);
+    endTouch(100, 125);
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
@@ -1242,34 +1264,33 @@ describe("touch gesture arbitration", () => {
     const { row } = touchTarget();
 
     startTouch();
-    expect(moveTouch(100, 120)).toBe(true);
+    expect(moveTouch(100, 125)).toBe(true);
     advanceHold(ROW_GESTURE_HOLD_MS + 1);
-    endTouch(100, 120);
+    endTouch(100, 125);
 
     expect(row).not.toHaveClass("opacity-40");
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("assigns vertical-dominant travel exactly at the Euclidean boundary to scroll", () => {
+  it("assigns vertical-dominant travel exactly at the 25px boundary to scroll", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
     const { row } = touchTarget();
 
-    // Exactly 12px of travel, so it sits on the activation boundary itself
-    // rather than safely past it. Integer deltas keep it off a float edge.
+    // The 15-20-25 triangle pins the Euclidean boundary with integer deltas.
     startTouch();
-    expect(moveTouch(100, 112)).toBe(true);
+    expect(moveTouch(115, 120)).toBe(true);
 
     // Decided here, at move time — not later by the hold's drift check. Turning
     // back onto the horizontal axis must stay inert, which it only does if the
     // gesture already resolved to scroll.
-    moveTouch(60, 112);
+    moveTouch(60, 120);
     expect(row.querySelector<HTMLElement>("div.relative")?.style.marginRight).toBe("");
 
     advanceHold(ROW_GESTURE_HOLD_MS + 1);
-    endTouch(60, 112);
+    endTouch(60, 120);
 
     expect(row).not.toHaveClass("opacity-40");
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
@@ -1299,7 +1320,7 @@ describe("touch gesture arbitration", () => {
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
   });
 
-  it("hands travel to the swipe as soon as the horizontal axis clears 12px", () => {
+  it("keeps 24px below the explicit scroll boundary pending", () => {
     vi.useFakeTimers();
     writeSwipeActions({ left: "archive", right: "archive" });
     mocks.isMobile = true;
@@ -1307,17 +1328,34 @@ describe("touch gesture arbitration", () => {
     const { row } = touchTarget();
     const surface = row.querySelector<HTMLElement>("div.relative");
 
-    // (10,8) is 12.8px of travel but only 10px horizontally, so it is scroll,
-    // not swipe: the axis threshold governs, not the Euclidean length. Pairs
-    // with the boundary case above to pin both halves of the rule.
+    // The browser normally claims this through pan-y. Without pointercancel,
+    // the explicit fallback must remain pending until the exact 25px boundary.
     startTouch();
-    moveTouch(110, 108);
+    moveTouch(100, 124);
     expect(surface?.style.marginRight).toBe("");
-    advanceHold(ROW_GESTURE_HOLD_MS + 1);
-    endTouch(110, 108);
+    moveTouch(10, 100);
+    expect(surface?.style.marginRight).not.toBe("");
+    endTouch(10, 100);
 
-    expect(mocks.archive.mutate).not.toHaveBeenCalled();
-    expect(row).not.toHaveClass("opacity-40");
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+  });
+
+  it("keeps 11px horizontal travel below swipe activation", () => {
+    vi.useFakeTimers();
+    writeSwipeActions({ left: "archive", right: "archive" });
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    moveTouch(111, 100);
+    const surface = row.querySelector<HTMLElement>("div.relative");
+    expect(surface?.style.marginLeft).toBe("");
+    advanceHold();
+    expect(row).toHaveClass("scale-[1.01]");
+    endTouch(111, 100);
   });
 
   it("assigns exactly 12px horizontal travel to swipe", () => {
@@ -1339,6 +1377,21 @@ describe("touch gesture arbitration", () => {
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
   });
 
+  it("arms touch drag on a wide viewport with a coarse pointer", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = false;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    expect(row).toHaveClass("scale-[1.01]");
+    moveTouch(101, 100);
+
+    expect(row).toHaveClass("opacity-40");
+    endTouch(101, 100);
+  });
+
   it("leaves a short still press as plain link activation", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
@@ -1516,6 +1569,10 @@ describe("touch gesture arbitration", () => {
 });
 
 describe("touch swipe actions", () => {
+  beforeEach(() => {
+    mocks.hasCoarsePointer = true;
+  });
+
   // jsdom has no real touch, so drive the gesture with pointer events. The row
   // recognizer gates on a primary touch pointer; pair each pointer event with
   // its touch event so the real dnd-kit activator also sees the sequence.
@@ -1546,6 +1603,18 @@ describe("touch swipe actions", () => {
     expect(mocks.del.mutate).not.toHaveBeenCalled();
   });
 
+  it("commits on a wide viewport with a coarse pointer", () => {
+    mocks.isMobile = false;
+    renderSidebar();
+
+    swipeRow(-90);
+
+    expect(mocks.archive.mutate).toHaveBeenCalledWith(
+      { id: "conv_1", archived: true },
+      expect.anything(),
+    );
+  });
+
   it("opens the delete confirm dialog (no immediate delete) when swiping the delete direction", () => {
     // Map swipe-right → delete, then swipe right.
     writeSwipeActions({ left: "archive", right: "delete" });
@@ -1747,12 +1816,21 @@ describe("touch swipe actions", () => {
     );
   });
 
-  it("ignores swipes on desktop (non-touch viewport)", () => {
-    // Desktop (default isMobile=false) leaves the gesture disabled entirely.
+  it("ignores touch gestures without a coarse pointer", () => {
+    vi.useFakeTimers();
+    mocks.hasCoarsePointer = false;
     renderSidebar();
 
     swipeRow(-90);
     expect(mocks.archive.mutate).not.toHaveBeenCalled();
+
+    const { row } = touchTarget();
+    startTouch();
+    act(() => vi.advanceTimersByTime(ROW_GESTURE_HOLD_MS));
+    moveTouch(101, 100);
+    expect(row).not.toHaveClass("scale-[1.01]");
+    expect(row).not.toHaveClass("opacity-40");
+    endTouch(101, 100);
   });
 
   it("ignores non-touch pointers (pen/stylus/mouse) on mobile", () => {
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 0ffa4fef1c..79dae3ee3a 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -149,6 +149,7 @@ import {
 } from "@/hooks/useUnseenConversations";
 import { cn } from "@/lib/utils";
 import { type SwipeAction, useSwipeActions } from "@/lib/swipeActionPreferences";
+import { useCoarsePointer } from "@/hooks/useCoarsePointer";
 import { useIsMobileViewport } from "@/hooks/useIsMobileViewport";
 import { useResizableSidebar } from "@/hooks/useResizableSidebar";
 import { useSessionSwitchHotkey } from "@/hooks/useSessionSwitchHotkey";
@@ -2918,6 +2919,7 @@ function ConversationRow({
   // project flyout's HoverCard and leave it lingering over the chat. Gate the
   // flyout off below the `md` breakpoint (see `projectFlyoutName`).
   const isMobile = useIsMobileViewport();
+  const hasCoarsePointer = useCoarsePointer();
   // Track the *live* active conversation id. Delete is fire-and-forget,
   // so the user can navigate to another conversation before the mutation
   // resolves — the onSuccess redirect must key off where they are now,
@@ -3067,7 +3069,8 @@ function ConversationRow({
   const onSwipeAction = useCallback((action: Exclude<SwipeAction, "none">) => {
     swipeActionRef.current(action);
   }, []);
-  const swipeEnabled = isMobile && !selectionMode && isOwner && !isEditing;
+  const gestureEnabled = hasCoarsePointer && !selectionMode && !isEditing;
+  const swipeEnabled = gestureEnabled && isOwner;
   const dragEnabled = isOwner && !selectionMode && !isArchived && !isEditing;
   const openContextMenuAt = useCallback((point: { clientX: number; clientY: number }) => {
     rowLinkRef.current?.dispatchEvent(
@@ -3081,9 +3084,9 @@ function ConversationRow({
     );
   }, []);
   const gesture = useRowGesture({
-    enabled: !selectionMode && !isEditing,
+    enabled: gestureEnabled,
     swipeEnabled,
-    dragEnabled,
+    dragEnabled: hasCoarsePointer && dragEnabled,
     actions: swipeActions,
     onAction: onSwipeAction,
     onLongPress: openContextMenuAt,

From 69f1879bc6f6ad21b7691358c36ddb6575b48d64 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 13:19:42 -0700
Subject: [PATCH 17/30] feat(sidebar): open the row menu at long-press,
 drag-through to move

The context menu now appears the moment the 400ms hold arms (with the
haptic and lift) instead of on release. Pulling 10px from the arm point
dismisses the menu once (Escape through Radix's layer) and hands the
row to dnd-kit; anything less keeps the menu, and release leaves it
open through the trailing click. The threshold measures from the arm
point so legal pre-arm drift can't pre-spend the drag budget.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            |  36 +++++--
 web/src/shell/Sidebar.rowActions.test.tsx | 121 +++++++++++++++++-----
 web/src/shell/Sidebar.tsx                 |  21 +++-
 3 files changed, 139 insertions(+), 39 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 220c919e90..207e9c0578 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -18,6 +18,9 @@ import type { SwipeAction, SwipeActionPreferences } from "@/lib/swipeActionPrefe
 export const ROW_GESTURE_HOLD_MS = 400;
 export const ROW_SWIPE_ACTIVATE_PX = 12;
 export const ROW_SWIPE_COMMIT_PX = 72;
+// Native touch slop is typically 8-10dp; 10px filters hold tremble while
+// keeping a deliberate pull immediate.
+export const ROW_DRAG_ACTIVATE_PX = 10;
 
 const ROW_SCROLL_ACTIVATE_PX = 25;
 const ROW_HOLD_TOLERANCE_PX = 20;
@@ -32,6 +35,8 @@ interface ActiveRowGesture {
   startY: number;
   lastX: number;
   lastY: number;
+  armX: number;
+  armY: number;
   phase: Exclude<RowGesturePhase, "idle">;
   target: Element;
   sensorTarget: Element;
@@ -121,6 +126,7 @@ export function useRowGesture({
   actions,
   onAction,
   onLongPress,
+  onDragStart,
   onPickUp,
 }: {
   enabled: boolean;
@@ -129,6 +135,7 @@ export function useRowGesture({
   actions: SwipeActionPreferences;
   onAction: (action: Exclude<SwipeAction, "none">) => void;
   onLongPress: (point: { clientX: number; clientY: number }) => void;
+  onDragStart?: () => void;
   onPickUp?: () => void;
 }) {
   const [dx, setDx] = useState(0);
@@ -220,6 +227,8 @@ export function useRowGesture({
         startY: event.clientY,
         lastX: event.clientX,
         lastY: event.clientY,
+        armX: event.clientX,
+        armY: event.clientY,
         phase: "pending",
         target: event.currentTarget,
         sensorTarget: target instanceof Element ? target : event.currentTarget,
@@ -238,13 +247,16 @@ export function useRowGesture({
           return;
         }
         holdTimer.current = null;
+        gesture.armX = gesture.lastX;
+        gesture.armY = gesture.lastY;
         setGesturePhase(gesture, "armed");
         capturePointer(gesture);
         if (typeof navigator.vibrate === "function") navigator.vibrate(10);
         onPickUp?.();
+        onLongPress({ clientX: gesture.lastX, clientY: gesture.lastY });
       }, ROW_GESTURE_HOLD_MS);
     },
-    [capturePointer, enabled, onPickUp, reset, setGesturePhase],
+    [capturePointer, enabled, onLongPress, onPickUp, reset, setGesturePhase],
   );
 
   const onPointerMove = useCallback(
@@ -258,9 +270,17 @@ export function useRowGesture({
       gesture.lastY = event.clientY;
 
       if (gesture.phase === "armed") {
-        if (!moved) return;
-        if (dragEnabled) setGesturePhase(gesture, "drag");
-        else {
+        if (
+          !moved ||
+          Math.hypot(event.clientX - gesture.armX, event.clientY - gesture.armY) <
+            ROW_DRAG_ACTIVATE_PX
+        ) {
+          return;
+        }
+        if (dragEnabled) {
+          onDragStart?.();
+          setGesturePhase(gesture, "drag");
+        } else {
           setGesturePhase(gesture, "scroll");
           releaseCapture(gesture);
         }
@@ -313,6 +333,7 @@ export function useRowGesture({
       capturePointer,
       clearHoldTimer,
       dragEnabled,
+      onDragStart,
       releaseCapture,
       setGesturePhase,
       swipeEnabled,
@@ -326,13 +347,10 @@ export function useRowGesture({
       const resolvedPhase = gesture.phase;
       const offset = gesture.offset;
       const action = offset < 0 ? actions.left : actions.right;
-      const point = { clientX: event.clientX, clientY: event.clientY };
       reset();
 
       if (resolvedPhase !== "pending") suppressTrailingClick();
-      if (resolvedPhase === "armed") {
-        onLongPress(point);
-      } else if (
+      if (
         resolvedPhase === "swipe" &&
         Math.abs(offset) >= ROW_SWIPE_COMMIT_PX &&
         action !== "none"
@@ -340,7 +358,7 @@ export function useRowGesture({
         onAction(action);
       }
     },
-    [actions.left, actions.right, onAction, onLongPress, reset, suppressTrailingClick],
+    [actions.left, actions.right, onAction, reset, suppressTrailingClick],
   );
 
   const onPointerCancel = useCallback(
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 734a45218f..aced107691 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -163,7 +163,7 @@ vi.mock("@/lib/serverOrigin", () => ({ isCurrentServerLocal: () => false }));
 
 import { type Conversation, useConversations } from "@/hooks/useConversations";
 import { resetReadStateForTests, seedReadState } from "@/hooks/useUnseenConversations";
-import { ROW_GESTURE_HOLD_MS } from "@/hooks/useRowGesture";
+import { ROW_DRAG_ACTIVATE_PX, ROW_GESTURE_HOLD_MS } from "@/hooks/useRowGesture";
 import { writeSwipeActions } from "@/lib/swipeActionPreferences";
 import { Sidebar } from "./Sidebar";
 
@@ -991,7 +991,9 @@ const TOUCH_POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as c
 const SECOND_TOUCH_POINTER = { pointerId: 2, isPrimary: false, pointerType: "touch" as const };
 
 function touchTarget() {
-  const link = screen.getByRole("link", { name: /My Session/ });
+  // ContextMenu marks the app tree aria-hidden while portalled; pointer capture
+  // still routes the held touch to this same row underneath it.
+  const link = screen.getByRole("link", { name: /My Session/, hidden: true });
   return { link, row: link.closest("li")! };
 }
 
@@ -1045,7 +1047,7 @@ describe("touch gesture arbitration", () => {
     act(() => vi.advanceTimersByTime(ms));
   }
 
-  it("keeps a hold past Radix's own long-press from opening a second menu", () => {
+  it("opens once at hold fire without Radix adding a second menu", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
@@ -1053,15 +1055,17 @@ describe("touch gesture arbitration", () => {
     const contextMenus: MouseEvent[] = [];
     link.addEventListener("contextmenu", (event) => contextMenus.push(event));
 
-    // Radix's trigger arms its own 700ms touch long-press. Holding past it must
-    // not open a menu mid-gesture — the recognizer owns the only open path, on
-    // release — or a hold-then-drag would drag underneath an open menu.
+    // The recognizer opens first; holding past Radix's 700ms timer must not
+    // add a second menu or dispatch another contextmenu event.
     startTouch(140, 220);
-    advanceHold(900);
-    expect(document.querySelectorAll('[role="menu"]')).toHaveLength(0);
-    expect(contextMenus).toHaveLength(0);
+    advanceHold();
+    expect(document.querySelectorAll('[role="menu"]')).toHaveLength(1);
+    expect(contextMenus).toHaveLength(1);
     expect(row).toHaveClass("scale-[1.01]");
 
+    advanceHold(500);
+    expect(document.querySelectorAll('[role="menu"]')).toHaveLength(1);
+    expect(contextMenus).toHaveLength(1);
     endTouch(140, 220);
     expect(document.querySelectorAll('[role="menu"]')).toHaveLength(1);
     expect(contextMenus).toHaveLength(1);
@@ -1082,23 +1086,28 @@ describe("touch gesture arbitration", () => {
     expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
   });
 
-  it("opens the positioned context menu when a still hold is released without dragging", () => {
+  it("opens at the current finger point and stays open through release and trailing click", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
-    renderSidebar();
+    const view = renderSidebar();
     const { link, row } = touchTarget();
     const contextMenus: MouseEvent[] = [];
     link.addEventListener("contextmenu", (event) => contextMenus.push(event));
 
     startTouch(140, 220);
+    moveTouch(145, 224);
     advanceHold();
     expect(row).toHaveClass("scale-[1.01]");
     expect(row).not.toHaveClass("opacity-40");
+    expect(screen.getByTestId("archive-conversation")).toBeInTheDocument();
+    expect(contextMenus.at(-1)).toMatchObject({ clientX: 145, clientY: 224 });
 
-    endTouch(140, 220);
+    endTouch(145, 224);
+    fireEvent.click(link);
     expect(screen.getByTestId("archive-conversation")).toBeInTheDocument();
     expect(row).not.toHaveClass("opacity-40");
-    expect(contextMenus.at(-1)).toMatchObject({ clientX: 140, clientY: 220 });
+    expect(contextMenus).toHaveLength(1);
+    expect(view.onClose).not.toHaveBeenCalled();
 
     fireEvent.click(screen.getByTestId("archive-conversation"));
     expect(mocks.archive.mutate).toHaveBeenCalledWith(
@@ -1107,7 +1116,7 @@ describe("touch gesture arbitration", () => {
     );
   });
 
-  it("starts dnd-kit only when an armed hold moves, without opening the menu", () => {
+  it("keeps a threshold-minus-one wiggle armed with the menu open", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
@@ -1118,12 +1127,66 @@ describe("touch gesture arbitration", () => {
     expect(row).not.toHaveClass("opacity-40");
     expect(row).toHaveClass("touch-none");
     expect(row).not.toHaveClass("touch-pan-y");
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
 
-    moveTouch(101, 100);
+    moveTouch(104, 104);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX - 1, 100);
+    expect(row).not.toHaveClass("opacity-40");
+    expect(row).toHaveClass("touch-none");
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    endTouch(100 + ROW_DRAG_ACTIVATE_PX - 1, 100);
+  });
+
+  it("measures the drag threshold from the arm point, not the press origin", () => {
+    // A press may legally drift up to the hold tolerance before the timer
+    // fires; that drift must not pre-spend the drag budget, or the first
+    // post-arm tremble would dismiss the fresh menu into a drag.
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    // Vertical-dominant 15px drift: inside the 20px hold tolerance, outside
+    // the swipe wedge, under the 25px scroll circle.
+    moveTouch(100, 115);
+    advanceHold();
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+
+    // ~3px wiggle from the ARM point (but ~17px from the press origin).
+    moveTouch(102, 117);
+    expect(row).not.toHaveClass("opacity-40");
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+
+    // A deliberate pull measured from the arm point still drags.
+    moveTouch(100, 115 + ROW_DRAG_ACTIVATE_PX);
+    expect(row).toHaveClass("opacity-40");
+    expect(screen.queryByTestId("rename-conversation")).toBeNull();
+    endTouch(100, 115 + ROW_DRAG_ACTIVATE_PX);
+  });
+
+  it("starts drag at the threshold and dismisses the menu exactly once", () => {
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+    const escapeKeydowns = vi.fn((event: KeyboardEvent) => event.key);
+    document.addEventListener("keydown", escapeKeydowns, { capture: true });
+
+    startTouch();
+    advanceHold();
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
     expect(row).toHaveClass("opacity-40");
     expect(row).toHaveClass("touch-none");
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
-    endTouch(101, 100);
+
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX + 10, 100);
+    document.removeEventListener("keydown", escapeKeydowns, { capture: true });
+    expect(escapeKeydowns).toHaveBeenCalledOnce();
+    expect(escapeKeydowns.mock.results[0]?.value).toBe("Escape");
+    endTouch(100 + ROW_DRAG_ACTIVATE_PX + 10, 100);
   });
 
   it("does not restart a drag after viewport resize cancels the sensor", () => {
@@ -1134,15 +1197,15 @@ describe("touch gesture arbitration", () => {
 
     startTouch();
     advanceHold();
-    moveTouch(101, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
     expect(row).toHaveClass("opacity-40");
 
     act(() => window.dispatchEvent(new Event("resize")));
     expect(row).not.toHaveClass("opacity-40");
 
-    moveTouch(102, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX + 1, 100);
     expect(row).not.toHaveClass("opacity-40");
-    endTouch(102, 100);
+    endTouch(100 + ROW_DRAG_ACTIVATE_PX + 1, 100);
   });
 
   it("resets the recognizer when dnd-kit ends the drag", () => {
@@ -1153,15 +1216,15 @@ describe("touch gesture arbitration", () => {
 
     startTouch();
     advanceHold();
-    moveTouch(101, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
     expect(row).toHaveClass("opacity-40");
 
-    const touch = touchPoint(link, 101, 100);
+    const touch = touchPoint(link, 100 + ROW_DRAG_ACTIVATE_PX, 100);
     fireEvent.touchEnd(link, { touches: [], changedTouches: [touch] });
 
     expect(row).not.toHaveClass("opacity-40");
     expect(row).not.toHaveClass("touch-none");
-    moveTouch(102, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX + 1, 100);
     expect(row).not.toHaveClass("opacity-40");
   });
 
@@ -1386,10 +1449,10 @@ describe("touch gesture arbitration", () => {
     startTouch();
     advanceHold();
     expect(row).toHaveClass("scale-[1.01]");
-    moveTouch(101, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
 
     expect(row).toHaveClass("opacity-40");
-    endTouch(101, 100);
+    endTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
   });
 
   it("leaves a short still press as plain link activation", () => {
@@ -1530,12 +1593,16 @@ describe("touch gesture arbitration", () => {
     const linkB = screen.getByRole("link", { name: /Session B/ });
     const rowA = linkA.closest("li")!;
     const first = touchPoint(linkA, 100, 100);
-    const moved = touchPoint(linkA, 101, 100);
+    const moved = touchPoint(linkA, 100 + ROW_DRAG_ACTIVATE_PX, 100);
 
     fireEvent.pointerDown(linkA, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
     fireEvent.touchStart(linkA, { touches: [first], changedTouches: [first] });
     advanceHold();
-    fireEvent.pointerMove(linkA, { ...TOUCH_POINTER, clientX: 101, clientY: 100 });
+    fireEvent.pointerMove(linkA, {
+      ...TOUCH_POINTER,
+      clientX: 100 + ROW_DRAG_ACTIVATE_PX,
+      clientY: 100,
+    });
     fireEvent.touchMove(linkA, { touches: [moved], changedTouches: [moved] });
     expect(rowA).toHaveClass("opacity-40");
 
@@ -1558,7 +1625,7 @@ describe("touch gesture arbitration", () => {
 
     startTouch();
     advanceHold();
-    moveTouch(101, 100);
+    moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
     expect(row).toHaveClass("opacity-40");
 
     fireEvent.pointerDown(link, { ...SECOND_TOUCH_POINTER, clientX: 104, clientY: 104 });
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 79dae3ee3a..26a6897e5c 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -2965,6 +2965,7 @@ function ConversationRow({
   // The kebab menu is controlled so the project submenu can close the whole
   // menu after a pick (a plain click inside the submenu wouldn't otherwise).
   const [menuOpen, setMenuOpen] = useState(false);
+  const contextMenuOpenRef = useRef(false);
   // Opt-in "delete local branch" checkbox (worktree sessions only).
   const [deleteBranch, setDeleteBranch] = useState(false);
   const [shareOpen, setShareOpen] = useState(false);
@@ -3083,6 +3084,19 @@ function ConversationRow({
       }),
     );
   }, []);
+  const onContextMenuOpenChange = useCallback((open: boolean) => {
+    contextMenuOpenRef.current = open;
+  }, []);
+  const dismissContextMenu = useCallback(() => {
+    if (!contextMenuOpenRef.current) return;
+    (document.activeElement ?? document.body).dispatchEvent(
+      new globalThis.KeyboardEvent("keydown", {
+        key: "Escape",
+        bubbles: true,
+        cancelable: true,
+      }),
+    );
+  }, []);
   const gesture = useRowGesture({
     enabled: gestureEnabled,
     swipeEnabled,
@@ -3090,6 +3104,7 @@ function ConversationRow({
     actions: swipeActions,
     onAction: onSwipeAction,
     onLongPress: openContextMenuAt,
+    onDragStart: dismissContextMenu,
   });
 
   // The recognizer state travels with this draggable, so the static touch
@@ -3476,7 +3491,7 @@ function ConversationRow({
           )
         ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <ContextMenu>
+            <ContextMenu onOpenChange={onContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
               </ContextMenuTrigger>
@@ -3495,7 +3510,7 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          <ContextMenu>
+          <ContextMenu onOpenChange={onContextMenuOpenChange}>
             <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
@@ -3507,7 +3522,7 @@ function ConversationRow({
           </ContextMenu>
         ) : (
           <Tooltip>
-            <ContextMenu>
+            <ContextMenu onOpenChange={onContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <div className="w-full">
                   <TooltipTrigger asChild>{rowLink}</TooltipTrigger>

From de3f0a1961d876612cd1b8645ab5055df6e16b84 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 15:29:37 -0700
Subject: [PATCH 18/30] fix(sidebar): stop native pan and selection from
 stealing the long-press gesture
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Three leaks on real touch devices: Chrome samples touch-action at
touchstart, so nothing stopped it claiming the armed gesture's first
vertical moves as a pan (pointercancel, no drag) — a native non-passive
touchmove guard now runs from arm until reset. The row menus rendered
modally, whose body pointer-events lock let touches fall through the
sidebar overlay and start text selection on the chat beneath — they are
non-modal now. And the menu surface itself carried no user-select or
touch-action, so drags starting on it seeded selection behind it.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/components/ui/context-menu.tsx    |   5 +-
 web/src/hooks/useRowGesture.ts            |  32 ++++-
 web/src/shell/Sidebar.rowActions.test.tsx | 140 ++++++++++++++++++++++
 web/src/shell/Sidebar.tsx                 |   6 +-
 4 files changed, 176 insertions(+), 7 deletions(-)

diff --git a/web/src/components/ui/context-menu.tsx b/web/src/components/ui/context-menu.tsx
index 964ee261cb..e575ac2e5c 100644
--- a/web/src/components/ui/context-menu.tsx
+++ b/web/src/components/ui/context-menu.tsx
@@ -36,7 +36,10 @@ function ContextMenuContent({
       <ContextMenuPrimitive.Content
         data-slot="context-menu-content"
         className={cn(
-          "z-50 max-h-(--radix-context-menu-content-available-height) w-max min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto whitespace-nowrap rounded-[12px] border border-border bg-popover p-2 text-popover-foreground shadow-menu duration-150 ease-[cubic-bezier(0.16,1,0.3,1)] data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:overflow-hidden data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+          // touch-pan-y (not touch-none) keeps the menu's own overflow-y-auto
+          // scrollable; select-none stops a touch drag on the menu from
+          // seeding a text selection that extends behind it into the list.
+          "z-50 max-h-(--radix-context-menu-content-available-height) w-max min-w-32 origin-(--radix-context-menu-content-transform-origin) touch-pan-y overflow-x-hidden overflow-y-auto select-none whitespace-nowrap rounded-[12px] border border-border bg-popover p-2 text-popover-foreground shadow-menu duration-150 ease-[cubic-bezier(0.16,1,0.3,1)] data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:overflow-hidden data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
           className,
         )}
         {...props}
diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 207e9c0578..896bcbbbb1 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -143,6 +143,7 @@ export function useRowGesture({
   const state = useRef<ActiveRowGesture | null>(null);
   const holdTimer = useRef<number | null>(null);
   const suppressClick = useRef(false);
+  const touchMoveGuard = useRef<((event: TouchEvent) => void) | null>(null);
 
   const clearHoldTimer = useCallback(() => {
     if (holdTimer.current === null) return;
@@ -150,6 +151,28 @@ export function useRowGesture({
     holdTimer.current = null;
   }, []);
 
+  // Chrome samples touch-action at touchstart, so the armed-state class swap
+  // to touch-none can't stop an in-flight touch from being claimed as a native
+  // pan. A held finger hasn't started a scroll yet, so its touchmoves are
+  // still cancelable — preventDefault here forestalls the pan until the
+  // gesture resolves to drag or resets. React's delegated listeners are
+  // passive, so this has to be a real native listener.
+  const armTouchMoveGuard = useCallback(() => {
+    if (touchMoveGuard.current) return;
+    const handler = (event: TouchEvent) => {
+      if (event.cancelable) event.preventDefault();
+    };
+    touchMoveGuard.current = handler;
+    document.addEventListener("touchmove", handler, { passive: false });
+  }, []);
+
+  const disarmTouchMoveGuard = useCallback(() => {
+    const handler = touchMoveGuard.current;
+    if (!handler) return;
+    touchMoveGuard.current = null;
+    document.removeEventListener("touchmove", handler, { passive: false } as EventListenerOptions);
+  }, []);
+
   const releaseCapture = useCallback((gesture: ActiveRowGesture | null) => {
     if (!gesture) return;
     try {
@@ -167,6 +190,7 @@ export function useRowGesture({
       if (!gesture) return;
       clearHoldTimer();
       releaseCapture(gesture);
+      disarmTouchMoveGuard();
       state.current = null;
       setDx(0);
       setPhase("idle");
@@ -176,7 +200,7 @@ export function useRowGesture({
         );
       }
     },
-    [clearHoldTimer, releaseCapture],
+    [clearHoldTimer, disarmTouchMoveGuard, releaseCapture],
   );
 
   // Armed until the trailing click arrives or the next press clears it. A timer
@@ -251,12 +275,13 @@ export function useRowGesture({
         gesture.armY = gesture.lastY;
         setGesturePhase(gesture, "armed");
         capturePointer(gesture);
+        armTouchMoveGuard();
         if (typeof navigator.vibrate === "function") navigator.vibrate(10);
         onPickUp?.();
         onLongPress({ clientX: gesture.lastX, clientY: gesture.lastY });
       }, ROW_GESTURE_HOLD_MS);
     },
-    [capturePointer, enabled, onLongPress, onPickUp, reset, setGesturePhase],
+    [armTouchMoveGuard, capturePointer, enabled, onLongPress, onPickUp, reset, setGesturePhase],
   );
 
   const onPointerMove = useCallback(
@@ -406,8 +431,9 @@ export function useRowGesture({
     () => () => {
       clearHoldTimer();
       releaseCapture(state.current);
+      disarmTouchMoveGuard();
     },
-    [clearHoldTimer, releaseCapture],
+    [clearHoldTimer, disarmTouchMoveGuard, releaseCapture],
   );
 
   return {
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index aced107691..838c975ca2 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -986,6 +986,49 @@ describe("right-click context menu", () => {
   });
 });
 
+describe("row context menus render non-modally", () => {
+  // react-remove-scroll's modal lock hit-tests through the sidebar overlay to
+  // the chat behind it (pointer-events: none on body only blocks the sidebar's
+  // own subtree from taking the hit, not the underlying page). modal={false}
+  // must be set on all three row variants so a touch continuing past the menu
+  // never reaches native text selection in the chat.
+  it("does not lock body pointer-events for the desktop context menu", () => {
+    renderSidebar();
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    expect(document.body).not.toHaveAttribute("data-scroll-locked");
+    expect(document.body.style.pointerEvents).not.toBe("none");
+  });
+
+  it("does not lock body pointer-events for the mobile context menu", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    expect(document.body).not.toHaveAttribute("data-scroll-locked");
+    expect(document.body.style.pointerEvents).not.toBe("none");
+  });
+
+  it("does not lock body pointer-events for a pinned row's project-flyout context menu", () => {
+    mocks.pinnedStore.set(["conv_1"]);
+    mockConversations([{ ...CONV, labels: { omni_project: "Moonshot" } }]);
+    renderSidebar();
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    expect(document.body).not.toHaveAttribute("data-scroll-locked");
+    expect(document.body.style.pointerEvents).not.toBe("none");
+  });
+
+  it("marks the menu content select-none with a scrollable, page-safe touch-action", () => {
+    renderSidebar();
+    fireEvent.contextMenu(screen.getByRole("link", { name: /My Session/ }));
+    const menu = screen.getByRole("menu");
+    expect(menu).toHaveClass("select-none");
+    expect(menu).toHaveClass("touch-pan-y");
+    expect(menu).not.toHaveClass("touch-none");
+  });
+});
+
 const TOUCH_POINTER = { pointerId: 1, isPrimary: true, pointerType: "touch" as const };
 // A second finger: non-primary, so the recognizer cancels the gesture in flight.
 const SECOND_TOUCH_POINTER = { pointerId: 2, isPrimary: false, pointerType: "touch" as const };
@@ -1633,6 +1676,103 @@ describe("touch gesture arbitration", () => {
     expect(row).not.toHaveClass("opacity-40");
     expect(screen.queryByRole("menu")).toBeNull();
   });
+
+  // Chrome samples touch-action at touchstart; the armed-state touch-none
+  // class swap can't retroactively stop an in-flight pan. Only a real native
+  // non-passive touchmove listener, held from arm to full reset, forestalls it.
+  describe("native touchmove guard", () => {
+    function nativeTouchMove() {
+      const event = new Event("touchmove", { bubbles: true, cancelable: true });
+      document.dispatchEvent(event);
+      return event;
+    }
+
+    it("does not guard before the hold arms", () => {
+      vi.useFakeTimers();
+      mocks.isMobile = true;
+      renderSidebar();
+      const addSpy = vi.spyOn(document, "addEventListener");
+
+      startTouch();
+      expect(addSpy).not.toHaveBeenCalledWith("touchmove", expect.any(Function), {
+        passive: false,
+      });
+      expect(nativeTouchMove().defaultPrevented).toBe(false);
+      endTouch();
+      addSpy.mockRestore();
+    });
+
+    it("registers the guard exactly when armed and removes it on release", () => {
+      vi.useFakeTimers();
+      mocks.isMobile = true;
+      renderSidebar();
+      const addSpy = vi.spyOn(document, "addEventListener");
+      const removeSpy = vi.spyOn(document, "removeEventListener");
+
+      startTouch();
+      advanceHold();
+      expect(addSpy).toHaveBeenCalledWith("touchmove", expect.any(Function), { passive: false });
+      const touchmoveAdds = addSpy.mock.calls.filter((call) => call[0] === "touchmove");
+      expect(touchmoveAdds).toHaveLength(1);
+      expect(removeSpy).not.toHaveBeenCalledWith(
+        "touchmove",
+        expect.any(Function),
+        expect.anything(),
+      );
+
+      endTouch();
+      expect(removeSpy).toHaveBeenCalledWith("touchmove", expect.any(Function), { passive: false });
+      addSpy.mockRestore();
+      removeSpy.mockRestore();
+    });
+
+    it("preventDefaults a cancelable touchmove while armed and through drag", () => {
+      vi.useFakeTimers();
+      mocks.isMobile = true;
+      renderSidebar();
+
+      startTouch();
+      advanceHold();
+      expect(nativeTouchMove().defaultPrevented).toBe(true);
+
+      moveTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
+      expect(nativeTouchMove().defaultPrevented).toBe(true);
+      endTouch(100 + ROW_DRAG_ACTIVATE_PX, 100);
+    });
+
+    it("removes the guard on pointercancel", () => {
+      vi.useFakeTimers();
+      mocks.isMobile = true;
+      renderSidebar();
+      const { link } = touchTarget();
+
+      startTouch();
+      advanceHold();
+      const removeSpy = vi.spyOn(document, "removeEventListener");
+      fireEvent.pointerCancel(link, { ...TOUCH_POINTER, clientX: 100, clientY: 100 });
+      fireEvent.touchCancel(link, { touches: [], changedTouches: [touchPoint(link, 100, 100)] });
+
+      expect(removeSpy).toHaveBeenCalledWith("touchmove", expect.any(Function), { passive: false });
+      expect(nativeTouchMove().defaultPrevented).toBe(false);
+      removeSpy.mockRestore();
+    });
+
+    it("removes the guard when a second touch cancels the gesture", () => {
+      vi.useFakeTimers();
+      mocks.isMobile = true;
+      renderSidebar();
+      const { link } = touchTarget();
+
+      startTouch();
+      advanceHold();
+      const removeSpy = vi.spyOn(document, "removeEventListener");
+      fireEvent.pointerDown(link, { ...SECOND_TOUCH_POINTER, clientX: 104, clientY: 104 });
+
+      expect(removeSpy).toHaveBeenCalledWith("touchmove", expect.any(Function), { passive: false });
+      expect(nativeTouchMove().defaultPrevented).toBe(false);
+      removeSpy.mockRestore();
+    });
+  });
 });
 
 describe("touch swipe actions", () => {
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 26a6897e5c..42777bf709 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3491,7 +3491,7 @@ function ConversationRow({
           )
         ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <ContextMenu onOpenChange={onContextMenuOpenChange}>
+            <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
               </ContextMenuTrigger>
@@ -3510,7 +3510,7 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          <ContextMenu onOpenChange={onContextMenuOpenChange}>
+          <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
             <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
@@ -3522,7 +3522,7 @@ function ConversationRow({
           </ContextMenu>
         ) : (
           <Tooltip>
-            <ContextMenu onOpenChange={onContextMenuOpenChange}>
+            <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
               <ContextMenuTrigger asChild>
                 <div className="w-full">
                   <TooltipTrigger asChild>{rowLink}</TooltipTrigger>

From 006ac46f541363761d4852d16fdc755d276e2f85 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 15:45:51 -0700
Subject: [PATCH 19/30] fix(sidebar): suppress the OS long-press contextmenu
 while a gesture owns the touch
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

At ~500ms Android fires its own contextmenu on the still-held touch —
100ms after the recognizer opened the menu. Pointer capture retargets
it to the row root, bypassing Radix's trigger, and unprevented it
starts text selection and cancels the pointer stream, which killed the
pending drag. The recognizer's own dispatch is tagged and passes
through; everything else is prevented while the gesture is armed or
dragging. Root-caused with real Chrome touch dispatch over CDP: with
touch-action pan-y, pointercancel fires through pointer capture unless
the pan and the OS menu are both forestalled.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.rowActions.test.tsx | 33 +++++++++++++++++++++++
 web/src/shell/Sidebar.tsx                 | 32 +++++++++++++++-------
 2 files changed, 56 insertions(+), 9 deletions(-)

diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 838c975ca2..b366947a59 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1159,6 +1159,39 @@ describe("touch gesture arbitration", () => {
     );
   });
 
+  it("suppresses the OS's native contextmenu while the recognizer owns the touch", () => {
+    // Android fires its own contextmenu at ~500ms — after the 400ms arm
+    // already opened the menu. Capture retargets it to the row root,
+    // bypassing Radix's trigger; unprevented it starts text selection and
+    // cancels the pointer stream, killing the pending drag. The recognizer's
+    // own dispatch carries a tag; the OS's does not.
+    vi.useFakeTimers();
+    mocks.isMobile = true;
+    renderSidebar();
+    const { row } = touchTarget();
+
+    startTouch();
+    advanceHold();
+    // The tagged synthetic dispatch got through: the menu is open.
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+
+    const nativeLongPress = new MouseEvent("contextmenu", { bubbles: true, cancelable: true });
+    row.dispatchEvent(nativeLongPress);
+    expect(nativeLongPress.defaultPrevented).toBe(true);
+    endTouch();
+  });
+
+  it("leaves the contextmenu alone when no gesture owns the touch", () => {
+    // Desktop right-click arrives with the recognizer idle — it must reach
+    // Radix untouched or the mouse context menu dies.
+    renderSidebar();
+    const { row } = touchTarget();
+
+    const rightClick = new MouseEvent("contextmenu", { bubbles: true, cancelable: true });
+    row.dispatchEvent(rightClick);
+    expect(rightClick.defaultPrevented).toBe(false);
+  });
+
   it("keeps a threshold-minus-one wiggle armed with the menu open", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 42777bf709..7e0ccc3090 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -194,6 +194,9 @@ const SIDEBAR_HOVER_HIGHLIGHT = "hover:bg-muted hover:text-foreground dark:hover
 const SIDEBAR_ACTIVE_HIGHLIGHT =
   "bg-[var(--sidebar-active)] text-[var(--sidebar-active-foreground)] hover:bg-[var(--sidebar-active)] hover:text-[var(--sidebar-active-foreground)] dark:hover:bg-[var(--sidebar-active)] dark:hover:text-[var(--sidebar-active-foreground)]";
 const DROP_TARGET_HIGHLIGHT = SIDEBAR_ACTIVE_HIGHLIGHT;
+// Marks the recognizer's own contextmenu dispatch so the row root can suppress
+// the OS long-press contextmenu mid-gesture without eating its own.
+const ROW_MENU_SYNTHETIC = Symbol("row-menu-synthetic");
 
 // Maps a first-class project id → its name, provided once at the list level so
 // each row resolves its ``project_id`` to a folder name without its own
@@ -3074,15 +3077,17 @@ function ConversationRow({
   const swipeEnabled = gestureEnabled && isOwner;
   const dragEnabled = isOwner && !selectionMode && !isArchived && !isEditing;
   const openContextMenuAt = useCallback((point: { clientX: number; clientY: number }) => {
-    rowLinkRef.current?.dispatchEvent(
-      new globalThis.MouseEvent("contextmenu", {
-        bubbles: true,
-        cancelable: true,
-        button: 2,
-        clientX: point.clientX,
-        clientY: point.clientY,
-      }),
-    );
+    const event = new globalThis.MouseEvent("contextmenu", {
+      bubbles: true,
+      cancelable: true,
+      button: 2,
+      clientX: point.clientX,
+      clientY: point.clientY,
+    });
+    // Tagged so the row root can tell this dispatch apart from the OS's own
+    // long-press contextmenu, which it must suppress mid-gesture.
+    Object.assign(event, { [ROW_MENU_SYNTHETIC]: true });
+    rowLinkRef.current?.dispatchEvent(event);
   }, []);
   const onContextMenuOpenChange = useCallback((open: boolean) => {
     contextMenuOpenRef.current = open;
@@ -3381,6 +3386,15 @@ function ConversationRow({
     <li
       ref={setRowRef}
       {...rowGestureListeners}
+      // Android's own ~500ms long-press fires a native contextmenu even while
+      // the recognizer holds the pointer — capture retargets it to this li,
+      // bypassing Radix's trigger on the link. Unprevented it starts text
+      // selection and cancels the pointer stream, killing the pending drag.
+      // The recognizer's own tagged re-dispatch passes through.
+      onContextMenu={(e) => {
+        if (ROW_MENU_SYNTHETIC in e.nativeEvent) return;
+        if (ownsPointer || isDragging) e.preventDefault();
+      }}
       className={cn(
         "group relative",
         isDragging && "opacity-40",

From a6b3279aadb67eea3e43dfc045d5fa4d443d140c Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 16:12:12 -0700
Subject: [PATCH 20/30] fix(sidebar): suppress the OS contextmenu document-wide
 while a gesture owns the touch
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The OS long-press hit-tests the element under the finger — once the row
menu opens at the press point, that is the menu portal, past the
row-level guard, so Android still engaged selection and cancelled the
pointer stream (drag worked only when the pull beat the ~500ms
long-press). The contextmenu/selectstart suppression now rides the
armed-gesture guard at the document, capture phase; the recognizer's
tagged dispatch passes through. Root-caused live on the device: a
CDP-synthesized gesture (which bypasses the OS long-press) completed
the full menu->dismiss->drag->drop pipeline, isolating the failure to
the View-layer path only real fingers take.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            | 31 +++++++++++++++++++----
 web/src/shell/Sidebar.rowActions.test.tsx | 16 ++++++++++++
 web/src/shell/Sidebar.tsx                 |  4 +--
 3 files changed, 43 insertions(+), 8 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 896bcbbbb1..8ab25ef152 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -21,6 +21,9 @@ export const ROW_SWIPE_COMMIT_PX = 72;
 // Native touch slop is typically 8-10dp; 10px filters hold tremble while
 // keeping a deliberate pull immediate.
 export const ROW_DRAG_ACTIVATE_PX = 10;
+// Marks the recognizer's own contextmenu dispatch so the mid-gesture guards
+// can suppress the OS long-press contextmenu without eating their own.
+export const ROW_MENU_SYNTHETIC = Symbol("row-menu-synthetic");
 
 const ROW_SCROLL_ACTIVATE_PX = 25;
 const ROW_HOLD_TOLERANCE_PX = 20;
@@ -143,7 +146,7 @@ export function useRowGesture({
   const state = useRef<ActiveRowGesture | null>(null);
   const holdTimer = useRef<number | null>(null);
   const suppressClick = useRef(false);
-  const touchMoveGuard = useRef<((event: TouchEvent) => void) | null>(null);
+  const touchMoveGuard = useRef<(() => void) | null>(null);
 
   const clearHoldTimer = useCallback(() => {
     if (holdTimer.current === null) return;
@@ -162,15 +165,33 @@ export function useRowGesture({
     const handler = (event: TouchEvent) => {
       if (event.cancelable) event.preventDefault();
     };
-    touchMoveGuard.current = handler;
+    // The OS long-press contextmenu hit-tests the element under the finger —
+    // once the row menu opens there, that is the menu itself, past every
+    // row-level guard. Unprevented it starts text selection and cancels the
+    // pointer stream, so suppress it document-wide while the gesture owns the
+    // touch. The recognizer's own tagged dispatch passes through.
+    const contextMenuHandler = (event: Event) => {
+      if (ROW_MENU_SYNTHETIC in event) return;
+      event.preventDefault();
+    };
+    const selectStartHandler = (event: Event) => event.preventDefault();
+    touchMoveGuard.current = () => {
+      document.removeEventListener("touchmove", handler, {
+        passive: false,
+      } as EventListenerOptions);
+      document.removeEventListener("contextmenu", contextMenuHandler, true);
+      document.removeEventListener("selectstart", selectStartHandler, true);
+    };
     document.addEventListener("touchmove", handler, { passive: false });
+    document.addEventListener("contextmenu", contextMenuHandler, true);
+    document.addEventListener("selectstart", selectStartHandler, true);
   }, []);
 
   const disarmTouchMoveGuard = useCallback(() => {
-    const handler = touchMoveGuard.current;
-    if (!handler) return;
+    const teardown = touchMoveGuard.current;
+    if (!teardown) return;
     touchMoveGuard.current = null;
-    document.removeEventListener("touchmove", handler, { passive: false } as EventListenerOptions);
+    teardown();
   }, []);
 
   const releaseCapture = useCallback((gesture: ActiveRowGesture | null) => {
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index b366947a59..4231762f8e 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1178,7 +1178,23 @@ describe("touch gesture arbitration", () => {
     const nativeLongPress = new MouseEvent("contextmenu", { bubbles: true, cancelable: true });
     row.dispatchEvent(nativeLongPress);
     expect(nativeLongPress.defaultPrevented).toBe(true);
+
+    // The OS hit-tests the element under the finger — once the menu opens
+    // there, that's the menu portal, far from the row. The document-level
+    // guard must still catch it.
+    const offRowLongPress = new MouseEvent("contextmenu", { bubbles: true, cancelable: true });
+    document.body.dispatchEvent(offRowLongPress);
+    expect(offRowLongPress.defaultPrevented).toBe(true);
+
+    const selection = new Event("selectstart", { bubbles: true, cancelable: true });
+    document.body.dispatchEvent(selection);
+    expect(selection.defaultPrevented).toBe(true);
     endTouch();
+
+    // Released: the guards are gone.
+    const afterRelease = new MouseEvent("contextmenu", { bubbles: true, cancelable: true });
+    document.body.dispatchEvent(afterRelease);
+    expect(afterRelease.defaultPrevented).toBe(false);
   });
 
   it("leaves the contextmenu alone when no gesture owns the touch", () => {
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 7e0ccc3090..72591e18fb 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -156,6 +156,7 @@ import { useSessionSwitchHotkey } from "@/hooks/useSessionSwitchHotkey";
 import { usePinnedSessionHotkeys } from "@/hooks/usePinnedSessionHotkeys";
 import {
   finishActiveRowGesture,
+  ROW_MENU_SYNTHETIC,
   ROW_SWIPE_COMMIT_PX,
   RowGestureTouchSensor,
   useRowGesture,
@@ -194,9 +195,6 @@ const SIDEBAR_HOVER_HIGHLIGHT = "hover:bg-muted hover:text-foreground dark:hover
 const SIDEBAR_ACTIVE_HIGHLIGHT =
   "bg-[var(--sidebar-active)] text-[var(--sidebar-active-foreground)] hover:bg-[var(--sidebar-active)] hover:text-[var(--sidebar-active-foreground)] dark:hover:bg-[var(--sidebar-active)] dark:hover:text-[var(--sidebar-active-foreground)]";
 const DROP_TARGET_HIGHLIGHT = SIDEBAR_ACTIVE_HIGHLIGHT;
-// Marks the recognizer's own contextmenu dispatch so the row root can suppress
-// the OS long-press contextmenu mid-gesture without eating its own.
-const ROW_MENU_SYNTHETIC = Symbol("row-menu-synthetic");
 
 // Maps a first-class project id → its name, provided once at the list level so
 // each row resolves its ``project_id`` to a folder name without its own

From f4322dfecf727ab2dc6fe64a01b08dd0ae1b0ee5 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 16:52:51 -0700
Subject: [PATCH 21/30] fix(sidebar): make the row link non-draggable so a
 stationary long-press survives
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Chrome Android hands a stationary long-press on a draggable link to its
native drag machinery, firing an unconditional pointercancel before the
contextmenu event — no preventDefault can save the pointer stream. With
draggable=false the long-press has no native claimant left and the row
gesture's menu-then-drag works from a stationary hold.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.rowActions.test.tsx | 10 ++++++++++
 web/src/shell/Sidebar.tsx                 |  4 ++++
 2 files changed, 14 insertions(+)

diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index 4231762f8e..effad02454 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -1197,6 +1197,16 @@ describe("touch gesture arbitration", () => {
     expect(afterRelease.defaultPrevented).toBe(false);
   });
 
+  it("renders the row link non-draggable so a stationary long-press survives", () => {
+    // Links are natively draggable; Chrome Android hands a stationary
+    // long-press on one to native drag with an unconditional pointercancel —
+    // fired before the contextmenu event, so no preventDefault can save the
+    // pointer stream. draggable=false removes that claimant entirely.
+    renderSidebar();
+    const rowLink = screen.getByRole("link", { name: /My Session/ });
+    expect(rowLink).toHaveAttribute("draggable", "false");
+  });
+
   it("leaves the contextmenu alone when no gesture owns the touch", () => {
     // Desktop right-click arrives with the recognizer idle — it must reach
     // Radix untouched or the mouse context menu dies.
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 72591e18fb..62508fea6f 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -3292,6 +3292,10 @@ function ConversationRow({
       ref={rowLinkRef}
       to={selectionMode ? "#" : `/c/${conversation.id}`}
       componentId="sidebar.conversation_switcher"
+      // Links are natively draggable, and Chrome Android hands a stationary
+      // long-press on one to its native drag machinery — an unconditional
+      // pointercancel that kills the row gesture. Not draggable, not claimed.
+      draggable={false}
       // The recognizer owns touch long-press, so stop the trigger's own 700ms
       // timer from opening a second menu mid-hold; Radix skips its handler once
       // this event is defaultPrevented. Scoped to touch because the recognizer

From 8e08d21cde56250f7780619f618f52d7985cd50e Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 16:55:46 -0700
Subject: [PATCH 22/30] fix(sidebar): close the row context menu via controlled
 state, not a synthetic Escape
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A document-visible Escape keydown is exactly what dnd-kit's pointer
sensors listen to for drag cancellation — dismissing the menu that way
races the drag it is meant to make room for. Controlled open state
closes the menu directly with no key event.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.rowActions.test.tsx | 14 ++++++---
 web/src/shell/Sidebar.tsx                 | 38 ++++++++++++++---------
 2 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index effad02454..e5f2acae57 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -220,6 +220,7 @@ function serverInfo(overrides: Partial<ServerInfo> = {}): ServerInfo {
     public_sharing_enabled: true,
     server_version: null,
     smart_routing_enabled: false,
+    smart_routing_sources: { external: false, oss: false },
     harness_install_enabled: false,
     installable_harnesses: [],
     dictation_available: false,
@@ -600,7 +601,12 @@ describe("double-click to rename", () => {
     mockConversations([{ ...CONV, owner: "other@example.com" }]);
     renderSidebar();
     // Radix Tabs triggers activate on mousedown (primary button), not click.
-    fireEvent.mouseDown(screen.getByTestId("sidebar-tab-shared"), { button: 0 });
+    fireEvent.pointerDown(screen.getByTestId("session-filter"), {
+      button: 0,
+      ctrlKey: false,
+      pointerType: "mouse",
+    });
+    fireEvent.click(screen.getByTestId("session-filter-shared"));
 
     fireEvent.dblClick(screen.getByRole("link", { name: /My Session/ }));
 
@@ -1267,7 +1273,7 @@ describe("touch gesture arbitration", () => {
     endTouch(100, 115 + ROW_DRAG_ACTIVATE_PX);
   });
 
-  it("starts drag at the threshold and dismisses the menu exactly once", () => {
+  it("starts drag at the threshold without a menu-dismissal keydown", () => {
     vi.useFakeTimers();
     mocks.isMobile = true;
     renderSidebar();
@@ -1285,9 +1291,9 @@ describe("touch gesture arbitration", () => {
     expect(screen.queryByTestId("rename-conversation")).toBeNull();
 
     moveTouch(100 + ROW_DRAG_ACTIVATE_PX + 10, 100);
+    expect(row).toHaveClass("opacity-40");
     document.removeEventListener("keydown", escapeKeydowns, { capture: true });
-    expect(escapeKeydowns).toHaveBeenCalledOnce();
-    expect(escapeKeydowns.mock.results[0]?.value).toBe("Escape");
+    expect(escapeKeydowns).not.toHaveBeenCalled();
     endTouch(100 + ROW_DRAG_ACTIVATE_PX + 10, 100);
   });
 
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 62508fea6f..dd34ece8d1 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -2966,7 +2966,9 @@ function ConversationRow({
   // The kebab menu is controlled so the project submenu can close the whole
   // menu after a pick (a plain click inside the submenu wouldn't otherwise).
   const [menuOpen, setMenuOpen] = useState(false);
-  const contextMenuOpenRef = useRef(false);
+  // Close the row menu directly so an armed touch never sends Escape through
+  // dnd-kit's document-level sensor listeners.
+  const [contextMenuOpen, setContextMenuOpen] = useState(false);
   // Opt-in "delete local branch" checkbox (worktree sessions only).
   const [deleteBranch, setDeleteBranch] = useState(false);
   const [shareOpen, setShareOpen] = useState(false);
@@ -3087,18 +3089,8 @@ function ConversationRow({
     Object.assign(event, { [ROW_MENU_SYNTHETIC]: true });
     rowLinkRef.current?.dispatchEvent(event);
   }, []);
-  const onContextMenuOpenChange = useCallback((open: boolean) => {
-    contextMenuOpenRef.current = open;
-  }, []);
   const dismissContextMenu = useCallback(() => {
-    if (!contextMenuOpenRef.current) return;
-    (document.activeElement ?? document.body).dispatchEvent(
-      new globalThis.KeyboardEvent("keydown", {
-        key: "Escape",
-        bubbles: true,
-        cancelable: true,
-      }),
-    );
+    setContextMenuOpen(false);
   }, []);
   const gesture = useRowGesture({
     enabled: gestureEnabled,
@@ -3128,6 +3120,22 @@ function ConversationRow({
     disabled: !dragEnabled,
   });
   const rowGestureListeners = gesture.listeners(dragListeners);
+  // The menu render branches below are mutually exclusive; switching branches
+  // remounts the ContextMenu, and a stale open=true would reopen the fresh
+  // menu anchored at the viewport corner. Reset during render (not in an
+  // effect) so the remounted menu never paints open.
+  const menuBranch = selectionMode
+    ? "none"
+    : projectFlyoutName
+      ? "flyout"
+      : isMobile
+        ? "mobile"
+        : "desktop";
+  const [prevMenuBranch, setPrevMenuBranch] = useState(menuBranch);
+  if (prevMenuBranch !== menuBranch) {
+    setPrevMenuBranch(menuBranch);
+    if (contextMenuOpen) setContextMenuOpen(false);
+  }
   // A drag ends with a synthetic click on the row's <Link> (mousedown + mouseup
   // on the same anchor still fires a click); swallow that one click so a drag
   // doesn't also navigate into the session. Flagged when a drag finishes,
@@ -3507,7 +3515,7 @@ function ConversationRow({
           )
         ) : projectFlyoutName ? (
           <HoverCard openDelay={150} closeDelay={0}>
-            <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
+            <ContextMenu modal={false} open={contextMenuOpen} onOpenChange={setContextMenuOpen}>
               <ContextMenuTrigger asChild>
                 <HoverCardTrigger asChild>{rowLink}</HoverCardTrigger>
               </ContextMenuTrigger>
@@ -3526,7 +3534,7 @@ function ConversationRow({
             />
           </HoverCard>
         ) : isMobile ? (
-          <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
+          <ContextMenu modal={false} open={contextMenuOpen} onOpenChange={setContextMenuOpen}>
             <ContextMenuTrigger asChild>{rowLink}</ContextMenuTrigger>
             <ContextMenuContent className="min-w-44">
               <ConversationMenuItems
@@ -3538,7 +3546,7 @@ function ConversationRow({
           </ContextMenu>
         ) : (
           <Tooltip>
-            <ContextMenu modal={false} onOpenChange={onContextMenuOpenChange}>
+            <ContextMenu modal={false} open={contextMenuOpen} onOpenChange={setContextMenuOpen}>
               <ContextMenuTrigger asChild>
                 <div className="w-full">
                   <TooltipTrigger asChild>{rowLink}</TooltipTrigger>

From cfac09d6e35e4cff158d8f4e8eace4e188d11440 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 09:50:39 -0700
Subject: [PATCH 23/30] feat(web): project folder context menu on right-click
 and long-press
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Project folder headers only exposed their actions through a hover-revealed
kebab. A right-click fell through to the browser's native menu, and touch —
which has no right-click at all — could not reach the actions in any way.
Session rows already had both gestures, so the two row types behaved
inconsistently.

Attach a Radix ContextMenuTrigger to the folder header button, which brings
both gestures with it: contextmenu for mouse, and a built-in 700ms pointerdown
timer for touch. No custom gesture code, and no dnd-kit sensor changes (the
folder is useDroppable, which contributes a ref only). The kebab is unchanged —
this is additive parity.

The menu body is authored once (ProjectFolderMenuItems) and rendered under both
primitive families via the existing dropdown/context MenuComponents bundles,
mirroring how ConversationMenuItems does it for session rows. The rename /
settings / delete dialogs move up into a useProjectFolderMenu hook so the kebab
and the context menu share one set rather than each mounting its own.

The trigger wraps the header BUTTON only, never the outer folder div or the
section — either would enclose the nested session rows and hijack right-click on
them. Opening the menu must also not toggle the folder: the header's onClick
flips expand/collapse, and a long-press's trailing click would otherwise
collapse the folder under the just-opened menu, so that one click is swallowed
while a plain left-click still toggles.

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../test_sidebar_project_context_menu.py      | 280 ++++++++++++
 .../shell/Sidebar.projectContextMenu.test.tsx | 416 +++++++++++++++++
 web/src/shell/Sidebar.tsx                     | 420 ++++++++++++------
 3 files changed, 970 insertions(+), 146 deletions(-)
 create mode 100644 tests/e2e_ui/sessions/test_sidebar_project_context_menu.py
 create mode 100644 web/src/shell/Sidebar.projectContextMenu.test.tsx

diff --git a/tests/e2e_ui/sessions/test_sidebar_project_context_menu.py b/tests/e2e_ui/sessions/test_sidebar_project_context_menu.py
new file mode 100644
index 0000000000..9436adc263
--- /dev/null
+++ b/tests/e2e_ui/sessions/test_sidebar_project_context_menu.py
@@ -0,0 +1,280 @@
+"""Browser e2e for the project-folder header's context menu.
+
+Project folder headers used to expose their actions only through a
+hover-revealed kebab: a right-click fell through to the browser's native menu,
+and touch — which has no right-click at all — could not reach them. The header
+button now also carries a Radix ``ContextMenuTrigger``, which brings BOTH
+gestures with it (``contextmenu`` for mouse; a built-in 700ms pointerdown timer
+for touch), so the same actions open either way. The kebab is unchanged.
+
+Both menus render from one shared item body (``ProjectFolderMenuItems`` in
+``Sidebar.tsx``) — one under a Radix ``DropdownMenu`` (the kebab), one under a
+``ContextMenu`` (these gestures) — mirroring how the session rows do it.
+
+This guards the wiring the mocked unit tests can't exercise end-to-end:
+
+- Desktop right-click suppresses the native menu and opens the app's, and
+  picking an item drives the real dialog.
+- A **real touch long-press** opens the same menu. Dispatched via CDP
+  ``Input.dispatchTouchEvent`` (touchStart → hold → touchEnd) on a
+  ``has_touch`` context, because that is the only way to produce genuine
+  ``touchstart``/``pointerdown`` sequences here: ``page.touchscreen.tap()`` is
+  instantaneous and cannot hold, and a synthetic ``dispatch_event("pointerdown")``
+  emits no ``touchstart`` at all — it under-exercises the pipeline and can pass
+  while real touch fails.
+- Neither gesture toggles the folder's expand/collapse (the header button's
+  onClick), while a plain left-click still does.
+"""
+
+from __future__ import annotations
+
+import time
+import uuid
+from collections.abc import Iterator
+
+import httpx
+import pytest
+from playwright.sync_api import Browser, Locator, Page, expect
+
+# Phone-width viewport, below the 768px `md` breakpoint: the sidebar is the
+# mobile overlay there, which is where a long-press actually matters.
+_MOBILE_VIEWPORT = {"width": 390, "height": 844}
+
+# Comfortably past Radix's 700ms long-press timer.
+_LONG_PRESS_MS = 900
+
+
+def _set_title(base_url: str, session_id: str, title: str) -> None:
+    """Give a session a unique title so its row is easy to spot on the shared
+    server (other tests' sessions live there too)."""
+    resp = httpx.patch(
+        f"{base_url}/v1/sessions/{session_id}",
+        json={"title": title},
+        timeout=10.0,
+    )
+    resp.raise_for_status()
+
+
+def _create_project(base_url: str, name: str) -> None:
+    """Create an empty project via ``POST /v1/projects``.
+
+    Seeded over the API rather than through the sidebar's + button: that button
+    is hover-revealed on desktop and hidden entirely on the mobile overlay, and
+    what's under test here is the folder header's context menu — not project
+    creation (``test_sidebar_projects.py`` already covers that UI path).
+    """
+    resp = httpx.post(f"{base_url}/v1/projects", json={"name": name}, timeout=10.0)
+    resp.raise_for_status()
+
+
+def _folder_header(page: Page, project: str) -> Locator:
+    """The project folder's collapse-toggle header button.
+
+    A DOM locator rather than ``get_by_role``: an open Radix menu is modal and
+    ``aria-hidden``s the rest of the tree, so role queries can't see the header
+    while its own context menu is up — which is exactly when these tests need to
+    read ``aria-expanded``. Project names here are unique hex, so the text filter
+    is unambiguous.
+    """
+    return page.locator("h2 button").filter(has_text=project)
+
+
+def _expanded(page: Page, project: str) -> str:
+    """Read the folder's current expand state as the raw ``aria-expanded`` value.
+
+    Read rather than asserted against a constant: a freshly created project may
+    render already-expanded, and what the context-menu tests care about is that
+    the gesture leaves the state UNCHANGED, whatever it started as.
+    """
+    value = _folder_header(page, project).get_attribute("aria-expanded")
+    assert value is not None, "folder header is missing aria-expanded"
+    return value
+
+
+def _long_press(
+    page: Page,
+    target: Locator,
+    menu_testid: str = "rename-project",
+    hold_ms: int = _LONG_PRESS_MS,
+) -> bool:
+    """Long-press *target* with real touch events and report whether the menu opened.
+
+    Uses CDP ``Input.dispatchTouchEvent`` so the page sees a genuine
+    ``touchstart`` → ``pointerdown`` sequence (Playwright's ``touchscreen.tap``
+    is instantaneous and cannot hold a press, and a synthetic
+    ``dispatch_event("pointerdown")`` emits no ``touchstart`` at all).
+
+    Polls for the menu *during* the hold rather than only after release: the
+    menu opens mid-gesture off Radix's 700ms timer, and a post-release-only
+    check can miss it entirely.
+
+    :param page: The page whose CDP session dispatches the touch.
+    :param target: Element to press; its bounding box centre is the touch point.
+    :param menu_testid: An item test-id that only the expected menu renders.
+    :param hold_ms: How long to hold before releasing, in milliseconds.
+    :returns: Whether the menu was observed open during (or at the end of) the press.
+    """
+    box = target.bounding_box()
+    assert box is not None, "long-press target has no bounding box"
+    x = box["x"] + box["width"] / 2
+    y = box["y"] + box["height"] / 2
+
+    cdp = page.context.new_cdp_session(page)
+    opened = False
+    try:
+        cdp.send(
+            "Input.dispatchTouchEvent",
+            {"type": "touchStart", "touchPoints": [{"x": x, "y": y}]},
+        )
+        # Peak-poll through the hold; stop as soon as the menu is up.
+        deadline = time.monotonic() + hold_ms / 1000
+        while time.monotonic() < deadline:
+            if page.get_by_test_id(menu_testid).count() > 0:
+                opened = True
+                break
+            page.wait_for_timeout(50)
+        cdp.send("Input.dispatchTouchEvent", {"type": "touchEnd", "touchPoints": []})
+        # A menu that opens right at the release still counts.
+        if not opened:
+            opened = page.get_by_test_id(menu_testid).count() > 0
+    finally:
+        cdp.detach()
+    return opened
+
+
+@pytest.fixture
+def project_page(page: Page, seeded_session: tuple[str, str]) -> Iterator[tuple[Page, str]]:
+    """A desktop page with a fresh, empty project folder in the sidebar.
+
+    :param page: Playwright page fixture (fresh context per test).
+    :param seeded_session: ``(base_url, session_id)`` for a pre-created session.
+    :returns: ``(page, project_name)``.
+    """
+    base_url, session_id = seeded_session
+    _set_title(base_url, session_id, f"e2e-projctx-{uuid.uuid4().hex[:8]}")
+    project = f"Project {uuid.uuid4().hex[:6]}"
+
+    _create_project(base_url, project)
+    page.goto(f"{base_url}/c/{session_id}")
+    expect(_folder_header(page, project)).to_be_visible()
+
+    yield (page, project)
+
+
+def test_right_click_opens_project_folder_menu(project_page: tuple[Page, str]) -> None:
+    """Right-clicking a folder header opens the kebab's actions, and they work.
+
+    :param project_page: ``(page, project_name)`` with the folder in the sidebar.
+    """
+    page, project = project_page
+    header = _folder_header(page, project)
+
+    # Whatever state the folder is in, the right-click must not change it.
+    before = _expanded(page, project)
+
+    # Radix's ContextMenuTrigger preventDefaults the native contextmenu and
+    # opens the app menu at the cursor.
+    header.click(button="right")
+
+    # The full kebab action set, same testids — it renders from the shared
+    # ProjectFolderMenuItems body. (The kebab DropdownMenu is closed, so these
+    # are the context menu's own items.)
+    expect(page.get_by_test_id("rename-project")).to_be_visible()
+    expect(page.get_by_test_id("project-settings")).to_be_visible()
+    expect(page.get_by_test_id("delete-project")).to_be_visible()
+
+    # Opening the menu did NOT collapse/expand the folder.
+    expect(header).to_have_attribute("aria-expanded", before)
+
+    # The item drives the real dialog, same as the kebab's Rename.
+    page.get_by_test_id("rename-project").click()
+    expect(page.get_by_test_id("rename-project-confirm")).to_be_visible()
+
+
+def test_left_click_still_toggles_the_folder(project_page: tuple[Page, str]) -> None:
+    """A plain left-click on the header still expands and collapses the folder.
+
+    :param project_page: ``(page, project_name)`` with the folder in the sidebar.
+    """
+    page, project = project_page
+    header = _folder_header(page, project)
+
+    # Toggle relative to the starting state (a fresh project may already be
+    # expanded), so this asserts the flip rather than an absolute value.
+    before = _expanded(page, project)
+    flipped = "false" if before == "true" else "true"
+
+    header.click()
+    expect(header).to_have_attribute("aria-expanded", flipped)
+    header.click()
+    expect(header).to_have_attribute("aria-expanded", before)
+
+
+def test_touch_long_press_opens_project_folder_menu(
+    browser: Browser,
+    seeded_session: tuple[str, str],
+) -> None:
+    """A real touch long-press on the folder header opens the same menu.
+
+    Runs on its own ``has_touch``/``is_mobile`` phone-width context: mobile is
+    the case that had no way to reach these actions at all before, since touch
+    cannot right-click.
+
+    Includes a **positive control** — the same press on a session row, whose
+    long-press menu already worked before this change — so a negative result on
+    the folder header means the folder is broken rather than that the CDP touch
+    plumbing failed to reach the page.
+
+    :param browser: Playwright browser fixture (a fresh context is made here).
+    :param seeded_session: ``(base_url, session_id)`` for a pre-created session.
+    """
+    base_url, session_id = seeded_session
+    _set_title(base_url, session_id, f"e2e-projctx-touch-{uuid.uuid4().hex[:8]}")
+    project = f"Project {uuid.uuid4().hex[:6]}"
+
+    _create_project(base_url, project)
+
+    context = browser.new_context(
+        has_touch=True,
+        is_mobile=True,
+        viewport=_MOBILE_VIEWPORT,
+    )
+    try:
+        page = context.new_page()
+        # The mobile sidebar starts closed; ?sidebar=open is the one-shot param
+        # the notification-tap destination uses.
+        page.goto(f"{base_url}/c/{session_id}?sidebar=open")
+
+        header = _folder_header(page, project)
+        expect(header).to_be_visible()
+        before = _expanded(page, project)
+
+        # Detector validation: prove the CDP touch pipeline actually reaches the
+        # page BEFORE trusting a negative on the folder. A session row's
+        # long-press menu is the known-good reference; if this press produces
+        # nothing, the plumbing is at fault and the folder result is meaningless.
+        row = page.locator(f'a[href="/c/{session_id}"]')
+        expect(row).to_be_visible()
+        assert _long_press(page, row, menu_testid="rename-conversation"), (
+            "CDP touch long-press did not reach the page (control failed) — "
+            "the folder assertion below would be meaningless"
+        )
+        # Dismiss the control's menu so it can't be mistaken for the folder's.
+        page.keyboard.press("Escape")
+        expect(page.get_by_test_id("rename-conversation")).to_have_count(0)
+
+        # The actual assertion: long-press the folder header.
+        assert _long_press(page, header), (
+            "long-press on the project folder header did not open the context menu"
+        )
+
+        expect(page.get_by_test_id("rename-project")).to_be_visible()
+        expect(page.get_by_test_id("project-settings")).to_be_visible()
+        expect(page.get_by_test_id("delete-project")).to_be_visible()
+
+        # The long-press must not have toggled the folder: Radix opens the menu
+        # mid-gesture, and the press's trailing click would otherwise collapse
+        # or expand it under the just-opened menu.
+        expect(_folder_header(page, project)).to_have_attribute("aria-expanded", before)
+    finally:
+        context.close()
diff --git a/web/src/shell/Sidebar.projectContextMenu.test.tsx b/web/src/shell/Sidebar.projectContextMenu.test.tsx
new file mode 100644
index 0000000000..f1c8952cea
--- /dev/null
+++ b/web/src/shell/Sidebar.projectContextMenu.test.tsx
@@ -0,0 +1,416 @@
+// Tests for the project-folder header's right-click / long-press context menu.
+//
+// Project folder headers historically had only a hover-revealed kebab: a
+// right-click fell through to the browser's native menu, and touch (which has
+// no right-click) had no way to reach the actions at all. The header button now
+// also carries a Radix `ContextMenuTrigger`, which supplies BOTH gestures —
+// `contextmenu` for mouse and a built-in 700ms pointerdown timer for touch — so
+// the same actions are reachable either way. The kebab stays.
+//
+// The menu body is authored once (`ProjectFolderMenuItems`) and rendered under
+// both primitive families via the dropdown/context `MenuComponents` bundles, the
+// same pattern the session rows use (`ConversationMenuItems`).
+//
+// What's locked in here:
+//   1. Parity — the context menu carries the kebab's exact items, and each one
+//      opens the same dialog as the kebab's.
+//   2. Left-click still expands/collapses the folder.
+//   3. Opening the context menu does NOT toggle expansion (the pre-existing
+//      trap: the header button's onClick flips expand/collapse, and a
+//      long-press's trailing click would otherwise fire it).
+//   4. A nested session row keeps its OWN context menu — the trigger wraps the
+//      header button, not the section, so right-click isn't hijacked.
+//   5. Bulk-selection mode suppresses the header context menu, matching rows.
+
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { act, cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { MemoryRouter } from "react-router-dom";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { TooltipProvider } from "@/components/ui/tooltip";
+
+// `isMobile` drives the mocked `useIsMobileViewport` (jsdom doesn't evaluate
+// media queries), so the mobile-only "New session" item can be exercised.
+const mocks = vi.hoisted(() => ({
+  isMobile: false,
+  renameProject: { mutate: vi.fn() },
+  deleteProject: { mutate: vi.fn() },
+}));
+
+vi.mock("@/hooks/useIsMobileViewport", () => ({
+  useIsMobileViewport: () => mocks.isMobile,
+}));
+
+vi.mock("@/hooks/useConversations", () => ({
+  useConversations: vi.fn(),
+  useConnectedConversations: () => [],
+  useStopAndDeleteConversation: () => ({
+    mutate: vi.fn(),
+    reset: vi.fn(),
+    isPending: false,
+    isError: false,
+    variables: undefined,
+  }),
+  usePinnedConversations: () => ({
+    data: { conversations: [], filterHonored: true },
+    isSuccess: true,
+  }),
+  useTogglePinnedConversation: () => ({ mutate: vi.fn() }),
+  setConversationPinned: vi.fn(() => Promise.resolve({})),
+  PINNED_CONVERSATIONS_KEY: ["pinned-conversations"],
+  useRenameConversation: () => ({ mutate: vi.fn() }),
+  useArchiveConversation: () => ({ mutate: vi.fn() }),
+  useBulkArchiveConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
+  useBulkDeleteConversations: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
+  useBulkStopSessions: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
+  useStopSession: () => ({ mutate: vi.fn() }),
+  useProjects: () => ({ data: [{ id: PROJECT_ID, name: PROJECT_NAME }] }),
+  // The folder sources its members from the globally-loaded window too, so the
+  // nested-row test doesn't need this query to return anything.
+  useProjectSessions: () => ({
+    data: undefined,
+    isLoading: false,
+    isError: false,
+    error: null,
+    fetchNextPage: vi.fn(),
+    hasNextPage: false,
+    isFetchingNextPage: false,
+  }),
+  useMoveToProject: () => ({ mutate: vi.fn() }),
+  useDeleteProject: () => ({ ...mocks.deleteProject, isPending: false, isError: false }),
+  useRenameProject: () => ({ ...mocks.renameProject, isPending: false, isError: false }),
+  useCreateProject: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
+  useProjectConfig: () => ({ data: undefined, isLoading: false }),
+  useUpdateProjectConfig: () => ({ mutate: vi.fn(), isPending: false, isError: false }),
+  fetchProjectSessionIds: () => Promise.resolve([]),
+  PROJECT_LABEL_KEY: "omni_project",
+}));
+
+vi.mock("./AgentTypeFilter", () => ({ AgentTypeFilter: () => null }));
+vi.mock("./ReportIssueButton", () => ({ ReportIssueButton: () => null }));
+vi.mock("@/components/PermissionsModal", () => ({ PermissionsModal: () => null }));
+
+import { type Conversation, useConversations } from "@/hooks/useConversations";
+import { Sidebar } from "./Sidebar";
+
+const PROJECT_NAME = "Sprint 42";
+const PROJECT_ID = "p_sprint42";
+
+const useConvMock = vi.mocked(useConversations);
+
+/** A session filed under PROJECT_NAME, so the folder holds a nested row. */
+const FILED_CONV: Conversation = {
+  id: "conv_1",
+  object: "conversation",
+  title: "My Session",
+  created_at: 1_700_000_000,
+  updated_at: 1_700_000_000,
+  labels: {},
+  project_id: PROJECT_ID,
+  permission_level: null,
+  status: "idle",
+};
+
+function mockConversations(conversations: Conversation[]) {
+  const result = {
+    data: {
+      pages: [
+        {
+          data: conversations,
+          first_id: conversations[0]?.id ?? null,
+          last_id: conversations.at(-1)?.id ?? null,
+          has_more: false,
+        },
+      ],
+      pageParams: [undefined],
+    },
+    isLoading: false,
+    isError: false,
+    error: null,
+    fetchNextPage: vi.fn(),
+    hasNextPage: false,
+    isFetchingNextPage: false,
+  } as unknown as ReturnType<typeof useConversations>;
+  useConvMock.mockImplementation(() => result);
+}
+
+function renderSidebar() {
+  const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } });
+  return render(
+    <QueryClientProvider client={qc}>
+      <TooltipProvider>
+        <MemoryRouter initialEntries={["/"]}>
+          <Sidebar open={true} onClose={vi.fn()} />
+        </MemoryRouter>
+      </TooltipProvider>
+    </QueryClientProvider>,
+  );
+}
+
+/** The project folder's collapse-toggle header button. An open Radix menu is
+ *  modal and `aria-hidden`s the rest of the tree, so role queries can't see the
+ *  header while the menu is up — match on the accessible name via the DOM. */
+function folderHeader(): HTMLElement {
+  const header = Array.from(document.querySelectorAll("h2 button")).find(
+    (b) => b.textContent === PROJECT_NAME,
+  );
+  if (header === undefined) throw new Error(`no folder header for ${PROJECT_NAME}`);
+  return header as HTMLElement;
+}
+
+/** Radix's ContextMenuTrigger renders a wrapping span around the `asChild`
+ *  header button; the pointer handlers that arm the long-press live on it. */
+function contextTrigger(): HTMLElement {
+  const trigger = folderHeader().closest('[data-slot="context-menu-trigger"]');
+  if (trigger === null) throw new Error("folder header has no context-menu trigger");
+  return trigger as HTMLElement;
+}
+
+/** Simulate a touch long-press on the folder header: Radix arms a 700ms timer
+ *  on a non-mouse pointerdown, so advance fake timers past it. */
+function longPressHeader() {
+  fireEvent.pointerDown(contextTrigger(), { pointerType: "touch", button: 0 });
+  // The open happens inside the timer callback, so flush it under act().
+  act(() => {
+    vi.advanceTimersByTime(750);
+  });
+}
+
+beforeEach(() => {
+  mocks.isMobile = false;
+  mocks.renameProject.mutate.mockReset();
+  mocks.deleteProject.mutate.mockReset();
+  useConvMock.mockReset();
+  localStorage.clear();
+  mockConversations([FILED_CONV]);
+});
+
+afterEach(cleanup);
+
+describe("project folder header context menu", () => {
+  it("opens the kebab's exact action set on right-click", () => {
+    renderSidebar();
+
+    // Nothing rendered until the header is right-clicked (the kebab is closed).
+    expect(screen.queryByTestId("rename-project")).toBeNull();
+
+    fireEvent.contextMenu(folderHeader());
+
+    // Same testids as the kebab body — it renders from the shared
+    // ProjectFolderMenuItems, so the two menus can't diverge.
+    expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+    expect(screen.getByTestId("project-settings")).toBeInTheDocument();
+    expect(screen.getByTestId("delete-project")).toBeInTheDocument();
+    // "New session" is present but mobile-only (md:hidden), matching the kebab.
+    expect(screen.getByTestId("project-new-session-menu")).toHaveClass("md:hidden");
+  });
+
+  it("carries exactly the same items as the kebab", () => {
+    // Parity asserted item-for-item rather than by a hand-written list, so a
+    // future kebab item that skips the shared body fails here.
+    renderSidebar();
+
+    fireEvent.pointerDown(screen.getByTestId("project-actions"), { button: 0 });
+    const kebabItems = screen
+      .getAllByRole("menuitem")
+      .map((el) => el.getAttribute("data-testid"))
+      .filter((id): id is string => id !== null);
+    expect(kebabItems.length).toBeGreaterThan(0);
+
+    cleanup();
+    renderSidebar();
+
+    fireEvent.contextMenu(folderHeader());
+    const contextItems = screen
+      .getAllByRole("menuitem")
+      .map((el) => el.getAttribute("data-testid"))
+      .filter((id): id is string => id !== null);
+
+    expect(contextItems).toEqual(kebabItems);
+  });
+
+  it("keeps the kebab working unchanged", () => {
+    renderSidebar();
+
+    fireEvent.pointerDown(screen.getByTestId("project-actions"), { button: 0 });
+
+    expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+    fireEvent.click(screen.getByTestId("rename-project"));
+    expect(screen.getByTestId("rename-project-confirm")).toBeInTheDocument();
+  });
+
+  it("drives Rename from the context menu into the same dialog and mutation", () => {
+    renderSidebar();
+
+    fireEvent.contextMenu(folderHeader());
+    fireEvent.click(screen.getByTestId("rename-project"));
+
+    // The shared rename dialog — same testid the kebab path opens.
+    const confirm = screen.getByTestId("rename-project-confirm");
+    expect(confirm).toBeInTheDocument();
+
+    const input = screen.getByDisplayValue(PROJECT_NAME);
+    fireEvent.change(input, { target: { value: "Sprint 43" } });
+    fireEvent.click(confirm);
+
+    expect(mocks.renameProject.mutate).toHaveBeenCalledWith(
+      { id: PROJECT_ID, oldName: PROJECT_NAME, newName: "Sprint 43" },
+      expect.anything(),
+    );
+  });
+
+  it("drives Project settings from the context menu", () => {
+    renderSidebar();
+
+    fireEvent.contextMenu(folderHeader());
+    fireEvent.click(screen.getByTestId("project-settings"));
+
+    expect(screen.getByRole("dialog")).toHaveTextContent(/Project settings/i);
+  });
+
+  it("drives Delete from the context menu into the same confirm + mutation", () => {
+    renderSidebar();
+
+    fireEvent.contextMenu(folderHeader());
+    fireEvent.click(screen.getByTestId("delete-project"));
+
+    // The confirm dialog (delete archives every member, so it's gated).
+    expect(screen.getByText("Delete project?")).toBeInTheDocument();
+    fireEvent.click(screen.getByRole("button", { name: "Delete project" }));
+
+    expect(mocks.deleteProject.mutate).toHaveBeenCalledWith(
+      { id: PROJECT_ID, name: PROJECT_NAME },
+      expect.anything(),
+    );
+  });
+
+  it("exposes the mobile-only New session item pre-filed under the project", () => {
+    mocks.isMobile = true;
+    renderSidebar();
+
+    fireEvent.contextMenu(folderHeader());
+
+    // asChild renders the item as the <a> itself, so the href lives on it.
+    expect(screen.getByTestId("project-new-session-menu")).toHaveAttribute(
+      "href",
+      `/?project=${encodeURIComponent(PROJECT_NAME)}`,
+    );
+  });
+
+  it("still expands and collapses the folder on plain left-click", () => {
+    renderSidebar();
+
+    // Project folders render collapsed by default.
+    const header = folderHeader();
+    expect(header).toHaveAttribute("aria-expanded", "false");
+
+    fireEvent.click(header);
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
+
+    fireEvent.click(folderHeader());
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+  });
+
+  it("does not toggle the folder when the context menu opens on right-click", () => {
+    renderSidebar();
+
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+
+    fireEvent.contextMenu(folderHeader());
+
+    // The menu is open and the folder stayed collapsed — Radix preventDefaults
+    // the native contextmenu, so no click reaches the collapse toggle.
+    expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+  });
+
+  it("does not toggle the folder when a long-press opens the menu", () => {
+    // The gotcha this PR had to solve: the long-press fires mid-gesture off
+    // Radix's pointerdown timer, but the trailing pointerup still produces a
+    // click — which would collapse/expand the folder under the just-opened menu.
+    vi.useFakeTimers();
+    try {
+      renderSidebar();
+      expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+
+      longPressHeader();
+
+      // The menu opened from touch alone — no custom gesture code, just Radix's
+      // 700ms timer on the same trigger.
+      expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+
+      // The trailing click of the press must NOT toggle the folder.
+      fireEvent.pointerUp(contextTrigger(), { pointerType: "touch", button: 0 });
+      fireEvent.click(folderHeader());
+      expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+    } finally {
+      vi.useRealTimers();
+    }
+  });
+
+  it("still toggles on a plain click after a long-press opened the menu", () => {
+    // The click-swallow must be one-shot: a later ordinary click still expands.
+    vi.useFakeTimers();
+    try {
+      renderSidebar();
+
+      longPressHeader();
+      fireEvent.pointerUp(contextTrigger(), { pointerType: "touch", button: 0 });
+      fireEvent.click(folderHeader());
+      expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+
+      // A fresh, separate click (its own pointerdown) toggles as normal.
+      fireEvent.pointerDown(folderHeader(), { pointerType: "mouse", button: 0 });
+      fireEvent.click(folderHeader());
+      expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
+    } finally {
+      vi.useRealTimers();
+    }
+  });
+
+  it("scopes the header trigger to the header button, clear of the nested rows", () => {
+    // Structural guard on placement. The trigger must wrap the header BUTTON,
+    // never an ancestor that also contains the child rows (the outer folder
+    // div, or the <section>) — those would put every nested session row inside
+    // the project's trigger and hijack right-click on them.
+    renderSidebar();
+
+    // Expand the folder so its member row renders inside the section.
+    fireEvent.click(folderHeader());
+    const row = screen.getByRole("link", { name: /My Session/ });
+
+    const trigger = contextTrigger();
+    expect(trigger.contains(folderHeader())).toBe(true);
+    expect(trigger.contains(row)).toBe(false);
+  });
+
+  it("leaves a nested session row's own context menu intact", () => {
+    renderSidebar();
+
+    fireEvent.click(folderHeader());
+    const row = screen.getByRole("link", { name: /My Session/ });
+
+    fireEvent.contextMenu(row);
+
+    // The SESSION's menu opened (row actions), not the project's.
+    expect(screen.getByTestId("rename-conversation")).toBeInTheDocument();
+    expect(screen.getByTestId("archive-conversation")).toBeInTheDocument();
+    expect(screen.queryByTestId("rename-project")).toBeNull();
+    expect(screen.queryByTestId("delete-project")).toBeNull();
+  });
+
+  it("suppresses the header context menu in bulk-selection mode", () => {
+    // Selection mode owns the rows, and the session rows already drop their
+    // context menus there — the folder header matches that.
+    renderSidebar();
+
+    fireEvent.click(folderHeader());
+    fireEvent.pointerDown(screen.getByTestId("project-list-actions"), { button: 0 });
+    fireEvent.click(screen.getByTestId("projects-select-sessions"));
+
+    // In selection mode the header no longer carries a context-menu trigger,
+    // and right-clicking it opens nothing.
+    expect(folderHeader().closest('[data-slot="context-menu-trigger"]')).toBeNull();
+    fireEvent.contextMenu(folderHeader());
+    expect(screen.queryByTestId("rename-project")).toBeNull();
+  });
+});
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index dd34ece8d1..5834e529c0 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -195,6 +195,8 @@ const SIDEBAR_HOVER_HIGHLIGHT = "hover:bg-muted hover:text-foreground dark:hover
 const SIDEBAR_ACTIVE_HIGHLIGHT =
   "bg-[var(--sidebar-active)] text-[var(--sidebar-active-foreground)] hover:bg-[var(--sidebar-active)] hover:text-[var(--sidebar-active-foreground)] dark:hover:bg-[var(--sidebar-active)] dark:hover:text-[var(--sidebar-active-foreground)]";
 const DROP_TARGET_HIGHLIGHT = SIDEBAR_ACTIVE_HIGHLIGHT;
+// Shared sizing for the sidebar's dropdown / context menus so they can't drift.
+const SIDEBAR_MENU_CONTENT_CLASS = "min-w-40";
 
 // Maps a first-class project id → its name, provided once at the list level so
 // each row resolves its ``project_id`` to a folder name without its own
@@ -1074,6 +1076,10 @@ function ProjectFolder({
     data: { type: "project", name },
   });
 
+  // One set of rename / settings / delete dialogs, driven by both the header
+  // kebab and the header's right-click / long-press context menu.
+  const { actions: menuActions, dialogs: menuDialogs } = useProjectFolderMenu(name, projectId);
+
   return (
     <div
       ref={setNodeRef}
@@ -1107,7 +1113,17 @@ function ProjectFolder({
         emptyMessage={loadingFirstPage ? undefined : "No sessions"}
         indentRows
         headerAction={
-          <ProjectFolderActions projectName={name} projectId={projectId} onNavigate={onRowClick} />
+          <ProjectFolderActions projectName={name} onNavigate={onRowClick} actions={menuActions} />
+        }
+        headerContextMenu={
+          <ContextMenuContent className={SIDEBAR_MENU_CONTENT_CLASS}>
+            <ProjectFolderMenuItems
+              components={contextBundle}
+              projectName={name}
+              onNavigate={onRowClick}
+              actions={menuActions}
+            />
+          </ContextMenuContent>
         }
         footer={
           loadingFirstPage ? (
@@ -1123,6 +1139,7 @@ function ProjectFolder({
           )
         }
       />
+      {menuDialogs}
     </div>
   );
 }
@@ -2071,6 +2088,7 @@ function SectionHeader({
   hasAction,
   collapsed,
   onToggleCollapsed,
+  contextMenu,
 }: {
   title: string;
   icon?: ReactNode;
@@ -2081,72 +2099,132 @@ function SectionHeader({
   hasAction?: boolean;
   collapsed: boolean;
   onToggleCollapsed: () => void;
+  /** Optional {@link ContextMenuContent} opened by right-clicking (desktop) or
+      long-pressing (touch) the header button — the folder-menu parity path.
+      Radix's own trigger supplies both gestures, so no gesture code lives here. */
+  contextMenu?: ReactNode;
 }) {
-  return (
-    <h2>
-      <button
-        type="button"
-        aria-expanded={!collapsed}
-        onClick={onToggleCollapsed}
-        className={
-          icon
-            ? cn(
-                SIDEBAR_ROW,
-                "group flex w-full items-center border-0 text-left text-foreground transition-colors",
-                SIDEBAR_HOVER_HIGHLIGHT,
-              )
-            : "group flex w-full items-center gap-1 border-0 pt-0 pr-0 pb-1 pl-2 text-left text-sm font-normal text-muted-foreground transition-colors hover:text-foreground"
+  // A long-press opens the menu mid-gesture and its trailing click would toggle
+  // the folder; a mouse right-click or keyboard Shift+F10 leaves no such click.
+  const swallowClickRef = useRef(false);
+  // True while a pointer that could still long-press is down. The non-mouse gate
+  // and the move/up/cancel clears below mirror Radix's own long-press timer.
+  const longPressPointerRef = useRef(false);
+
+  function clearLongPressPointer() {
+    longPressPointerRef.current = false;
+  }
+
+  const button = (
+    <button
+      type="button"
+      aria-expanded={!collapsed}
+      onPointerDown={(event) => {
+        swallowClickRef.current = false;
+        longPressPointerRef.current = event.pointerType !== "mouse";
+      }}
+      onPointerMove={clearLongPressPointer}
+      onPointerUp={clearLongPressPointer}
+      onPointerCancel={clearLongPressPointer}
+      onClick={() => {
+        if (swallowClickRef.current) {
+          swallowClickRef.current = false;
+          return;
         }
-      >
-        {icon ? (
-          // Headers with a leading icon (project folders) swap the folder for a
-          // chevron on desktop hover/focus, so the caret takes the icon's place
-          // rather than trailing the name. Mobile (no hover) keeps the folder
-          // icon and shows the trailing chevron below.
-          <span className="relative flex size-4 shrink-0 items-center justify-center">
-            <span className="flex md:transition-opacity md:group-hover:opacity-0 md:group-focus-visible:opacity-0">
-              {icon}
-            </span>
-            <ChevronRightIcon
-              className={cn(
-                "absolute size-3.5 opacity-0 transition-[transform,opacity]",
-                !collapsed && "rotate-90",
-                "hidden md:flex md:group-hover:opacity-100 md:group-focus-visible:opacity-100",
-              )}
-            />
+        onToggleCollapsed();
+      }}
+      // select-none: a long-press must open the context menu, not start a
+      // native text selection of the header title. The header cannot suppress
+      // it the way session rows do (preventDefault on touch pointerdown) —
+      // that would also cancel Radix's composed long-press timer.
+      className={
+        icon
+          ? cn(
+              SIDEBAR_ROW,
+              "group flex w-full select-none items-center border-0 text-left text-foreground transition-colors",
+              SIDEBAR_HOVER_HIGHLIGHT,
+            )
+          : "group flex w-full select-none items-center gap-1 border-0 pt-0 pr-0 pb-1 pl-2 text-left text-sm font-normal text-muted-foreground transition-colors hover:text-foreground"
+      }
+    >
+      {icon ? (
+        // Headers with a leading icon (project folders) swap the folder for a
+        // chevron on desktop hover/focus, so the caret takes the icon's place
+        // rather than trailing the name. Mobile (no hover) keeps the folder
+        // icon and shows the trailing chevron below.
+        <span className="relative flex size-4 shrink-0 items-center justify-center">
+          <span className="flex md:transition-opacity md:group-hover:opacity-0 md:group-focus-visible:opacity-0">
+            {icon}
           </span>
-        ) : null}
-        <span className="min-w-0 truncate">{title}</span>
-        {/* Trailing chevron, rotating on expand. Headers without a leading icon
-            reveal it on desktop hover/focus; icon headers show it only on mobile
-            (no hover) since desktop swaps the folder for the chevron above. */}
-        <ChevronRightIcon
-          className={cn(
-            "size-3.5 shrink-0 transition-[transform,opacity]",
-            !collapsed && "rotate-90",
-            icon
-              ? "md:hidden"
-              : "md:opacity-0 md:group-hover:opacity-100 md:group-focus-visible:opacity-100",
-          )}
-        />
-        {/* A hidden row inside this collapsed section carries a marker — surface
-            the exact same badge a row would show, pinned to the right edge. */}
-        {collapsed && marker && (
-          <span
+          <ChevronRightIcon
             className={cn(
-              "ml-auto flex shrink-0 items-center transition-opacity",
-              // When the header also carries a hover-revealed kebab, keep the
-              // marker clear of it the same way a row's time/marker slot does:
-              // reserve space on mobile (kebab always shown) and fade out on
-              // desktop hover so the kebab takes its place.
-              hasAction &&
-                "mr-14 md:mr-0 md:group-hover/section:opacity-0 md:group-focus-within/section:opacity-0",
+              "absolute size-3.5 opacity-0 transition-[transform,opacity]",
+              !collapsed && "rotate-90",
+              "hidden md:flex md:group-hover:opacity-100 md:group-focus-visible:opacity-100",
             )}
-          >
-            <SessionStateBadge state={marker} />
-          </span>
+          />
+        </span>
+      ) : null}
+      <span className="min-w-0 truncate">{title}</span>
+      {/* Trailing chevron, rotating on expand. Headers without a leading icon
+          reveal it on desktop hover/focus; icon headers show it only on mobile
+          (no hover) since desktop swaps the folder for the chevron above. */}
+      <ChevronRightIcon
+        className={cn(
+          "size-3.5 shrink-0 transition-[transform,opacity]",
+          !collapsed && "rotate-90",
+          icon
+            ? "md:hidden"
+            : "md:opacity-0 md:group-hover:opacity-100 md:group-focus-visible:opacity-100",
         )}
-      </button>
+      />
+      {/* A hidden row inside this collapsed section carries a marker — surface
+          the exact same badge a row would show, pinned to the right edge. */}
+      {collapsed && marker && (
+        <span
+          className={cn(
+            "ml-auto flex shrink-0 items-center transition-opacity",
+            // When the header also carries a hover-revealed kebab, keep the
+            // marker clear of it the same way a row's time/marker slot does:
+            // reserve space on mobile (kebab always shown) and fade out on
+            // desktop hover so the kebab takes its place.
+            hasAction &&
+              "mr-14 md:mr-0 md:group-hover/section:opacity-0 md:group-focus-within/section:opacity-0",
+          )}
+        >
+          <SessionStateBadge state={marker} />
+        </span>
+      )}
+    </button>
+  );
+
+  // Right-click / long-press parity with the kebab. The trigger wraps the header
+  // BUTTON only — not the section — so a nested session row keeps its own menu.
+  // Radix preventDefaults the native contextmenu and arms a 700ms touch
+  // long-press itself, so both gestures come free; no `style` prop is passed,
+  // which would clobber its WebkitTouchCallout.
+  return (
+    <h2>
+      {contextMenu ? (
+        <ContextMenu
+          onOpenChange={(open) => {
+            if (open) {
+              swallowClickRef.current = longPressPointerRef.current;
+              longPressPointerRef.current = false;
+            } else {
+              // A long-press's trailing click lands while the menu is open; a
+              // gesture with no trailing click (pen right-click, touch release
+              // over the menu) must not strand the swallow past the close.
+              swallowClickRef.current = false;
+            }
+          }}
+        >
+          <ContextMenuTrigger asChild>{button}</ContextMenuTrigger>
+          {contextMenu}
+        </ContextMenu>
+      ) : (
+        button
+      )}
     </h2>
   );
 }
@@ -2252,7 +2330,7 @@ function ProjectHeaderActions({
               <MoreHorizontalIcon className="size-3.5" />
             </Button>
           </DropdownMenuTrigger>
-          <DropdownMenuContent align="end" className="min-w-40">
+          <DropdownMenuContent align="end" className={SIDEBAR_MENU_CONTENT_CLASS}>
             {/* Gated independently: each hides only when it would be a no-op, so
                 a mixed set offers both. */}
             {showExpandControls && !allExpanded && (
@@ -2352,6 +2430,7 @@ function ConversationSection({
   emptyMessage,
   indentRows,
   headerAction,
+  headerContextMenu,
   afterHeader,
   footer,
   onProjectAssigned,
@@ -2378,6 +2457,10 @@ function ConversationSection({
   /** Optional control overlaid at the header's right edge (e.g. a project's
       kebab). Hover/focus-revealed on desktop, always shown on mobile. */
   headerAction?: ReactNode;
+  /** Optional {@link ContextMenuContent} for the header itself — the same
+      actions as `headerAction`'s kebab, reached by right-click or long-press.
+      Suppressed in selection mode, matching the session rows. */
+  headerContextMenu?: ReactNode;
   /** Optional content rendered directly under the header, above the rows (and
       shown even when collapsed) — e.g. the bulk-selection action bar. */
   afterHeader?: ReactNode;
@@ -2404,6 +2487,8 @@ function ConversationSection({
             hasAction={headerAction != null}
             collapsed={isCollapsed}
             onToggleCollapsed={onToggleCollapsed}
+            // Selection mode owns the rows, so the header menu is suppressed.
+            contextMenu={selectionMode ? undefined : headerContextMenu}
           />
           {headerAction && (
             <div className="-translate-y-1/2 absolute top-1/2 right-1 flex items-center transition-opacity md:opacity-0 md:group-focus-within/header:opacity-100 md:group-hover/header:opacity-100 md:group-has-[[data-state=open]]/header:opacity-100 md:has-[[aria-expanded=true]]:opacity-100">
@@ -2465,6 +2550,8 @@ interface MenuItemProps {
   className?: string;
   disabled?: boolean;
   variant?: "default" | "destructive";
+  // Renders the item as its child element (e.g. a router <Link>).
+  asChild?: boolean;
   // Radix's menu `onSelect` receives a native Event in both families.
   onSelect?: (event: Event) => void;
   "data-testid"?: string;
@@ -3931,15 +4018,14 @@ function ArchivingRow({ label }: { label: string }) {
  */
 function ProjectFolderActions({
   projectName,
-  projectId,
   onNavigate,
+  actions,
 }: {
   projectName: string;
-  /** First-class project id, or null for a label-only folder. */
-  projectId: string | null;
   /** Plain-left-click nav handler — closes the mobile overlay so the
       pre-filed new-session page isn't left hidden behind the sidebar. */
   onNavigate: (e: MouseEvent<HTMLAnchorElement>) => void;
+  actions: ProjectFolderMenuActions;
 }) {
   return (
     // gap-0.5 (2px) between the pencil and kebab mirrors the session row's
@@ -3973,7 +4059,7 @@ function ProjectFolderActions({
         </TooltipTrigger>
         <TooltipContent side="bottom">New session in project</TooltipContent>
       </Tooltip>
-      <ProjectFolderMenu projectName={projectName} projectId={projectId} onNavigate={onNavigate} />
+      <ProjectFolderMenu projectName={projectName} onNavigate={onNavigate} actions={actions} />
     </div>
   );
 }
@@ -3981,23 +4067,80 @@ function ProjectFolderActions({
 // ── ProjectFolderMenu ─────────────────────────────────────────────────────────
 
 /**
- * The kebab on a project-folder header: "Rename project" (O(1) via
- * `PATCH /v1/projects/{id}` for a first-class project; promotes a label-only
- * folder on demand) and "Delete project" (archives + unfiles all members, then
- * removes the container). Delete is confirmed since it archives sessions.
+ * The project-folder action menu body — authored once and rendered under both
+ * the header kebab {@link DropdownMenu} and the header's right-click /
+ * long-press {@link ContextMenu}, via the {@link MenuComponents} bundle, so the
+ * two menus stay identical (mirrors {@link ConversationMenuItems} for rows).
  */
-function ProjectFolderMenu({
+function ProjectFolderMenuItems({
+  components: C,
   projectName,
-  projectId,
   onNavigate,
+  actions,
 }: {
+  components: MenuComponents;
   projectName: string;
-  projectId: string | null;
   /** Nav handler for the mobile-only "New session" item (desktop uses the
       hover-revealed pencil). Closes the sidebar overlay on mobile. */
   onNavigate: (e: MouseEvent<HTMLAnchorElement>) => void;
+  actions: ProjectFolderMenuActions;
 }) {
-  const [menuOpen, setMenuOpen] = useState(false);
+  return (
+    <>
+      {/* New session — mobile-only (md:hidden); desktop uses the
+          hover-revealed pencil on the folder header. */}
+      <C.Item asChild className="md:hidden" data-testid="project-new-session-menu">
+        <Link
+          to={`/?project=${encodeURIComponent(projectName)}`}
+          onClick={(e) => {
+            e.stopPropagation();
+            onNavigate(e);
+          }}
+        >
+          <SquarePenIcon className="size-3.5" />
+          New session
+        </Link>
+      </C.Item>
+      <C.Item data-testid="rename-project" onSelect={actions.openRename}>
+        <PencilIcon className="size-3.5" />
+        Rename project
+      </C.Item>
+      <C.Item data-testid="project-settings" onSelect={actions.openSettings}>
+        <Settings2Icon className="size-3.5" />
+        Project settings
+      </C.Item>
+      <C.Item data-testid="delete-project" variant="destructive" onSelect={actions.openDelete}>
+        <Trash2Icon className="size-3.5" />
+        Delete project
+      </C.Item>
+    </>
+  );
+}
+
+/** The dialog-opening handlers the folder menu body drives, owned by
+ *  {@link useProjectFolderMenu} so the kebab and the header context menu share
+ *  one set of dialogs rather than each mounting its own. */
+interface ProjectFolderMenuActions {
+  openRename: () => void;
+  openSettings: () => void;
+  openDelete: () => void;
+}
+
+/**
+ * Owns the project-folder menu's dialogs — "Rename project" (O(1) via
+ * `PATCH /v1/projects/{id}` for a first-class project; promotes a label-only
+ * folder on demand), "Project settings", and "Delete project" (archives +
+ * unfiles all members, then removes the container; confirmed since it archives
+ * sessions).
+ *
+ * Returns the open-handlers plus the rendered dialog elements, so the header can
+ * mount the dialogs once and drive them from either the kebab or the header's
+ * context menu.
+ */
+function useProjectFolderMenu(
+  projectName: string,
+  projectId: string | null,
+): { actions: ProjectFolderMenuActions; dialogs: ReactNode } {
   const [deleteOpen, setDeleteOpen] = useState(false);
   const [renameOpen, setRenameOpen] = useState(false);
   const [settingsOpen, setSettingsOpen] = useState(false);
@@ -4005,62 +4148,17 @@ function ProjectFolderMenu({
   const deleteProject = useDeleteProject();
   const renameProject = useRenameProject();
 
-  return (
+  const actions: ProjectFolderMenuActions = {
+    openRename: () => {
+      setRenameValue(projectName);
+      setRenameOpen(true);
+    },
+    openSettings: () => setSettingsOpen(true),
+    openDelete: () => setDeleteOpen(true),
+  };
+
+  const dialogs = (
     <>
-      <DropdownMenu open={menuOpen} onOpenChange={setMenuOpen}>
-        <DropdownMenuTrigger asChild>
-          <Button
-            type="button"
-            variant="ghost"
-            size="icon-xs"
-            aria-label={`Project actions for ${projectName}`}
-            data-testid="project-actions"
-            className="text-muted-foreground"
-            // Sits on the folder header; keep its click off the collapse toggle.
-            onClick={(e) => e.stopPropagation()}
-          >
-            <MoreHorizontalIcon className="size-3.5" data-icon-size="14" />
-          </Button>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent align="end" className="min-w-40">
-          {/* New session — mobile-only (md:hidden); desktop uses the
-              hover-revealed pencil on the folder header. */}
-          <DropdownMenuItem asChild className="md:hidden" data-testid="project-new-session-menu">
-            <Link
-              to={`/?project=${encodeURIComponent(projectName)}`}
-              onClick={(e) => {
-                e.stopPropagation();
-                onNavigate(e);
-              }}
-            >
-              <SquarePenIcon className="size-3.5" />
-              New session
-            </Link>
-          </DropdownMenuItem>
-          <DropdownMenuItem
-            data-testid="rename-project"
-            onSelect={() => {
-              setRenameValue(projectName);
-              setRenameOpen(true);
-            }}
-          >
-            <PencilIcon className="size-3.5" />
-            Rename project
-          </DropdownMenuItem>
-          <DropdownMenuItem data-testid="project-settings" onSelect={() => setSettingsOpen(true)}>
-            <Settings2Icon className="size-3.5" />
-            Project settings
-          </DropdownMenuItem>
-          <DropdownMenuItem
-            data-testid="delete-project"
-            variant="destructive"
-            onSelect={() => setDeleteOpen(true)}
-          >
-            <Trash2Icon className="size-3.5" />
-            Delete project
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
       <Dialog open={renameOpen} onOpenChange={setRenameOpen}>
         <DialogContent onClick={(e) => e.stopPropagation()}>
           <DialogHeader>
@@ -4075,17 +4173,11 @@ function ProjectFolderMenu({
               const newName = renameValue.trim();
               if (newName === "" || newName === projectName) {
                 setRenameOpen(false);
-                setMenuOpen(false);
                 return;
               }
               renameProject.mutate(
                 { id: projectId, oldName: projectName, newName },
-                {
-                  onSuccess: () => {
-                    setRenameOpen(false);
-                    setMenuOpen(false);
-                  },
-                },
+                { onSuccess: () => setRenameOpen(false) },
               );
             }}
           >
@@ -4122,10 +4214,7 @@ function ProjectFolderMenu({
       </Dialog>
       <ProjectSettingsDialog
         open={settingsOpen}
-        onOpenChange={(o) => {
-          setSettingsOpen(o);
-          if (!o) setMenuOpen(false);
-        }}
+        onOpenChange={setSettingsOpen}
         projectId={projectId}
         projectName={projectName}
       />
@@ -4163,12 +4252,7 @@ function ProjectFolderMenu({
               onClick={() => {
                 deleteProject.mutate(
                   { id: projectId, name: projectName },
-                  {
-                    onSuccess: () => {
-                      setDeleteOpen(false);
-                      setMenuOpen(false);
-                    },
-                  },
+                  { onSuccess: () => setDeleteOpen(false) },
                 );
               }}
             >
@@ -4179,6 +4263,50 @@ function ProjectFolderMenu({
       </Dialog>
     </>
   );
+
+  return { actions, dialogs };
+}
+
+/**
+ * The kebab on a project-folder header. Renders {@link ProjectFolderMenuItems}
+ * under the dropdown family; the header's right-click / long-press context menu
+ * renders the same body under the context family (see {@link ConversationSection}).
+ */
+function ProjectFolderMenu({
+  projectName,
+  onNavigate,
+  actions,
+}: {
+  projectName: string;
+  onNavigate: (e: MouseEvent<HTMLAnchorElement>) => void;
+  actions: ProjectFolderMenuActions;
+}) {
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button
+          type="button"
+          variant="ghost"
+          size="icon-xs"
+          aria-label={`Project actions for ${projectName}`}
+          data-testid="project-actions"
+          className="text-muted-foreground"
+          // Sits on the folder header; keep its click off the collapse toggle.
+          onClick={(e) => e.stopPropagation()}
+        >
+          <MoreHorizontalIcon className="size-3.5" data-icon-size="14" />
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end" className={SIDEBAR_MENU_CONTENT_CLASS}>
+        <ProjectFolderMenuItems
+          components={dropdownBundle}
+          projectName={projectName}
+          onNavigate={onNavigate}
+          actions={actions}
+        />
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
 }
 
 // ── ProjectPickerMenu ─────────────────────────────────────────────────────────

From 11fbbd6d4382190eb015c53a1eea7c79e661592b Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 09:57:54 -0700
Subject: [PATCH 24/30] chore: DCO sign-off for the preceding commit

Signed-off-by: Bryan Li <bryan.li@gmail.com>

From e5bb14744453a7fe2e22c62548d2e4355bf894e8 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Tue, 4 Aug 2026 09:59:41 -0700
Subject: [PATCH 25/30] DCO Remediation Commit for Bryan Li
 <bryan.li@gmail.com>

I, Bryan Li <bryan.li@gmail.com>, hereby add my Signed-off-by to this commit: afc97322a5f565441f6e62d8ba04042652e3b594

Signed-off-by: Bryan Li <bryan.li@gmail.com>

From 89519c347f0192c35794bf1738151d686ca50c71 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 03:54:52 -0700
Subject: [PATCH 26/30] Fix project context menu keyboard activation

Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../shell/Sidebar.projectContextMenu.test.tsx | 28 +++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/web/src/shell/Sidebar.projectContextMenu.test.tsx b/web/src/shell/Sidebar.projectContextMenu.test.tsx
index f1c8952cea..83b84e9b18 100644
--- a/web/src/shell/Sidebar.projectContextMenu.test.tsx
+++ b/web/src/shell/Sidebar.projectContextMenu.test.tsx
@@ -23,7 +23,7 @@
 //   5. Bulk-selection mode suppresses the header context menu, matching rows.
 
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { act, cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { act, cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
 import { MemoryRouter } from "react-router-dom";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { TooltipProvider } from "@/components/ui/tooltip";
@@ -310,17 +310,41 @@ describe("project folder header context menu", () => {
     expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
   });
 
-  it("does not toggle the folder when the context menu opens on right-click", () => {
+  it("toggles on the first left-click after the mouse context menu is dismissed", () => {
     renderSidebar();
 
     expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
 
+    fireEvent.pointerDown(folderHeader(), { pointerType: "mouse", button: 2 });
     fireEvent.contextMenu(folderHeader());
 
     // The menu is open and the folder stayed collapsed — Radix preventDefaults
     // the native contextmenu, so no click reaches the collapse toggle.
     expect(screen.getByTestId("rename-project")).toBeInTheDocument();
     expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+
+    fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+    fireEvent.click(folderHeader());
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
+  });
+
+  it("toggles on the first keyboard activation after its context menu is dismissed", async () => {
+    renderSidebar();
+
+    const header = folderHeader();
+    header.focus();
+
+    // jsdom does not synthesize contextmenu or click from keyboard keys, so
+    // dispatch the browser-generated events explicitly without pointer events.
+    fireEvent.keyDown(header, { key: "F10", shiftKey: true });
+    fireEvent.contextMenu(header);
+    expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+
+    fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+    await waitFor(() => expect(header).toHaveFocus());
+
+    fireEvent.click(header, { detail: 0 });
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
   });
 
   it("does not toggle the folder when a long-press opens the menu", () => {

From f5232e0a0bc2af14be739da0c3574e2f3d9155c6 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 05:16:59 -0700
Subject: [PATCH 27/30] Simplify folder-header long-press click swallow

Gate the pending-long-press flag on the same non-mouse pointer test Radix
uses to arm its timer, and share one Escape helper in the tests.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.projectContextMenu.test.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/web/src/shell/Sidebar.projectContextMenu.test.tsx b/web/src/shell/Sidebar.projectContextMenu.test.tsx
index 83b84e9b18..dbd772e4f4 100644
--- a/web/src/shell/Sidebar.projectContextMenu.test.tsx
+++ b/web/src/shell/Sidebar.projectContextMenu.test.tsx
@@ -175,6 +175,11 @@ function longPressHeader() {
   });
 }
 
+/** Dismiss the open menu with Escape, aimed at whatever the menu focused. */
+function dismissMenu() {
+  fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+}
+
 beforeEach(() => {
   mocks.isMobile = false;
   mocks.renameProject.mutate.mockReset();
@@ -323,7 +328,7 @@ describe("project folder header context menu", () => {
     expect(screen.getByTestId("rename-project")).toBeInTheDocument();
     expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
 
-    fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+    dismissMenu();
     fireEvent.click(folderHeader());
     expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
   });
@@ -340,7 +345,7 @@ describe("project folder header context menu", () => {
     fireEvent.contextMenu(header);
     expect(screen.getByTestId("rename-project")).toBeInTheDocument();
 
-    fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+    dismissMenu();
     await waitFor(() => expect(header).toHaveFocus());
 
     fireEvent.click(header, { detail: 0 });

From c4d6b3d66d60b4d49144f7a640c0a02778f68e3c Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 09:22:29 -0700
Subject: [PATCH 28/30] fix(sidebar): suppress text selection on header
 long-press

A long-press on a folder header must open the context menu, not select
the title. preventDefault on touch pointerdown (the session-row
mechanism) would cancel Radix's composed long-press timer, so the
header uses user-select: none instead.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/shell/Sidebar.projectContextMenu.test.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/web/src/shell/Sidebar.projectContextMenu.test.tsx b/web/src/shell/Sidebar.projectContextMenu.test.tsx
index dbd772e4f4..15ace4f564 100644
--- a/web/src/shell/Sidebar.projectContextMenu.test.tsx
+++ b/web/src/shell/Sidebar.projectContextMenu.test.tsx
@@ -352,6 +352,16 @@ describe("project folder header context menu", () => {
     expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
   });
 
+  it("suppresses native text selection of the header title", () => {
+    // A long-press must open the menu, not select the project name. Session
+    // rows suppress selection by preventDefault-ing touch pointerdown, but on
+    // this trigger that would also cancel Radix's composed long-press timer —
+    // so the header relies on user-select: none instead. jsdom cannot run a
+    // real selection, so pin the class that carries the behavior.
+    renderSidebar();
+    expect(folderHeader()).toHaveClass("select-none");
+  });
+
   it("does not toggle the folder when a long-press opens the menu", () => {
     // The gotcha this PR had to solve: the long-press fires mid-gesture off
     // Radix's pointerdown timer, but the trailing pointerup still produces a

From 66b5b3248408ca28726fc5845497cd89b98b8730 Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Thu, 6 Aug 2026 05:25:36 -0700
Subject: [PATCH 29/30] fix(web): harden folder-menu click swallow and tidy
 review nits

Clear the header's click-swallow when the context menu closes, so an
opening gesture with no trailing click (pen barrel right-click, touch
release over the portaled menu) can't strand the flag and eat the next
keyboard Enter; add a regression test. Also hoist the thrice-duplicated
menu-content class to a module const, fold contextMenuDisabled into a
nullable contextMenu prop, drop a useMemo with no memoized consumers,
and fix a test comment that misdescribed Radix's asChild trigger DOM.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 .../shell/Sidebar.projectContextMenu.test.tsx | 23 +++++++++++++++++--
 web/src/shell/Sidebar.tsx                     |  9 ++++++--
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/web/src/shell/Sidebar.projectContextMenu.test.tsx b/web/src/shell/Sidebar.projectContextMenu.test.tsx
index 15ace4f564..6764ea74c3 100644
--- a/web/src/shell/Sidebar.projectContextMenu.test.tsx
+++ b/web/src/shell/Sidebar.projectContextMenu.test.tsx
@@ -157,8 +157,9 @@ function folderHeader(): HTMLElement {
   return header as HTMLElement;
 }
 
-/** Radix's ContextMenuTrigger renders a wrapping span around the `asChild`
- *  header button; the pointer handlers that arm the long-press live on it. */
+/** With `asChild`, Radix's ContextMenuTrigger renders no wrapper — its props
+ *  (data-slot, the long-press pointer handlers) merge onto the header button
+ *  itself, so `closest` matches the button and this equals folderHeader(). */
 function contextTrigger(): HTMLElement {
   const trigger = folderHeader().closest('[data-slot="context-menu-trigger"]');
   if (trigger === null) throw new Error("folder header has no context-menu trigger");
@@ -406,6 +407,24 @@ describe("project folder header context menu", () => {
     }
   });
 
+  it("does not swallow a keyboard toggle after a clickless non-mouse open", () => {
+    // A pen barrel-button right-click (or a touch release over the portaled
+    // menu) arms the swallow but never delivers a trailing click. Closing the
+    // menu must disarm it, or the next keyboard Enter is silently eaten.
+    renderSidebar();
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "false");
+
+    fireEvent.pointerDown(contextTrigger(), { pointerType: "pen", button: 2 });
+    fireEvent.contextMenu(folderHeader());
+    expect(screen.getByTestId("rename-project")).toBeInTheDocument();
+
+    dismissMenu();
+
+    // Keyboard activation (click with no preceding pointerdown) still toggles.
+    fireEvent.click(folderHeader(), { detail: 0 });
+    expect(folderHeader()).toHaveAttribute("aria-expanded", "true");
+  });
+
   it("scopes the header trigger to the header button, clear of the nested rows", () => {
     // Structural guard on placement. The trigger must wrap the header BUTTON,
     // never an ancestor that also contains the child rows (the outer folder
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 5834e529c0..01d7f5cb1b 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -2089,6 +2089,7 @@ function SectionHeader({
   collapsed,
   onToggleCollapsed,
   contextMenu,
+  contextMenuDisabled,
 }: {
   title: string;
   icon?: ReactNode;
@@ -2103,6 +2104,8 @@ function SectionHeader({
       long-pressing (touch) the header button — the folder-menu parity path.
       Radix's own trigger supplies both gestures, so no gesture code lives here. */
   contextMenu?: ReactNode;
+  /** Suppresses the context menu (bulk-selection mode owns the rows). */
+  contextMenuDisabled?: boolean;
 }) {
   // A long-press opens the menu mid-gesture and its trailing click would toggle
   // the folder; a mouse right-click or keyboard Shift+F10 leaves no such click.
@@ -2205,8 +2208,9 @@ function SectionHeader({
   // which would clobber its WebkitTouchCallout.
   return (
     <h2>
-      {contextMenu ? (
+      {contextMenu && !contextMenuDisabled ? (
         <ContextMenu
+          modal={false}
           onOpenChange={(open) => {
             if (open) {
               swallowClickRef.current = longPressPointerRef.current;
@@ -2487,8 +2491,9 @@ function ConversationSection({
             hasAction={headerAction != null}
             collapsed={isCollapsed}
             onToggleCollapsed={onToggleCollapsed}
+            contextMenu={headerContextMenu}
             // Selection mode owns the rows, so the header menu is suppressed.
-            contextMenu={selectionMode ? undefined : headerContextMenu}
+            contextMenuDisabled={selectionMode}
           />
           {headerAction && (
             <div className="-translate-y-1/2 absolute top-1/2 right-1 flex items-center transition-opacity md:opacity-0 md:group-focus-within/header:opacity-100 md:group-hover/header:opacity-100 md:group-has-[[data-state=open]]/header:opacity-100 md:has-[[aria-expanded=true]]:opacity-100">

From e69cf432018972fea372afb5602c593999a1f6be Mon Sep 17 00:00:00 2001
From: Bryan Li <bryan.li@gmail.com>
Date: Wed, 5 Aug 2026 13:25:06 -0700
Subject: [PATCH 30/30] fix(sidebar): keep menu Pin and New-session reachable
 on wide touch devices
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Desktop hides these menu items behind hover-revealed buttons, but a
coarse-pointer device has no hover at any width — the width-only gate
left wide touch devices with no way to pin a session or start one in a
project. Also corrects the swipe/scroll boundary comment: the regions
overlap and check order gives swipe precedence.

Co-authored-by: Isaac
Signed-off-by: Bryan Li <bryan.li@gmail.com>
---
 web/src/hooks/useRowGesture.ts            |  5 +++--
 web/src/shell/Sidebar.rowActions.test.tsx | 16 ++++++++++++++++
 web/src/shell/Sidebar.tsx                 | 21 ++++++++++++++-------
 3 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/web/src/hooks/useRowGesture.ts b/web/src/hooks/useRowGesture.ts
index 8ab25ef152..bb1e533cef 100644
--- a/web/src/hooks/useRowGesture.ts
+++ b/web/src/hooks/useRowGesture.ts
@@ -351,8 +351,9 @@ export function useRowGesture({
 
       const horizontal = Math.abs(deltaX);
       const vertical = Math.abs(deltaY);
-      // Horizontal-dominant travel locks swipe at 12px; other travel waits for
-      // the 25px scroll circle. Since 25/sqrt(2) > 12, (12,0) and (15,20) cannot overlap.
+      // Horizontal-dominant travel locks swipe at 12px. The regions overlap
+      // (e.g. 18,17.5 satisfies both) — this check running first is what gives
+      // swipe precedence; everything it declines waits for the 25px circle.
       if (horizontal >= ROW_SWIPE_ACTIVATE_PX && horizontal > vertical) {
         const action = deltaX < 0 ? actions.left : actions.right;
         if (!swipeEnabled || action === "none") {
diff --git a/web/src/shell/Sidebar.rowActions.test.tsx b/web/src/shell/Sidebar.rowActions.test.tsx
index e5f2acae57..2d91cabfdb 100644
--- a/web/src/shell/Sidebar.rowActions.test.tsx
+++ b/web/src/shell/Sidebar.rowActions.test.tsx
@@ -355,6 +355,22 @@ describe("quick pin/unpin hover button", () => {
     expect(rowLink).toHaveClass("md:pr-14");
   });
 
+  it("keeps the menu Pin item at desktop widths when a coarse pointer exists", () => {
+    // Desktop hides the menu Pin item behind the hover-revealed quick-pin
+    // button, but a touch device has no hover at any width — the menu must
+    // keep carrying Pin there or wide touch devices cannot pin at all.
+    mocks.hasCoarsePointer = true;
+    renderSidebar();
+    fireEvent.pointerDown(screen.getByTestId("conversation-actions"), { button: 0 });
+    expect(screen.getByTestId("pin-conversation")).not.toHaveClass("md:hidden");
+  });
+
+  it("hides the menu Pin item at desktop widths without a coarse pointer", () => {
+    renderSidebar();
+    fireEvent.pointerDown(screen.getByTestId("conversation-actions"), { button: 0 });
+    expect(screen.getByTestId("pin-conversation")).toHaveClass("md:hidden");
+  });
+
   it("sizes the project-folder header controls to match the session-row kebab", () => {
     // The folder-header pencil + kebab share the right-edge column with the
     // session-row kebab, so they must be the same compact `icon-xs` (size-6)
diff --git a/web/src/shell/Sidebar.tsx b/web/src/shell/Sidebar.tsx
index 01d7f5cb1b..c10439eba9 100644
--- a/web/src/shell/Sidebar.tsx
+++ b/web/src/shell/Sidebar.tsx
@@ -2659,6 +2659,7 @@ function ConversationMenuItems({
   // to the side. `view` swaps between the main actions and that sub-view;
   // desktop always renders the native side-flyout submenu regardless.
   const isMobile = useIsMobileViewport();
+  const hasCoarsePointer = useCoarsePointer();
   const [view, setView] = useState<"main" | "projects">("main");
 
   // The project pick / create / remove flow — shared verbatim by the desktop
@@ -2711,13 +2712,13 @@ function ConversationMenuItems({
 
   return (
     <>
-      {/* Pin/Unpin — mobile-only (md:hidden); desktop uses the
-          hover-revealed quick-pin button. Archived rows omit it (archive
-          outranks pin). */}
+      {/* Pin/Unpin — desktop uses the hover-revealed quick-pin button, but a
+          coarse-pointer device has no hover at any width, so the menu keeps
+          the item there. Archived rows omit it (archive outranks pin). */}
       {!isArchived && (
         <C.Item
           data-testid="pin-conversation"
-          className="md:hidden"
+          className={hasCoarsePointer ? undefined : "md:hidden"}
           onSelect={() => onTogglePinned(conversation.id)}
         >
           {isPinned ? <PinOffIcon className="size-3.5" /> : <PinIcon className="size-3.5" />}
@@ -4090,11 +4091,17 @@ function ProjectFolderMenuItems({
   onNavigate: (e: MouseEvent<HTMLAnchorElement>) => void;
   actions: ProjectFolderMenuActions;
 }) {
+  const hasCoarsePointer = useCoarsePointer();
   return (
     <>
-      {/* New session — mobile-only (md:hidden); desktop uses the
-          hover-revealed pencil on the folder header. */}
-      <C.Item asChild className="md:hidden" data-testid="project-new-session-menu">
+      {/* New session — desktop uses the hover-revealed pencil on the folder
+          header, but a coarse-pointer device has no hover at any width, so
+          the menu keeps the item there. */}
+      <C.Item
+        asChild
+        className={hasCoarsePointer ? undefined : "md:hidden"}
+        data-testid="project-new-session-menu"
+      >
         <Link
           to={`/?project=${encodeURIComponent(projectName)}`}
           onClick={(e) => {