fix: Ctrl+click+drag copies pre-toggle selection, not post-toggle

Ctrl+click toggle selection THEN drag started -> selIds.has(itemId)
returned false because the item was just removed from snapshot.
Fix: snapshot selectedItemIds BEFORE toggle, pass to pendingDrag.
Drag always copies the original group; toggle is only visual.

app/static/js/app.jsx

@@ -1084,14 +1084,14 @@ const WaveformLane = ({
         e.stopPropagation();
         if (e.ctrlKey) {
           // Ctrl+Click: toggle selection only, never start drag immediately
-          var ctrlWasSelected = selectedItemIds && selectedItemIds.has(hitItem.id);
-          if (ctrlWasSelected) {
+          var preToggleSnapshot = selectedItemIds ? new Set(selectedItemIds) : new Set();
+          if (selectedItemIds && selectedItemIds.has(hitItem.id)) {
             if (onDeselectItem) onDeselectItem(hitItem.id);
           } else if (onAddToSelection) {
             onAddToSelection(hitItem.id);
           }
-          // Store pending drag so mousemove can start copy-drag
-          if (onSetPendingDrag) onSetPendingDrag(track.id, hitItem.type, hitItem.id, time - hitItem.start, e.nativeEvent || e, ctrlWasSelected);
+          // Store pre-toggle snapshot so drag copies the ORIGINAL group
+          if (onSetPendingDrag) onSetPendingDrag(track.id, hitItem.type, hitItem.id, time - hitItem.start, e.nativeEvent || e, preToggleSnapshot);
         } else {
           // No modifier: start drag immediately (single or multi move)
           if (onSectionItemDragStart) onSectionItemDragStart(track.id, hitItem.type, hitItem.id, time - hitItem.start, false);
@@ -1151,15 +1151,15 @@ const WaveformLane = ({
         e.preventDefault();
         e.stopPropagation();
         if (e.ctrlKey) {
-          // Ctrl+Click: toggle selection, store pending drag
+          // Ctrl+Click: toggle selection, store pending drag w/ pre-toggle snapshot
           var clipCanonicalId = clickedClip.id === 'default' ? 'default_' + track.id : clickedClip.id;
-          var ctrlClipSelected = selectedItemIds && selectedItemIds.has(clipCanonicalId);
-          if (ctrlClipSelected) {
+          var clipPreToggleSnapshot = selectedItemIds ? new Set(selectedItemIds) : new Set();
+          if (selectedItemIds && selectedItemIds.has(clipCanonicalId)) {
             if (onDeselectItem) onDeselectItem(clipCanonicalId);
           } else if (onAddToSelection) {
             onAddToSelection(clipCanonicalId);
           }
-          if (onSetPendingDrag) onSetPendingDrag(track.id, 'clip', clipCanonicalId, time - clickedClip.startTime, e.nativeEvent || e, ctrlClipSelected);
+          if (onSetPendingDrag) onSetPendingDrag(track.id, 'clip', clipCanonicalId, time - clickedClip.startTime, e.nativeEvent || e, clipPreToggleSnapshot);
         } else {
           // Alt+Click: move immediately
           if (onClipDragStart) onClipDragStart(track.id, clickedClip.id, time - clickedClip.startTime, false);
@@ -11666,11 +11666,8 @@ const App = () => {
       return next;
     });
   };
-  const handleSetPendingDrag = (trackId, itemType, itemId, clickOffset, e, wasAlreadySelected) => {
-    var snap = new Set(selectedItemIds);
-    if (wasAlreadySelected) snap.delete(itemId);
-    else snap.add(itemId);
-    pendingDragRef.current = { trackId, itemType, itemId, clickOffset, startX: e.clientX, startY: e.clientY, selectedIds: snap };
+  const handleSetPendingDrag = (trackId, itemType, itemId, clickOffset, e, preToggleSnapshot) => {
+    pendingDragRef.current = { trackId, itemType, itemId, clickOffset, startX: e.clientX, startY: e.clientY, selectedIds: preToggleSnapshot || new Set(selectedItemIds) };
   };
 
   // ── Sweep Select ──

app/static/js/app.precompiled.js

@@ -52,12 +52,12 @@ if(e.shiftKey){e.preventDefault();e.stopPropagation();const currentAnchor=getLoc
 const isLocal=selectionMode==='local'&&localSelectionTrackId===track.id;if(isLocal&&localSelLeft!==null&&localSelRight!==null){const leftPx=localSelLeft*zoom;const rightPx=localSelRight*zoom;const distToLeft=Math.abs(x-leftPx);const distToRight=Math.abs(x-rightPx);if(distToLeft<=5){e.preventDefault();e.stopPropagation();if(onSelectionEdgeDragStart)onSelectionEdgeDragStart(e,track.id,'left');return;}else if(distToRight<=5){e.preventDefault();e.stopPropagation();if(onSelectionEdgeDragStart)onSelectionEdgeDragStart(e,track.id,'right');return;}}// Check if time-stretching (Alt + Right Edge)
 const toleranceSec=8/zoom;const rightEdgeClip=clips.find(c=>{const duration=c.buffer.duration/(c.speed||1.0);return Math.abs(time-(c.startTime+duration))<=toleranceSec;});if(rightEdgeClip&&e.altKey){e.preventDefault();e.stopPropagation();if(onClipStretchStart){onClipStretchStart(track.id,rightEdgeClip.id,time);}return;}// Check section/MIDI item edge for resize, then body for drag
 const secItems=track.sections||[];const midiItems=track.midiItems||[];const secTol=8/zoom;let hitItem=null;let hitEdge=null;for(const sec of secItems){if(Math.abs(time-sec.start)<=secTol){hitItem={type:'section',id:sec.id,start:sec.start,dur:sec.duration};hitEdge='left';break;}if(Math.abs(time-(sec.start+sec.duration))<=secTol){hitItem={type:'section',id:sec.id,start:sec.start,dur:sec.duration};hitEdge='right';break;}}if(!hitItem){for(const midi of midiItems){if(Math.abs(time-midi.startTime)<=secTol){hitItem={type:'midiItem',id:midi.id,start:midi.startTime,dur:midi.duration};hitEdge='left';break;}if(Math.abs(time-(midi.startTime+midi.duration))<=secTol){hitItem={type:'midiItem',id:midi.id,start:midi.startTime,dur:midi.duration};hitEdge='right';break;}}}if(hitItem&&hitEdge){e.preventDefault();e.stopPropagation();if(onSectionItemResizeStart)onSectionItemResizeStart(track.id,hitItem.type,hitItem.id,hitEdge,time);return;}if(!hitItem){for(const sec of secItems){if(time>=sec.start&&time<sec.start+sec.duration){hitItem={type:'section',id:sec.id,start:sec.start};break;}}}if(!hitItem){for(const midi of midiItems){if(time>=midi.startTime&&time<midi.startTime+midi.duration){hitItem={type:'midiItem',id:midi.id,start:midi.startTime};break;}}}if(hitItem&&!e.altKey&&!e.shiftKey){e.preventDefault();e.stopPropagation();if(e.ctrlKey){// Ctrl+Click: toggle selection only, never start drag immediately
-var ctrlWasSelected=selectedItemIds&&selectedItemIds.has(hitItem.id);if(ctrlWasSelected){if(onDeselectItem)onDeselectItem(hitItem.id);}else if(onAddToSelection){onAddToSelection(hitItem.id);}// Store pending drag so mousemove can start copy-drag
-if(onSetPendingDrag)onSetPendingDrag(track.id,hitItem.type,hitItem.id,time-hitItem.start,e.nativeEvent||e,ctrlWasSelected);}else{// No modifier: start drag immediately (single or multi move)
+var preToggleSnapshot=selectedItemIds?new Set(selectedItemIds):new Set();if(selectedItemIds&&selectedItemIds.has(hitItem.id)){if(onDeselectItem)onDeselectItem(hitItem.id);}else if(onAddToSelection){onAddToSelection(hitItem.id);}// Store pre-toggle snapshot so drag copies the ORIGINAL group
+if(onSetPendingDrag)onSetPendingDrag(track.id,hitItem.type,hitItem.id,time-hitItem.start,e.nativeEvent||e,preToggleSnapshot);}else{// No modifier: start drag immediately (single or multi move)
 if(onSectionItemDragStart)onSectionItemDragStart(track.id,hitItem.type,hitItem.id,time-hitItem.start,false);}return;}const clickedClip=clips.find(c=>time>=c.startTime&&time<c.startTime+c.buffer.duration/(c.speed||1.0));// Set selected clip ID
 if(clickedClip){setSelectedClipId({trackId:track.id,clipId:clickedClip.id==='default'?'default_'+track.id:clickedClip.id});}else{setSelectedClipId(null);}if(activeTool==='pen'&&!e.ctrlKey){if(clickedClip){e.preventDefault();e.stopPropagation();if(onEditClipInSubTab){onEditClipInSubTab(track.id,clickedClip.id);}}return;}if(activeTool==='razor'&&!e.ctrlKey){if(clickedClip){e.preventDefault();e.stopPropagation();if(onSplitTrackAtTime){onSplitTrackAtTime(track.id,clickedClip.id,time);}}return;}if(activeTool==='grab'){if(onTrackLaneMouseDown){onTrackLaneMouseDown(track.id,time,e);}if(clickedClip){e.preventDefault();e.stopPropagation();if(onClipDragStart){onClipDragStart(track.id,clickedClip.id,time-clickedClip.startTime,e.ctrlKey);}}else{onPlayheadSet(time);}return;}// Check for click drag clip (Alt to move, Ctrl to duplicate)
-if(clickedClip&&(e.altKey||e.ctrlKey)){e.preventDefault();e.stopPropagation();if(e.ctrlKey){// Ctrl+Click: toggle selection, store pending drag
-var clipCanonicalId=clickedClip.id==='default'?'default_'+track.id:clickedClip.id;var ctrlClipSelected=selectedItemIds&&selectedItemIds.has(clipCanonicalId);if(ctrlClipSelected){if(onDeselectItem)onDeselectItem(clipCanonicalId);}else if(onAddToSelection){onAddToSelection(clipCanonicalId);}if(onSetPendingDrag)onSetPendingDrag(track.id,'clip',clipCanonicalId,time-clickedClip.startTime,e.nativeEvent||e,ctrlClipSelected);}else{// Alt+Click: move immediately
+if(clickedClip&&(e.altKey||e.ctrlKey)){e.preventDefault();e.stopPropagation();if(e.ctrlKey){// Ctrl+Click: toggle selection, store pending drag w/ pre-toggle snapshot
+var clipCanonicalId=clickedClip.id==='default'?'default_'+track.id:clickedClip.id;var clipPreToggleSnapshot=selectedItemIds?new Set(selectedItemIds):new Set();if(selectedItemIds&&selectedItemIds.has(clipCanonicalId)){if(onDeselectItem)onDeselectItem(clipCanonicalId);}else if(onAddToSelection){onAddToSelection(clipCanonicalId);}if(onSetPendingDrag)onSetPendingDrag(track.id,'clip',clipCanonicalId,time-clickedClip.startTime,e.nativeEvent||e,clipPreToggleSnapshot);}else{// Alt+Click: move immediately
 if(onClipDragStart)onClipDragStart(track.id,clickedClip.id,time-clickedClip.startTime,false);}return;}// Ctrl+Click on empty space: sweep select (deselect all via onSweepSelectStart)
 if(e.ctrlKey&&!clickedClip&&!hitItem){e.preventDefault();e.stopPropagation();if(onSweepSelectStart)onSweepSelectStart(track.id,time);return;}onPlayheadSet(time);if(onTrackLaneMouseDown){onTrackLaneMouseDown(track.id,time,e);}e.stopPropagation();},onDoubleClick:e=>{const rect=canvasRef.current.getBoundingClientRect();const x=e.clientX-rect.left+(scrollLeft||0);const time=Math.max(0,x/zoom-leadInMargin);const clips=track.clips&&track.clips.length>0?track.clips:track.buffer?[{id:'default',buffer:track.buffer,startTime:track.startTime||0,name:track.name,speed:track.speed||1.0}]:[];// Check double-click on section first
 const dblSecItems=track.sections||[];let dblSecHit=null;for(const sec of dblSecItems){if(time>=sec.start&&time<sec.start+sec.duration){dblSecHit=sec;break;}}if(dblSecHit){e.preventDefault();e.stopPropagation();if(onEditSectionInTab)onEditSectionInTab(track.id,dblSecHit.id);return;}// Check double-click on MIDI item next
@@ -330,7 +330,7 @@ if(t.id===drag.trackId&&drag.trackId!==targetTrackId){const updatedClips=(t.clip
 if(t.id===targetTrackId){const existingClips=t.clips&&t.clips.length>0?t.clips:t.buffer?[{id:'default_'+t.id,buffer:t.buffer,startTime:t.startTime||0,name:t.name}]:[];const hasClip=existingClips.some(c=>c.id===drag.clipId);let updatedClips;if(hasClip){updatedClips=existingClips.map(c=>c.id===drag.clipId?{...c,startTime:newStart}:c);}else{updatedClips=[...existingClips,{id:drag.clipId,buffer:drag.buffer,startTime:newStart,name:drag.name}];}return{...t,clips:updatedClips,buffer:updatedClips[0].buffer,startTime:updatedClips[0].startTime,name:updatedClips[0].name};}return t;}));if(drag.trackId!==targetTrackId){setDraggedClip(prev=>({...prev,trackId:targetTrackId}));}};const handleMouseUp=()=>{const drag=draggedClipRef.current;if(!drag)return;const afterSnap=captureTrackSnapshotRef.current(drag.trackId);pushAction('MOVE_CLIP',drag.trackId,drag.beforeSnap,afterSnap);setDraggedClip(null);showToast('Đã di chuyển clip.','success');};document.addEventListener('mousemove',handleMouseMove);document.addEventListener('mouseup',handleMouseUp);return()=>{document.removeEventListener('mousemove',handleMouseMove);document.removeEventListener('mouseup',handleMouseUp);};},[zoom]);// Document-level mousemove/mouseup for clip stretching
 useEffect(()=>{const handleMouseMove=e=>{const stretch=stretchedClipRef.current;if(!stretch)return;autoScrollTimeline(e.clientX);const wrapper=timelineWrapperRef.current;if(!wrapper)return;const rect=wrapper.getBoundingClientRect();const scrollLeft=wrapper.scrollLeft;const mouseX=e.clientX-rect.left+scrollLeft;const time=mouseX/zoom;const secPerBar=60.0/(parseInt(bpmRef.current)||120)*4;const marginBar=maxDurationRef.current-secPerBar;const maxEnd=Math.min(time,marginBar);const newDuration=Math.max(0.1,maxEnd-stretch.startTime);const speedRatio=stretch.originalDuration/newDuration;updateActiveTracks(prev=>prev.map(t=>{if(t.id===stretch.trackId){const updatedClips=(t.clips||[]).map(c=>{if(c.id===stretch.clipId){return{...c,speed:speedRatio};}return c;});return{...t,clips:updatedClips,buffer:updatedClips[0]?.buffer,startTime:updatedClips[0]?.startTime||0,speed:updatedClips[0]?.speed||1.0};}return t;}));};const handleMouseUp=()=>{const stretch=stretchedClipRef.current;if(!stretch)return;const afterSnap=captureTrackSnapshotRef.current(stretch.trackId);pushAction('STRETCH_CLIP',stretch.trackId,stretch.beforeSnap,afterSnap);setStretchedClip(null);showToast('Đã giãn thời gian clip.','success');};document.addEventListener('mousemove',handleMouseMove);document.addEventListener('mouseup',handleMouseUp);return()=>{document.removeEventListener('mousemove',handleMouseMove);document.removeEventListener('mouseup',handleMouseUp);};},[zoom]);// ── Deselect single item ──
 const handleDeselectItem=itemId=>{setSelectedItemIds(prev=>{var next=new Set(prev);next.delete(itemId);return next;});};// ── Add item to selectedItemIds ──
-const handleAddToSelection=itemId=>{setSelectedItemIds(prev=>{var next=new Set(prev);next.add(itemId);return next;});};const handleSetPendingDrag=(trackId,itemType,itemId,clickOffset,e,wasAlreadySelected)=>{var snap=new Set(selectedItemIds);if(wasAlreadySelected)snap.delete(itemId);else snap.add(itemId);pendingDragRef.current={trackId,itemType,itemId,clickOffset,startX:e.clientX,startY:e.clientY,selectedIds:snap};};// ── Sweep Select ──
+const handleAddToSelection=itemId=>{setSelectedItemIds(prev=>{var next=new Set(prev);next.add(itemId);return next;});};const handleSetPendingDrag=(trackId,itemType,itemId,clickOffset,e,preToggleSnapshot)=>{pendingDragRef.current={trackId,itemType,itemId,clickOffset,startX:e.clientX,startY:e.clientY,selectedIds:preToggleSnapshot||new Set(selectedItemIds)};};// ── Sweep Select ──
 const handleSweepSelectStart=(trackId,startTime)=>{isSweepingRef.current=true;sweepStartRef.current=startTime;sweepTrackIdRef.current=trackId;var init={startTime,endTime:startTime};sweepSelectRef.current=init;setSweepSelect(init);setSelectedItemIds(new Set());};// ── Section / MIDI Item Drag Start ──
 const handleSectionItemDragStart=(trackId,itemType,itemId,clickOffset,isDuplicate,pendingSelectedIds)=>{var curTracks=activeTracksRef.current||activeTracks;var multiIds=null;var selIds=pendingSelectedIds||selectedItemIds;if(selIds&&selIds.size>0&&selIds.has(itemId)){var selArr=Array.from(selIds);var originals={};curTracks.forEach(function(t){(t.sections||[]).forEach(function(s){if(selArr.indexOf(s.id)>=0)originals[s.id]={type:'section',start:s.start};});(t.midiItems||[]).forEach(function(m){if(selArr.indexOf(m.id)>=0)originals[m.id]={type:'midiItem',start:m.startTime};});(t.clips||[]).forEach(function(c){var cid=c.id==='default'?'default_'+t.id:c.id;if(selArr.indexOf(cid)>=0)originals[cid]={type:'clip',start:c.startTime};});});if(Object.keys(originals).length>0)multiIds=originals;}if(isDuplicate){var track=curTracks.find(function(t){return t.id===trackId;});if(!track)return;if(multiIds){var newOriginals={};updateActiveTracks(function(prev){return prev.map(function(t){var updatedSections=t.sections?t.sections.slice():[];var updatedMidi=t.midiItems?t.midiItems.slice():[];var updatedClips=t.clips?t.clips.slice():[];Object.keys(multiIds).forEach(function(oid){var info=multiIds[oid];if(info.type==='section'){var sec=(t.sections||[]).find(function(s){return s.id===oid;});if(sec){var newId='sec_dup_'+Date.now()+'_'+Math.random().toString(36).substr(2,5);updatedSections.push({...sec,id:newId,name:sec.name+' (Copy)'});newOriginals[newId]={type:'section',start:sec.start};}}else if(info.type==='midiItem'){var mid=(t.midiItems||[]).find(function(m){return m.id===oid;});if(mid){var newId='midi_dup_'+Date.now()+'_'+Math.random().toString(36).substr(2,5);updatedMidi.push({...mid,id:newId,name:mid.name+' (Copy)'});newOriginals[newId]={type:'midiItem',start:mid.startTime};}}else if(info.type==='clip'){var clip=(t.clips||[]).find(function(c){return c.id===oid||'default_'+t.id===oid;});if(clip){var newId='clip_dup_'+Date.now()+'_'+Math.random().toString(36).substr(2,5);updatedClips.push({...clip,id:newId,startTime:clip.startTime,name:clip.name+' (Copy)'});newOriginals[newId]={type:'clip',start:clip.startTime};}}});return{...t,sections:updatedSections,midiItems:updatedMidi,clips:updatedClips};});});setDraggedSectionItem({trackId,itemType,itemId,clickOffset,multiIds:newOriginals});}else{var items=itemType==='section'?track.sections||[]:track.midiItems||[];var item=items.find(function(it){return it.id===itemId;});if(!item)return;var newId=itemType+'_dup_'+Date.now();var newItem={...item,id:newId,name:item.name+' (Copy)'};updateActiveTracks(function(prev){return prev.map(function(t){if(t.id!==trackId)return t;var updated=itemType==='section'?[...(t.sections||[]),newItem]:[...(t.midiItems||[]),newItem];return itemType==='section'?{...t,sections:updated}:{...t,midiItems:updated};});});setDraggedSectionItem({trackId,itemType,itemId:newId,clickOffset,isDuplicate:false});}return;}setDraggedSectionItem({trackId,itemType,itemId,clickOffset,multiIds});};handleSectionItemDragStartRef.current=handleSectionItemDragStart;// ── Section / MIDI Item Resize Start ──
 const handleSectionItemResizeStart=(trackId,itemType,itemId,side,clickTime)=>{const curTracks=activeTracks;const track=curTracks.find(t=>t.id===trackId);if(!track)return;const items=itemType==='section'?track.sections:track.midiItems;const item=(items||[]).find(it=>it.id===itemId);if(!item)return;const start=itemType==='section'?item.start:item.startTime;setResizedSectionItem({trackId,itemType,itemId,side,originalStart:start,originalDuration:item.duration});};// ── Document-level mousemove/mouseup for Section/MIDI item drag ──