fix: separate right-click menu vs drag-erase behavior

Right-click on note = delete.
Right-click empty space (no drag) = context menu only (no erase sweep).
Right-click empty space + drag >5px = erase sweep (starts on mousemove).
Uses rightClickDragRef to track pending right-click state.

app/static/js/app.jsx

@@ -4912,7 +4912,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
 
     if (scaleMenuPos) setScaleMenuPos(null);
 
-    // Right click -> delete note or start erase sweep (drag to sweep)
+    // Right click -> delete note (if on note) or prepare for sweep-drag
     if (e.button === 2) {
       e.preventDefault();
       const clickedNote = notes.find(n => {
@@ -4924,8 +4924,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
         setSelectedNoteIds(prev => prev.filter(id => id !== clickedNote.id));
         showToast('Đã xóa nốt!', 'info');
       } else {
-        notesBeforeDragRef.current = JSON.parse(JSON.stringify(notes));
-        setDraggedNote({ mode: 'erase_sweep', visitedPitches: [pitch] });
+        rightClickDragRef.current = { active: true, startX: e.clientX, startY: e.clientY };
       }
       return;
     }
@@ -5114,6 +5113,15 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
       return;
     }
 
+    // Right-click drag → erase sweep
+    const rc = rightClickDragRef.current;
+    if (rc.active && (Math.abs(e.clientX - rc.startX) > 5 || Math.abs(e.clientY - rc.startY) > 5)) {
+      rc.active = false;
+      notesBeforeDragRef.current = JSON.parse(JSON.stringify(notes));
+      setDraggedNote({ mode: 'erase_sweep', visitedPitches: [] });
+      return;
+    }
+
     if (!draggedNote) {
       let foundIdx = -1;
       for (let i = 0; i < notes.length; i++) {
@@ -5238,6 +5246,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
   const handleGridMouseUp = () => {
     setDraggedNote(null);
     setSelectionMarquee(null);
+    rightClickDragRef.current = { active: false, startX: 0, startY: 0 };
   };
 
   const handleContextMenu = (e) => {
@@ -5248,6 +5257,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
   };
 
   const ccDragRef = React.useRef(null);
+  const rightClickDragRef = React.useRef({ active: false, startX: 0, startY: 0 });
 
   const handleCCMouseDown = (e) => {
     const canvas = ccCanvasRef.current;