From 4a9b102ce1d6824167cdb57f514b66d115bf016e Mon Sep 17 00:00:00 2001 From: aashishparuvada Date: Mon, 23 Jun 2025 23:26:41 +0530 Subject: [PATCH] feature:deselect-clips-on-click --- apps/web/src/components/editor/timeline.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx index b95f983..d6a6d62 100644 --- a/apps/web/src/components/editor/timeline.tsx +++ b/apps/web/src/components/editor/timeline.tsx @@ -299,9 +299,13 @@ export function Timeline() { }; const handleWheel = (e: React.WheelEvent) => { - e.preventDefault(); - const delta = e.deltaY > 0 ? -0.05 : 0.05; - setZoomLevel((prev) => Math.max(0.1, Math.min(10, prev + delta))); + // Only zoom if user is using pinch gesture (ctrlKey or metaKey is true) + if (e.ctrlKey || e.metaKey) { + e.preventDefault(); + const delta = e.deltaY > 0 ? -0.05 : 0.05; + setZoomLevel((prev) => Math.max(0.1, Math.min(10, prev + delta))); + } + // Otherwise, allow normal scrolling }; const dragProps = { @@ -620,8 +624,7 @@ export function Timeline() { className="relative cursor-pointer select-none" style={{ width: `${Math.max(1000, duration * 50 * zoomLevel)}px`, - minHeight: - tracks.length > 0 ? `${tracks.length * 60}px` : "200px", + minHeight: '600px', // Always at least 600px tall for easy empty area clicking }} onClick={handleTimelineAreaClick} onMouseDown={handleTimelineMouseDown}