From 043bf7d70abb705059bed5c0dbcc8007448750ec Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Sat, 26 Jul 2025 12:34:57 +0200
Subject: [PATCH] fix: ensure clicking context menu item doesn't move timeline
 playhead

---
 apps/web/src/components/editor/timeline/index.tsx    |  7 +++++--
 .../components/editor/timeline/timeline-element.tsx  | 12 ++++++++----
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/apps/web/src/components/editor/timeline/index.tsx b/apps/web/src/components/editor/timeline/index.tsx
index 0368e452..bcaece89 100644
--- a/apps/web/src/components/editor/timeline/index.tsx
+++ b/apps/web/src/components/editor/timeline/index.tsx
@@ -746,11 +746,14 @@ export function Timeline() {
                         </ContextMenuTrigger>
                         <ContextMenuContent className="z-[200]">
                           <ContextMenuItem
-                            onClick={() => toggleTrackMute(track.id)}
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              toggleTrackMute(track.id);
+                            }}
                           >
                             {track.muted ? "Unmute Track" : "Mute Track"}
                           </ContextMenuItem>
-                          <ContextMenuItem>
+                          <ContextMenuItem onClick={(e) => e.stopPropagation()}>
                             Track settings (soon)
                           </ContextMenuItem>
                         </ContextMenuContent>
diff --git a/apps/web/src/components/editor/timeline/timeline-element.tsx b/apps/web/src/components/editor/timeline/timeline-element.tsx
index fc40bb54..c66e9fcb 100644
--- a/apps/web/src/components/editor/timeline/timeline-element.tsx
+++ b/apps/web/src/components/editor/timeline/timeline-element.tsx
@@ -102,7 +102,8 @@ export function TimelineElement({
   // Element should always be positioned at startTime - trimStart only affects content, not position
   const elementLeft = elementStartTime * 50 * zoomLevel;
 
-  const handleElementSplitContext = () => {
+  const handleElementSplitContext = (e: React.MouseEvent) => {
+    e.stopPropagation();
     const effectiveStart = element.startTime;
     const effectiveEnd =
       element.startTime +
@@ -118,7 +119,8 @@ export function TimelineElement({
     }
   };
 
-  const handleElementDuplicateContext = () => {
+  const handleElementDuplicateContext = (e: React.MouseEvent) => {
+    e.stopPropagation();
     const { id, ...elementWithoutId } = element;
     addElementToTrack(track.id, {
       ...elementWithoutId,
@@ -130,7 +132,8 @@ export function TimelineElement({
     });
   };
 
-  const handleElementDeleteContext = () => {
+  const handleElementDeleteContext = (e: React.MouseEvent) => {
+    e.stopPropagation();
     if (rippleEditingEnabled) {
       removeElementFromTrackWithRipple(track.id, element.id);
     } else {
@@ -138,7 +141,8 @@ export function TimelineElement({
     }
   };
 
-  const handleReplaceClip = () => {
+  const handleReplaceClip = (e: React.MouseEvent) => {
+    e.stopPropagation();
     if (element.type !== "media") {
       toast.error("Replace is only available for media clips");
       return;