From f44f0acf7024febdbbecbbf10772b9b9d3863b4f Mon Sep 17 00:00:00 2001
From: aashishparuvada <aashishvardhanp@gmail.com>
Date: Mon, 23 Jun 2025 21:16:21 +0530
Subject: [PATCH] hotfix-improved-selection-standards

---
 apps/web/src/components/editor/timeline.tsx | 10 +++-------
 apps/web/src/stores/timeline-store.ts       |  3 +++
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx
index 1120fbe..e824d42 100644
--- a/apps/web/src/components/editor/timeline.tsx
+++ b/apps/web/src/components/editor/timeline.tsx
@@ -33,7 +33,7 @@ export function Timeline() {
   // Timeline shows all tracks (video, audio, effects) and their clips.
   // You can drag media here to add it to your project.
   // Clips can be trimmed, deleted, and moved.
-  const { tracks, addTrack, addClipToTrack, removeTrack, toggleTrackMute, removeClipFromTrack, moveClipToTrack, getTotalDuration, selectedClips, selectClip, deselectClip, clearSelectedClips } =
+  const { tracks, addTrack, addClipToTrack, removeTrack, toggleTrackMute, removeClipFromTrack, moveClipToTrack, getTotalDuration, selectedClips, selectClip, deselectClip, clearSelectedClips, setSelectedClips } =
     useTimelineStore();
   const { mediaItems, addMediaItem } = useMediaStore();
   const { currentTime, duration, seek, setDuration, isPlaying, play, pause, toggle } = usePlaybackStore();
@@ -156,20 +156,18 @@ export function Timeline() {
     });
     if (newSelection.length > 0) {
       if (marquee.additive) {
-        // Add to current selection
         const current = new Set(selectedClips.map((c) => c.trackId + ":" + c.clipId));
         newSelection = [
           ...selectedClips,
           ...newSelection.filter((c) => !current.has(c.trackId + ":" + c.clipId)),
         ];
       }
-      clearSelectedClips();
-      newSelection.forEach((c) => selectClip(c.trackId, c.clipId, true));
+      setSelectedClips(newSelection);
     } else if (!marquee.additive) {
       clearSelectedClips();
     }
     setMarquee(null);
-  }, [marquee, tracks, zoomLevel, selectedClips, selectClip, clearSelectedClips]);
+  }, [marquee, tracks, zoomLevel, selectedClips, selectClip, clearSelectedClips, setSelectedClips]);
 
   const handleDragEnter = (e: React.DragEvent) => {
     // When something is dragged over the timeline, show overlay
@@ -1398,8 +1396,6 @@ function TimelineTrackContent({
                     e.stopPropagation();
                     if (e.metaKey || e.ctrlKey || e.shiftKey) {
                       selectClip(track.id, clip.id, true);
-                    } else if (isSelected) {
-                      deselectClip(track.id, clip.id);
                     } else {
                       selectClip(track.id, clip.id, false);
                     }
diff --git a/apps/web/src/stores/timeline-store.ts b/apps/web/src/stores/timeline-store.ts
index c6ecaea..4b55a53 100644
--- a/apps/web/src/stores/timeline-store.ts
+++ b/apps/web/src/stores/timeline-store.ts
@@ -26,6 +26,7 @@ interface TimelineStore {
   selectClip: (trackId: string, clipId: string, multi?: boolean) => void;
   deselectClip: (trackId: string, clipId: string) => void;
   clearSelectedClips: () => void;
+  setSelectedClips: (clips: { trackId: string; clipId: string }[]) => void;
 
   // Actions
   addTrack: (type: "video" | "audio" | "effects") => string;
@@ -82,6 +83,8 @@ export const useTimelineStore = create<TimelineStore>((set, get) => ({
     set({ selectedClips: [] });
   },
 
+  setSelectedClips: (clips) => set({ selectedClips: clips }),
+
   addTrack: (type) => {
     const newTrack: TimelineTrack = {
       id: crypto.randomUUID(),